/* Selection handling
   (C) 2006-2010 Thomas Winischhofer, Vienna, Austria
*/

var Selections = {
	sels: [],
	observer: [],

	register: function(selectionhandler) {
		if(this.sels.length == 0) {
			this.eventMouseUp   = this.endselection.bindAsEventListener(this);
			this.eventMouseMove = this.dohandleselection.bindAsEventListener(this);
			this.eventOnKeyDown = this.mykeydown.bindAsEventListener(this);
			this.eventOnKeyUp = this.mykeyup.bindAsEventListener(this);

			Event.observe(document, "mouseup", this.eventMouseUp);
			Event.observe(document, "mousemove", this.eventMouseMove);
			Event.observe(document, "keydown", this.eventOnKeyDown);
			Event.observe(document, "keyup", this.eventOnKeyUp);
		}
		this.sels = this.sels.reject(function(s) { return s.myelementid==selectionhandler.myelementid });
		this.sels.push(selectionhandler);
	},

	unregister: function(selectionhandler) {
		this.sels = this.sels.reject(function(s) { return s==selectionhandler });
		if(this.sels.length == 0) {
			Event.stopObserving(document, "mouseup", this.eventMouseUp);
			Event.stopObserving(document, "mousemove", this.eventMouseMove);
			Event.stopObserving(document, "keydown", this.eventOnKeyDown);
			Event.stopObserving(document, "keyup", this.eventOnKeyUp);
		}
	},

	activate: function(selectionhandler) {
		window.focus(); // allows keypress events if window isn't currently focused, fails for Safari
		this.activeSelectionHandler = selectionhandler;
	},

	deactivate: function() {
		this.activeSelectionHandler = null;
	},

	endselection: function(event) {
		if(!this.activeSelectionHandler) return;
		this._lastPointer = null;
		this.activeSelectionHandler.endselection(event);
		this.activeSelectionHandler = null;
	},

	dohandleselection: function(event) {
		if(!this.activeSelectionHandler) return;
		//if (this.activeSelectionHandler.showcoords) {
		//	document.getElementById(this.activeSelectionHandler.showcoords).innerHTML = Event.pointerX(event) + "x" + Event.pointerY(event);
		//}
		var pointer = [Event.pointerX(event), Event.pointerY(event)];
		// Mozilla-based browsers fire successive mousemove events with
		// the same coordinates, prevent needless redrawing (moz bug?)
		if(this._lastPointer && (this._lastPointer.inspect() == pointer.inspect())) return;
		this._lastPointer = pointer;
		this.activeSelectionHandler.dohandleselection(event);
	},

	mykeydown: function(event) {
		if(this.activeSelectionHandler)
			this.activeSelectionHandler.mykeydown(event);
	},

	mykeyup: function(event) {
		if(this.activeSelectionHandler)
			this.activeSelectionHandler.mykeyup(event);
	}
}

