//////////////////////// Creator /////////////////////////////////////
var Drag = {
	obj : null,
	init : function(o, oRoot, minX, maxX, minY, maxY, bSwapHorzRef, bSwapVertRef, fXMapper, fYMapper){
		o.onmousedown	= Drag.start;
		o.hmode			= bSwapHorzRef ? false : true ;
		o.vmode			= bSwapVertRef ? false : true ;
		o.root = oRoot && oRoot != null ? oRoot : o ;
		if (o.hmode  && isNaN(parseInt(o.root.style.left  ))) o.root.style.left   = "0px";
		if (o.vmode  && isNaN(parseInt(o.root.style.top   ))) o.root.style.top    = "0px";
		if (!o.hmode && isNaN(parseInt(o.root.style.right ))) o.root.stfyle.right  = "0px";
		if (!o.vmode && isNaN(parseInt(o.root.style.bottom))) o.root.style.bottom = "0px";
		o.minX	= typeof minX != 'undefined' ? minX : null;
		o.minY	= typeof minY != 'undefined' ? minY : null;
		o.maxX	= typeof maxX != 'undefined' ? maxX : null;
		o.maxY	= typeof maxY != 'undefined' ? maxY : null;
		o.xMapper = fXMapper ? fXMapper : null;
		o.yMapper = fYMapper ? fYMapper : null;
		o.root.onDragStart	= new Function();
		o.root.onDragEnd	= new Function();
		o.root.onDrag		= new Function();
	},
	start : function(e){
		f = 'modulatorLayerObject';
		var o = Drag.obj = document.getElementById(f);
		e = Drag.fixE(e);
		var y = parseInt(o.vmode ? o.root.style.top  : o.root.style.bottom);
		var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );
		o.root.onDragStart(x, y);
		o.lastMouseX	= e.clientX;
		o.lastMouseY	= e.clientY;
		if (o.hmode) {
			if (o.minX != null)	o.minMouseX	= e.clientX - x + o.minX;
			if (o.maxX != null)	o.maxMouseX	= o.minMouseX + o.maxX - o.minX;
		} else {
			if (o.minX != null) o.maxMouseX = -o.minX + e.clientX + x;
			if (o.maxX != null) o.minMouseX = -o.maxX + e.clientX + x;
		}
		if (o.vmode) {
			if (o.minY != null)	o.minMouseY	= e.clientY - y + o.minY;
			if (o.maxY != null)	o.maxMouseY	= o.minMouseY + o.maxY - o.minY;
		} else {
			if (o.minY != null) o.maxMouseY = -o.minY + e.clientY + y;
			if (o.maxY != null) o.minMouseY = -o.maxY + e.clientY + y;
		}
		document.onmousemove	= Drag.drag;
		document.onmouseup		= Drag.end;
		return false;
	},
	drag : function(e){
		e = Drag.fixE(e);
		var o = Drag.obj;
		var ey	= e.clientY;
		var ex	= e.clientX;
		var y = parseInt(o.vmode ? o.root.style.top  : o.root.style.bottom);
		var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );
		var nx, ny;
		if (o.minX != null) ex = o.hmode ? Math.max(ex, o.minMouseX) : Math.min(ex, o.maxMouseX);
		if (o.maxX != null) ex = o.hmode ? Math.min(ex, o.maxMouseX) : Math.max(ex, o.minMouseX);
		if (o.minY != null) ey = o.vmode ? Math.max(ey, o.minMouseY) : Math.min(ey, o.maxMouseY);
		if (o.maxY != null) ey = o.vmode ? Math.min(ey, o.maxMouseY) : Math.max(ey, o.minMouseY);
		nx = x + ((ex - o.lastMouseX) * (o.hmode ? 1 : -1));
		ny = y + ((ey - o.lastMouseY) * (o.vmode ? 1 : -1));
		if (o.xMapper)		nx = o.xMapper(y)
		else if (o.yMapper)	ny = o.yMapper(x)
		Drag.obj.root.style[o.hmode ? "left" : "right"] = nx + "px";
		Drag.obj.root.style[o.vmode ? "top" : "bottom"] = ny + "px";
		Drag.obj.lastMouseX	= ex;
		Drag.obj.lastMouseY	= ey;
		Drag.obj.root.onDrag(nx, ny);
		return false;
	},
	end : function(){
		document.onmousemove = null;
		document.onmouseup   = null;
		Drag.obj.root.onDragEnd(	parseInt(Drag.obj.root.style[Drag.obj.hmode ? "left" : "right"]), 
									parseInt(Drag.obj.root.style[Drag.obj.vmode ? "top" : "bottom"]));
		Drag.obj = null;
		var modus = document.getElementById('modus').value;
		var tmpX = modus+'_X';
		var tmpY = modus+'_Y';
		if(parseInt(document.getElementById(tmpX).value) != parseInt(document.getElementById('XStart').value)){
			senden();
			return false;
		}
		if(parseInt(document.getElementById(tmpY).value) != parseInt(document.getElementById('YStart').value)){
			senden();
			return false;
		}
	},
	fixE : function(e){
		if (typeof e == 'undefined') e = window.event;
		if (typeof e.layerX == 'undefined') e.layerX = e.offsetX;
		if (typeof e.layerY == 'undefined') e.layerY = e.offsetY;
		return e;
	}
};

