var MovingElement = Class.create({
	initialize: function(element, event, options){
		Object.extend(this, options || {});
		this.element = $(element);
		this.element.absolutize();
		this.initialOffset = this.element.viewportOffset();
		this.pointer = this.getPointer(event)
		this.diffX = this.initialOffset.left -  this.pointer.x;
		this.diffY = this.initialOffset.top - this.pointer.y;
		Event.observe(document, "mousemove", this.bindedMove = (typeof this.onmove == "function" ? //
			function(event){ this.move(event); this.onmove(event); } : this.move).bindAsEventListener(this));
		Event.observe(document, "mouseup", this.bindedStop = this.stop.bindAsEventListener(this));
	},

	getPointer: function(event){
		return {
			"x": Event.pointerX(event),
			"y": Event.pointerY(event)
		};
	},

	refreshPosition: function(){
		var reqVPOffset = {
			"left": this.pointer.x + this.diffX,
			"top": this.pointer.y + this.diffY
		}
		var curVPOffset = Element.viewportOffset(this.element);
		var curOffset = Element.positionedOffset(this.element);
		Element.setStyle(this.element, {
			"left": curOffset["left"] + reqVPOffset["left"] - curVPOffset["left"] + "px",
			"top": curOffset["top"] + reqVPOffset["top"] - curVPOffset["top"] + "px"
		});
	},

	move: function(event){
		this.pointer = this.getPointer(event);
		this.refreshPosition();
		event.stop();
	},

	stop: function(event){
		Event.stopObserving(document, "mousemove", this.bindedMove);
		Event.stopObserving(document, "mouseup", this.bindedStop);
		this.element = null;
		event.stop();
		if (typeof this.onfinish == "function") this.onfinish();
	}
});

Element.exactDimensions = function(element){
	if (!element) return {};
	return { "width": element.clientWidth, "height": element.clientHeight };
};

Element.exactHeight = function(element){ return Element.exactDimensions(element)["height"]; };

var ResizeableElement = Class.create({
	direction: "se",
	initialize: function(element, event, options){
		Object.extend(this, options || {});
		this.element = $(element);
		this.target = this.target ? $(this.target) : this.element;
		this.min = this.min || 0;
// 		this.initialDimensions = Element.getDimensions(this.element);
		this.initialDimensions = Element.exactDimensions(this.element);
		this.diffX = this.initialDimensions.width - event.pointerX();
		this.diffY = this.initialDimensions.height - event.pointerY();
		this.do_move = Event.stop;
		switch(this.direction){
			case "se": this.do_move = this.moveSE; break;
			case "s": this.do_move = this.moveS; break;
			case "w":
				this.diffX = this.initialDimensions.width + event.pointerX();
				this.do_move = this.moveW;
				break;
			case "e": this.do_move = this.moveE; break;
		}
		Event.observe(document, "mousemove", this.bindedMove = (typeof this.onmove == "function" ? //
			function(event){ this.do_move(event); this.onmove(event); } : this.do_move).bindAsEventListener(this));
		Event.observe(document, "mouseup", this.bindedStop = this.stop.bindAsEventListener(this));
		event.stop();
	},

	moveSE: function(event){
		Element.setStyle(this.target, {
			width: String(event.pointerX() + this.diffX) + "px",
			height: String(event.pointerY() + this.diffY) + "px"
		});
		event.stop();
	},

	moveS: function(event){
		Element.setStyle(this.target, {height: String(Math.max(event.pointerY() + this.diffY, this.min)) + "px"});
		event.stop();
	},

	moveW: function(event){
		Element.setStyle(this.target, {width: String(Math.max(- event.pointerX() + this.diffX, this.min)) + "px"});
		event.stop();
	},

	moveE: function(event){
		Element.setStyle(this.target, {width: String(Math.max(event.pointerX() + this.diffX, this.min)) + "px"});
		event.stop();
	},

	stop: function(event){
		Event.stopObserving(document, "mousemove", this.bindedMove);
		Event.stopObserving(document, "mouseup", this.bindedStop);
		this.element = null;
		event.stop();
		if (typeof(this.onfinish) == "function") this.onfinish();
	}
});