var SelectionHandlers = Class.create();
SelectionHandlers.prototype = {

initialize: function(myelementid, containerid, clearcontainerid, selallcontainerid, coordscontainerid, options, onchangejs) {
	var selecthandler = this;

	if(this.initialized) {
		this.dispose();
	}

	this.myelementid = myelementid;

	this.myelement = document.getElementById(myelementid);
	this.container = document.getElementById(containerid);
	this.clearcontainer = document.getElementById(clearcontainerid);
	this.selallcontainer = document.getElementById(selallcontainerid);
	this.showcoords = coordscontainerid;

	this.scc = this.container.parentNode;

	this.options = options || {};

	this.imgw = this.options.iwidth || this.myelement.offsetWidth;
	this.imgh = this.options.iheight || this.myelement.offsetHeight;

	this.maskid = this.options.mask || this.myelementid + '_mask';

	this.selectionimageid = this.options.selection || this.myelementid + '_selection';
	this.idtl = "js_tl";	/* TODO: Add rnd number to id */
	this.idtm = "js_tm";
	this.idtr = "js_tr";
	this.idml = "js_ml";
	this.idmr = "js_mr";
	this.idbl = "js_bl";
	this.idbm = "js_bm";
	this.idbr = "js_br";

	this.snap = this.options.snap || 7;

	this.imgsrc = this.myelement.src;
	this.selection = null;
	this.curroffsx = 0;
	this.curroffsy = 0;
	this.startcoords = null;
	this.startleft = 0;
	this.starttop = 0;
	this.layercoords = null;
	this.oldabscoords = { x: 0, y: 0 };
	this.newabscoords = null;
	this.key = 0;
	this.ctrlkey = false;
	this.shiftkey = false;
	this.pevent = {};

	this.onChange = this.options.onChange || Prototype.emptyFunction;
	this.onChangeJS = onchangejs || null;
	this.setCook = this.options.setcook || 0;

	this.pwidth = this.options.pw || 0;
	this.pheight = this.options.ph || 0;
	this.phid = this.options.phid || 0;

	this.lockbutton = this.options.lockcont ? document.getElementById(this.options.lockcont) : null;
	this.locktext = this.options.lockontxt || null;
	this.unlocktext = this.options.lockofftxt || null;
	this.lockbst = this.options.lockonbst || null;
	this.unlockbst = this.options.lockoffbst || null;
	if(this.lockbutton && this.locktext) this.lockbutton.innerHTML = this.locktext;

	this.ns6 = document.getElementById && !document.all;
	this.ie = document.all;

	this.eventMouseDown = this.newselection.bindAsEventListener(this);
	this.eventMouseUp   = this.endselection.bindAsEventListener(this);
	this.eventMouseDown2 = this.startmoveselection.bindAsEventListener(this);
	this.eventOnClick = this.updateselection.bindAsEventListener(this);

	this.eventMouseDownTL = this.startresizeselectionTL.bindAsEventListener(this);
	this.eventMouseDownTM = this.startresizeselectionTM.bindAsEventListener(this);
	this.eventMouseDownTR = this.startresizeselectionTR.bindAsEventListener(this);
	this.eventMouseDownML = this.startresizeselectionML.bindAsEventListener(this);
	this.eventMouseDownMR = this.startresizeselectionMR.bindAsEventListener(this);
	this.eventMouseDownBL = this.startresizeselectionBL.bindAsEventListener(this);
	this.eventMouseDownBM = this.startresizeselectionBM.bindAsEventListener(this);
	this.eventMouseDownBR = this.startresizeselectionBR.bindAsEventListener(this);

	this.eventKeyDown = this.mykeydown.bindAsEventListener(this);
	this.eventKeyUp = this.mykeyup.bindAsEventListener(this);

	if(this.imgw > 0) {
		this.initselection();
		this.selectionimage =  document.getElementById(this.selectionimageid);
		Event.observe(this.selectionimage, "mousedown", this.eventMouseDown2);

		this.tl =  document.getElementById(this.idtl);
		Event.observe(this.tl, "mousedown", this.eventMouseDownTL);
		this.tm =  document.getElementById(this.idtm);
		Event.observe(this.tm, "mousedown", this.eventMouseDownTM);
		this.tr =  document.getElementById(this.idtr);
		Event.observe(this.tr, "mousedown", this.eventMouseDownTR);
		this.ml =  document.getElementById(this.idml);
		Event.observe(this.ml, "mousedown", this.eventMouseDownML);
		this.mr =  document.getElementById(this.idmr);
		Event.observe(this.mr, "mousedown", this.eventMouseDownMR);
		this.bl =  document.getElementById(this.idbl);
		Event.observe(this.bl, "mousedown", this.eventMouseDownBL);
		this.bm =  document.getElementById(this.idbm);
		Event.observe(this.bm, "mousedown", this.eventMouseDownBM);
		this.br =  document.getElementById(this.idbr);
		Event.observe(this.br, "mousedown", this.eventMouseDownBR);

		this.init();
		this.initialized = true;

		if(this.options.rx || this.options.rw) {
			this.seloldselection(this.options.rx, this.options.ry, this.options.rw, this.options.rh);
		}
	} else {
		this.eventOnLoad = this.myonload.bindAsEventListener(this);
		Event.observe(document.getElementById(myelementid), "load", this.eventOnLoad);
	}

	Event.observe(this.container, "mousedown", this.eventMouseDown);
	Event.observe(this.container, "mouseup", this.eventMouseUp);
	Event.observe(this.container, "click", this.eventOnClick);

	this.eventMyMouseDown2 = this.clearselection.bindAsEventListener(this);
	Event.observe(this.clearcontainer, "click", this.eventMyMouseDown2);
	this.eventMyMouseDown3 = this.selallselection.bindAsEventListener(this);
	Event.observe(this.selallcontainer, "click", this.eventMyMouseDown3);

	if(this.lockbutton) {
		this.eventMyMouseDown4 = this.lockselection.bindAsEventListener(this);
		Event.observe(this.lockbutton, "click", this.eventMyMouseDown4);
	}

	Event.observe(this.container, "keydown", this.eventKeyDown);
	Event.observe(this.container, "keyup", this.eventKeyUp);

	Event.observe(window, 'unload', Event.unloadCache, false);

	Selections.register(this);
},

myonload: function(event) {
	this.imgw = this.myelement.offsetWidth;
	this.imgh = this.myelement.offsetHeight;

	this.initselection();
	this.selectionimage =  document.getElementById(this.selectionimageid);
	Event.observe(this.selectionimage, "mousedown", this.eventMouseDown2);

	this.tl =  document.getElementById(this.idtl);
	Event.observe(this.tl, "mousedown", this.eventMouseDownTL);
	this.tm =  document.getElementById(this.idtm);
	Event.observe(this.tm, "mousedown", this.eventMouseDownTM);
	this.tr =  document.getElementById(this.idtr);
	Event.observe(this.tr, "mousedown", this.eventMouseDownTR);
	this.ml =  document.getElementById(this.idml);
	Event.observe(this.ml, "mousedown", this.eventMouseDownML);
	this.mr =  document.getElementById(this.idmr);
	Event.observe(this.mr, "mousedown", this.eventMouseDownMR);
	this.bl =  document.getElementById(this.idbl);
	Event.observe(this.bl, "mousedown", this.eventMouseDownBL);
	this.bm =  document.getElementById(this.idbm);
	Event.observe(this.bm, "mousedown", this.eventMouseDownBM);
	this.br =  document.getElementById(this.idbr);
	Event.observe(this.br, "mousedown", this.eventMouseDownBR);

	this.init();
	this.initialized = true;

	if(this.options.rx || this.options.rw) {
		this.seloldselection(this.options.rx, this.options.ry, this.options.rw, this.options.rh);
	}
},

destroy: function() {
	var selecthandler = this;
	Event.stopObserving(this.container, "mousedown", this.eventMouseDown);
	Event.stopObserving(this.container, "mouseup", this.eventMouseUp);
	Event.stopObserving(this.selectionimage, "mousedown", this.eventMouseDown2);
	Event.stopObserving(this.container, "click", this.eventOnClick);

	Event.stopObserving(this.tl, "mousedown", this.eventMouseDownTL);
	Event.stopObserving(this.tm, "mousedown", this.eventMouseDownTM);
	Event.stopObserving(this.tr, "mousedown", this.eventMouseDownTR);
	Event.stopObserving(this.ml, "mousedown", this.eventMouseDownML);
	Event.stopObserving(this.mr, "mousedown", this.eventMouseDownMR);
	Event.stopObserving(this.bl, "mousedown", this.eventMouseDownBL);
	Event.stopObserving(this.bm, "mousedown", this.eventMouseDownBM);
	Event.stopObserving(this.br, "mousedown", this.eventMouseDownBR);

	Event.stopObserving(this.container, "keydown", this.eventKeyDown);
	Event.stopObserving(this.container, "keyup", this.eventKeyUp);

	Event.stopObserving(this.clearcontainer, "click", this.eventMyMouseDown2);
	Event.stopObserving(this.selallcontainer, "click", this.eventMyMouseDown3);
	if(this.lockbutton) Event.stopObserving(this.lockbutton, "click", this.eventMyMouseDown4);

	Event.stopObserving(window, "unload", Event.unloadCache);
	if(this.eventOnLoad) {
		Event.stopObserving(window, "load", this.eventOnLoad);
	}
	Selections.unregister(this);
},

iebody: function () {
	return (document.compatMode && document.compatMode != "BackCompat") ? document.documentElement : document.body
},

getcoordX: function(event) {
	var clientX;
	if(event.pseudo) {
		clientX = event.clientX;
	} else {
		clientX = (this.ns6) ? event.pageX : event.clientX + this.iebody().scrollLeft;
	}
	return clientX;
},

getcoordY: function(event) {
	var clientY;
	if(event.pseudo) {
		clientY = event.clientY;
	} else {
		clientY = (this.ns6) ? event.pageY : event.clientY + this.iebody().scrollTop;
	}
	return clientY;
},

updateselection: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	if(event.stopPropagation) {
		event.stopPropagation();
	} else {
		event.cancelBubble = true;
	}
	return false;
},

