/*  SkyByte.js v1.0-beta, May 17 2007
 *  (c) 2007 Aleksandras Ilarionovas (Alex)
 *
 *  SkyByte.js is freely distributable under the terms of an MIT-style license.
 *  For details, see the SkyByte.net web site: http://www.skybyte.net/scripts/
 *
 *--------------------------------------------------------------------------*/

if(typeof Prototype === 'undefined')  { throw("SkyByte.js requires Prototype.js library"); }
var SkyByte = { Version: '1.2' };

//--------------------------------------------------------------------------
var Browser = {
	cursor	:function(cur)	{ document.body.style.cursor=cur;	}
};
function debug(o){  s=''; for (var n in o){ s+=n+':'+o[n]+'\n'; } alert(s); }

//--------------------------------------------------------------------------
// Syntax: Mouse.start(object: optional) where object._mouseMove(e) = callback function or empty parameter
//         Mouse.stop(object: optional)
// Return: Mouse.x, Mouse.y = current mouse coordinates
var Mouse = {
	callbacks:[], x:0, y:0, event: null,
	start:function(obj){ //start callback or just start observing mouse coordinates
		obj=obj || 'global';
		if(this.callbacks.length===0){
			this.eventMouseMove = this._mouseMove.bindAsEventListener(this);	Event.observe(document, "mousemove", this.eventMouseMove);
		}
		var found = this.callbacks.detect(function(d) { return d==obj; });
		if(!found){ this.callbacks.push(obj); }
	},
	stop:function(obj){ //stop callback or stop observing all
		obj=obj || 'global';
		this.callbacks = this.callbacks.reject(function(d) { return d==obj; });
		if(this.callbacks.length===0){
			Event.stopObserving(document, "mousemove", this.eventMouseMove);
		}
	},
	_mouseMove: function(e){
		var o,i; this.x=Event.pointerX(e); this.y=Event.pointerY(e); this.event=e;
		if(Mouse.callbacks){
			for (i=0, len=Mouse.callbacks.length; i<len; ++i){ o=Mouse.callbacks[i];
				if(typeof o=='object'){ o._mouseMove(e);}
			}
		}
	}
};
//--------------------------------------------------------------------------
Object.extend(Element, {
	add:function(el,attr,style,opt){ var d;
		for (var n in opt)	{ val=opt[n];	if(n=='clone'){ d=val.cloneNode(true); }	}
		if(!d){ d=document.createElement(el);	}
		for (n in attr)	{ d.setAttribute(n,attr[n]); 		}
		for (n in style){ d.style[n.camelize()] = style[n];	}
		for (n in opt)	{ val=opt[n];
			switch(n){
				case 'a':	if(typeof val=='string'){val=$(val);} d=val.appendChild(d);	break;
				case 'c':	d.className=val;	break;
				case 'id':	d.id=val;			break;
				case 'txt': //IE6 bug: The innerHTML property of the TABLE, TFOOT, THEAD, and TR elements are read-only.
				if(d.tagName=="TABLE" || d.tagName=="TFOOT" || d.tagName=="THEAD" || d.tagName=="TR"){

				}else if(d.innerHTML){ d.innerHTML=val; }
				break;
			}
		} return d;
	},
	rem:function(el){ if(el.parentNode){ d=el.parentNode.removeChild(el); return d; } },
	putAt :function(target,c){
		if(target){
			target.style.left= c.x +'px';
			target.style.top = c.y +'px';
		}
	},
	showAt:function(target,c){
		if(target){
			target.style.left	= c.x +'px';
			target.style.top	= c.y +'px';
			target.style.width	= c.w +'px';
			target.style.height	= c.h +'px';
		}
	},
	xywh:function(el){  //x,y,width,height
		var d = Element.getDimensions(el);		//={w,h} of the object
		var c = Position.cumulativeOffset(el);	//={x,y} absolute offset from the top-left corner
		return {x:c[0], y:c[1], w:d.width, h:d.height};
	},
	wh:function(el){	//=width/height
		var d = Element.getDimensions(el);		//={w,h} of the object
		return {w:d.width, h:d.height};
	}
});