var MouseObserver = Class.create({
	initialize: function(element){
		this.element = element || document;
		this.binded = {};
		MouseObserver.triggers.each(function(evtnam){
			var callback = this["on" + evtnam];
			if (!Object.isFunction(callback)) return;
			this.binded[evtnam] = callback.bindAsEventListener(this);
			var evtelem = MouseObserver.triggers_document.include(evtnam) ? document : this.element;
			if (evtnam == "scroll") ["mousewheel", "DOMMouseScroll"].each(function(nam){
				Event.observe(evtelem, nam, this.binded[evtnam]); }, this);
			else Event.observe(evtelem, evtnam, this.binded[evtnam]);
		}, this);
	},

	getPointer: function(event){ return { "x" : Event.pointerX(event), "y": Event.pointerY(event) }; },

	fireCustomEvent: function(event_type, event){
		var curpos = this.getPointer(event);
		Element.fire(Event.element(event), MouseObserver.events[event_type], Object.extend(curpos, {
			"dx": curpos["x"] - this.inipos["x"],
			"dy": curpos["y"] - this.inipos["y"],
			"dx-recent": curpos["x"] - this.lastpos["x"],
			"dy-recent": curpos["y"] - this.lastpos["y"],
			"original-event": event }));
		this.lastpos = curpos;
	},

	active: false,

	onmousedown: function(event){
		this.active = true;
		this.inipos = this.getPointer(event);
		this.lastpos = this.inipos;
		this.fireCustomEvent("mousedown", event);
		Event.stop(event);
	},

	onmousemove: function(event){ if (this.active) this.fireCustomEvent("mousemove", event); },

	onmouseup: function(event){
		if (!this.active) return;
		this.fireCustomEvent("mouseup", event);
		this.active = false;
	},

	onclick: function(event){
		this.fireCustomEvent("click", event);
	},

	onscroll: function(event){
		var curpos = this.getPointer(event);
		Element.fire(Event.element(event), MouseObserver.events["scroll"], Object.extend(curpos, {
			"ticks": event.detail || 0,
			"original-event": event }));
	}
});

MouseObserver.triggers = ["click", "mousedown", "mousemove", "mouseup", "scroll"];
MouseObserver.triggers_document = ["mousemove", "mouseup"];

MouseObserver.events = {};

MouseObserver.triggers.each(function(evtnam){
	MouseObserver.events[evtnam] = "mouse-observer:" + evtnam;
});

var Resizer = Class.create({
	initialize: function(catcher, target, params){
		if (!catcher || !target) return;
		var wnd = params.wnd || null;
		delete params.wnd;
		if (wnd && wnd.OnResize) params["onmove"] = params["onfinish"] = wnd.OnResize.bind(wnd);
		this.wnd_ = wnd;
		Event.observe(catcher, "mousedown", function(event){ new ResizeableElement(target, event, params); });
		this.catcher_ = catcher;
		this.target_ = target;
		this.catcher_.resizer__ = this.target_.resizer__ = this;
		this.params_ = params;
	},

	SetAttribute: function(nam, val){
		if (nam == "visibility" && ["yes", "ro", "vo", "link", "no"].include(val)){
			var vo = val == "vo" || val == "link";
			Element.setStyle(this.catcher_, {"display": vo || val == "no" ? "none" : ""});
			Element.setStyle(this.target_, {"display": val == "no" ? "none" : ""});
			if (vo){
				var dir = String(this.params_.dir|| "se").toLowerCase();
				if (dir.include("s") || dir.include("n")) Element.setStyle(this.target_, {"height": "", "overflowY": "auto"});
				if (dir.include("w") || dir.include("e")) Element.setStyle(this.target_, {"width": "", "overflowX": "auto"});
				if (this.wnd_ && this.wnd_.OnResize) this.wnd_.OnResize();
			}else Element.setStyle(this.target_, {"overflowX": "", "overflowY": ""});
			Element[vo ? "addClassName" : "removeClassName"](this.target_, "VO");
			if (this.target_.parentNode == this.catcher_.parentNode && //
					Element.hasClassName(this.target_.parentNode, "Wrapper"))
				Element[vo ? "addClassName" : "removeClassName"](this.target_.parentNode, "VO");
		}
	}
});