newselection: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	if(event.stopPropagation) {
		event.stopPropagation();
	} else {
		event.cancelBubble = true;
	}

	// Prevent caching issues: Re-do the mask in case the image dimensions have changed
	if(this.imgw != this.myelement.offsetWidth || this.imgh != this.myelement.offsetHeight) {
		this.imgw = this.myelement.offsetWidth;
		this.imgh = this.myelement.offsetHeight;
		this.imgsrc = this.myelement.src;
		var themask = document.getElementById(this.maskid);
		if(!themask) {
			// panic --- what happended?? not intialized???
			this.initselection();
			this.selectionimage =  document.getElementById(this.selectionimageid);
			Event.observe(this.selectionimage, "mousedown", this.eventMouseDown2);
			this.tl =  document.getElementById(this.idtl);
			Event.observe(this.tl, "mousedown", this.eventMouseDownTL);
			this.tm =  document.getElementById(this.idtm);
			Event.observe(this.tm, "mousedown", this.eventMouseDownTM);
			this.tr =  document.getElementById(this.idtr);
			Event.observe(this.tr, "mousedown", this.eventMouseDownTR);
			this.ml =  document.getElementById(this.idml);
			Event.observe(this.ml, "mousedown", this.eventMouseDownML);
			this.mr =  document.getElementById(this.idmr);
			Event.observe(this.mr, "mousedown", this.eventMouseDownMR);
			this.bl =  document.getElementById(this.idbl);
			Event.observe(this.bl, "mousedown", this.eventMouseDownBL);
			this.bm =  document.getElementById(this.idbm);
			Event.observe(this.bm, "mousedown", this.eventMouseDownBM);
			this.br =  document.getElementById(this.idbr);
			Event.observe(this.br, "mousedown", this.eventMouseDownBR);
			this.init();
			this.initialized = true;
			themask = document.getElementById(this.maskid);
		}
		themask.style.width = this.imgw + "px";
		themask.style.height = this.imgh + "px";
		this.selectionimage.style.width = this.imgw + "px";
		this.selectionimage.style.height = this.imgh + "px";
	}

	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;
	if(this.selection.getvisible() != "visible") {
		var x;
		var y;
		var clientX = this.getcoordX(event);
		var clientY = this.getcoordY(event);
		if(!document.all && typeof(event.layerX) != 'undefined') {
			x = event.layerX;
			y = event.layerY;
		} else {
			x = event.offsetX;
			y = event.offsetY;
		}
		this.oldabscoords.x = clientX;
		this.oldabscoords.y = clientY;
		this.newabscoords = {x: clientX, y: clientY};
		this.layercoords  = {x: x + 1, y: y + 1};
		this.selection.draw(x, y, 1, 1);
		this.selection.track = true;
	}

	Selections.activate(this);

	return false;
},

endselection: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	if(event.stopPropagation) {
		event.stopPropagation();
	} else {
		event.cancelBubble = true;
	}
	var themask = document.getElementById(this.maskid);

	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;

	if(!document.all) {
		targetid = event.target.id;
	} else {
		targetid = event.srcElement.id;
	}

	if(this.selection.track) {
		var clientX = this.getcoordX(event);
		var clientY = this.getcoordY(event);
		if(this.newabscoords.x == clientX && this.newabscoords.y == clientY) {
			this.init();
		} else {
			this.resizeselection(event);
			themask.style.visibility = "visible";
			Element.show(this.maskid);
			this.selection.setcursor("move");	//default

			this.oldabscoords.x = clientX;
			this.oldabscoords.y = clientY;
		}
	} else if(this.selection.resize) {

	} else if(targetid == this.maskid || targetid == this.myelementid) {
		this.init();
		this.selection.setneswcursor(this.selection.getlockaspect());
		if(a=document.getElementById('post_selunlocktrigger')) {
			if(typeof a.onchange == 'function'){a.onchange();}
		}
	}

	this.selection.drag = false;
	this.selection.track = false;
	this.selection.resize = false;
	themask = null;

	this.updatefinished();

	Selections.deactivate(this);

	return false;
},

dohandleselection: function(event) {
	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;
	var clientX = this.getcoordX(event);
	var clientY = this.getcoordY(event);
	if(this.selection.track || this.selection.drag || this.selection.resize) {
		if(event.preventDefault) {
			event.preventDefault();
		} else {
			event.returnValue = false;
		}
		this.pevent.clientX = clientX;
		this.pevent.clientY = clientY;
		this.pevent.pseudo = true;
		if(this.selection.track) {
			this.resizeselection(this.pevent);
		} else if(this.selection.drag) {
			this.dragselection(this.pevent);
		} else if(this.selection.resize) {
			this.resizeselectionafter(this.pevent);
		}
	}
	this.oldabscoords.x = clientX;
	this.oldabscoords.y = clientY;

	return false;
},

startmoveselection: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;
	var clientX = this.getcoordX(event);
	var clientY = this.getcoordY(event);
	this.startcoords = {x: clientX, y: clientY};
	this.startleft = this.selection.getLeft();
	this.starttop = this.selection.getTop();
	this.selection.drag = true;
	return false;
},

startresizeselectionTL: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;
	this.startcoords = {x: this.getcoordX(event), y: this.getcoordY(event)};
	this.startleft = this.selection.getLeft();
	this.starttop = this.selection.getTop();
	this.selection.resizepoint = 1;
	this.selection.resize = true;
	return false;
},
startresizeselectionTM: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;
	this.startcoords = {x: this.getcoordX(event), y: this.getcoordY(event)};
	this.starttop = this.selection.getTop();	/* ok, need only top (shift ignored) */
	this.selection.resizepoint = 2;
	this.selection.resize = true;
	return false;
},
startresizeselectionTR: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;
	this.startcoords = {x: this.getcoordX(event), y: this.getcoordY(event)};
	this.startleft = this.selection.getLeft();
	this.starttop = this.selection.getTop();
	this.startwidth = this.selection.getWidth();
	this.startheight = this.selection.getHeight();
	this.selection.resizepoint = 3;
	this.selection.resize = true;
	return false;
},
startresizeselectionML: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;
	this.startcoords = {x: this.getcoordX(event), y: this.getcoordY(event)};
	this.startleft = this.selection.getLeft();	/* ok, need only left (shift ignored) */
	this.selection.resizepoint = 4;
	this.selection.resize = true;
	return false;
},
startresizeselectionMR: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;
	this.startcoords = {x: this.getcoordX(event), y: this.getcoordY(event)};
	this.startwidth = this.selection.getWidth();	/* OK, need only width (shift ignored) */
	this.selection.resizepoint = 5;
	this.selection.resize = true;
	return false;
},
startresizeselectionBL: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;
	this.startcoords = {x: this.getcoordX(event), y: this.getcoordY(event)};
	this.startleft = this.selection.getLeft();
	this.starttop = this.selection.getTop();
	this.startwidth = this.selection.getWidth();
	this.startheight = this.selection.getHeight();
	this.selection.resizepoint = 6;
	this.selection.resize = true;
	return false;
},
startresizeselectionBM: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;
	this.startcoords = {x: this.getcoordX(event), y: this.getcoordY(event)};
	this.startheight = this.selection.getHeight();	/* ok, need only height (shift ignored) */
	this.selection.resizepoint = 7;
	this.selection.resize = true;
	return false;
},
startresizeselectionBR: function(event) {
	if(event.preventDefault) {
		event.preventDefault();
	} else {
		event.returnValue = false;
	}
	this.shiftkey = false;
	this.ctrlkey = false;
	if(event.shiftKey) this.shiftkey = event.shiftKey;
	if(event.ctrlKey) this.ctrlkey = event.ctrlKey;
	this.startcoords = {x: this.getcoordX(event), y: this.getcoordY(event)};
	this.startleft = this.selection.getLeft();
	this.starttop = this.selection.getTop();
	this.startwidth = this.selection.getWidth();
	this.startheight = this.selection.getHeight();
	this.selection.resizepoint = 8;
	this.selection.resize = true;
	return false;
},

