function refreshButtons(){
	if (PS.isObjSelected()){
		toggleBtn("toolbar1.delete", false);
		toggleBtn("toolbar1.link", false);
		toggleBtn("toolbar1.undo", false);
		toggleBtn("toolbar1.redo", false);
		toggleBtn("toolbar1.copy", false);
		toggleBtn("toolbar1.forward", false);
		toggleBtn("toolbar1.back", false);
	} else {
		toggleBtn("toolbar1.delete", true);
		toggleBtn("toolbar1.link", true);
		toggleBtn("toolbar1.undo", true);
		toggleBtn("toolbar1.redo", true);
		toggleBtn("toolbar1.copy", true);
		toggleBtn("toolbar1.forward", true);
		toggleBtn("toolbar1.back", true);
	}
	toggleBtn("toolbar1.paste", (crtItemCopy == null));
}

function addText(){
	var id = 'floatingPane' + count;
	createContentPanel("panel" + count , "panel", 'Double click to edit the text...', false, false, false, true, null, null, 200, 200, '150px', '150px', "text");

	createText("panel" + count);

	dojo.connect(dojo.byId("panel" + count),"onclick",fClickPanel);
	count++;

	refreshButtons();
}

function addImage(){
	var id = 'floatingPane' + count;
	createContentPanel("panel" + count , "panel", 'Double click to edit the text...', false, false, false, true, null, null, 200, 200, '150px', '150px', "image");

	dojo.connect(dojo.byId("panel" + count),"onclick",fClickPanel);

	createImage("panel" + count);

	count++;

	refreshButtons();
}

function addContent(){
	dijit.byId("contentSettings").show();
//	dojo.style(dojo.byId("contentSettings"), "display", "block");
}

function deleteItem(){
	console.debug(crtId);
	if (crtObj != null){
		dijit.byId(crtId).destroy();
		crtObj = null;
	}

	refreshButtons();
}

function changeBackground(){
	dijit.byId("backgroundSettings").show();
//	dojo.style(dojo.byId("backgroundSettings"), "display", "block");
}

function copyItem(){
	crtItemCopy = dojo.clone(crtObj);
	refreshButtons();
}

function pasteItem(){
	dojo.attr(crtItemCopy,"id", "panel" +  count);
	dojo.attr(crtItemCopy,"widgetId", "panel" +  count);
	dojo.body().appendChild(crtItemCopy);
	
	dojo.connect(crtItemCopy,"onclick",fClickPanel);
	
	count++;
	
	crtItemCopy = null;
	refreshButtons();
}

function moveForward(){
	var izIndex = parseInt(crtZOrder);
	if (izIndex < 900){
		izIndex += 100;
	} else if (izIndex < 980){
		izIndex += 10;
	} else {
		izIndex = 990;
	}
	crtZOrder = izIndex;
	dojo.style(crtObj, { zIndex : izIndex} );
}

function moveBack(){
	var izIndex = parseInt(crtZOrder);
	if (izIndex > 100){
		izIndex -= 100;
	} else if (izIndex > 10){
		izIndex -= 10;
	} else {
		izIndex = 1;
	}
	crtZOrder = izIndex;
	dojo.style(crtObj, { zIndex : izIndex} );
}

var crtItemCopy = null;
var count = 0;
var crtObj = null;
var crtResize = null;
var crtMove = null;
var crtTxtEdit = null;
var crtId = null;
var crtZOrder = null;
function clearPreviousObject(){
	if (crtObj != null){
		dojo.style(crtObj, { borderWidth :0});
//		dojo.style(crtObj, { zIndex : crtZOrder });

		if (crtResize != null){
			crtResize.destroy();
		}

		if (crtMove != null){
			crtMove.destroy();
		}
	}
}

function onOver(event){
	dojo.stopEvent(event);
	crtMove.destroy();
}
function onOverPanel(event){
	if (crtMove == null){
		crtObj = event.target;

		var id = crtObj.id;

		crtMove = createMoveablePanel(id, "move" + id, "handleMove");
	}
}

function onChangeInline(event){
	if (crtTxtEdit != null){
		crtTxtEdit.destroy(true);
		crtTxtEdit = null;
	}
	if (dojo.byId(crtId) == null){
		dojo.attr(dojo.byId(crtId + "inline"),"id", crtId );
	}
	crtResize = createResizablePanel(crtId, "resize" + crtId , "handleResize");
}

function buildId(parentId, prefix){
	return parentId + "_" + prefix;
}
function fDoubleClick(event){
	crtObj = event.target;

	var id = crtObj.id;
	if (crtTxtEdit != null){
		crtTxtEdit.destroy(true);
		crtTxtEdit = null;
	}

	if (crtResize != null){
		crtResize.destroy();
	}


	crtTxtEdit = new dijit.InlineEditBox({
		width : '200',
		height : '100',
		position : 'absolute',
		left : '50',
		top : '50',
		id: id + 'inline',
		displayNode : id,
		onChange:onChangeInline,
		onCancel:onChangeInline,
		autoSave: true,
	}, dojo.byId(id));
	crtTxtEdit.style.position = "absolute";
	crtTxtEdit.style.top = "200";crtObj.style.top;
	crtTxtEdit.style.left = crtObj.style.left;

}
function fClickPanel(event){
	dijit.byId("backgroundSettings").hide();
//	dojo.style(dojo.byId("backgroundSettings"), "display", "none");
	if (crtObj == event.target) return;
	
	clearPreviousObject();

	selectItem(event.target);
}

