var TemplateMaker = Class.create({
	actionFile:'',
	composerActionFile:'',

	create: function() {
		var params = $('createTemplateForm').serialize(true);
		params.command = 'doCreateTemplate';
		new Ajax.Request(this.getActionFile(),{
			method:'post',
			parameters:params,
			onSuccess:function(transport) {
				if( transport.responseText=='OK' ) {
					system.getPopUp().close();
					new Page(templateMaker.getActionFile(),{command:'printPage',style:system.getCurrentStyle},'pageContainer');
					system.getMessageManager().hideMessage();
				}
				else {
					system.getMessageManager().showMessage(transport.responseText,{color:'red'});
				}
			}
		});
	},
	
	edit: function(templateId) {
		var params = $('editTemplateForm').serialize(true);
		params.command = 'doEditTemplate';
		params.templateId = templateId;
		new Ajax.Request(this.getActionFile(),{
			method:'post',
			parameters:params,
			onSuccess:function(transport) {
				if( transport.responseText=='OK' ) {
					system.getPopUp().close();
					new Page(templateMaker.getActionFile(),{command:'printPage',style:system.getCurrentStyle},'pageContainer');
					system.getMessageManager().hideMessage();
				}
				else {
					system.getMessageManager().showMessage(transport.responseText,{color:'red'});
				}
			}
		});
	},

	saveTemplateProperties: function(templateId) {
		var params = $('templatePropertiesForm').serialize(true);
		params.command = 'saveTemplateProperties';
		params.templateId = templateId;
		new Ajax.Request(this.getTemplateComposerFile(),{
			method:'post',
			parameters:params,
			onSuccess:function(transport) {
				if( transport.responseText=='OK' ) {
					templateMaker.reloadTemplateContainer(templateId);
				}
				else {
					alert(transport.responseText);
				}
			}
		});
	},

	reloadTemplateContainer: function(templateId) {
		var params = {command:'reloadTemplateContainer',style:system.getCurrentStyle(),templateId:templateId};
		new Ajax.Request(this.getTemplateComposerFile(),{
			method:'post',
			parameters:params,
			onSuccess:function(transport) {
				$('templateEditorContainer').innerHTML = transport.responseText;
				system.evalAllScripts('templateEditorContainer');
			}
		})
	},

	getActionFile: function() {
		if( this.actionFile=='' ) {
			this.actionFile = system.getLibraryPath() + 'templatemaker/_index.php';
		}
		return this.actionFile;
	},

	getTemplateComposerFile: function() {
		if( this.composerActionFile=='' ) {
			this.composerActionFile = system.getLibraryPath() + 'templatemaker/_template_composer.php';
		}
		return this.composerActionFile;
	}
});

var templateMaker = new TemplateMaker();