mykeypress: function(event) {
	this.shiftkey = event.shiftKey;
	this.ctrlkey = event.ctrlKey;
	if(this.selection.track || this.selection.drag || this.selection.resize) {
		this.pevent.preventDefault = function() {};
		this.pevent.shiftKey = event.shiftKey;
		this.pevent.ctrlKey = event.ctrlKey;
		this.pevent.clientX = this.oldabscoords.x;
		this.pevent.clientY = this.oldabscoords.y;
		this.pevent.pseudo = true;
	}
	if(this.selection.track) {
		this.resizeselection(this.pevent);
	} else if(this.selection.drag) {
		this.dohandleselection(this.pevent);
	} else if(this.selection.resize) {
		this.resizeselectionafter(this.pevent);
	}
},

mykeydown: function(event) {
	if(!this.ctrlkey && event.ctrlKey || !this.shiftkey && event.shiftKey) {
		this.mykeypress(event);
	}
},

mykeyup: function(event){
	if(this.ctrlkey && !event.ctrlKey || this.shiftkey && !event.shiftKey) {
		this.mykeypress(event);
	}
},

dragselection: function(event) {
	var clientX = this.getcoordX(event);
	var clientY = this.getcoordY(event);
	var left = this.startleft + clientX - this.startcoords.x;
	var top = this.starttop + clientY - this.startcoords.y;
	var width = this.selection.getWidth();
	var height = this.selection.getHeight();

	var minleft = left;
	if(minleft < 0 || minleft <= this.snap && !this.ctrlkey) left = 0;
	var mintop = top;
	if(mintop < 0 || mintop <= this.snap && !this.ctrlkey) top = 0;
	var maxright = this.imgw - width - left;
	if(maxright < 0 || maxright <= this.snap && !this.ctrlkey) left += maxright;
	var maxbottom = this.imgh - height - top;
	if(maxbottom < 0 || maxbottom <= this.snap && !this.ctrlkey) top += maxbottom;

	this.selection.dragto(left, top);
	//this.updatefinished();
},

resizeselection: function(event) {
	var clientX = this.getcoordX(event);
	var clientY = this.getcoordY(event);
	var left = this.layercoords.x + this.curroffsx;
	var top = this.layercoords.y + this.curroffsy;
	var width = Math.abs(clientX - (this.newabscoords.x + this.curroffsx));
	var height = Math.abs(clientY - (this.newabscoords.y + this.curroffsy));

	var reverseh = (clientX - (this.newabscoords.x + this.curroffsx) >= 0) ? false : true;
	if(reverseh) left -= width;
	var minleft = left;
	if(minleft < 0 || minleft <= this.snap && !this.ctrlkey) {
		width += minleft;
		left = 0;
	}
	var maxright = this.imgw - width - left;
	if(maxright < 0 || maxright <= this.snap && !this.ctrlkey) {
		width += maxright;
	}

	var reversev = (clientY - (this.newabscoords.y + this.curroffsy) >= 0) ? false : true;
	if(reversev) top -= height;
	var mintop = top;
	if(mintop < 0 || mintop <= this.snap && !this.ctrlkey) {
		height += mintop;
		top = 0;
	}
	var maxbottom = this.imgh - height - top;
	if(maxbottom < 0 || maxbottom <= this.snap && !this.ctrlkey) {
		height += maxbottom;
	}

	/* no need to handle aspectlocked here, this is for creating a new selection and there is no aspect yet */
	if(this.shiftkey) {
		if(width > height) {
			if(reverseh) left += width - height;
			width = height;
		}
		if(height > width) {
			if(reversev) top += height - width;
			height = width;
		}
	}

	this.selection.draw(left, top, width, height);
},

resizeselectionafter: function(event) {
	var clientX = this.getcoordX(event);
	var clientY = this.getcoordY(event);

	var oldl = this.selection.getLeft();
	var oldt = this.selection.getTop();
	var oldw = this.selection.getWidth();
	var oldh = this.selection.getHeight();

	if(this.selection.aspectratiox <= 0) {
		this.selection.aspectratiox = oldw;
		this.selection.aspectratioy = oldh;
	}
	var as = this.selection.aspectratiox / this.selection.aspectratioy;

	var left = oldl;
	var top = oldt;
	var width = oldw;
	var height = oldh;

	var doresize = true;

	/* NW, W, SW: left edge */
	if (this.selection.resizepoint == 1 || this.selection.resizepoint == 4 || this.selection.resizepoint == 6) {
		left = this.startleft + clientX - this.startcoords.x;
		width = oldw + (oldl - left);
		if (width <= 1) {
			left = (oldl + oldw) - 2;
			width = oldw + (oldl - left);
		}
		if(left < 0 || left <= this.snap && !this.ctrlkey) {
			width += left;
			left = 0;
		}
	}

	/* NE, E, SE: right edge */
	if (this.selection.resizepoint == 3 || this.selection.resizepoint == 5 || this.selection.resizepoint == 8) {
		width = this.startwidth + (clientX - this.startcoords.x);
		if (width <= 1) {
			width = 2;
		}
		var maxright = this.imgw - width - left;
		if(maxright < 0 || maxright <= this.snap && !this.ctrlkey) {
			width += maxright;
		}
	}

	/* NW, N, NE: top edge */
	if (this.selection.resizepoint == 1 || this.selection.resizepoint == 2 || this.selection.resizepoint == 3) {
		top = this.starttop + clientY - this.startcoords.y;
		height = oldh + (oldt - top);
		if(height <= 1) {
			top = (oldt + oldh) - 2;
			height = oldh + (oldt - top);
		}
		if(top < 0 || top <= this.snap && !this.ctrlkey) {
			height += top;
			top = 0;
		}
	}

	/* SW, S, SE: bottom edge */
	if (this.selection.resizepoint == 6 || this.selection.resizepoint == 7 || this.selection.resizepoint == 8) {
		height = this.startheight + (clientY - this.startcoords.y);
		if (height <= 1) {
			height = 2;
		}
		var maxbottom = this.imgh - height - top;
		if(maxbottom < 0 || maxbottom <= this.snap && !this.ctrlkey) {
			height += maxbottom;
		}
	}

	if(this.selection.getlockaspect() > 0) {
		if (this.selection.resizepoint == 8) {
			if(width > Math.round(height * as)) width = Math.round(height * as);
			if(Math.round(height * as) > width) height = Math.round(width / as);
		} else if (this.selection.resizepoint == 3) {
			if(width > Math.round(height * as)) width = Math.round(height * as);
			if(Math.round(height * as) > width) {
				top += (height - Math.round(width / as));
				height = Math.round(width / as);
			}
		} else if (this.selection.resizepoint == 1) {
			if(width > Math.round(height * as)) {
				left += (width - Math.round(height * as));
				width = Math.round(height * as);
			}
			if(Math.round(height * as) > width) {
				top += (height - Math.round(width / as));
				height = Math.round(width / as);
			}
		} else if (this.selection.resizepoint == 6) {
			if(width > Math.round(height * as)) {
				left += (width - Math.round(height * as));
				width = Math.round(height * as);
			}
			if(Math.round(height * as) > width) height = Math.round(width / as);
		//} else if (this.selection.resizepoint == 2) {  /* not nice due to rounding errors */
		//	//top += (height - Math.round(width / as));
		//	//height = Math.round(width / as);
		//	var ow = width; width = Math.round(height * as);
		//	left += Math.round((ow - (height * as)) / 2);
		//	if(left < 0 || left + width > this.imgw || width <= 1) doresize = false;
		} else {
			doresize = false;
		}
	} else if(this.shiftkey) {
		this.selection.aspectratiox = 0;
		if (this.selection.resizepoint == 8) {
			if(width > height) width = height;
			if(height > width) height = width;
		} else if (this.selection.resizepoint == 3) {
			if(width > height) width = height;
			if(height > width) {
				top += (height - width);
				height = width;
			}
		} else if (this.selection.resizepoint == 1) {
			if(width > height) {
				left += (width - height);
				width = height;
			}
			if(height > width) {
				top += (height - width);
				height = width;
			}
		} else if (this.selection.resizepoint == 6) {
			if(width > height) {
				left += (width - height);
				width = height;
			}
			if(height > width) height = width;
		}
	} else {
		this.selection.aspectratiox = 0;
	}

	if(doresize) this.selection.draw(left, top, width, height);
},