function selectItem(itemObj){
	crtObj = itemObj;
	var id = crtObj.id;
	
	crtZOrder = dojo.style(crtObj, "zIndex");
//	dojo.style(crtObj, { zIndex : 999} );

	if (id.indexOf("_") != -1){
		id = id.substring(0, id.indexOf("_"));
		crtObj = dojo.byId(id);
	}

	crtId = id;

	crtType = dojo.attr(dojo.byId(id),"myType");
	
	crtResize = createResizablePanel(id);

	crtMove = createMoveablePanel(id);

	dojo.attr(buildId(id, "resize"), "onmouseover", onOver);
	dojo.attr(id, "onmouseover", onOverPanel);

	console.debug(crtType);
	if (crtType == "text"){
		dojo.attr(id, "ondblclick", fDoubleClick);
//		dojo.byId("textSettings").show();
		dojo.style(dojo.byId("textSettings"), "display", "block");
	} else {
//		dijit.byId("textSettings").hide();
		dojo.style(dojo.byId("textSettings"), "display", "none");
		if (crtType == "line" || crtType == "youtube" || crtType == "calendar"){
			dijit.byId("contentGeneralSettings").show();

			showPanel(getCustomPanel());
		}
	}

	dojo.style(crtObj, "borderWidth", "1");

	refreshButtons();
}
function createText(parentId){
	dijit.byId(parentId).attr('content', "Double Click to Edit...");
}
function createImage(parentId){
//	dojo.attr(dojo.byId(parentId),"myType", "image");
	var fpId = buildId(parentId, "img");
	var fpNode = document.createElement("img");
	dojo.byId(parentId).appendChild(fpNode);
	dojo.addClass(fpNode, "imageAAA" );

	dojo.attr(fpNode,"id", fpId);
	dojo.attr(fpNode,"src", "images/image_lock.png");
}
function createMoveablePanel(parentId){
	fpId = buildId(parentId, "move");
//	var crtMove = new dojo.dnd.Moveable(parentId);
	var crtMove = new dojo.dnd.Moveable(parentId, {handle: parentId});

	return crtMove;
}
function createContentPanel( fpId, fpStyleClass,
		fpTitle, fpDockable, fpMaxable, fpClosable, fpResizable,
		fpMaximizeFunc, fpCloseFunc,
		fpWidth, fpHeight, fpTop, fpLeft, myType ){

	var fpNode = document.createElement("div");

	dojo.body().appendChild(fpNode);
	dojo.attr(fpNode,"id", fpId );

	if(fpStyleClass != null)
		dojo.addClass(fpNode, fpStyleClass );

	var tmp = new dijit.layout.ContentPane({
		titleBarDisplay : false,
		title: null ,
		dockable: fpDockable,
		maxable: fpMaxable,
		closable: fpClosable,
		resizable: fpResizable
	}, fpNode );

	tmp.startup();
	// Resize does not require px
	tmp.resize({ w: fpWidth, h: fpHeight });
	tmp.attr('titleBarDisplay', false);
	// Style top/left require px
	dojo.byId(fpId).style.position = "absolute";
	dojo.byId(fpId).style.top = fpTop;
	dojo.byId(fpId).style.left = fpLeft;
	dojo.attr(dojo.byId(fpId),"myType", myType);
}

function createResizablePanel(parentId,  fpId, fpStyleClass){
	var fpId = buildId(parentId, "resize");
	fpStyleClass = "handleResize";

	var fpNode = document.createElement("div");

	dojo.byId(parentId).appendChild(fpNode);
	dojo.attr(fpNode,"id", fpId );

	if(fpStyleClass != null)
		dojo.addClass(fpNode, fpStyleClass );

	var tmp = new dojox.layout.ResizeHandle({
		targetId : parentId
	}, fpNode );

	tmp.startup();

	return tmp;
}


