var Block = new Class.create({

	id:null,
	cssId:null,
	canBeUpdated:false,
	
	initialize: function(id,cssId,canBeUpdated){
		this.id = id;
		this.cssId = cssId;
		this.canBeUpdated = canBeUpdated;
	}
	
});

var Field = new Class.create({

	fieldId:null,
	cssId:null,
	blockId:null,
	
	initialize: function(fieldId,cssId,blockId){
		this.fieldId = fieldId;
		this.cssId = cssId;
		this.blockId = blockId;		
	}
	
});

var PageDesigner = new Class.create({

	blockList: null,
	actionFile: 'web/_page_editor_renderer.php',
	pageId: null,
	pageCssId: null,
	selectedBlock: null,
	noElementsInPageMessage: '',
	nothingSelectedMessage: '',
	undoManager: null,
	blocks:null,
	fields: null,
	numBlocks: 0,
	documentSaved:true,
	inDesignMode: false,
	
	mouseOver: '',
	mouseOut: '',
	mouseDown: '',
	mouseUp: '',
	
	propertiesRequest: null,

	init: function(pageId,nothingSelectedMessage,noElementsInPageMessage)	{
		
		this.actionFile = 'web/_page_editor_renderer.php',
		
		this.pageId = pageId;
		this.nothingSelectedMessage = '<p style="text-align:center;font-family: \'Lucida Grande\';font-size: 19px;color: grey;margin: 40px;">' + nothingSelectedMessage + '</p>';
		this.noElementsInPageMessage = '<p style="text-align:center;font-family: \'Lucida Grande\';font-size: 19px;color: grey;font-style: normal;margin: 40px;">' + noElementsInPageMessage + '</p>';
		
		this.undoManager = new UndoManager('pageDesigner');
		document.observe('ws:undomanager',function(){ pageDesigner.updateUndoButtons(); });
		document.observe('ws:editablecss_added',function(event){ editableCSSManager.editable(event.memo.id).setUndoManager(pageDesigner.undoManager); });
		document.observe('ws:css_size_may_changed',function(event) {
			resizerManager.getResizer(event.memo.fieldId).update();
		});
		
		hudWindowManager.addHUDWindow('blocks',localizedString.get('Elements'),'250px');
		hudWindowManager.getHUDWindow('blocks').setMaxHeight('400px');
		hudWindowManager.getHUDWindow('blocks').setOnStart(function(){ resizerManager.disableAllMouseOver(); });
		hudWindowManager.getHUDWindow('blocks').setOnEnd(function(){ resizerManager.enableAllMouseOver();
		pageDesigner.saveWindowPosition('blocks'); });
		
		//hudWindowManager.getHUDWindow('blocks').setContentPadding('10px','10px');
		
		hudWindowManager.getHUDWindow('blocks').setContent("<div id=\"itemListContainer\" style=\"overflow:auto;height: 368px;margin-bottom: 23px;\"></div><div id=\"actionBar\" style=\"position: absolute;bottom: 1px;left: 1px;right:1px;\"></div>");
		
		pb.core.actions.executeAndPutResultIntoContainer(system.getLibraryPath() + this.actionFile,'printElementsActionBar',{},'actionBar',true);
		
		pb.core.eventUtils.disableWheelEvent($('itemListContainer'));
		
		// document.observe('ws:control_added',function(event){ if (event.memo.id=='showActionsButton') {
		// 
		// 										var removeBlock = $('remove_block');			
		// 										if (removeBlock) {
		// 											pageDesigner.mouseOver = removeBlock.getAttribute('onmouseover');
		// 											pageDesigner.mouseOut = removeBlock.getAttribute('onmouseout');
		// 											pageDesigner.mouseDown = removeBlock.getAttribute('onmousedown');
		// 											pageDesigner.mouseUp = removeBlock.getAttribute('onmouseup'); }
		// 										
		// 											removeBlock.style.color = 'grey';
		// 											removeBlock.setAttribute('onmouseover','');
		// 											removeBlock.setAttribute('onmouseout','');
		// 											removeBlock.setAttribute('onmousedown','');
		// 											removeBlock.setAttribute('onmouseup','');
		// 										}
		// 									});
		
		//hudWindowManager.getHUDWindow('blocks').setContent(this.noElementsInPageMessage);
		
		//hudWindowManager.addHUDWindow('info',localizedString.get('Properties'),'450px','','300px');
		hudWindowManager.addHUDWindow('info',localizedString.get('Properties'),'','','300px');
		
		hudWindowManager.getHUDWindow('info').setContent(this.nothingSelectedMessage);
		hudWindowManager.getHUDWindow('info').setMaxHeight('500px');
		hudWindowManager.getHUDWindow('info').setMinWidth('450px');
		
		hudWindowManager.getHUDWindow('info').hide();

		hudWindowManager.getHUDWindow('info').setOnStart(function(){ resizerManager.disableAllMouseOver(); });
		hudWindowManager.getHUDWindow('info').setOnEnd(function(){ resizerManager.enableAllMouseOver(); pageDesigner.saveWindowPosition('info'); });

		viewportPlacer.place('info','right','middle');
		
		hudWindowManager.addHUDWindow('fav',localizedString.get('Favorites'),'322px',null,'300px');
		hudWindowManager.getHUDWindow('fav').setMaxHeight('400px');
	 	hudWindowManager.getHUDWindow('fav').hide();
		hudWindowManager.getHUDWindow('fav').setOnStart(function(){ resizerManager.disableAllMouseOver(); });
		hudWindowManager.getHUDWindow('fav').setOnEnd(function(){ resizerManager.enableAllMouseOver(); pageDesigner.saveWindowPosition('fav'); });

	
		var reloadProperties = this.reloadProperties.bind(this);
		document.observe('ws:load_actions',reloadProperties);
		document.observe('ws:load_animation',reloadProperties);
		document.observe('ws:load_css',reloadProperties);
	
		this.loadFavorites();	
		
		viewportPlacer.place('fav','left','top');
		

		// hudWindowManager.getHUDWindow('blocks').setContentWithURL(system.getLibraryPath() + 'web/_page_editor_renderer.php'
		// 			,{ command: 'printBlocks',pageId: pageId, style: system.getCurrentStyle() });
			
		hudWindowManager.getHUDWindow('blocks').hide();
		
		document.observe('ws:css_changed',function(event) {
			if (!event.memo.dontUpdateResizer){
				if (resizerManager.getResizer(event.memo.fieldId)){
					resizerManager.getResizer(event.memo.fieldId).update();
				}
			}
		});
		
		document.observe('ws:zindex_changed',function(event) {
			if (resizerManager.getResizer(event.memo.fieldId)){
				resizerManager.getResizer(event.memo.fieldId).updateZIndex();
			}
		});
		
		
		document.observe('ws:css_reseted',function(event) {
			pageDesigner.clearContainerStyle(event.memo.fieldId,event.memo.cssId);
		});
		
		document.observe('ws:css_display_changed',function(event){
			pageDesigner.updateBlockList();
		});

		Event.observe(document,'ws:hudwindow_changed_visibility',function (event){
			pageDesigner.updateWindowIcons();
		});
		
		Event.observe(document,'ws:block_css_changed',function (event){
			
			if (event.memo.id=='designPageContainer'){
					document.fire('ws:css_changed',{ fieldId: event.memo.id,cssId: pageDesigner.cssId, dontUpdateResizer: true });				
			}
			else {
				var blockId = event.memo.id.substr(9);

				var block = pageDesigner.getBlock(blockId);
				if (block){
					document.fire('ws:css_changed',{ fieldId: event.memo.id,cssId: block.cssId, dontUpdateResizer: true });				
				}
			}
		});
		
		document.observe('ws:block_resized',function(event) {
			if (event.memo.id){
				pageDesigner.updateBlockContent(event.memo.id);
			}
		});
		

		viewportPlacer.place('blocks','right','top');
		if ($('blocks').style.top){
			$('blocks').style.top = (parseInt($('blocks').style.top) + 60) + 'px';			
		}

		if ($('info').style.top){
			$('info').style.top = (parseInt($('info').style.top) - 20) + 'px';
		}
		
		this.updateBlockList();
		this.updateWindowIcons();
		
		Event.observe(document,'click',function(){ pageDesigner.clearSelection(); });

		var ctrlPressed = false;
		var shiftPressed = false;
		var cmdPressed = false;

		Event.observe(document,'keydown',function(event){ 
			if(event.which==17) ctrlPressed=false;
			if(event.which==16) shiftPressed = false;

			if (system.isCommandKey(event)) cmdPressed = false;

			// if ((event.keyCode==96)||(event.keyCode==96)) {
			// 				menuDesigner.togglePanels();
			// 			}

			// if (event.keyCode==70) {
			// 			pageDesigner.toggleFavorites();
			// 		}
			// 
			// 		if (event.keyCode==69) {
			// 			pageDesigner.toggleElements();
			// 		}
			// 
			// 		if (event.keyCode==80) {
			// 			pageDesigner.toggleProperties();
			// 		}
		
			
			// if (event.keyCode==Event.KEY_TAB){
			// 	pageDesigner.toggleElements();
			// 	event.cancelBubble = true;
			// }
		});
		
		Event.observe(document,'keydown',function(event){
			
			if (event.keyCode==17) { // Ctrl
				ctrlPressed = true;
			}
			
			if (event.keyCode==16) { // Shift
				shiftPressed = true;
			}
			
			if (system.isCommandKey(event)) { // Cmd
				cmdPressed = true;
			}
		
			if (event.keyCode==27) { // Esc
				pageDesigner.clearSelection(); 
			}
			
			pressed = false;
			if (ctrlPressed || cmdPressed){
				pressed = true;
			}
			
			if ((event.keyCode==90) && pressed) {
				if (shiftPressed) pageDesigner.undoManager.redo();
				else pageDesigner.undoManager.undo();
			}
		});
		
			
		this.blocks = new Object();
		this.numBlocks = 0;

		this.fields = new Object();
		this.numFields = 0;
		
		hudWindowManager.getHUDWindow('blocks').setPosition('fixed');
		hudWindowManager.getHUDWindow('info').setPosition('fixed');
		hudWindowManager.getHUDWindow('fav').setPosition('fixed');

		// Event.observe(document,'keydown',function(event){ 
		// 		if (event.keyCode==27) { // Esc
		// 			pageDesigner.clearSelection(); 
		// 		}
		// 		else if (event.keyCode==37){ // Left Arrow
		// 			//alert('left');
		// 			if (event.shiftKey){
		// 				pageDesigner.moveLeftFast();
		// 			}
		// 			else {
		// 				pageDesigner.moveLeft();
		// 			}
		// 
		// 		}
		// 		else if (event.keyCode==38){ // Up Arrow
		// 			//alert('up');
		// 			if (event.shiftKey){
		// 				pageDesigner.moveUpFast();
		// 			}
		// 			else {
		// 				pageDesigner.moveUp();
		// 			}
		// 		}
		// 		else if (event.keyCode==39){ // Right Arrow
		// 			//alert('right');
		// 			if (event.shiftKey){
		// 				pageDesigner.moveRightFast();	
		// 			}
		// 			else {
		// 				pageDesigner.moveRight();
		// 			}
		// 		}
		// 		else if (event.keyCode==40){ // Down Arrow
		// 			//alert('down');
		// 			if (event.shiftKey){
		// 				pageDesigner.moveDownFast();
		// 			}
		// 			else {
		// 				pageDesigner.moveDown();
		// 			}
		// 		}
		// 	});
		parent.window.onbeforeunload = this.checkTasksFinished.bind(this);
	},

	checkTasksFinished: function(event) {
		var event = event || window.event;

		if (pb.core.activityMonitor.getActiveTasksCount()>0) {
			var dialog = localizedString.get('If you continue some data could be lost. Are you sure?');
			  // For IE and Firefox
			  if (event) {
			    event.returnValue = dialog;
			  }

			  // For Safari
			  return dialog;			
		}
		else return;
	},
	
	reloadProperties: function(){
		this.performSelectBlock(this.selectedBlock);
	},
		
	getSelectedId: function(){
		if (this.selectedBlock=='designPageContainer'){
			return this.selectedBlock;
		}
		else {
			if (this.selectedBlock){
				return (this.getBlockFieldId(this.selectedBlock));
			}
		}
		return this.selectedBlock;
	},
	
	moveLeft: function(){

		if (!this.selectedBlock) return;
		
		if (this.selectedBlock=='designPageContainer'){
			if (resizerManager.getResizer(this.selectedBlock)){
				resizerManager.getResizer(this.selectedBlock).moveLeft();
			}
		}
		else {
			if (resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock))){
				if (resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock))){
					resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock)).moveLeft();
				}				
			}
		}
		
	},
	
	moveRight: function(){

		if (!this.selectedBlock) return;
		
		if (this.selectedBlock=='designPageContainer'){
			if (resizerManager.getResizer(this.selectedBlock)){
				resizerManager.getResizer(this.selectedBlock).moveRight();
			}
		}
		else {
			if (resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock))){
				if (resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock))){
					resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock)).moveRight();
				}				
			}
		}
		
	},
	
	moveUp: function(){

		if (!this.selectedBlock) return;
		
		if (this.selectedBlock=='designPageContainer'){
			if (resizerManager.getResizer(this.selectedBlock)){
				resizerManager.getResizer(this.selectedBlock).moveUp();
			}
		}
		else {
			if (resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock))){
				if (resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock))){
					resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock)).moveUp();
				}				
			}
		}
		
	},
	
	moveDown: function(){

		if (!this.selectedBlock) return;
		
		if (this.selectedBlock=='designPageContainer'){
			if (resizerManager.getResizer(this.selectedBlock)){
				resizerManager.getResizer(this.selectedBlock).moveDown();
			}
		}
		else {
			if (resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock))){
				if (resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock))){
					resizerManager.getResizer(this.getBlockFieldId(this.selectedBlock)).moveDown();
				}				
			}
		}
		
	},
	
	registerClickEvent: function(containerId) {
		pb.core.console.log('registerClickEvent');
		if ($(containerId)) {
			
			pb.core.console.log('registerClickEvent container id');
			
			// pageDesigner.loadResizer(containerId,cssId);
			$(containerId).observe('click',function(evt) { 
					pageDesigner.selectBlock(containerId);
					evt.stop();
					//pageDesigner.loadResizer(containerId);  
				});
		}
	},
	
	loadResizer: function(containerId) {
		//resizerManager.removeResizer(this.currentResizer);
		if (resizerManager.getResizer(this.currentResizer)) {
			resizerManager.getResizer(this.currentResizer).hideHandles();
		}
		
		this.addResizerToContainer(containerId);
		this.currentResizer = containerId;
	},

	
	setWindowPosition: function(id,left,top){
		
		if (!hudWindowManager.getHUDWindow(id)) return;
		
		if (!left){
			left = '50px';
		}
		
		if (!top){
			top = '100px';
		}
		
		hudWindowManager.getHUDWindow(id).setLeftPos(left);
		hudWindowManager.getHUDWindow(id).setTopPos(top);		
	},
	
	setWindowVisibility: function(id,visible){
		
		var panel = hudWindowManager.getHUDWindow(id);
		if (panel){
			if (visible){
				panel.show();
			}
			else {
				panel.hide();
			}
		}
		
		this.updateWindowIcons();
	},
	
	setWindowDepth: function(id,depth){
		var panel = hudWindowManager.getHUDWindow(id);
		if (panel){
			layerManagers['hudWindows'].setDepth(id,depth);
			//panel.style.zIndex = depth;
		}
	},
	
	saveWindowVisibility: function(id){
		var visible = 'true';
		if ($(id).style.display=='none'){
			visible = 'false';
		}
		
		new Ajax.Request(system.getLibraryPath() + this.actionFile, {
			method:'post',
			parameters:{ command: 'saveWindowVisibility',pageId: this.pageId,id: id,visible: visible, style: system.getCurrentStyle() },
			onSuccess: function(transport) {
			}
		});
	},
	
	saveWindowPosition: function(id){
		var depth = $(id).style.zIndex;
		new Ajax.Request(system.getLibraryPath() + this.actionFile, {
			method:'post',
			parameters:{ command: 'saveWindowPosition',pageId: this.pageId,id: id,left: $(id).style.left,top: $(id).style.top, depth: depth,style: system.getCurrentStyle() },
			onSuccess: function(transport) {
			}
		});
	},
	
	saveBlockContent: function(id,type,module,actionFile){
		
		document.fire('ws:savingBlock',{ id: id });
		$('blockContentForm').fire('ws:updateText');
		
		// TODO Implementar esto
		var parameters = {};
		var form = $('blockContentForm');
		if( form ) {
			parameters = form.serialize(true);
		}
		
		var obj = this;
		
		parameters.command='saveBlock';
		parameters.blockId=id;
		parameters.type=type;
		parameters.module=module;
		pb.core.activityMonitor.addTask(new pb_core_Task('saving_block_content',pb.core.localizedString.get('Saving block content')));
		new Ajax.Request(system.getLibraryPath() + module + '/' + actionFile, {
			method:'post',
			parameters:parameters,
			onSuccess: function(transport) {
				pb.core.activityMonitor.endTask('saving_block_content');
				pageDesigner.performUpdateBlockContent('webBlock_' + id);
				pageDesigner.updateBlockList();
			}
		});	
	},
	
	changeBlockType: function(id,module) {
		var newBlockType = $('blockTypeCombo').value;
		
		pb.core.activityMonitor.addTask(new pb_core_Task('changing_block_type',pb.core.localizedString.get('Changing block type')));
		new Ajax.Request(system.getLibraryPath() + this.actionFile,{
			method:'post',
			parameters:{command:'changeBlockType',blockId:id,newBlockType:newBlockType,destinationLibraryPath:system.getLibraryPath()},
			onSuccess:function(transport) {
				pb.core.activityMonitor.endTask('changing_block_type');
				if (transport.responseText!=""){
					$('pageBlockContent').innerHTML = transport.responseText;
					pb.core.system.evalAllScripts($('pageBlockContent'));
					
					pageDesigner.performUpdateBlockContent('webBlock_' + id);
					//pageDesigner.updateBlockList();
					
					//$('pageBlockButton_'+id).onclick();
				}
				//widgetsManager.getPageBlockEditor().editBlock(id,newBlockType,module,this.getActionFile());
			}
		});
	},
	
	toggleBlockDesign: function(id){
		
		
		var designField = $('designButton_' + id);
		if (designField.className=='DesignButtonOff'){
			designField.className = 'DesignButton';
		}
		else {
			designField.className = 'DesignButtonOff';			
		}
		
		new Ajax.Request(system.getLibraryPath() + this.actionFile, {
			method:'post',
			parameters:{ command: 'toggleBlockDesign',pageId: this.pageId,blockId: id, style: system.getCurrentStyle() },
			onSuccess: function(transport) {
				pageDesigner.updateBlockList();
			}
		});

		// new Ajax.Request(system.getLibraryPath() + this.actionFile, {
		// 	method:'post',
		// 	parameters:{ command: 'start',pageId: this.pageId,id: id,left: $(id).style.left,top: $(id).style.top, depth: depth,style: system.getCurrentStyle() },
		// 	onSuccess: function(transport) {
		// 	}
		// });
	},
		
	update: function(pageId,cssId){
		this.pageId = pageId;
		this.cssId = cssId;
		this.updateDesignMode();
		this.updateBlockList();
		this.updateWindowIcons();
	},
	
	updateDesignMode: function(){
	
		if (!this.inDesignMode){
				segmentedControlManager.control('designMode').setSelected('auto');
				// $('ResetDesignToolbarIcon').hide();

				$('RevertToolbarIcon').style.visibility = 'hidden';
				$('UndoToolbarIcon').style.visibility = 'hidden';
				$('RedoToolbarIcon').style.visibility = 'hidden';
				
				hudWindowManager.getHUDWindow('blocks').hide();
				hudWindowManager.getHUDWindow('info').hide();
				
				$('BlocksToolbarIcon').style.visibility = 'hidden';
				$('PropertiesToolbarIcon').style.visibility = 'hidden';
				$('FavoritesToolbarIcon').style.visibility = 'hidden';
				// $('AddContainerToolbarIcon').hide();
				
				resizerManager.removeResizer('designPageContainer');
		}
		else {
			segmentedControlManager.control('designMode').setSelected('manual');
			
				// $('ResetDesignToolbarIcon').show();
				
				$('RevertToolbarIcon').style.visibility = 'visible';
				$('UndoToolbarIcon').style.visibility = 'visible';
				$('RedoToolbarIcon').style.visibility = 'visible';
				$('BlocksToolbarIcon').style.visibility = 'visible';
				$('PropertiesToolbarIcon').style.visibility = 'visible';
				$('FavoritesToolbarIcon').style.visibility = 'visible';
				//$('AddContainerToolbarIcon').show();
				// $('DesignTitle').show();
				// 					$('PreviewTitle').hide();

				editableCSSManager.addEditable('designPageContainer',pageDesigner.cssId);
				editableCSSManager.editable(pageDesigner.cssId).setUndoManager(pageDesigner.undoManager);
				
				hudWindowManager.getHUDWindow('blocks').setOnStart(function(){ resizerManager.disableAllMouseOver(); });
				hudWindowManager.getHUDWindow('blocks').setOnEnd(function(){ resizerManager.enableAllMouseOver(); pageDesigner.saveWindowPosition('blocks'); });

				hudWindowManager.getHUDWindow('info').setOnStart(function(){ resizerManager.disableAllMouseOver(); });
				hudWindowManager.getHUDWindow('info').setOnEnd(function(){ resizerManager.enableAllMouseOver(); pageDesigner.saveWindowPosition('info'); });
			
		}
	},
	
	updateBlockList: function(){
		new Ajax.Request(system.getLibraryPath() + this.actionFile, {
			method:'post',
			parameters:{ command: 'printBlocks',pageId: this.pageId, style: system.getCurrentStyle() },
			onSuccess: function(transport) {
				pageDesigner.updateBlockListContent(transport.responseText);
			}
		});
		
	},
	
	updateBlockListContent: function(text){
		
		this.blockList = text.evalJSON();
		
		var rawList = "";
		
		var hiddenIcon = 'width: 20px;height:20px;background-image: url(../plasticbriqFramework/interfaceFiles/design/hidden.png);'
				
		for (var blockIndex in this.blockList){
			
			var designField = "";
			if (this.blockList[blockIndex].design=='off'){
				designField = '<div id="designButton_' + this.blockList[blockIndex].id + '" onclick="pageDesigner.toggleBlockDesign(\'' + this.blockList[blockIndex].id + '\');event.cancelBubble = true;return false;" title="' + localizedString.get("Press to start designing this block manually") + '" class="DesignButton" ></div>';
			}
			else if (this.blockList[blockIndex].design=='on'){
				designField = '<div id="designButton_' + this.blockList[blockIndex].id + '" onclick="pageDesigner.toggleBlockDesign(\'' + this.blockList[blockIndex].id + '\');event.cancelBubble = true;return false;" title="' + localizedString.get("Press to remove the manual design") + '" class="DesignButtonOff"></div>';
			}
			/*else {
				designField = '<div title="' + localizedString.get("This block does not support manual design") + '" class="DesignDisabledButton"></div>';
			}*/
						
			if (parseInt(blockIndex)==0) {
				rawList += "<div class=\"hudItem\" id=\"body_blockListItem\" style=\"padding: 2px;padding-top: 3px;padding-left: 10px;cursor: pointer;\" onclick=\"pageDesigner.selectBlock('body');\">" + this.blockList[blockIndex].type + "</div>";
			}
			else if (this.blockList[blockIndex].id=='site') {
				rawList += "<div class=\"treeViewItemParentCollapsed\" id=\"siteListItem\" style=\"padding: 2px;padding-top: 3px;padding-left: 20px;cursor: pointer;background-position: 10px 2px;\" onclick=\"if ($('containersListContainer').style.display=='none') { $('containersListContainer').style.display = 'block'; this.className = 'treeViewItemParentExpanded'; } else { $('containersListContainer').style.display = 'none'; this.className = 'treeViewItemParentCollapsed'; }\">" + '<div style="margin-left: 5px;">' +	 this.blockList[blockIndex].type + "</div></div><div id=\"containersListContainer\" style=\"display: none;\">";
			}
			else if (this.blockList[blockIndex].id=='designPageContainer') {
				
				var field = $('designPageContainer');
				
				var hidden = '';
				if (field && field.style.display=='none') {
					hidden = hiddenIcon;
				}
				
				rawList += "</div><div class=\"hudItem\" id=\"designPageContainer_blockListItem\" style=\"padding: 2px;padding-top: 3px;padding-left: 10px;cursor: pointer;\" onclick=\"pageDesigner.selectBlock('designPageContainer');\">" + "<div class=\"treeViewItemParentExpanded\" style=\"width: 15px;padding-left: 0px;cursor: pointer;background-position: 0px 0px;float:left;\" onclick=\"if ($('blocksListContainer').style.display=='none') { $('blocksListContainer').style.display = 'block'; this.className = 'treeViewItemParentExpanded'; } else { $('blocksListContainer').style.display = 'none'; this.className = 'treeViewItemParentCollapsed'; }\"></div><div style=\"float:left;\">" + this.blockList[blockIndex].type + "</div><div style=\"float:right;" + hidden + "\"></div></div><div id=\"blocksListContainer\">";
			}
			else if (this.blockList[blockIndex].kind=='container') {
				
				var field = $(this.blockList[blockIndex].id);
				
				var hidden = '';
				if (field && field.style.display=='none') {
					hidden = hiddenIcon;
				}
				
				var title = '';
				var name = this.blockList[blockIndex].type;
				var shortName = name.truncate(31);
				if (shortName!=name) title = name;
				
				rawList += "<div title=\"" + title + "\" class=\"hudItem\" id=\"" + this.blockList[blockIndex].id + "_containerListItem\" style=\"top: 2px;padding: 2px;padding-top: 3px;font-style: bold;padding-left: 30px;cursor: pointer;\" onclick=\"pageDesigner.selectBlock('" + this.blockList[blockIndex].id + "');\"> " + shortName + "<div style=\"float:right;" + hidden + "\"></div></div>";
			}
			else if (this.blockList[blockIndex].kind=='block') {
			
				var field = $('webBlock_' + this.blockList[blockIndex].id);
				
				var hidden = '';
				if (field && field.style.display=='none') {
					hidden = hiddenIcon;
				}

				var title = '';
				var name = this.blockList[blockIndex].type;
				var shortName = name.truncate(31);
				if (shortName!=name) title = name;
				
				rawList += "<div title=\"" + title + "\" class=\"hudItem\" id=\"" + this.blockList[blockIndex].id + "_blockListItem\" style=\"top: 2px;padding: 2px;padding-top: 3px;font-style: bold;padding-left: 30px;cursor: pointer;\" onclick=\"pageDesigner.selectBlock('" + this.blockList[blockIndex].id + "');\"> " + shortName + designField + "<div style=\"float:right;" + hidden + "\"></div></div>";
				
				if (this.blockList[blockIndex].designFields.length>0){
					for (var fieldIndex in this.blockList[blockIndex].designFields) {
						if (parseInt(fieldIndex)>=0){
							var field = this.blockList[blockIndex].designFields[fieldIndex];

							rawList += "<div class=\"hudItem\" id=\"" + field.fieldId + "_blockListItem\" style=\"top: 2px;padding: 2px;padding-top: 3px;font-style: bold;padding-left: 30px;cursor: pointer;\" onclick=\"pageDesigner.selectField('" + field.fieldId + "','" + field.cssId + "','" + this.blockList[blockIndex].id + "');\">- " + field.name + "</div>";							
						}
					}
				}

			}
			// else {
			// 			rawList += "<div class=\"hudItem\" id=\"" + this.blockList[blockIndex].id + "\" style=\"padding: 2px;padding-top: 3px;padding-left: 10px;cursor: pointer;\">" + this.blockList[blockIndex].type + "</div>";
			// 		}
		}
		
		rawList += '</div>';
		
		$('itemListContainer').innerHTML = rawList;
		pageDesigner.updateSelectedBlockItem();
		
	},
	
	selectField: function(fieldId,cssId,blockId){
		//layerManagers['blocks'].addField(fieldId);
		
		resizerManager.addResizer(fieldId,true);
		
		resizerManager.getResizer(fieldId).clickCallback = function (){
			pageDesigner.selectField(fieldId,cssId,blockId);
		};
		
		resizerManager.getResizer(fieldId).setUndoManager(pageDesigner.undoManager);
		
		resizerManager.getResizer(fieldId).dragCallback = function (){
			document.fire('ws:field_moved',{ fieldId: fieldId });
		};
		
		resizerManager.getResizer(fieldId).endDragCallback = function (){
			document.fire('ws:css_changed',{ cssId: cssId,fieldId: fieldId });
		};
		
		resizerManager.getResizer(fieldId).resizeCallback = function (){
			document.fire('ws:css_changed',{ cssId: cssId,fieldId: fieldId });
		};
		
		editableCSSManager.addEditable(fieldId,cssId);
		editableCSSManager.editable(cssId).setUndoManager(pageDesigner.undoManager);
		
		pageDesigner.addField(fieldId,cssId);
		
		resizerManager.removeResizer(blockId);
		
		if (this.selectedBlock==fieldId) return;

		this.clearSelection();
		// if (this.selectedBlock){
		// 	//resizerManager.removeResizer('webBlock_' + this.selectedBlock);
		// 	if (resizerManager.getResizer('webBlock_' + this.selectedBlock)){
		// 		resizerManager.getResizer('webBlock_' + this.selectedBlock).hideHandles();	
		// 	}
		// 
		// 	if ($(this.selectedBlock + '_blockListItem')){
		// 		$(this.selectedBlock + '_blockListItem').className = 'hudItem';
		// 	}			
		// }

		pb.core.console.log('selecting field');
		this.selectedBlock = fieldId;
		if ($(this.selectedBlock + '_blockListItem')){
			$(this.selectedBlock + '_blockListItem').className = 'hudSelectedItem';
		}
		
		//resizerManager.addResizer('webBlock_' + id);
		if (resizerManager.getResizer(fieldId)){
			resizerManager.getResizer(fieldId).showHandles();			
		}

		document.observe('ws:block_moved',function(event){ if (resizerManager.getResizer(event.memo.fieldId)) { resizerManager.getResizer(event.memo.fieldId).update(); } });

		hudWindowManager.getHUDWindow('info').setContentWithURL(system.getLibraryPath() + this.actionFile
			,{ command: 'printCssEditor',pageId: this.pageId,fieldId:fieldId,cssId: cssId, style: system.getCurrentStyle() });
	},
	
	updateUndoButtons: function(){
		var undoIcon = $('UndoToolbarIcon');
		var revertIcon = $('RevertToolbarIcon');
			
		if (this.undoManager.canUndo()){
			designWidgets.toolbar.setState('RevertToolbarIcon','normal');
			designWidgets.toolbar.setState('UndoToolbarIcon','normal');
		}
		else {
			designWidgets.toolbar.setState('RevertToolbarIcon','disabled');
			designWidgets.toolbar.setState('UndoToolbarIcon','disabled');
		}
		
		if (this.undoManager.canRedo()) {
			designWidgets.toolbar.setState('RedoToolbarIcon','normal');
		}
		else {
			designWidgets.toolbar.setState('RedoToolbarIcon','disabled');
		}		
	},
	
	clearSelection: function() {
		
		if (!this.selectedBlock) return;
		
		var callback = function(){
			pageDesigner.performClearSelection();
		};

		var previousSelection = this.selectedBlock;

		var backCallback = function(){
			pageDesigner.performSelectBlock(previousSelection);
		};

		this.undoManager.appendCommand(new CallbackCommand('clear selection',callback,backCallback));
		
		this.performClearSelection();
	},
	
	performClearSelection: function(){
		if (this.propertiesRequest) this.propertiesRequest.abort();
		if (this.selectedBlock){

			if (this.selectedBlock=='designPageContainer'){
				if (resizerManager.getResizer('designPageContainer')) {
					resizerManager.getResizer('designPageContainer').hideHandles();
				}
			}
			else {
				if (resizerManager.getResizer('webBlock_' + this.selectedBlock)){
					resizerManager.getResizer('webBlock_' + this.selectedBlock).hideHandles();
				}
				else if (resizerManager.getResizer(this.selectedBlock)) {
					//resizerManager.getResizer(this.selectedBlock).hideHandles();
					resizerManager.removeResizer(this.selectedBlock);
				}
			}

			if ($(this.selectedBlock + '_blockListItem')){
				$(this.selectedBlock + '_blockListItem').className = 'hudItem';
			}

			if ($(this.selectedBlock + '_containerListItem')){
				$(this.selectedBlock + '_containerListItem').className = 'hudItem';
			}

			hudWindowManager.getHUDWindow('info').setContent(this.nothingSelectedMessage);
			pb.core.console.log('clearing selection');
			this.selectedBlock = null;
		}
		
		colorPickerManager.hideAll();

		favoriteCSSEditor.fieldId = null;
		favoriteActionsEditor.fieldId = null;
		favoriteActionsEditor.actionsId = null;
		favoriteAnimationsEditor.fieldId = null;
		favoriteAnimationsEditor.animationId = null;
	},
	
	saveContainerPositionAndSize: function(containerId) {
		
		var container = $(containerId);
		
		if (container.getAttribute('anchorTop')=='both'){
			var top = container.offsetTop;
		}
		else if (container.getAttribute('anchorTop')=='bottom'){
		}
		else {
			var top = container.offsetTop;
		}

		var pageContainerBottom = $('pageContainerPositioner').offsetTop + $('pageContainerPositioner').offsetHeight;
		new Ajax.Request(system.getLibraryPath() + this.actionFile,{
			method:'post',
			parameters:{command:'saveContainerPosition',style:system.getCurrentStyle(),pageId:this.pageId,containerId:containerId,top:top,pageContainerBottom:pageContainerBottom},
			onSuccess:function(transport) {
				//websiteDesigner.forms.updateGenericContainer(websiteDesigner.siteId,containerId);
			}
		});
	},
	
	
	
	
	addResizerToContainer: function(container,disabled) {
		var resizer = resizerManager.getResizer(container);
		if (!resizer && $(container)) {
			resizerManager.addResizer(container);
			var resizer = resizerManager.getResizer(container);
			resizer.minWidth = 10;
			resizer.minHeight = 10;
			if (disabled) resizer.hideHandles();
			else resizer.showHandles();
			
			var info = pb.core.itemInfoManager.get('container',container);
			
			resizer.clickCallback = function() { pageDesigner.selectBlock(container); };
			resizer.endDragCallback = function() { 	
				pb.core.console.log('container cssid ' + info.cssId);
				document.fire('ws:css_changed',{ cssId: info.cssId,fieldId: container }); 
													pageDesigner.saveContainerPositionAndSize(container); };
			resizer.resizeCallback = function() { 
					pb.core.console.log('container cssid ' + info.cssId);
					document.fire('ws:css_changed',{ cssId: info.cssId,fieldId: container }); 
													pageDesigner.saveContainerPositionAndSize(container); };
			
			//resizerManager.getResizer(container).clickCallback = function() { websiteDesigner.loadGenericContainerProperties(container); };
			//document.observe('ws:css_changed',function (event) { pageDesigner.reloadContainerResizer(); });
			document.observe('ws:block_resized',function(event) { pageDesigner.saveContainerPositionAndSize(container); });
		}
	},
	
	reloadContainerResizer: function(){
		if (!this.selectedBlock) return;
		
		var container = this.selectedBlock;
		
		resizerManager.removeResizer(container);
		this.addResizerToContainer(container);
		// resizerManager.addResizer(container);
		// var resizer = resizerManager.getResizer(container);
		// resizer.minWidth = 10;
		// resizer.minHeight = 10;
		// resizer.showHandles();
		// resizer.endDragCallback = function() { pageDesigner.saveContainerPositionAndSize(container); };
		
	},
	
	selectContainer: function(id,cssId){
		// TODO Cargar un resizer bloqueado

		if (this.selectedBlock==id) return;
		
		var previousSelection = this.selectedBlock;

	
		var callback = function(){
			pageDesigner.performSelectContainer(id);
		};

		var previousSelection = this.selectedBlock;

		var backCallback = function(){
			pageDesigner.performSelectBlock(previousSelection);
		};

		this.undoManager.appendCommand(new CallbackCommand('selection',callback,backCallback));

		this.performSelectBlock(id);		

	},
	
	performSelectContainer: function(id) {
	
		this.performClearSelection();

		if (!id) return;
		
		pb.core.activityMonitor.addTask(new pb_core_Task('loading_container',pb.core.localizedString.get('Loading container')));
		
		hudWindowManager.getHUDWindow('info').setContentWithURL(system.getLibraryPath() + this.actionFile,
				{ command: 'printContainerInfo',pageId: this.pageId,id: id, style: system.getCurrentStyle() },'loading_container');
		
		this.showProperties();
		
		pageDesigner.loadResizer(id);
		
		this.selectedBlock = id;
		
		$('siteListItem').className = 'treeViewItemParentExpanded';
		$('containersListContainer').style.display = 'block';
		// $('blocks_content').scrollTo(id + '_containerListItem');
		
		$('itemListContainer').scrollTop = $(id + '_containerListItem').offsetTop - 30;
		
		
		if ($(id + '_containerListItem')){
			$(id + '_containerListItem').className = 'hudSelectedItem';
		}
		
	},
	
	loadGenericContainerStyleTab: function(containerId,tabViewId,state){
		
		pb.core.actions.executeAndPutResultIntoContainer(system.getLibraryPath() + this.actionFile,'loadGenericContainerStyleTab',
		{ containerId: containerId, state: state, pageId: this.pageId },tabViewManager.tabView(tabViewId).getCurrentTabContentField(),true);
		
	},
	
	selectBlock: function(id){
		
		pb.core.console.log('select block');

		if (this.selectedBlock==id) return;

		// var removeBlock = $('remove_block');
		// 
		// if (removeBlock){
		// 	if (isNaN(parseInt(id))){
		// 		removeBlock.style.color = 'grey';
		// 		removeBlock.setAttribute('onmouseover','');
		// 		removeBlock.setAttribute('onmouseout','');
		// 		removeBlock.setAttribute('onmousedown','');
		// 		removeBlock.setAttribute('onmouseup','');
		// 	}
		// 	else {
		// 		removeBlock.style.color = 'black';
		// 		removeBlock.setAttribute('onmouseover',this.mouseOver);
		// 		removeBlock.setAttribute('onmouseout',this.mouseOut);
		// 		removeBlock.setAttribute('onmousedown',this.mouseDown);
		// 		removeBlock.setAttribute('onmouseup',this.mouseUp);
		// 	}			
		// }
		
		if (resizerManager.getResizer(this.currentResizer)){
			resizerManager.getResizer(this.currentResizer).hideHandles();
		}

		var callback = function(){
			pageDesigner.performSelectBlock(id);
		};
		
		var previousSelection = this.selectedBlock;
		
		var backCallback = function(){
			pageDesigner.performSelectBlock(previousSelection);
		};
		
		this.undoManager.appendCommand(new CallbackCommand('selection',callback,backCallback));
		
		this.performSelectBlock(id);
	},
	
	
	performSelectBlock: function(id){
		
		//if (this.selectedBlock==id) return;
		
		pb.core.console.log('selecting block');
		
		var previousSelection = this.selectedBlock;

		this.performClearSelection();
		
		if (!id) return;
		
		pb.core.console.log('block should be selected: ' + pageDesigner.selectedBlock);
		
		var blockId = id;
		var blockInfo = null;

		pb.core.activityMonitor.addTask(new pb_core_Task('select_item',pb.core.localizedString.get('Loading block')));

		if (id=='body'){
			if (resizerManager.getResizer(id) && $(id).style.display!='none'){
				resizerManager.getResizer(id).showHandles();
			}
			
			document.observe('ws:block_moved',function(event){ if (resizerManager.getResizer(event.memo.fieldId)) { resizerManager.getResizer(event.memo.fieldId).update(); } });
			
			this.propertiesRequest = hudWindowManager.getHUDWindow('info').setContentWithURL(system.getLibraryPath() + this.actionFile
					,{ command: 'printBodyCSSEditor',pageId: this.pageId, style: system.getCurrentStyle() },'select_item');
					
			blockInfo = pb.core.itemInfoManager.get('site',id);
		}
		else if (id=='designPageContainer'){
			if (resizerManager.getResizer(id)){
				//resizerManager.setUndoManager(this.undoManager);
				
				resizerManager.getResizer(id).showHandles();
			}
			
			document.observe('ws:block_moved',function(event){ if (resizerManager.getResizer(event.memo.fieldId)) { resizerManager.getResizer(event.memo.fieldId).update(); } });
			
			this.propertiesRequest = hudWindowManager.getHUDWindow('info').setContentWithURL(system.getLibraryPath() + this.actionFile
					,{ command: 'printPageInfo',pageId: this.pageId, style: system.getCurrentStyle() },'select_item');
					
			blockInfo = pb.core.itemInfoManager.get('site',id);
		}
		else {
			blockId = this.getBlockFieldId(id);
			
			if ($(blockId)) {
				//resizerManager.addResizer('webBlock_' + id);
				if (resizerManager.getResizer(blockId) && ($(blockId).style.display!='none')){
					resizerManager.getResizer(blockId).showHandles();			
				}

				this.propertiesRequest = hudWindowManager.getHUDWindow('info').setContentWithURL(system.getLibraryPath() + this.actionFile
					,{ command: 'printCssEditor',pageId: this.pageId,blockId: id, style: system.getCurrentStyle() },'select_item');

				blockInfo = pb.core.itemInfoManager.get('block',id);				
			}
			else {
				var container = $(id);
				//pb.core.activityMonitor.addTask(new pb_core_Task('loading_container',pb.core.localizedString.get('Loading container')));

				this.propertiesRequest = hudWindowManager.getHUDWindow('info').setContentWithURL(system.getLibraryPath() + this.actionFile,
							{ command: 'printContainerInfo',pageId: this.pageId,id: id, style: system.getCurrentStyle() },'select_item');
				
				pageDesigner.addResizerToContainer(id);
				
				$('siteListItem').className = 'treeViewItemParentExpanded';
				$('containersListContainer').style.display = 'block';
			}
		}
		
		if (blockInfo){
			favoriteCSSEditor.fieldId = blockId;
			favoriteActionsEditor.fieldId = blockId;
			favoriteActionsEditor.actionsId = blockInfo.actionsId;
			favoriteAnimationsEditor.fieldId = blockId;
			favoriteAnimationsEditor.animationId = blockInfo.animationId;
		}
		
		// var offset = -20;
		// 
		// 	var toolbar = $('Toolbar');
		// 	if (toolbar) offset -= toolbar.offsetHeight;
		// 
		// 	var block = $(blockId);
		// 
		// 	if (pb.core.system.browser.Firefox){
		// 		block.scrollTo();
		// 		window.scrollBy(0,offset);
		// 	}
		// 	else {			
		// 		Effect.ScrollTo(blockId,{ offset: offset });
		// 		//window.scrollBy(0,50);				
		// 	}
		// 
		this.selectedBlock = id;
		
		var listItem = $(id + '_blockListItem');
		if (listItem) {
			$('itemListContainer').scrollTop = listItem.offsetTop - 30;
			listItem.className = 'hudSelectedItem';
		}

		listItem = $(id + '_containerListItem');
		if (listItem){
			$('itemListContainer').scrollTop = listItem.offsetTop - 30;
			listItem.className = 'hudSelectedItem';
		}

		this.showProperties();
	},
	
	updateSelectedBlockItem: function() {
		if (!this.selectedBlock) return;
		
		pb.core.console.log('updating selected block item ' + this.selectedBlock);

		var listItem = $(this.selectedBlock + '_blockListItem');
		if (listItem) {
			$('itemListContainer').scrollTop = listItem.offsetTop - 30;
			listItem.className = 'hudSelectedItem';
		}
	},
	
	getBlockFieldId: function(id){
		return 'webBlock_' + id;
	},
	
	getBlockId: function(fieldId){
		return fieldId.substr(9);
	},

	createBlock: function(){
		
		var scrollManager = new ScrollManager();
		
		new Ajax.Request(system.getLibraryPath() + this.actionFile, {
			method:'post',
			parameters:{ command: 'createBlock',pageId: this.pageId, style: system.getCurrentStyle(), scrollTop: scrollManager.currentOffset() },
			onSuccess: function(transport) {
				
				var container = $('designPageContainer');
				if (!container) container = $('pageContainer');
				
				Element.insert(container,transport.responseText);
				
				pageDesigner.updateBlockList();
				
				//pageDesigner.selectBlock();
				//system.evalAllScripts(field);
			}
		});
		
	},

	duplicateBlock: function(){
		
		var blockId = this.selectedBlock;
		
		if (isNaN(parseInt(blockId))) return; // No es un bloque, no se puede duplicar nada más
		
		new Ajax.Request(system.getLibraryPath() + this.actionFile, {
			method:'post',
			parameters:{ command: 'duplicateBlock',blockId: blockId, style: system.getCurrentStyle() },
			onSuccess: function(transport) {
				
				var container = $('designPageContainer');
				if (!container) container = $('pageContainer');
				
				Element.insert(container,transport.responseText);

				pageDesigner.updateBlockList();
				//system.evalAllScripts(field);
			}
		});
		
	},

	
	removeBlock: function(){
	
		// TODO Mirar qué bloque está seleccionado y borrarlo
		var blockId = this.selectedBlock;
		
		if (isNaN(parseInt(blockId))) return; // No es un bloque, no se puede borrar nada más

		//alert('Mover a la papelera el bloque ' + id);
		new Ajax.Request(system.getLibraryPath() + this.actionFile,{
			method:'post',
			parameters:{command:'removeBlock',blockId:blockId},
			onSuccess:function(transport){
				if( transport.responseText=='OK') {
					
					var id = 'webBlock_' + blockId;
					var block = $(id);
					if (block) block.remove();
					
					resizerManager.removeResizer(id);
					
					pageDesigner.hideProperties();
					hudWindowManager.getHUDWindow('info').setContent(pageDesigner.nothingSelectedMessage);
					pb.core.console.log('block removed. Clearing selection');
					this.selectedBlock = null;
					
					pageDesigner.updateBlockList();
				}
				else {
					alert(transport.responseText);
				}
			}
		});		
		
	},
	
	addBlock: function(id,cssId,canBeUpdated){
		this.blocks[id] = new Block(id,cssId,canBeUpdated);
		this.numBlocks++;
		
		// TODO Meter aquí la creación del resizer, del editableCSS y demás
	},
	
	getBlock: function(id){
		return this.blocks[id];
	},

	updateBlockContent: function(fieldId){		
		var blockId = this.getBlockId(fieldId);
		var block = this.blocks[blockId];
		
		if (!block || !block.canBeUpdated) return;
		
		this.performUpdateBlockContent(fieldId);
	},
	
	performUpdateBlockContent: function(fieldId){
		
		var field = $(fieldId);
		var blockId = this.getBlockId(fieldId);
		var block = this.blocks[blockId];
		
		var width = field.offsetWidth;
		var height = field.offsetHeight;

		var progressIcon = system.getLoadingIcon();
		field.innerHTML = '<div style="height: 100px;"><img style="display:table;margin-top:50px;margin-left:auto;margin-right:auto;" title="' + localizedString.get('Loading data...') + '" src="' + progressIcon + '"/></div>';
		
		new Ajax.Request(system.getLibraryPath() + this.actionFile, {
			method:'post',
			parameters:{ command: 'updateBlockContent',pageId: this.pageId, style: system.getCurrentStyle(),blockId:blockId,width:width,height:height },
			onSuccess: function(transport) {
				field.innerHTML = transport.responseText;
				system.evalAllScripts(field);
			}
		});
	},
		
	addField: function(fieldId,cssId,blockId){
		this.fields[fieldId] = new Field(fieldId,cssId,blockId);
		this.numFields++;
		
		// TODO Meter aquí la creación del resizer, del editableCSS y demás
	},
	
	removeField: function(id){
		
	},
	
	updateBlocksIcon: function(){
		var visible = hudWindowManager.getHUDWindow('blocks').isVisible();
		// if (reverse) visible = !visible;
		
		if (visible){
			designWidgets.toolbar.setState('BlocksToolbarIcon','pushed');
		}
		else {
			designWidgets.toolbar.setState('BlocksToolbarIcon','normal');
		}
	},
	
	toggleBlocks: function(){
		
		if (parseInt(hudWindowManager.getHUDWindow('blocks').getTopPos())<68) hudWindowManager.getHUDWindow('blocks').setTopPos('68px');
		
	 	hudWindowManager.getHUDWindow('blocks').toggle();
		this.updateBlocksIcon();
	},
	
	updatePropertiesIcon: function(){
		
		var visible = hudWindowManager.getHUDWindow('info').isVisible();

		if (visible){
			designWidgets.toolbar.setState('PropertiesToolbarIcon','pushed');
		}
		else {
			designWidgets.toolbar.setState('PropertiesToolbarIcon','normal');
		}		
	},
	
	togglePanels: function(){
		if (hudWindowManager.getHUDWindow('blocks').isVisible() || hudWindowManager.getHUDWindow('info').isVisible() || hudWindowManager.getHUDWindow('fav').isVisible()){
			this.hideProperties();
			this.hideElements();
			this.hideFavorites();
		}
		else {
			this.showProperties();
			this.showElements();
			this.showFavorites();			
		}
		
	},
	
	toggleElements: function(){
		if (parseInt(hudWindowManager.getHUDWindow('blocks').getTopPos())<68) hudWindowManager.getHUDWindow('blocks').setTopPos('68px');
		
		hudWindowManager.getHUDWindow('blocks').toggle();
		this.updateBlocksIcon();
	},
	
	hideElements: function(){
		hudWindowManager.getHUDWindow('blocks').hide();
		
		this.updateBlocksIcon();
	},
	
	toggleProperties: function(){

		if (parseInt(hudWindowManager.getHUDWindow('info').getTopPos())<68) hudWindowManager.getHUDWindow('info').setTopPos('68px');
		
		hudWindowManager.getHUDWindow('info').toggle();
		this.updatePropertiesIcon();
	},

	showProperties: function(){
		hudWindowManager.getHUDWindow('info').show();
				
		if (parseInt(hudWindowManager.getHUDWindow('info').getTopPos())<68) hudWindowManager.getHUDWindow('info').setTopPos('68px');
		
		this.updatePropertiesIcon();
	},

	hideProperties: function(){
		hudWindowManager.getHUDWindow('info').hide();
		
		this.updatePropertiesIcon();
	},

	toggleFavorites: function() {
		if (hudWindowManager.getHUDWindow('fav').isVisible()) {
			hudWindowManager.getHUDWindow('fav').hide();
		}
		else {
			this.showFavorites();
		}
	},

	showFavorites: function() {
		if (!hudWindowManager.getHUDWindow('fav').isVisible()) {
			var panel = hudWindowManager.getHUDWindow('fav');
			panel.setTopPos('67px');
			hudWindowManager.getHUDWindow('fav').show();	
		}
	},
	
	hideFavorites: function(){
		hudWindowManager.getHUDWindow('fav').hide();
	},
	
	loadFavorites: function(showWindow){
	
		var siteId = this.siteId;
		var favsWindow = hudWindowManager.getHUDWindow('fav');
		var url = system.getLibraryPath() + 'design/_website_designer_actions.php';
		var parameters = { command:'loadFavorites',style:system.getCurrentStyle(),siteId:siteId };
		
		if (showWindow && !favsWindow.isVisible()) favsWindow.show();
		
		favsWindow.setContentWithURL(url,parameters);
	},

	
	updateWindowIcons: function(){
		this.updateBlocksIcon();
		this.updatePropertiesIcon();
	},
	
	resetDesign: function() {
		var designIcon = $('DesignToolbarIcon');
		
		if (!pageDesigner.inDesignMode){
			return;
		}
					
		if (confirm(localizedString.get('Are you sure you want to revert to the original state? All the changes will be lost.'))){
			new Ajax.Request(system.getLibraryPath() + this.actionFile, {
				method:'post',
				parameters:{ command: 'resetPageDesign',pageId: this.pageId, style: system.getCurrentStyle() },
				onSuccess: function(transport) {
					var designIcon = $('ResetDesignToolbarIcon');
					designIcon.className == 'ToolbarIconOff';

					pageDesigner.updatePage();
					pageDesigner.undoManager.reset();
				}
			});
		}
	},
	
	toggleDesign: function() {
		//var design = 'true';
		
		new Ajax.Request(system.getLibraryPath() + this.actionFile, {
			method:'post',
			parameters:{ command: 'togglePageDesignMode',pageId: this.pageId, style: system.getCurrentStyle() },
			onSuccess: function(transport) {
				var designIcon = $('DesignToolbarIcon');
				if (pageDesigner.inDesignMode){
					
					//$('ResetDesignToolbarIcon').hide();
					
					// $('DesignOnToolbarTitle').show();
					// $('DesignOffToolbarTitle').hide();

					$('RevertToolbarIcon').hide();
					$('UndoToolbarIcon').hide();
					$('RedoToolbarIcon').hide();
					
					hudWindowManager.getHUDWindow('blocks').hide();
					hudWindowManager.getHUDWindow('info').hide();
					
					$('BlocksToolbarIcon').hide();
					$('PropertiesToolbarIcon').hide();
					$('FavoritesToolbarIcon').hide();
					// $('AddContainerToolbarIcon').hide();

					// $('DesignTitle').hide();
					// 					$('PreviewTitle').show();
					
					resizerManager.removeResizer('designPageContainer');

					//design = 'false';
				}
				else {

					//$('ResetDesignToolbarIcon').show();
					// $('DesignOnToolbarTitle').hide();
					// $('DesignOffToolbarTitle').show();


					$('RevertToolbarIcon').show();
					$('UndoToolbarIcon').show();
					$('RedoToolbarIcon').show();
					$('BlocksToolbarIcon').show();
					$('PropertiesToolbarIcon').show();
					$('FavoritesToolbarIcon').show();
					// $('AddContainerToolbarIcon').show();
					
					// $('DesignTitle').show();
					// 					$('PreviewTitle').hide();

					editableCSSManager.addEditable('designPageContainer',pageDesigner.cssId);
					editableCSSManager.editable(pageDesigner.cssId).setUndoManager(pageDesigner.undoManager);
					
					hudWindowManager.getHUDWindow('blocks').setOnStart(function(){ resizerManager.disableAllMouseOver(); });
					hudWindowManager.getHUDWindow('blocks').setOnEnd(function(){ resizerManager.enableAllMouseOver(); pageDesigner.saveWindowPosition('blocks'); });

					hudWindowManager.getHUDWindow('info').setOnStart(function(){ resizerManager.disableAllMouseOver(); });
					hudWindowManager.getHUDWindow('info').setOnEnd(function(){ resizerManager.enableAllMouseOver(); pageDesigner.saveWindowPosition('info'); });

					//design = 'true';
				}
				pageDesigner.inDesignMode = !pageDesigner.inDesignMode;
				pageDesigner.updatePage();
			}
		});
	},
	
	clearContainerStyle: function(fieldId,cssId) {
		// Comprobar que es un contenedor

		// Deseleccionar el contenedor
				
		// Llamada ajax para borrar el estilo
	},
	
	updatePage: function(){
		new Page(system.getLibraryPath() + this.actionFile,{ command: 'printPage',style: system.getCurrentStyle(),pageId: this.pageId },'pageContainer');
	},
	
	revert: function(){
		this.undoManager.revert();
		var revertIcon = $('RevertToolbarIcon');
		revertIcon.className = 'ToolbarIconDisabled';
		this.updateUndoButtons();
	}
});


var pageDesigner = new PageDesigner();