/*  SkyByteDD.js v1.0-beta, May 17 2007
 *  (c) 2007 Aleksandras Ilarionovas (Alex)
 *
 *  SkyByteDD.js is freely distributable under the terms of an MIT-style license.
 *  For details, see the SkyByte.net web site: http://www.skybyte.net/scripts/
 *
 *--------------------------------------------------------------------------*/

if(typeof Prototype		== 'undefined') { throw("SkyByteDD.js requires Prototype.js library"); }
else if(typeof SkyByte  == 'undefined')	{ throw("SkyByteDD.js requires SkyByte.js library"); }

var SkyByteDD = { Version: '1.2' };

var Drags = {
	drag    : null,
	drags   : [],
	hide    : { x:-100, y:-100, w:0, h:0 },
	register: function(obj) {
		if(this.drags.length === 0){
			Mouse.start(this);
			this.eventMouseUp	=this._mouseUp.bindAsEventListener(this);		Event.observe(document, "mouseup",   this.eventMouseUp);
			if(navigator.appVersion.match(/\bMSIE\b/)){
				this.eventMouseOver	=this._mouseOver.bindAsEventListener(this);
				this.eventMouseOut 	=this._mouseOut.bindAsEventListener(this);
			}
			this.div=Element.add('div',{},{},{a:document.body, c:'dragmove'});
			document.body.onselectstart = function () { return false; };	//disable selection in IE
		}
		this.drags.push(obj);
	},
	unregister: function(el){
		this.drags = this.drags.reject(function(d) { return d.element==el; });
	},
	is_drag: function(el){
		return this.drags.detect(function(d) { return d.element==el; });
	},
	destroy: function(){ var i,o,len;
		if(this.drags.length > 0){
			this.drag=null; //could be that elements activated with Drags.activate(el) function
			$A(this.drags).each( function(o){
				if(typeof o.destroy==='function'){ o.destroy(); } //so they don't have destroy function from the start
			});
		}
		if(this.drags.length === 0 && this.div){
			Element.rem(this.div); Mouse.stop(this);
			Event.stopObserving(document, "mouseup", this.eventMouseUp);
		}
	},
	activate: function(drag,e){
		this.drag = drag; this.drag.IE=false;
		if(this.drag.element.tagName==='IMG' && navigator.appVersion.match(/\bMSIE\b/)){
			//IE6 fix: when dragging images, loosing mouseover/mouseout event, so we fire those events on entire document
			this.drag.IE=true;
			Event.observe(document, "mouseover", this.eventMouseOver);
			Event.observe(document, "mouseout",  this.eventMouseOut);
		}
	},
	deactivate: function() {
		if(this.drag.IE){
			Event.stopObserving(document, "mouseover", this.eventMouseOver);
			Event.stopObserving(document, "mouseout",  this.eventMouseOut);
		}
		this.drag = null;
	},
	//--------------------IE only----------------------
	//IE6 ugly walkaround: manually detect if drop zone is over mouse and fire event
	_mouseOver: function(e){
		var d=Drops.is_drop(Event.element(e));
		if(d){
			Drops.drop=d;
			Drops.show_frame();
		}
	},
	//IE6 ugly walkaround
	_mouseOut: function(e){
		if(Drops && Drops.lastActive && typeof Drops.lastActive.options.mouseOut==='function'){
			Drops.lastActive.options.mouseOut(Drops.lastActive.element);
			Drops.lastActive=null;
		}
		Drops.hide_frame();
		Drops.drop=null;
	},
	//--------------------ALL Other--------------------
	_mouseMove: function(e){ if(!this.drag){ return; }
		this.drag._mouseMove(e);//Call MouseMove
		Event.stop(e);
	},
	_mouseUp: function(e){   if(!this.drag){ return; }
		this.drag._mouseUp(e);  //Call MouseUp
		this.drag = null;
		Event.stop(e);
	}
};
//---------------------------------------------------------------------------------------------