initselection: function() {
	this.selection = {
		left:		undefined,
		top:		undefined,
		width: 		undefined,
		height:		undefined,
		idLeft: 	"js_selleft",
		idTop:		"js_seltop",
		idRight:	"js_selright",
		idBottom:	"js_selbottom",
		tl:		undefined,
		tm:		undefined,
		tr:		undefined,
		ml:		undefined,
		mr:		undefined,
		bl:		undefined,
		bm:		undefined,
		br:		undefined,
		visible:	false,
		myparent:	this
	};

	var left = document.createElement("div");
	var right = document.createElement("div");
	var top = document.createElement("div");
	var bottom = document.createElement("div");

	var tl = document.createElement("div");
	var tm = document.createElement("div");
	var tr = document.createElement("div");
	var ml = document.createElement("div");
	var mr = document.createElement("div");
	var bl = document.createElement("div");
	var bm = document.createElement("div");
	var br = document.createElement("div");

	left.className = right.className = "selver";
	top.className = bottom.className = "selhor";

	tl.className = "selblktl";
	tm.className = "selblktm";
	tr.className = "selblktr";
	ml.className = "selblkml";
	mr.className = "selblkmr";
	bl.className = "selblkbl";
	bm.className = "selblkbm";
	br.className = "selblkbr";

	tl.style.cursor = "nw-resize";
	tm.style.cursor = "n-resize";
	tr.style.cursor = "ne-resize";
	ml.style.cursor = "w-resize";
	mr.style.cursor = "e-resize";
	bl.style.cursor = "sw-resize";
	bm.style.cursor = "s-resize";
	br.style.cursor = "se-resize";

	left.id = this.selection.idLeft;
	right.id = this.selection.idRight;
	top.id = this.selection.idTop;
	bottom.id = this.selection.idBottom;

	tl.id = this.idtl
	tm.id = this.idtm
	tr.id = this.idtr
	ml.id = this.idml
	mr.id = this.idmr
	bl.id = this.idbl
	bm.id = this.idbm
	br.id = this.idbr

	this.container.appendChild(bottom);
	this.container.appendChild(top);
	this.container.appendChild(left);
	this.container.appendChild(right);

	this.container.appendChild(tl);
	this.container.appendChild(tm);
	this.container.appendChild(tr);
	this.container.appendChild(ml);
	this.container.appendChild(mr);
	this.container.appendChild(bl);
	this.container.appendChild(bm);
	this.container.appendChild(br);

	var mask = document.createElement("div");
	mask.id = this.maskid;
	mask.className = "image_mask";
	mask.style.width = this.imgw + "px";
	mask.style.height = this.imgh + "px";
	this.container.appendChild(mask);

	var image = document.createElement("img");
	image.id = this.selectionimageid;
	image.className = "image_selection";
	image.src = this.imgsrc;
	image.style.width = this.imgw + "px";
	image.style.height = this.imgh + "px";
	this.container.appendChild(image);

	this.selection.reset = function() {
		this.left = this.top = this.width = this.height = undefined;
		this.setvisible("hidden");
		this.setcursor("crosshair");
		this.track = this.drag = this.resize = this.aspectlocked = false;
		if(this.myparent.lockbutton) {
			if(this.myparent.locktext) this.myparent.lockbutton.innerHTML = this.myparent.locktext;
			if(this.myparent.lockbst) this.myparent.lockbutton.style.border = this.myparent.lockbst;
		}
		this.aspectratiox = 0;	// clear aspect ratio
	};

	this.selection.draw = function(left, top, width, height) {
		if(width == 0) width = 1;
		if(height == 0) height = 1;
		this.left = left;
		this.top = top;
		this.width = width;
		this.height = height;

		left = Math.round(left);
		top = Math.round(top);
		width = Math.round(width);
		height = Math.round(height);

		if (left > this.myparent.imgw - 1) left = this.myparent.imgw - 1;
		if (top > this.myparent.imgh - 1)  top = this.myparent.imgh - 1;
		if (left + width > this.myparent.imgw) width = this.myparent.imgw - left;
		if (top + height > this.myparent.imgh) height = this.myparent.imgh - top;

		var dleft = document.getElementById(this.idLeft);
		var dright = document.getElementById(this.idRight);
		var dtop = document.getElementById(this.idTop);
		var dbottom = document.getElementById(this.idBottom);

		dleft.style.left = dtop.style.left = dbottom.style.left = left + "px";
		dright.style.left = (left + width - 1) + "px";

		dleft.style.top = dright.style.top = dtop.style.top = top + "px";
		dbottom.style.top = (top + height - 1) + "px";

		dleft.style.height = dright.style.height = height + "px";
		dtop.style.width = dbottom.style.width = width + "px";

		var clip = "rect(" + top + "px, " + (left + width) + "px, " + (top + height) + "px, " + left + "px)";
		this.myparent.selectionimage.style.clip = clip;

		this.setvisible("visible");

		dleft = dtop = dright = dbottom = null;

		blkw = blkh = 6;

		var tl = document.getElementById(this.myparent.idtl);
		var tm = document.getElementById(this.myparent.idtm);
		var tr = document.getElementById(this.myparent.idtr);
		var ml = document.getElementById(this.myparent.idml);
		var mr = document.getElementById(this.myparent.idmr);
		var bl = document.getElementById(this.myparent.idbl);
		var bm = document.getElementById(this.myparent.idbm);
		var br = document.getElementById(this.myparent.idbr);

		if (width >= 64 && height >= 64) {

			if (tl.className != "selblktl") {
				tl.className = "selblktl";
				tm.className = "selblktm";
				tr.className = "selblktr";
				ml.className = "selblkml";
				mr.className = "selblkmr";
				bl.className = "selblkbl";
				bm.className = "selblkbm";
				br.className = "selblkbr";
			}

			tl.style.left = ml.style.left = bl.style.left = left + "px";
			tm.style.left = bm.style.left = (left + (width / 2) - (blkw / 2) - 1) + "px";
			tr.style.left = mr.style.left = br.style.left = (left + width - blkw - 1) + "px";

			tl.style.top = tm.style.top = tr.style.top = top + "px";
			ml.style.top = mr.style.top = (top + (height / 2) - (blkh / 2)) + "px";
			bl.style.top = bm.style.top = br.style.top = (top + height - blkh - 1) + "px";

			tl.style.width = tm.style.width = tr.style.width = blkw + "px";
			ml.style.width = mr.style.width = blkw + "px";
			bl.style.width = bm.style.width = br.style.width = blkw + "px";

			tl.style.height = tm.style.height = tr.style.height = blkh + "px";
			ml.style.height = mr.style.height = blkh + "px";
			bl.style.height = bm.style.height = br.style.height = blkh + "px";

		} else {

			if (tl.className != "selblkbr") {
				tl.className = "selblkbr";
				tm.className = "selblkbm";
				tr.className = "selblkbl";
				ml.className = "selblkmr";
				mr.className = "selblkml";
				bl.className = "selblktr";
				bm.className = "selblktm";
				br.className = "selblktl";
			}

			var inv = this.myparent.scc ? ((this.myparent.scc.style.overflow == "auto") ? true : false) : false;

			tl.style.width = tm.style.width = tr.style.width = blkw + "px";
			bl.style.width = bm.style.width = br.style.width = blkw + "px";

			tl.style.height = tr.style.height = blkh + "px";
			ml.style.height = mr.style.height = blkh + "px";
			bl.style.height = br.style.height = blkh + "px";

			var temp = left - blkw - 1;
			if(inv && temp < 0) {
				tl.style.left = bl.style.left = "0px";
				ml.style.width = "1px";
				ml.style.left = left + "px";
			} else {
				tl.style.left = bl.style.left = ml.style.left = temp + "px";
				ml.style.width = blkw + "px";
			}

			tm.style.left = bm.style.left = (left + (width / 2) - (blkw / 2) - 1) + "px";

			temp = left + width;
			if(inv && temp + blkw >= this.myparent.imgw) {
				tr.style.left = br.style.left = (this.myparent.imgw - blkw - 1) + "px";
				mr.style.width = "1px";
				mr.style.left = (left + width - 2) + "px";
			} else {
				tr.style.left = br.style.left = mr.style.left = temp + "px";
				mr.style.width = blkw + "px";
			}

			temp = (top - blkh - 1);
			if(inv && temp < 0) {
				tl.style.top = tr.style.top = "0px";
				tm.style.height = "1px";
				tm.style.top = top + "px";
			} else {
				tl.style.top = tr.style.top = tm.style.top = temp + "px";
				tm.style.height = blkh + "px";
			}

			ml.style.top = mr.style.top = (top + (height / 2) - (blkh / 2)) + "px";

			temp = top + height;
			if(inv && temp + blkh >= this.myparent.imgh){
				bl.style.top = br.style.top = (this.myparent.imgh - blkh - 1) + "px";
				bm.style.height = "1px";
				bm.style.top = (top + height - 2) + "px";
			} else {
				bl.style.top = br.style.top = bm.style.top = temp + "px";
				bm.style.height = blkh + "px";
			}
		}

		tl = tm = tr = ml = mr = bl = bm = br = null;
	};

	this.selection.dragto = function(left, top) {
		this.left = left;
		this.top = top;
		var width = this.getWidth();
		var height = this.getHeight();

		var dl = document.getElementById(this.idLeft);
		var dr = document.getElementById(this.idRight);
		var dt = document.getElementById(this.idTop);
		var db = document.getElementById(this.idBottom);

		dl.style.left = dt.style.left = db.style.left = left + "px";
		dr.style.left = left + width - 1 + "px";

		dl.style.top = dr.style.top = dt.style.top = top + "px";
		db.style.top = top + height - 1 + "px";

		this.myparent.selectionimage.style.clip = "rect(" + top + "px, " + (left + width) + "px, " + (top + height) + "px, " + left + "px)";

		dl = dt = dr = db = null;

		var tl = document.getElementById(this.myparent.idtl);
		var tm = document.getElementById(this.myparent.idtm);
		var tr = document.getElementById(this.myparent.idtr);
		var ml = document.getElementById(this.myparent.idml);
		var mr = document.getElementById(this.myparent.idmr);
		var bl = document.getElementById(this.myparent.idbl);
		var bm = document.getElementById(this.myparent.idbm);
		var br = document.getElementById(this.myparent.idbr);

		blkw = blkh = 6;

		if (width >= 64 && height >= 64) {

			tl.style.left = ml.style.left = bl.style.left = left + "px";
			tm.style.left = bm.style.left = (left + (width / 2) - (blkw / 2)) + "px";
			tr.style.left = mr.style.left = br.style.left = (left + width - blkw - 1) + "px";

			tl.style.top = tm.style.top = tr.style.top = top + "px";
			ml.style.top = mr.style.top = (top + (height / 2) - (blkh / 2)) + "px";
			bl.style.top = bm.style.top = br.style.top = (top + height - blkh - 1) + "px";

			tl.style.width = tm.style.width = tr.style.width = blkw + "px";
			ml.style.width = mr.style.width = blkw + "px";
			bl.style.width = bm.style.width = br.style.width = blkw + "px";

			tl.style.height = tm.style.height = tr.style.height = blkh + "px";
			ml.style.height = mr.style.height = blkh + "px";
			bl.style.height = bm.style.height = br.style.height = blkh + "px";

		} else {

			var inv = this.myparent.scc ? ((this.myparent.scc.style.overflow == "auto") ? true : false) : false;

			tl.style.width = tm.style.width = tr.style.width = blkw + "px";
			bl.style.width = bm.style.width = br.style.width = blkw + "px";

			tl.style.height = tr.style.height = blkh + "px";
			ml.style.height = mr.style.height = blkh + "px";
			bl.style.height = br.style.height = blkh + "px";

			var temp = left - blkw - 1;
			if(inv && temp < 0) {
				tl.style.left = bl.style.left = "0px";
				ml.style.width = "1px";
				ml.style.left = left + "px";
			} else {
				tl.style.left = bl.style.left = ml.style.left = temp + "px";
				ml.style.width = blkw + "px";
			}

			tm.style.left = bm.style.left = (left + (width / 2) - (blkw / 2) - 1) + "px";

			temp = left + width;
			if(inv && temp + blkw >= this.myparent.imgw) {
				tr.style.left = br.style.left = (this.myparent.imgw - blkw - 1) + "px";
				mr.style.width = "1px";
				mr.style.left = (left + width - 2) + "px";
			} else {
				tr.style.left = br.style.left = mr.style.left = temp + "px";
				mr.style.width = blkw + "px";
			}

			temp = (top - blkh - 1);
			if(inv && temp < 0) {
				tl.style.top = tr.style.top = "0px";
				tm.style.height = "1px";
				tm.style.top = top + "px";
			} else {
				tl.style.top = tr.style.top = tm.style.top = temp + "px";
				tm.style.height = blkh + "px";
			}

			ml.style.top = mr.style.top = (top + (height / 2) - (blkh / 2)) + "px";

			temp = top + height;
			if(inv && temp + blkh >= this.myparent.imgh){
				bl.style.top = br.style.top = (this.myparent.imgh - blkh - 1) + "px";
				bm.style.height = "1px";
				bm.style.top = (top + height - 2) + "px";
			} else {
				bl.style.top = br.style.top = bm.style.top = temp + "px";
				bm.style.height = blkh + "px";
			}
		}

		tl = tm = tr = ml = mr = bl = bm = br = null;
	};

	this.selection.setLeft = function(left) {
		this.left = left;
	};
	this.selection.getLeft = function() {
		return Math.round(this.left);
	};

	this.selection.setTop = function(top) {
		this.top = top;
	};
	this.selection.getTop = function() {
		return Math.round(this.top);
	};

	this.selection.setWidth = function(width) {
		this.width = width;
	};
	this.selection.getWidth = function() {
		return Math.round(this.width);
	};

	this.selection.setHeight = function(height) {
		this.height = height;
	};
	this.selection.getHeight = function() {
		return Math.round(this.height);
	};

	this.selection.setvisible = function(vis) {
		if (vis == "visible") {
			Element.show(this.idLeft);
			Element.show(this.idTop);
			Element.show(this.idRight);
			Element.show(this.idBottom);
			Element.show(this.myparent.idtl);
			Element.show(this.myparent.idtm);
			Element.show(this.myparent.idtr);
			Element.show(this.myparent.idml);
			Element.show(this.myparent.idmr);
			Element.show(this.myparent.idbl);
			Element.show(this.myparent.idbm);
			Element.show(this.myparent.idbr);
			Element.show(this.myparent.selectionimageid);
		} else {
			Element.hide(this.idLeft);
			Element.hide(this.idTop);
			Element.hide(this.idRight);
			Element.hide(this.idBottom);
			Element.hide(this.myparent.idtl);
			Element.hide(this.myparent.idtm);
			Element.hide(this.myparent.idtr);
			Element.hide(this.myparent.idml);
			Element.hide(this.myparent.idmr);
			Element.hide(this.myparent.idbl);
			Element.hide(this.myparent.idbm);
			Element.hide(this.myparent.idbr);
			Element.hide(this.myparent.selectionimageid);
		}
		document.getElementById(this.idLeft).style.visibility = vis;
		document.getElementById(this.idTop).style.visibility = vis;
		document.getElementById(this.idRight).style.visibility = vis;
		document.getElementById(this.idBottom).style.visibility = vis;
		document.getElementById(this.myparent.idtl).style.visibility = vis;
		document.getElementById(this.myparent.idtm).style.visibility = vis;
		document.getElementById(this.myparent.idtr).style.visibility = vis;
		document.getElementById(this.myparent.idml).style.visibility = vis;
		document.getElementById(this.myparent.idmr).style.visibility = vis;
		document.getElementById(this.myparent.idbl).style.visibility = vis;
		document.getElementById(this.myparent.idbm).style.visibility = vis;
		document.getElementById(this.myparent.idbr).style.visibility = vis;
		document.getElementById(this.myparent.selectionimageid).style.visibility = vis;
		this.visibility = vis;
	};
	this.selection.getvisible = function() {
		return this.visibility;
	};

	this.selection.setcursor = function(cursor) {
		document.getElementById(this.myparent.selectionimageid).style.cursor = cursor;
		document.getElementById(this.idLeft).style.cursor =
			document.getElementById(this.idTop).style.cursor =
			document.getElementById(this.idRight).style.cursor =
			document.getElementById(this.idBottom).style.cursor = (cursor == "crosshair" ? cursor : "default");

	};

	this.selection.setneswcursor = function(lockedcursor) {
		var tm = document.getElementById(this.myparent.idtm);
		if(tm) {
			tm.style.cursor = lockedcursor ? "default" : "n-resize";
			document.getElementById(this.myparent.idml).style.cursor = lockedcursor ? "default" : "w-resize";
			document.getElementById(this.myparent.idmr).style.cursor = lockedcursor ? "default" : "e-resize";
			document.getElementById(this.myparent.idbm).style.cursor = lockedcursor ? "default" : "s-resize";;
		}
	};

	this.selection.zoom = function(fa) {
		if(this.left != undefined) {
			var bu1 = this.getlockaspect();	// need to save our lock status & aspect ratio
			var bu2 = this.aspectratiox;
			var fact = this.myparent.myelement.offsetWidth / this.myparent.imgw;
			this.myparent.seloldselection(this.left * fact, this.top * fact, this.width * fact, this.height * fact);
			this.lockaspect(bu1);		// write back lock status & aspect ratio
			this.aspectratiox = bu2;
		} else if(themask = document.getElementById(this.myparent.maskid)) {
			themask.style.width = this.myparent.selectionimage.style.width = this.myparent.myelement.offsetWidth + "px";
			themask.style.height = this.myparent.selectionimage.style.height = this.myparent.myelement.offsetHeight + "px";
		}
	};

	this.selection.lockaspect = function(loc) {
		this.aspectlocked = (parseInt(loc) == 0) ? false : true;
		this.setneswcursor(this.aspectlocked ? 1 : 0);
		if (this.myparent.lockbutton) {
			if(this.myparent.locktext) {
				this.myparent.lockbutton.innerHTML = this.aspectlocked ? this.myparent.unlocktext : this.myparent.locktext;
			}
			if(this.myparent.lockbst) {
				this.myparent.lockbutton.style.border = this.aspectlocked ? this.myparent.unlockbst : this.myparent.lockbst;
			}
		}
	};

	this.selection.getlockaspect = function() {
		return this.aspectlocked ? 1 : 0;
	};

	this.selection.setmaxwithaspect = function(ax, ay) {
		this.aspectratiox = ax;
		this.aspectratioy = ay;
		if(ax >= ay) {
			nw = this.myparent.imgw;
			nh = nw * ay / ax;
			if (nh > this.myparent.imgh) {
				nh = this.myparent.imgh;
				nw = nh * ax / ay;
			}
		} else {
			nh = this.myparent.imgh;
			nw = nh * ax / ay;
			if (nw > this.myparent.imgw) {
				nw = this.myparent.imgw;
				nh = nw * ay / ax;
			}
		}
		this.myparent.seloldselection((this.myparent.imgw - nw) / 2, (this.myparent.imgh - nh) / 2, nw, nh);
	};
},