function createContentPane( fpId, fpStyleClass,
		fpTitle, fpDockable, fpMaxable, fpClosable, fpResizable,
		fpMaximizeFunc, fpCloseFunc,
		fpWidth, fpHeight, fpTop, fpLeft ){

	var fpNode = document.createElement("div");

	var fpContentNode = document.createElement("div");
	dojo.attr(fpContentNode, "id", fpId + "Content");
	fpNode.appendChild(fpContentNode);

	dojo.body().appendChild(fpNode);
	dojo.attr(fpNode,"id", fpId );

	if(fpStyleClass != null)
		dojo.addClass(fpNode, fpStyleClass );

	var tmp=new dijit.layout.ContentPane({
		href:'',
		title:'Recently Updated',
		refreshOnShow:true
	}, fpNode);

	tmp.startup();

	// Style top/left require px
	dojo.byId(fpId).style.border = '10px';
	dojo.byId(fpId).style.top = fpTop;
	dojo.byId(fpId).style.left = fpLeft;
	dijit.byId(fpId).attr('content', fpTitle);

	// Resize does not require px
	tmp.resize({ w: fpWidth, h: fpHeight });

	var m2 = new dojo.dnd.Moveable(fpId);

	var fpNode1 = document.createElement("div");

	var fpContentNode1 = document.createElement("div");
	dojo.attr(fpContentNode1, "id", fpId + "Resize");
	fpNode1.appendChild(fpContentNode1);

	dojo.body().appendChild(fpNode1);
	dojo.attr(fpNode1,"id", fpId + "a" );

	if(fpStyleClass != null)
		dojo.addClass(fpNode, fpStyleClass );

	var tmp1=new dojox.layout.ResizeHandle({
		targetId:fpId,
	}, fpNode1);

	tmp1.startup();
}

function createFloatingPane( fpId, fpStyleClass,
		fpTitle, fpDockable, fpMaxable, fpClosable, fpResizable,
		fpMaximizeFunc, fpCloseFunc,
		fpWidth, fpHeight, fpTop, fpLeft ){

	var fpNode = document.createElement("div");

	var fpContentNode = document.createElement("div");
	dojo.attr(fpContentNode, "id", fpId + "Content");
	fpNode.appendChild(fpContentNode);

	dojo.body().appendChild(fpNode);
	dojo.attr(fpNode,"id", fpId );

	if(fpStyleClass != null)
		dojo.addClass(fpNode, fpStyleClass );

	var tmp = new dojox.layout.FloatingPane({
		titleBarDisplay : false,
		title: null ,
		dockable: fpDockable,
		maxable: fpMaxable,
		closable: fpClosable,
		resizable: fpResizable
	}, fpNode );

	if(fpMaximizeFunc != null)
		tmp.connect(tmp,"maximize",fpMaximizeFunc);
	if(fpCloseFunc != null)
		tmp.connect(tmp,"close",fpCloseFunc);

	tmp.startup();
	// Resize does not require px
	tmp.resize({ w: fpWidth, h: fpHeight });
	tmp.attr('titleBarDisplay', false);
	// Style top/left require px
	dojo.byId(fpId).style.top = fpTop;
	dojo.byId(fpId).style.left = fpLeft;

	dijit.byId(fpId).attr('content', fpTitle);
	dijit.byId(fpId).attr('titleBarDisplay', false);
}

function fTextFont(el){
	var font = el.value;
	dojo.style(dojo.byId(crtObj.id), "fontFamily", font);
}

function fTextSize(el){
	var size = el.value;
	dojo.style(dojo.byId(crtObj.id), "fontSize", size + "ex");
}

function fncColorChange(color){
	dojo.style(dojo.byId(crtObj.id), "color", color);
}

function fTextColor(color){
	var theSpan = dojo.byId("outputSpan");
	theSpan.style.color = color;
	theSpan.innerHTML = color;
	
	fncColorChange(color);
}
function fTextBold(){
	dojo.style(dojo.byId(crtObj.id), "fontWeight", "bold");
}
function fTextItalic(){
	dojo.style(dojo.byId(crtObj.id), "fontStyle", "italic");
}
function fTextUnderline(){
	dojo.style(dojo.byId(crtObj.id), "textDecoration", "underline");
}
function fTextStrike(){
	dojo.style(dojo.byId(crtObj.id), "textDecoration", "line-through");
}
function fTextAlignLeft(){
	dojo.style(dojo.byId(crtObj.id), "textAlign", "left");
	
	dijit.byId("toolbarText.alignCenter").setChecked(false);
	dijit.byId("toolbarText.alignRight").setChecked(false);
}
function fTextAlignCenter(){
	dojo.style(dojo.byId(crtObj.id), "textAlign", "center");
	
	dijit.byId("toolbarText.alignLeft").setChecked(false);
	dijit.byId("toolbarText.alignRight").setChecked(false);
}
function fTextAlignRight(){
	dojo.style(dojo.byId(crtObj.id), "textAlign", "right");
	
	dijit.byId("toolbarText.alignCenter").setChecked(false);
	dijit.byId("toolbarText.alignLeft").setChecked(false);
}

function fBackgroundDone(el){
	dijit.byId("backgroundSettings").hide();
//	dojo.style(dojo.body(), "backgroundImage", "url(" + el.src + ")");
}
function fBackgroundChangeImg(el){
	dojo.style(dojo.body(), "backgroundImage", "url(" + el.src + ")");
}
function fBackgroundChangeColor(color){
	dojo.style(dojo.body(), "backgroundImage", "none");
	dojo.style(dojo.body(), "backgroundColor", color);
}

/*
 * Create an element of a certain type using document.createElement().
 */
function createTheElement(type, parent){
	var el = null; 
	el = document.createElement(type);
	if (typeof parent != "undefined")
		parent.appendChild(el); 
	return el; 
}

var PS = {
		objSel : false,
		isObjSelected:function(){
	return crtObj != null;
}
}