var Drag = Class.create();
Drag.prototype = {
	initialize: function(el) {
		this.element = $(el);
		this.options = Object.extend({
			self	 : false,
			classname: 'drag',
			caption  : '',		//moving...
			affect   : false 	//set different rules for all drop zones
		}, arguments[1] || {});
		if(this.options.self){
			this.options.self=this.element.parentNode; Element.makePositioned(this.options.self);
		}
		this.eventMouseDown=this._mouseDown.bindAsEventListener(this);	Event.observe(this.element, "mousedown", this.eventMouseDown);
		Drags.register(this);
	},
	destroy: function(){
		Event.stopObserving(this.element, "mousedown", this.eventMouseDown);
		Drags.unregister(this.element);
	},
	currentDelta: function() { return([
	  parseInt(Element.getStyle(this.options.self,'left') || '0'),
	  parseInt(Element.getStyle(this.options.self,'top') || '0')]);
	},
	_mouseDown:function(e){ var el,pointer,pos;
		if(this.options.self){
			el=this.options.self;
			pointer = [Mouse.x, Mouse.y];
			pos     = Position.cumulativeOffset(el);
			this.offset = [0,1].map( function(i) { return (pointer[i] - pos[i]); });
		}

		Browser.cursor('default');
		Drops.affect=this.options.affect; //tell Drops that this element needs different rules
		Drags.activate(this);
		Event.stop(e);
	},
	_mouseUp:function(e){
		var ok;
		//.........call drop function when mouse released
		Element.putAt(Drags.div,Drags.hide);
		if(this.element && Drops.drop && (this.element!=Drops.drop.element)){
			if(Drops.drop.options.accept===this.element.tagName){ ok=true; }
			if(Drops.drop.options.accept===''){ ok=true; }
			if(Drops.affect){ ok=true; }
			if(ok){
				if(typeof Drops.drop.options.mouseUp==='function'){
					Drops.drop.options.mouseUp(Drops.drop.element,this.element);
				}
			}
		}
		//.........
		Drops.affect=false; //tell Drops to return to normal state
		Drags.deactivate();
		Drops.hide_frame();
		//Event.stop(e); //already stopped
	},
	_mouseMove:function(e){
		var ok,d,pos,point,p,style,el,div,caption;
		if(this.options.self){ el=this.options.self;
			pos = Position.cumulativeOffset(el);
			d = this.currentDelta();
			pos[0] -= d[0]; pos[1] -= d[1];
			point=[]; point.push(Mouse.x); point.push(Mouse.y);
			p=[0,1].map(function(i){ return (point[i]-pos[i]-this.offset[i]) }.bind(this));
			style = el.style;
			style.left = p[0] + "px";
			style.top  = p[1] + "px";
		}else{
			//.........set default drag style and caption
			div=Drags.div;	div.className='dragmove'; caption=this.options.caption;
			if(this.element && Drops.drop && (this.element!=Drops.drop.element)){
				if(Drops.drop.options.accept && Drops.drop.options.accept===this.element.tagName){ ok=true; }
				if(Drops.drop.options.accept===''){ ok=true; }
				if(Drops.affect){ ok=true; }
				if(ok){ cap=Drops.drop.options.caption;
					if(cap){ caption=cap; } //take message from Drop Area?
					div.className=this.options.classname;
					if(typeof Drops.drop.options.mouseOver==='function'){
						Drops.lastActive=Drops.drop;
						Drops.drop.options.mouseOver(Drops.drop.element,this.element);
					}
				}
			}
			//.........place div at cursor
			div.innerHTML=caption; Mouse.x+=15; Mouse.y+=10; Element.putAt(div,Mouse);
			//.........
		}
		//Event.stop(e); //already stopped
	}

};