init: function() {
	if(themask = document.getElementById(this.maskid)) {
		themask.style.visibility = "hidden";
		Element.hide(this.maskid);
	}
	this.layercoords = this.newabscoords = null;
	this.shiftkey = this.ctrlkey = false;
	if(this.selection) this.selection.reset();
},

clearselection: function(event) {
	this.init();
	this.updatefinished();
	this.selection.setneswcursor(this.selection.getlockaspect());
	if(a=document.getElementById('post_selunlocktrigger')) {
		if(typeof a.onchange == 'function'){a.onchange();}
	}
},

selallselection: function(event) {
	var themask;
	this.init();
	if(this.imgw != this.myelement.offsetWidth || this.imgh != this.myelement.offsetHeight) {
		this.imgw = this.myelement.offsetWidth;
		this.imgh = this.myelement.offsetHeight;
		this.imgsrc = this.myelement.src;
		if(!(themask = document.getElementById(this.maskid))) {
			// panic --- what happended?? not intialized???
			this.initselection();
			this.selectionimage =  document.getElementById(this.selectionimageid);
			Event.observe(this.selectionimage, "mousedown", this.eventMouseDown2);
			this.tl =  document.getElementById(this.idtl);
			Event.observe(this.tl, "mousedown", this.eventMouseDownTL);
			this.tm =  document.getElementById(this.idtm);
			Event.observe(this.tm, "mousedown", this.eventMouseDownTM);
			this.tr =  document.getElementById(this.idtr);
			Event.observe(this.tr, "mousedown", this.eventMouseDownTR);
			this.ml =  document.getElementById(this.idml);
			Event.observe(this.ml, "mousedown", this.eventMouseDownML);
			this.mr =  document.getElementById(this.idmr);
			Event.observe(this.mr, "mousedown", this.eventMouseDownMR);
			this.bl =  document.getElementById(this.idbl);
			Event.observe(this.bl, "mousedown", this.eventMouseDownBL);
			this.bm =  document.getElementById(this.idbm);
			Event.observe(this.bm, "mousedown", this.eventMouseDownBM);
			this.br =  document.getElementById(this.idbr);
			Event.observe(this.br, "mousedown", this.eventMouseDownBR);
			this.init();
			this.initialized = true;
			themask = document.getElementById(this.maskid);
		}
		themask.style.width = this.selectionimage.style.width = this.imgw + "px";
		themask.style.height = this.selectionimage.style.height = this.imgh + "px";
	}
	this.selection.draw(0, 0, this.imgw, this.imgh);
	if(themask = document.getElementById(this.maskid)) {
		Element.show(this.maskid);
		themask.style.visibility = "visible";
	}

	this.selection.setcursor("move"); //default

	this.updatefinished();

	this.selection.setneswcursor(this.selection.getlockaspect());
	if(a=document.getElementById('post_selunlocktrigger')) {
		if(typeof a.onchange == 'function'){a.onchange();}
	}
},