var BlockEditor = Class.create({
	actionFile:'',
	currentBlockId:0,
	prevMouseX:0,
	prevMouseY:0,
	selectedBlock:null,

	getSelectedBlock: function() {
		return this.selectedBlock;
	},

	addBlock: function(templateId) {
		new Ajax.Request(this.getActionFile(),{
			method:'post',
			parameters:{command:'createNewBlock',templateId:templateId},
			onSuccess:function(transport) {
				if( transport.responseText=='OK' ) {
					templateMaker.reloadTemplateContainer(templateId);
				}
			}
		});
	},

	startDrag: function(event,blockId) {
		this.currentBlockId = blockId;
		this.prevMouseX = event.pageX;
		this.prevMouseY = event.pageY;
		this.selectedBlock = $('template_block_' + blockId);
	},
	
	drag: function(event,blockId) {
		if( this.currentBlockId!=0) {
			var block = $('template_block_' + blockId);

			var blockX = block.positionedOffset().left;
			var blockY = block.positionedOffset().top;
			
			var offsetX = this.prevMouseX - event.pageX;
			var offsetY = this.prevMouseY - event.pageY;

			this.prevMouseX = event.pageX;
			this.prevMouseY = event.pageY;
			blockX = (blockX - offsetX) + 'px';
			blockY = (blockY - offsetY) + 'px';

			block.setStyle({left:blockX,top:blockY});
		}
	},

	stopDrag: function(event,blockId) {

		this.updateResizer(event,blockId);
		
		var block = $('template_block_' + blockId);
		if( block ) {
			var posX = block.positionedOffset().left;
			var posY = block.positionedOffset().top;
			
			new Ajax.Request(this.getActionFile(),{
				method:'post',
				parameters:{command:'saveBlockPosition',blockId:blockId,posX:posX,posY:posY},
				onSuccess:function(transport) {
					if( transport.responseText!='OK' ) {
						alert(transport.responseText);
					}
				}
			});
		}
		
		this.currentBlockId = 0;
	},
	
	updateResizer: function(event,blockId) {
		var block = $('template_block_' + blockId);
		var blockResizer = $('template_block_resize_' + blockId);
		if( block &&  blockResizer) {
			var posX = block.positionedOffset().left;
			var posY = block.positionedOffset().top;
			
			var width = parseInt(block.style.width);
			var height = parseInt(block.style.height);

			var resizerX = width + posX -16;
			var resizerY = height + posY -16;
			
			blockResizer.style.left = (resizerX) + 'px';
			blockResizer.style.top = (resizerY) + 'px';
		}
		
		this.currentBlockId = 0;		
	},
	
	updateBlockSize: function(event,blockId) {
		var block = $('template_block_' + blockId);
		var blockResizer = $('template_block_resize_' + blockId);
		if( block &&  blockResizer) {
			var posX = block.positionedOffset().left;
			var posY = block.positionedOffset().top;

			var resizeX = blockResizer.positionedOffset().left;
			var resizeY = blockResizer.positionedOffset().top;
			
			block.style.width = (resizeX - posX +16) + 'px';
			block.style.height = (resizeY - posY +16) + 'px';
			
			this.updateResizer(event,blockId);
		}
		
		this.currentBlockId = 0;		
	},
	
	updateSize: function(event,blockId) {
		var block = $('template_block_' + blockId);
		var blockResizer = $('template_block_resize_' + blockId);
		if( block &&  blockResizer) {
			var posX = block.positionedOffset().left;
			var posY = block.positionedOffset().top;

			var resizeX = blockResizer.positionedOffset().left;
			var resizeY = blockResizer.positionedOffset().top;
			
			var width = resizeX - posX + 16;
			var height = resizeY - posY + 16;
			
			this.updateResizer(event,blockId);
						
			new Ajax.Request(this.getActionFile(),{
				method:'post',
				parameters:{command:'saveBlockSize',blockId:blockId,width:width,height:height},
				onSuccess:function(transport) {
					if( transport.responseText!='OK' ) {
						alert(transport.responseText);
					}
				}
			});
		}
		
		this.currentBlockId = 0;		
	},
		
	editBlock: function(blockId) {
		system.getPopUp().setContent('Loading data...'); 
		system.getPopUp().setContentWithURL(this.getActionFile(),{command:'editBlockForm',style:system.getCurrentStyle(),blockId:blockId});
		system.getPopUp().open();
	},
	
	saveBlockChanges: function(blockId,templateId) {
		var params = $('editBlockForm').serialize(true);
		params.command = 'saveBlockChanges';
		params.blockId = blockId;
		new Ajax.Request(this.getActionFile(),{
			method:'post',
			parameters:params,
			onSuccess:function(transport) {
				if( transport.responseText=='OK' ) {
					system.getPopUp().close();
					system.getMessageManager().hideMessage();
					templateMaker.reloadTemplateContainer(templateId);
				}
				else {
					system.getMessageManager().showMessage(transport.responseText,{color:'red'});
				}
			}
		});
	},
	
	deleteBlock: function(blockId,templateId) {
		new Ajax.Request(this.getActionFile(),{
			method:'post',
			parameters:{command:'deleteBlock',style:system.getCurrentStyle(),blockId:blockId},
			onSuccess:function(transport) {
				if( transport.responseText=='OK' ) {
					system.getPopUp().close();
					system.getMessageManager().hideMessage();
					templateMaker.reloadTemplateContainer(templateId);
				}
				else {
					system.getMessageManager().showMessage(transport.responseText,{color:'red'});
				}
			}
		});
	},
	
	getActionFile:function() {
		if( this.actionFile=='' ) {
			this.actionFile = system.getLibraryPath() + 'templatemaker/_template_composer.php';
		}
		return this.actionFile;
	},
	
	adjustFields: function(){
		var container = $('backgroundImage');
		
		var width = parseInt(container.style.width)||0;
		var height = parseInt(container.style.height)||0;
		width = width; // Por el borde
		height = height; // Por el borde
		
		var blocks = container.select('.templateBlock');
		for (var i=0;i<blocks.length;i++){
			var top = parseInt(blocks[i].style.top)||0;
			var left = parseInt(blocks[i].style.left)||0;
			var w =  parseInt(blocks[i].style.width)||0; //pb.core.cssUtils.getWidth(blocks[i]);
			var h = parseInt(blocks[i].style.height)||0; //pb.core.cssUtils.getHeight(blocks[i]);
			
			if (top<0) top = 0;
			if (left<0) left = 0;

			if ((left+w)>width) {
				left = width-w;
				if (left<0){
					left = 0;
					w = width-left;
				}
			}

			
			if ((top+h)>height) {
				top = height-h;
				if (top<0){
					top = 0;
					h = height-top;
				}
			}
			
						
			blocks[i].style.left = left + 'px';
			blocks[i].style.top = top + 'px';
			blocks[i].style.width = w + 'px';
			blocks[i].style.height = h + 'px';
						
			var prefix = 'template_block_';
			var nodeId = new String(blocks[i].id);
			var blockId = nodeId.substring(prefix.length);
			

			this.updateResizer(null,blockId);		
			
				new Ajax.Request(this.getActionFile(),{
					method:'post',
					parameters:{command:'saveBlockPosition',blockId:blockId,posX:left,posY:top,width: w,height: h},
					onSuccess:function(transport) {
						if( transport.responseText!='OK' ) {
							alert(transport.responseText);
						}
					}
				});
		
			this.currentBlockId = 0;
		}
		
	}
});

var blockEditor = new BlockEditor();