//---------------------------------------------------------------------------------------------
var Drops = {
	lastActive	: null,
	frameactive	: null,
	drop		: null,
	affect		: null,
	drops		: [],
	hide		: {	x:-10, y:-10, w:0, h:0	},
	register: function(obj) {
		if(this.drops.length === 0){
			this.L = Element.add('div',{},{},{a:document.body, c:'drop'});
			this.R = Element.add('div',{},{},{a:document.body, c:'drop'});
			this.T = Element.add('div',{},{},{a:document.body, c:'drop'});
			this.B = Element.add('div',{},{},{a:document.body, c:'drop'});
		}
		this.drops.push(obj);
	},
	unregister: function(el){
		this.hide_frame(); //hide frame if mouse over zone
		this.drops = this.drops.reject(function(d) { return d.element==el; });
	},
	destroy: function(){ var i,o,len;
		if(this.drops.length > 0){
			Element.rem(this.L); Element.rem(this.R); Element.rem(this.T); Element.rem(this.B);
			$A(this.drops).each( function(o){
				if(typeof o.destroy==='function'){ o.destroy(); } //so they don't have destroy function from the start
			});
			this.drop=null;
			this.hide_frame(); //hide frame if mouse over zone
		}
	},
	is_drop: function(el){
		return this.drops.detect(function(d) { return d.element==el; });
	},
	show_frame: function(){
		this.frameactive=true;
		var pointer=Element.xywh(this.drop.element);
		this.L.className=this.drop.options.classname;
		this.R.className=this.drop.options.classname;
		this.T.className=this.drop.options.classname;
		this.B.className=this.drop.options.classname;
		Element.showAt(this.L,{x:pointer.x, y:pointer.y, w:1, h:pointer.h});
		Element.showAt(this.R,{x:(pointer.x+pointer.w), y:pointer.y, w:1, h:pointer.h});
		Element.showAt(this.T,{x:pointer.x, y:pointer.y, w:pointer.w, h:1});
		Element.showAt(this.B,{x:pointer.x, y:(pointer.y+pointer.h), w:pointer.w, h:1});
	},
	hide_frame: function(){
		if(this.drops.length>0 && this.frameactive){
			this.frameactive=false;
			Element.showAt(this.L,this.hide);
			Element.showAt(this.R,this.hide);
			Element.showAt(this.T,this.hide);
			Element.showAt(this.B,this.hide);
		}
	}
};

//---------------------------------------------------------------------------------------------
var Drop = Class.create();
Drop.prototype = {
	initialize: function(el){
		this.element = $(el);
		this.options = Object.extend({
			caption		: '',		//drop here
			classname	: 'drop',
			accept		: this.element.tagName,
			mouseUp		: null,
			mouseOver	: null,
			mouseOut	: null
		}, arguments[1] || {});
		this.eventMouseOver=this._mouseOver.bindAsEventListener(this);	Event.observe(this.element, "mouseover", this.eventMouseOver);
		this.eventMouseOut =this._mouseOut.bindAsEventListener(this);	Event.observe(this.element, "mouseout",  this.eventMouseOut);
		Drops.register(this);
	},
	destroy: function(){
		Event.stopObserving(this.element, "mouseover", this.eventMouseOver);
		Event.stopObserving(this.element, "mouseout", this.eventMouseOut);
		Drops.unregister(this.element);
	},
	_mouseOver:function(e){
		var d=Drops.is_drop(Event.element(e));
		if(!d){ d=Drops.is_drop(this.element); }
		if(d){
			Drops.drop=d;
			Drops.show_frame();
		}
		Event.stop(e);
	},
	_mouseOut:function(e){
		if(Drops.lastActive && typeof Drops.lastActive.options.mouseOut==='function'){
			Drops.lastActive.options.mouseOut(Drops.lastActive.element);
			Drops.lastActive=null;
		}
		Drops.drop=null;
		Drops.hide_frame();
		Event.stop(e);
	}
};
//---------------------------------------------------------------------------------------------

/*  SkyByteRS.js, May 17 2007
 *  (c) 2007 Aleksandras Ilarionovas (Alex)
 *
 *  SkyByteRS.js is freely distributable under the terms of an MIT-style license.
 *  For details, see the SkyByte.net web site: http://www.skybyte.net/scripts/
 *
 *--------------------------------------------------------------------------*/
if(!Prototype)	 	{ throw("SkyByteRS.js requires Prototype.js library");	}
else if(!SkyByte)	{ throw("SkyByteRS.js requires SkyByte.js library");	}
else if(!SkyByteDD)	{ throw("SkyByteRS.js requires SkyByteDD.js library");	}

var SkyByteRS = { Version: '1.2.3' };