seloldselection: function(x, y, w, h) {
	var themask;
	this.init();
	if(this.imgw != this.myelement.offsetWidth || this.imgh != this.myelement.offsetHeight) {
		this.imgw = this.myelement.offsetWidth;
		this.imgh = this.myelement.offsetHeight;
		this.imgsrc = this.myelement.src;
		if(!(themask = document.getElementById(this.maskid))) {
			// panic --- what happended?? not intialized???
			this.initselection();
			this.selectionimage =  document.getElementById(this.selectionimageid);
			Event.observe(this.selectionimage, "mousedown", this.eventMouseDown2);
			this.tl =  document.getElementById(this.idtl);
			Event.observe(this.tl, "mousedown", this.eventMouseDownTL);
			this.tm =  document.getElementById(this.idtm);
			Event.observe(this.tm, "mousedown", this.eventMouseDownTM);
			this.tr =  document.getElementById(this.idtr);
			Event.observe(this.tr, "mousedown", this.eventMouseDownTR);
			this.ml =  document.getElementById(this.idml);
			Event.observe(this.ml, "mousedown", this.eventMouseDownML);
			this.mr =  document.getElementById(this.idmr);
			Event.observe(this.mr, "mousedown", this.eventMouseDownMR);
			this.bl =  document.getElementById(this.idbl);
			Event.observe(this.bl, "mousedown", this.eventMouseDownBL);
			this.bm =  document.getElementById(this.idbm);
			Event.observe(this.bm, "mousedown", this.eventMouseDownBM);
			this.br =  document.getElementById(this.idbr);
			Event.observe(this.br, "mousedown", this.eventMouseDownBR);
			this.init();
			this.initialized = true;
			themask = document.getElementById(this.maskid);
		}
		themask.style.width = this.selectionimage.style.width = this.imgw + "px";
		themask.style.height = this.selectionimage.style.height = this.imgh + "px";
	}
	this.selection.draw(x, y, w, h);
	if(themask = document.getElementById(this.maskid)) {
		Element.show(this.maskid);
		themask.style.visibility = "visible";
	}

	this.selection.setcursor("move"); // default

	this.updatefinished();
},