function senden(){
	var modus = document.getElementById('modus').value;
	var tmpX = modus+'_X';
	var tmpY = modus+'_Y';
	var parameter = 'X=' + document.getElementById(tmpX).value + '&Y=' + document.getElementById(tmpY).value + '&Id=' + document.getElementById('Id').value;  
	new Ajax.Request(HOME_URL + 'Creator/setPosition' + modus, {method: 'get', parameters: parameter, onComplete: myResponse.bind(this)});
}

function init() {
	if(document.getElementById("modulatorLayerObject")){
		myid = document.getElementById('modulatorLayer');
		var modus = document.getElementById('modus').value;
		var tmpX = modus+'_X';
		var tmpY = modus+'_Y';
		Drag.init(document.getElementById("modulatorLayerObject"),null,0,parseInt(myid.style.width)-parseInt(document.getElementById('layerWidth').value),0,parseInt(myid.style.height)-parseInt(document.getElementById('layerHeight').value));
		
		
		document.getElementById("modulatorLayerObject").onDrag = function (x, y) { 
			var modus = document.getElementById('modus').value;
			var tmpX = modus+'_X';
			var tmpY = modus+'_Y';
			
			document.getElementById(tmpX).value = parseInt(x); 
			document.getElementById(tmpY).value = parseInt(y); 
		};
		document.getElementById(tmpX).value =parseInt(document.getElementById('XStart').value); 
		document.getElementById(tmpY).value =parseInt(document.getElementById('YStart').value); 
		document.getElementById("modulatorLayerObject").style.left = parseInt(document.getElementById('XStart').value) + 'px';
		document.getElementById("modulatorLayerObject").style.top = parseInt(document.getElementById('YStart').value) + 'px';	
	}
}

function rahmenShow(){
	var zeigeRahmen = 'yes';
	
	if(document.getElementById('zeigeRahmen').checked == true){
	
		if(document.getElementById('modulatorLayerObject'))	document.getElementById('modulatorLayerObject').style.border = '1px dotted #FF0000';
		document.getElementById('modulatorLayer').style.border = '1px dotted #404040';
	}else{
		document.getElementById('modulatorLayer').style.border = 'none';
		if(document.getElementById('modulatorLayerObject')) document.getElementById('modulatorLayerObject').style.border = 'none';
		zeigeRahmen = 'no';
	}
	new Ajax.Request(HOME_URL + 'Index/zeige', {method: 'get', parameters: 'zeigeRahmen=' + zeigeRahmen, onComplete: myResponse.bind(this)});
}

function moveObject(typ){
	var modus = document.getElementById('modus').value;
	var tmpX = modus+'_X';
	var tmpY = modus+'_Y';
	x = parseInt(document.getElementById(tmpX).value);
	y = parseInt(document.getElementById(tmpY).value);
	
	width = parseInt(myid.style.width)-parseInt(document.getElementById('layerWidth').value);
	height = parseInt(myid.style.height)-parseInt(document.getElementById('layerHeight').value);
	
	change = false;
	switch (typ){
		case "up":
			if((y - 1) >= 0){
				y = y -1;
				change = true;
			}
		    break;
		case "down":
			if((y + 1) <= height){
				y = y + 1;
				change = true;
			}
		    break;
		case "left":
			if((x - 1) >= 0){
			 	x = x -1;
			 	change = true;
			}
		    break;
		case "right":
			if((x + 1) <= width){
				x = x + 1;
				change = true;
			}
		    break;
		case "center":
			if(width / 2 != x){
				x = width / 2;
				change = true;
			}
		    break;
	}
	
	if(change == true){
		document.getElementById(tmpX).value = x;
		document.getElementById(tmpY).value = y;
		document.getElementById("modulatorLayerObject").style.left = x + 'px';
		document.getElementById("modulatorLayerObject").style.top = y + 'px';	
		senden();
	}
}

function setFontSize(operator,value){
	
	if(operator == '+'){
	 	document.getElementById('FontSize').value = parseInt(document.getElementById('FontSize').value) + value;
	}else{
		document.getElementById('FontSize').value = parseInt(document.getElementById('FontSize').value) - value;
	}
	return document.getElementById('FontSize').value;
}

function setSize(operator){

	switch (operator){
		case '+':
			return parseInt(document.getElementById('layerWidth').value) * 1.06;	
		case '-':
			if(parseInt(document.getElementById('layerWidth').value) * 0.94 > 35){
				return parseInt(document.getElementById('layerWidth').value) * 0.94;	
			}else{
				return parseInt(document.getElementById('layerWidth').value);
			}
		case 'max':
			return parseInt(document.getElementById('modulatorLayer').style.width);	
	}		
}


function setColor(color,id){
	document.getElementById('ColorDisplay').style.backgroundColor = color;
	loadTemplate('modulatorLayerObject','Id='+id+'&Color='+ color.substr(1,6));
}