var Resizes = {
	resizes		: [],
	resize		: {},
	resizing	: null,
	frameactive	: false,
	register:function(obj){
		if(this.resizes.length === 0){

			this.L  = Element.add('div',{},{position:'absolute',top:'-50px',left:'-50px'},{c:'resizel', a:document.body});
			this.R  = Element.add('div',{},{position:'absolute',top:'-50px',left:'-50px'},{c:'resizer', a:document.body});
			this.T  = Element.add('div',{},{position:'absolute',top:'-50px',left:'-50px'},{c:'resizet', a:document.body});
			this.B  = Element.add('div',{},{position:'absolute',top:'-50px',left:'-50px'},{c:'resizeb', a:document.body});
			this.box= Element.add('div',{},{position:'absolute',top:'-50px',left:'-50px'},{c:'resizebox', a:document.body});

			this.TM = Element.add('div',{},{cursor:'s-resize' ,overflow:'hidden',position:'absolute',top:'-50px',left:'-50px'},{c:'resizeknob', a:document.body});	Drags.register(this.TM);
			this.BM = Element.add('div',{},{cursor:'s-resize' ,overflow:'hidden',position:'absolute',top:'-50px',left:'-50px'},{c:'resizeknob', a:document.body});	Drags.register(this.BM);
			this.LT = Element.add('div',{},{cursor:'se-resize',overflow:'hidden',position:'absolute',top:'-50px',left:'-50px'},{c:'resizeknob', a:document.body});	Drags.register(this.LT);
			this.LM = Element.add('div',{},{cursor:'e-resize' ,overflow:'hidden',position:'absolute',top:'-50px',left:'-50px'},{c:'resizeknob', a:document.body});	Drags.register(this.LM);
			this.LB = Element.add('div',{},{cursor:'ne-resize',overflow:'hidden',position:'absolute',top:'-50px',left:'-50px'},{c:'resizeknob', a:document.body});	Drags.register(this.LB);
			this.RT = Element.add('div',{},{cursor:'sw-resize',overflow:'hidden',position:'absolute',top:'-50px',left:'-50px'},{c:'resizeknob', a:document.body});	Drags.register(this.RT);
			this.RM = Element.add('div',{},{cursor:'e-resize' ,overflow:'hidden',position:'absolute',top:'-50px',left:'-50px'},{c:'resizeknob', a:document.body});	Drags.register(this.RM);
			this.RB = Element.add('div',{},{cursor:'nw-resize',overflow:'hidden',position:'absolute',top:'-50px',left:'-50px'},{c:'resizeknob', a:document.body});	Drags.register(this.RB);

 			this.eventMouseDown	=this._mouseDown.bindAsEventListener(this);	//knob event
 			this.eventMouseOver	=this._mouseOver.bindAsEventListener(this);	//knob event
 			this.eventMouseOut	=this._mouseOut.bindAsEventListener(this);	//knob event
			this.eventClick		=this._observeClick.bindAsEventListener(this);	Event.observe(document, "mousedown", this.eventClick); //catch clicks outside element

 			Event.observe(this.TM, "mousedown", this.eventMouseDown);	Event.observe(this.TM, "mouseover", this.eventMouseOver);	Event.observe(this.TM, "mouseout",  this.eventMouseOut);
 			Event.observe(this.BM, "mousedown", this.eventMouseDown);	Event.observe(this.BM, "mouseover", this.eventMouseOver);	Event.observe(this.BM, "mouseout",  this.eventMouseOut);
 			Event.observe(this.LT, "mousedown", this.eventMouseDown);	Event.observe(this.LT, "mouseover", this.eventMouseOver);	Event.observe(this.LT, "mouseout",  this.eventMouseOut);
 			Event.observe(this.LM, "mousedown", this.eventMouseDown);	Event.observe(this.LM, "mouseover", this.eventMouseOver);	Event.observe(this.LM, "mouseout",  this.eventMouseOut);
 			Event.observe(this.LB, "mousedown", this.eventMouseDown);	Event.observe(this.LB, "mouseover", this.eventMouseOver);	Event.observe(this.LB, "mouseout",  this.eventMouseOut);
 			Event.observe(this.RT, "mousedown", this.eventMouseDown);	Event.observe(this.RT, "mouseover", this.eventMouseOver);	Event.observe(this.RT, "mouseout",  this.eventMouseOut);
 			Event.observe(this.RM, "mousedown", this.eventMouseDown);	Event.observe(this.RM, "mouseover", this.eventMouseOver);	Event.observe(this.RM, "mouseout",  this.eventMouseOut);
 			Event.observe(this.RB, "mousedown", this.eventMouseDown);	Event.observe(this.RB, "mouseover", this.eventMouseOver);	Event.observe(this.RB, "mouseout",  this.eventMouseOut);
		}

		this.resizes.push(obj);
	},
	unregister: function(el){
		this.hide_frame();
		this.resizes = this.resizes.reject(function(d) { return d.element==el; });
	},
	destroy: function(){ var i,o;
		if(this.resizes.length > 0){
			$A(this.resizes).each( function(o){
				if(o.destroy){ o.destroy(); }
			});
		}
		if(this.resizes.length === 0 && this.TM){
			this.resize={};
			Element.rem(this.T); Element.rem(this.B); Element.rem(this.L); Element.rem(this.R);
			Drags.unregister(this.TM); Element.rem(this.TM);
			Drags.unregister(this.TB); Element.rem(this.BM);
			Drags.unregister(this.LT); Element.rem(this.LT);
			Drags.unregister(this.LM); Element.rem(this.LM);
			Drags.unregister(this.LB); Element.rem(this.LB);
			Drags.unregister(this.RT); Element.rem(this.RT);
			Drags.unregister(this.RM); Element.rem(this.RM);
			Drags.unregister(this.RB); Element.rem(this.RB);
			Event.stopObserving(this, "mousedown", this.eventMouseDown);
			Event.stopObserving(this, "mouseover", this.eventMouseOver);
			Event.stopObserving(this, "mouseout",  this.eventMouseOut);
			Event.stopObserving(document, "mousedown", this.eventClick);
		}
		this.hide_frame();
	},
	is_resize: function(el){
		return this.resizes.detect(function(d) { return d.element==el; });
	},
	activate  : function(el){
		var r=Resizes.is_resize(el); if(!r){ return; } 
		Resizes.resize=r; this.element=el; 
		this.show_frame(Element.xywh(this.element));
	},
	deactivate: function(){
		this.hide_frame();
	},
	show_frame: function(c){  var opt=this.resize.options; if(this.resizes.length==0){ return; }
		this.frameactive=true;
		if(opt.indicator==true){
			this.box.innerHTML=c.w+'x'+c.h; var bb=Element.wh(this.box); 
			Element.putAt(this.box,{x:c.x+(c.w/2)-(bb.w/2), y:c.y+(c.h/2)-(bb.h/2)}); 
		}
		Element.showAt(this.L,{x:c.x, y:c.y, w:1, h:c.h});
		Element.showAt(this.R,{x:(c.x+c.w), y:c.y, w:1, h:c.h});
		Element.showAt(this.T,{x:c.x, y:c.y, w:c.w, h:1});
		Element.showAt(this.B,{x:c.x, y:(c.y+c.h), w:c.w, h:1});

		Element.putAt(this.TM, {x: c.x+((c.w/2)-4), y: (c.y-2) });
		Element.putAt(this.BM, {x: c.x+((c.w/2)-4), y: c.y+(c.h-4) });
		Element.putAt(this.LT, {x: (c.x-3), y: (c.y-2) });
		Element.putAt(this.LM, {x: (c.x-3), y: c.y+((c.h/2)-3) });
		Element.putAt(this.LB, {x: (c.x-3), y: c.y+(c.h-4) });
		Element.putAt(this.RT, {x: c.x+(c.w-4), y: (c.y-2) });
		Element.putAt(this.RM, {x: c.x+(c.w-4), y: c.y+((c.h/2)-3) });
		Element.putAt(this.RB, {x: c.x+(c.w-4), y: c.y+(c.h-4) });
	},
	hide_frame: function(){
		if(this.frameactive){
			this.show_frame({x:-50,y:-50,w:10,h:10}); this.frameactive=false;
		}
	},
	border:function(el){  
		var cl =Element.add('div',{},{background:'red',border:'0',margin:0,padding:0,visibility:'hidden'},{clone:el, a:el.parentNode});
		var cwh=Element.wh(cl); var ewh=Element.wh(el); Element.rem(cl);
		return {w:(ewh.w-cwh.w), h:(ewh.h-cwh.h)};
	},
	minmax: function(src){ var i,o,xy;
		var minW=0; var minH=0; var maxW=0; var maxH=0;
		//1. find parent outer dimensions 760px;
		var div0 = Element.add('div',{},{},{a:src.parentNode});	var parXY=Element.wh(div0);	Element.rem(div0);

		//2. find owner inner dimensions 300px;
		var div1 = Element.add('div',{},{position:'absolute',top:'0px',left:'0px'},{a:document.body});
		var div2 = Element.add('div',{},{width:'auto',height:'auto',float:'left'},{clone:src, txt:'', a:div1});

		//3. find owner margins
		var outXY=Element.xywh(div1); var innXY=Element.xywh(div2);	Element.rem(div1);
		var ml=innXY.x; var mt=innXY.y; var mr=outXY.w-(innXY.x+innXY.w); var mb=outXY.h-(innXY.y+innXY.h);

		//4. find owner inner dimensions 300px;
		var ownXY=Element.xywh(src);  //target element dimensions
		var els=src.getElementsByTagName('*');
		for (i=0, len=els.length; i<len; ++i){ o=els[i];
			xy=Element.xywh(o); mW=xy.x+xy.w; mH=xy.y+xy.h; if(mW>minW){minW=mW;} if(mH>minH){minH=mH;}
		}

		var a={};
		a.minW=minW-ownXY.x; if(a.minW<0){a.minW=0;}
		a.minH=minH-ownXY.y; if(a.minH<0){a.minH=0;}
		a.maxW=(parXY.w-mr-ml); a.maxH=(parXY.h-mt-mb); //= maxW(760) - margin left - margin right = 740
		a.w=ownXY.w; a.h=ownXY.h;
		//IE bug: element "margin:0 auto;" will return huge margins, [ ...300...] [element] [...300...]
		if(a.maxW<=0 || a.maxW<ownXY.w){ a.maxW=parXY.w; } //=parXY.w 
		if(a.maxH<=0 || a.maxH<ownXY.h){ a.maxH=0; } //=parXY.h  
		return a;
	},
	_mouseMove:function(e){ var rA; if(!this.init){ return; }
		var opt= this.resize.options;
		var m0 = this.init.mouse;
		var mm = this.init.wh;
		var mb = this.init.border;
		var mx = this.init.minmax;
		var pr = opt.proportional;
		var dX=(m0.x-Mouse.x); var dY=(m0.y-Mouse.y); if(mm.h>0){ rA=(mm.w/mm.h); }else{ rA=1; } 
		var newX=(mm.w-dX); var newY=(mm.h-dY);
		switch(this.init.knob){
			case this.RM: newX=(mm.w-dX);										newY=mm.h;		break;
			case this.LM: newX=(mm.w+dX);										newY=mm.h; 		break;
			case this.TM: newX=mm.w;											newY=(mm.h+dY);	break;
			case this.BM: newX=mm.w;											newY=(mm.h-dY);	break;
			case this.RT: if(pr){ newX=Math.round((mm.w-(dX*rA)));			}	newY=(mm.h-dX);	break;
			case this.LT: if(pr){ dX=-dX; newX=Math.round((mm.w-(dX*rA)));	}	newY=(mm.h-dX);	break;
			case this.RB: if(pr){ newX=Math.round((mm.w-(dX*rA)));			}	newY=(mm.h-dX);	break;
			case this.LB: if(pr){ dX=-dX; newX=Math.round((mm.w-(dX*rA)));	}	newY=(mm.h-dX);	break;
		}
		//control inner and outer dimensions
		if(mx.minW){ if(newX<=mx.minW){ newX=mx.minW; } }
		if(mx.minH){ if(newY<=mx.minH){ newY=mx.minH; } }
		if(mx.maxW){ if(newX>=mx.maxW){ newX=mx.maxW; } }
		if(mx.maxH){ if(newY>=mx.maxH){ newY=mx.maxH; } }
		
		newX=newX-mb.w; if(newX<0){newX=0;}
		newY=newY-mb.h; if(newY<0){newY=0;}
			
		this.element.style.width =newX+'px';
		this.element.style.height=newY+'px';
		
		
		var p=Element.xywh(this.element);
		this.show_frame(p);
		if(typeof opt.mouseMove==='function'){  opt.mouseMove(this.element,dX,dY,this); }
		return p;
	},
	_mouseDown:function(e){
		var src=Event.element(e); Event.stop(e);
		if(src.className!='resizeknob'){ return; }
		switch(src){
			case this.TM: Drags.activate(this); break;
			case this.BM: Drags.activate(this); break;
			case this.LT: Drags.activate(this); break;
			case this.LM: Drags.activate(this); break;
			case this.LB: Drags.activate(this); break;
			case this.RT: Drags.activate(this); break;
			case this.RM: Drags.activate(this); break;
			case this.RB: Drags.activate(this); break;
		}
		var mx=this.minmax(this.element); var opt=this.resize.options;
		if(opt.min.w){ mx.minW=opt.min.w; }
		if(opt.min.h){ mx.minH=opt.min.h; }
		if(opt.max.w){ mx.maxW=opt.max.w; }
		if(opt.max.h){ mx.maxH=opt.max.h; }
		this.init = {
			knob	: src,
			mouse	:{ x:Mouse.x, y:Mouse.y },
			wh		:{ w:mx.w, h:mx.h },
			border	: this.border(this.element),
			minmax	: mx
		};
		if(typeof opt.startResize==='function'){ opt.startResize(this.element); }
	},
	_observeClick:function(e){ var el,click;
		if(!this.frameactive){ return; }
		var src=Event.element(e);
		var r=Resizes.is_resize(this.element);
		if(r){
			click=r.options.click;
			if(click==true){
				if(src!=this.element){	this.deactivate(); }
			}else if(click==false){
				//do not destroy selection
			}else{
				el=$(click); if(el==src){ this.deactivate(); }
			}
		}
	},
	_mouseUp:function(e){ var opt= this.resize.options;
		if(typeof opt.endResize==='function'){ opt.endResize(this.element); }	
		this.init=false; Browser.cursor('default');
	},
	_mouseOver:function(e){
		var src=Event.element(e); if(src.className==='resizeknob'){ src.style.background='black'; }
	},
	_mouseOut:function(e){
		var src=Event.element(e); if(src.className==='resizeknob'){ src.style.background='white'; }
	}

};

//----------------------------------------------------------------------------

var Resize = Class.create();
Resize.prototype = {
	initialize: function(el){
		this.element = $(el);
		this.options = Object.extend({
			event		: 'mousedown',
			startResize	: null,
			mouseMove	: null,
			endResize	: null,
			indicator	: true,
			click		: true,
			proportional: true,
			min			: {w:0,h:0},
			max			: {w:0,h:0}
		}, arguments[1] || {});
		//check for min, max here once, because we may want to pass initial element dimensions, before resizing it
	    if(typeof this.options.min==='function'){
	        this.options.min=this.options.min(this); if(!this.options.min){ this.options.min={w:0,h:0}; }
		}
		if(typeof this.options.max==='function'){
	        this.options.max=this.options.max(this); if(!this.options.max){ this.options.max={w:0,h:0}; }
		}
		this.eventActivate=this.activate.bindAsEventListener(this);	Event.observe(this.element, this.options.event, this.eventActivate);
		Resizes.register(this);
	},
	activate:function(e){
		var el=Event.element(e);
		Resizes.activate(el);
	},
	destroy: function(){
		Event.stopObserving(this.element, this.options.event, this.eventActivate);
		Resizes.unregister(this.element);
	}
};

//----------------------------------------------------------------------------