var Bounder = Class.create(JSControl, {
	initialize: function(element, dims, bounds){
		this.element_ = $(element); if (!this.element_) return;
		if (!this.element_.JSControl) this.element_.JSControl = this;
		else if (!this.element_.JSControl.OnResize) this.element_.JSControl.OnResize = this.OnResize.bind(this);
		var awnd = AControl.GetParentWindow(this.element_);
		if (awnd) awnd.RegisterResizeableChild(this.ID());
		this.dims_ = String(dims);
		this.bounds_ = bounds || {};
		this.element_.JSControl.OnResize();
	},

	getGridFrame: function(){
		if (!this.gridframe_) this.gridframe_ = Element.up(this.element_, "div[type='gridFrame']");
		return this.gridframe_;
	},

	getStyleNum: function(element, property){ return parseInt(Element.getStyle(element, property), 10) || 0; },

	computeWidth: function(){
		var gridframe = this.getGridFrame(); if (!gridframe) return 100000;
		var width = gridframe.innerWidth || //
			(gridframe.offsetWidth - this.getStyleNum(gridframe, "paddingLeft") - this.getStyleNum(gridframe, "paddingRight"));
		width -= this.element_.offsetLeft;// + this.getStyleNum(this.element_, "marginRight");
		for (var elem = this.element_.offsetParent; //
				elem && elem != gridframe && Element.descendantOf(elem, gridframe); //
				elem = elem.offsetParent){
			if (Element.descendantOf(elem.offsetParent, gridframe) || elem.offsetParent == gridframe) width -= elem.offsetLeft;
			else width -= this.getStyleNum(elem, "paddingLeft");
			width -= this.getStyleNum(elem, "paddingRight");
		}
		if (this.bounds_["min-width"]) width = Math.max(width, this.bounds_["min-width"] || 0);
		if (this.bounds_["max-width"]) width = Math.min(width, this.bounds_["max-width"] || 0);
		return width;
	},

	computeHeight: function(){
		var gridframe = this.getGridFrame(); if (!gridframe) return 100000;
		var height = gridframe.innerHeight || //
			(gridframe.offsetHeight - this.getStyleNum(gridframe, "paddingTop") - this.getStyleNum(gridframe, "paddingBottom"));
		height -= this.element_.offsetTop + this.getStyleNum(this.element_, "marginBottom");
		for (var elem = this.element_.offsetParent; //
				elem && elem != gridframe && Element.descendantOf(elem, gridframe); //
				elem = elem.offsetParent){
			if (Element.descendantOf(elem.offsetParent, gridframe) || elem.offsetParent == gridframe) height -= elem.offsetTop;
			else width -= this.getStyleNum(elem, "paddingTop");
			width -= this.getStyleNum(elem, "paddingBottom");
		}
		if (this.bounds_["min-height"]) height = Math.max(height, this.bounds_["min-height"] || 0);
		if (this.bounds_["max-height"]) height = Math.min(height, this.bounds_["max-height"] || 0);
		return height;
	},

	OnResize: function(){
		if (this.dims_.include("w")){
			var width = this.computeWidth();
			Element.setStyle(this.element_, {"maxWidth": (width <= 0 ? "" : width + "px")});
		}
		if (this.dims_.include("h")) Element.setStyle(this.element_, {"maxHeight": this.computeHeight() + "px"});
	},

	ID: function(){ return Element.identify(this.element_); },

	SetTabOrder: function(tabbase){
		JSControl.GetChildControls(this.element_).each(function(jscontrol){ tabbase = jscontrol.SetTabOrder(tabbase); });
		return tabbase;
	}
});

var Stretcher = Class.create(Bounder, {
	OnResize: function(){
		if (this.dims_.include("w")) Element.setStyle(this.element_, {"width": this.computeWidth() + "px"});
		if (this.dims_.include("h")) Element.setStyle(this.element_, {"height": this.computeHeight() + "px"});
	}
});