lockselection: function(event) {
	this.selection.lockaspect(this.selection.getlockaspect() ^ 1);
	if(this.selection.getlockaspect() == 0) {
		if(a=document.getElementById('post_selunlocktrigger')) {
			if(typeof a.onchange == 'function'){a.onchange();}
		}
	} else {
		if(a=document.getElementById('post_sellocktrigger')) {
			if(typeof a.onchange == 'function'){a.onchange();}
		}
	}
},

updatefinished: function() {
	if(this.initialized) {
		var l = Math.round(this.selection.left);
		var t = Math.round(this.selection.top);
		var w = Math.round(this.selection.width);
		var h = Math.round(this.selection.height);
		if (l > this.imgw - 1) l = this.imgw - 1;
		if (t > this.imgh - 1) t = this.imgh - 1;
		if (l + w > this.imgw) w = this.imgw - l;
		if (t + h > this.imgh) h = this.imgh - t;
		if(this.setCook) {
			var temp = this.imgw + 'X' + this.imgh + 'X' + l + 'X' + t + 'X' + w + 'X' + h + 'X' + this.phid;
			if(temp.indexOf('undefined') != -1 || temp.indexOf('NaN') != -1) {
				if(document.cookie.indexOf('pselection') != -1) document.cookie="pselection=;path=/;expires=Thu, 01-Jan-1970 00:00:01 GMT";
			} else {
				document.cookie = "pselection=" + temp + ";path=/";
			}
		}
	 	if (this.onChange) {
			this.onChange(this.imgw + ',' + this.imgh + ',' + l + ',' + t + ',' + w + ',' + h + ',' + this.phid);
		}
		if (this.onChangeJS) {
			this.onChangeJS(this.pwidth,this.pheight,this.imgw,this.imgh,l,t,w,h);
		}
	}
	this.event = null;
}

};