/*
 *
 * mini ajax lib, thanks to openjs.com
 *
 */
//V3.01.A - http://www.openjs.com/scripts/jx/
jx={getHTTPObject:function(){var A=false;if(typeof ActiveXObject!="undefined"){try{A=new ActiveXObject("Msxml2.XMLHTTP")}catch(C){try{A=new ActiveXObject("Microsoft.XMLHTTP")}catch(B){A=false}}}else{if(window.XMLHttpRequest){try{A=new XMLHttpRequest()}catch(C){A=false}}}return A},load:function(url,callback,format,method,opt){var http=this.init();if(!http||!url){return }if(http.overrideMimeType){http.overrideMimeType("text/xml")}if(!method){method="GET"}if(!format){format="text"}if(!opt){opt={}}format=format.toLowerCase();method=method.toUpperCase();var now="uid="+new Date().getTime();url+=(url.indexOf("?")+1)?"&":"?";url+=now;var parameters=null;if(method=="POST"){var parts=url.split("?");url=parts[0];parameters=parts[1]}http.open(method,url,true);if(method=="POST"){http.setRequestHeader("Content-type","application/x-www-form-urlencoded");http.setRequestHeader("Content-length",parameters.length);http.setRequestHeader("Connection","close")}var ths=this;if(opt.handler){http.onreadystatechange=function(){opt.handler(http)}}else{http.onreadystatechange=function(){if(http.readyState==4){if(http.status==200){var result="";if(http.responseText){result=http.responseText}if(format.charAt(0)=="j"){result=result.replace(/[\n\r]/g,"");result=eval("("+result+")")}else{if(format.charAt(0)=="x"){result=http.responseXML}}if(callback){callback(result)}}else{if(opt.loadingIndicator){document.getElementsByTagName("body")[0].removeChild(opt.loadingIndicator)}if(opt.loading){document.getElementById(opt.loading).style.display="none"}if(error){error(http.status)}}}}}http.send(parameters)},bind:function(A){var C={"url":"","onSuccess":false,"onError":false,"format":"text","method":"GET","update":"","loading":"","loadingIndicator":""};for(var B in C){if(A[B]){C[B]=A[B]}}if(!C.url){return }var D=false;if(C.loadingIndicator){D=document.createElement("div");D.setAttribute("style","position:absolute;top:0px;left:0px;");D.setAttribute("class","loading-indicator");D.innerHTML=C.loadingIndicator;document.getElementsByTagName("body")[0].appendChild(D);this.opt.loadingIndicator=D}if(C.loading){document.getElementById(C.loading).style.display="block"}this.load(C.url,function(E){if(C.onSuccess){C.onSuccess(E)}if(C.update){document.getElementById(C.update).innerHTML=E}if(D){document.getElementsByTagName("body")[0].removeChild(D)}if(C.loading){document.getElementById(C.loading).style.display="none"}},C.format,C.method,C)},init:function(){return this.getHTTPObject()}}

var footerSwf = 'footer2_' + swfVersion + '.swf';
var mainSwf = 'main_' + swfVersion + '.swf';

//var footerSwf = 'footer2.swf';
//var mainSwf = 'main.swf';

function onLoad(){
	/*
	 *
	 * init the tinyMCE configuration
	 *
	 */
	tinyMCE.init(
	{
		mode : "none",
		theme : "advanced",   //(n.b. no trailing comma, this will be critical as you experiment later)
		theme_advanced_buttons1 : "bold,italic,link,unlink",
		theme_advanced_buttons2 : "",
		theme_advanced_buttons3 : "",
		valid_elements : "b/strong,i/em,a[href|target],br",
		entity_encoding : "raw",
		force_p_newlines : false,
		force_br_newlines : true,
		convert_newlines_to_brs : false,
		remove_linebreaks : true,
		setup : function(ed) {
			ed.onKeyDown.add(function(ed, e) {
				dirtyFields();
			});
		}
	}
	);
	/*
	 *
	 * set styles and embed
	 *
	 */
	YUI().use('node', 'dd-constrain', 'dd-proxy', 'dd-drop', 'dd-scroll', function(Y) {
		
		var siteCont = Y.one('#siteContainer');
		siteCont.setStyle('overflow','auto');
		
		var footerCont = Y.one('#footerDiv');
		footerCont.setStyle('position','fixed');
		footerCont.setStyle('bottom','0');
		footerCont.setStyle('width','100%');
		footerCont.setStyle('height','80px');
		
		var swfVersionStr = "10.0.0";
		var xiSwfUrlStr = "";
		
		var flashvars = {base_url:base_url};
		var wmode = (Y.UA.gecko)?'window':'transparent'; 
		var params = {allowScriptAccess:"sameDomain", quality:"high", scale:"noscale", salign:"tl", wmode:wmode};
		var attributes = {id:"AppSkeleton",name:"AppSkeleton"};
		swfobject.embedSWF(mainSwf, "AppSkeleton", "100%", "100%", swfVersionStr, xiSwfUrlStr, flashvars, params, attributes);
		swfobject.createCSS("#AppSkeleton", "display:block;");
		
		flashvars = {connectToTwitter:(window.location.href.substring(0,17)=='http://localhost/'?"false":"true"), base_url:base_url};
		params = {quality:"high", scale:"noscale", salign:"tl"};
		attributes = {id:"footerContent",name:"footerContent"};
		swfobject.embedSWF(footerSwf, "footerContent","100%", "80", swfVersionStr, xiSwfUrlStr, flashvars, params, attributes);
		
		Y.on('windowresize', resizeFlashSite);
		
		// logged in?
		checkSession();
	});
}

function setNewHeight(newHeight){
	document.getElementById("flashDiv").style.height = newHeight+"px";
}

function resizeFlashSite(e){
	//alert('resfs');
	YUI().use('node', 'dd-constrain', 'dd-proxy', 'dd-drop', 'dd-scroll', function(Y) {
		var footCont = Y.one('#footerDiv');
		if(flashMovie("AppSkeleton").setMinHeightForSite){
			//alert('ifyes');
			flashMovie("AppSkeleton").setMinHeightForSite(footCont.get('winHeight') - footCont.get('clientHeight'));
			
		}
	});
}


function checkSession(){
	jx.load('getsess',setSession,'json','post');
}

var flashInitiated = false;
var getCMSDataWhenInitiated = false;

function flashReady(){
	flashInitiated = true;
	//alert('flashReady');
	if(getCMSDataWhenInitiated){
		getCMSData();
	}
}

function setSession(value){
	if ("status" in value && "vars" in value) {
		if(value.status == "success"){
			if("username" in value.vars){
				//alert(value.vars.username);
				if(value.vars.username != "null"){
					initCMS(value.vars.username);
				}
			}
		}
	}
}

function getCMSData(){
	var flashmov = flashMovie("AppSkeleton");
	if(flashmov == null){
		//alert('ERROR: no flash movie object could be found');
	}else{
		flashmov.getCMSData();
	}		
}



/*
 *
 * show the login display
 *
 */
function displayLogin(){
	YUI().use('node', 'dd-constrain', 'dd-proxy', 'dd-drop', 'dd-scroll', function(Y) {
		var loginHTMLFORM = "<div>Welkom! Door in te loggen kan je de CMS-weergave te starten.<br>- meerdere gebruikers tegelijk zijn met dit eenvoudige systeem niet mogelijk<br><form name='loginForm' onsubmit='encryptPassword()'><table><tr><td colspan='2'>naam: </td><td colspan='2'><input type=text size=20 name=username le></td></tr><tr><td colspan='2'>wachtwoord: </td><td colspan='2'><input type=password size=20 name=password></td></tr><tr><td colspan='2'><input type='button' name='loginButton' value='Inloggen' onclick='encryptPassword();' /></td></tr></form></div>";
		var logindiv;
		var cmsdiv;
		cmsdiv = Y.one('#cmsDisplay');
		cmsdiv.setStyle('backgroundColor', '#666666');
		cmsdiv.setStyle('border', '1px solid black');
		cmsdiv.setStyle('height', 'auto');
		cmsdiv.setStyle('margin','3px');
		cmsdiv.setStyle('padding','0');
		cmsdiv.setStyle('zoom','1');
		cmsdiv.setStyle('position','relative');
		if(!document.getElementById("loginDisplay")){
			logindiv = cmsdiv.appendChild("<div id='loginDisplay'></div>");
			spacerdiv = cmsdiv.appendChild("<div class='spacer'></div>");
			spacerdiv.setStyle('clear','both');
		}else{
			logindiv = Y.one('#loginDisplay');
		}
		logindiv.set('innerHTML',loginHTMLFORM);
		logindiv.setStyle('margin','3px');
		logindiv.setStyle('zoom','1');
		logindiv.setStyle('float','left');
		logindiv.setStyle('padding','0');
		logindiv.setStyle('position','relative');
	});
}


	


/*
 * get challenge
 */
function encryptPassword(){
	jx.load('getchall',encryptLogin,'text','post');
}
/*
 * encrypt response
 */
function encryptLogin(challenge){
	var shaObj = new jsSHA(challenge+document.loginForm.password.value, "ASCII");
	jx.load('shakehand?username=' + document.loginForm.username.value + '&handshake=' + shaObj.getHash("SHA-256", "HEX"),loginResult,'json','post');
}
/*
 * result switch
 */
function loginResult(result){
    if ("status" in result && "vars" in result) {
		if(result.status == "failed"){
			if(result.vars == "user does not exist"){
				alert("login mislukt. deze gebruiker bestaat niet. probeer het opnieuw.");
			}else if(result.vars == "wrong password"){
				alert("dit was niet het goede wachtwoord. probeer het opnieuw.");
			}else if(result.vars == "otherUser"){
				alert("een ander persoon is al ingelogd. probeer degene te vinden. bij vergissingen: sessies verlopen na vijf minuten, probeer dan opnieuw.");
			}else{
				alert("error - neem contact op met de beheerder. De error is: '" + result.vars + "'.");
			}
		}else{
			if(result.status == "otherSession" || result.status == "success"){
				initCMS(result.vars);
			}
		}
	}else{
		alert("error - neem contact op met de beheerder. De error is: 'invalid login result'.");	
	}
}

/*
 *
 * init the CMS (display message about status)
 *
 */

 
function initCMS(username){
	YUI().use('node', 'dd-constrain', 'dd-proxy', 'dd-drop', 'dd-scroll', function(Y) {
		var sessionHTMLFORM = "<table border='1' cellspacing='12'><tr><td id='username'>login: " + username + "</td><td colspan='2'><input type='button' name='previewButton' id='previewButton' value='Preview' onclick='saveToPreview();' /></td><td colspan='2'><input type='button' name='saveButton' value='Opslaan' disabled='disabled' onclick='saveData();' /></td><td colspan='2'><input type='button' name='logoutButton' id='logoutButton' value='Uitloggen' onclick='logout();' /></td></tr></table>";
		var bcolor = '#9dbadd';
		var logindiv;
		var cmsdiv;
		cmsdiv = Y.one('#cmsDisplay');
		cmsdiv.set('innerHTML','');
		cmsdiv.setStyle('backgroundColor', bcolor);
		cmsdiv.setStyle('border', '1px solid black');
		cmsdiv.setStyle('height', 'auto');
		cmsdiv.setStyle('margin','3px');
		cmsdiv.setStyle('padding','0');
		cmsdiv.setStyle('zoom','1');
		cmsdiv.setStyle('position','relative');
		if(!document.getElementById("loginDisplay")){
			logindiv = cmsdiv.appendChild("<div id='loginDisplay'></div>");
			var spacerdiv = cmsdiv.appendChild("<div class='spacer'></div>");
			spacerdiv.setStyle('clear','both');
		}else{
			logindiv = Y.one('#loginDisplay');
		}
		logindiv.set('innerHTML',sessionHTMLFORM);
		logindiv.setStyle('margin','3px');
		logindiv.setStyle('zoom','1');
		logindiv.setStyle('float','left');
		logindiv.setStyle('padding','0');
		logindiv.setStyle('position','relative');
		if(flashInitiated){
			getCMSData();
		}else{
			getCMSDataWhenInitiated = true;
		}
	});
}





/*
 *
 * cms items port
 *
 */
var fieldNameToRegExp = {};


// for dragdrop functionality
var lastY;
var goingUp;
var backgroundColorForEnglish = 'lightsteelblue';
function returnCMSData(item){
	deactivatePreview();
	YUI().use('node', 'dd-constrain', 'dd-proxy', 'dd-drop', 'dd-scroll', function(Y) {
		var cmsdiv = Y.one('#cmsDisplay');
		var navdiv = Y.one("#navigationDisplay");
		if(navdiv == null){
			var logindiv = Y.one('#loginDisplay');
			logindiv.insert('<div id="navigationDisplay"></div>', 'after');
			navdiv = Y.one('#navigationDisplay');
		}
		var ht = "<table id='params'>";
		var cd = item;
		var pr = cd.protected;
		ht = ht + "<tr><td><span style='color:#444444'>";
		var f = true;
		for(z in pr){
			if(!f){
				ht = ht + ", ";
			}
			f = false;
			ht = ht + z + ":" + pr[z];
		}
		ht = ht + ", up: <a href='#page=" + cd.parent.url + "'>" + cd.parent.title + "</a><span></td></tr>";
		ht = ht + "<tr><td>down: ";
		f = true;
		var lk = cd.children;
		for(var i in lk){
			if(!f){
				ht = ht + ", ";
			}
			f = false;
			ht = ht + "<a href='#page=" + lk[i]['url'] + "'>" + lk[i]['title'] + "</a>";
		}
		ht = ht + "</td></tr></table>";
		//navdiv.set('innerHTML',ht);
		
		ht = "<table id='fields'>";
		fieldNameToRegExp = {};
		var fd = cd.fields;
		var fc = 0;
		var fieldIDsForEditor = [];
		for(z in fd){
			var fieldName = fd[z].fieldName;
			var fieldContent = fd[z].fieldContent;
			var abstractFieldType = fd[z].abstractFieldType;
			var regularExpression = fd[z].regularExpression;
			var concreteFieldType = fd[z].concreteFieldType;
			var domId = 'field_' + fc;
			switch(abstractFieldType)
			{
				case "strings":
				  ht = ht + "<tr><td><span>"+ fieldName + " </span>"+((fd[z].lang) ? "<span>lang="+fd[z].lang+"</span>" : "")+"</td></tr><tr><td><textarea rows='5' cols='50' class='"+concreteFieldType+"' onkeydown='dirtyFields();' name='" + fieldName + "' id='" + domId + "'"+((fd[z].lang) ? "style='background-color: "+backgroundColorForEnglish+"' lang='"+fd[z].lang+"'" : "")+">" + fieldContent + "</textarea></td></tr>";
				  fieldIDsForEditor.push(domId);
				  break;
				case "visuals":
				  ht = ht + "<tr><td><span>"+ fieldName + "</span></td></tr><tr><td><textarea rows='1' cols='50' class='"+concreteFieldType+"' onkeydown='dirtyFields();' name='" + fieldName + "' id='" + domId + "'>" + fieldContent + "</textarea><div id='iframe_container_" + domId + "'><iframe src='pmupload/index/" + domId + "/" + concreteFieldType + "' frameborder='0' style='height:75px;' id='iframe_" + domId + "'></iframe></div><div id='images_container_" + domId + "'></div></td></tr>";
				  /*
				  "<head><script language='javascript'>window.parent.setUploadedImage('" . $this->imageUrl . "', '" . $_POST['div_id'] . "', '" . $this->formIndex . "'); window.parent.dirtyFields();</script></head>"
				  */
				  
				  break;
			}
			fc++;
		}
		ht = ht + "</table>";
		
		
		// watch out - remove editors before removing attached textareas
		while (tinymce.editors.length > 0) {
		  tinyMCE.execCommand('mceRemoveControl',false, tinymce.editors[0].id); 
		};
		
		var flddiv = Y.one("#fieldsDisplay");
		if(flddiv == null){
			flddiv = cmsdiv.appendChild("<div id='fieldsDisplay'></div>");
		}
		flddiv.set('innerHTML',ht);
		
		// now create new editors for fields
		for(fid in fieldIDsForEditor){
			tinyMCE.execCommand("mceAddControl", true, fieldIDsForEditor[fid]);
		}
		
		// and add images to the images_containers
		var fc = 0;
		for(z in fd){
			var fieldName = fd[z].fieldName;
			var fieldContent = fd[z].fieldContent;
			var abstractFieldType = fd[z].abstractFieldType;
			var regularExpression = fd[z].regularExpression;
			var concreteFieldType = fd[z].concreteFieldType;
			var domId = 'field_' + fc;
			
			
			
			
			
			//alert('iterating ' + abstractFieldType + ' field with args fieldContent ' + fieldContent + ', concreteFieldType ' + concreteFieldType + ', domId ' + domId);
			if(abstractFieldType == 'visuals'){
				setUploadedImage(fieldContent, domId)
			}
			
			
			
			
			fc++;
		}
		
		var rfrndiv = Y.one("#referencesDisplay");
		if(rfrndiv == null){
			rfrndiv = cmsdiv.appendChild("<div id='referencesDisplay'></div>");
			rfrndiv.setStyle('border','1px solid black');
			rfrndiv.setStyle('margin','10px');
			rfrndiv.setStyle('zoom','1');
		}
		rfrndiv.set('innerHTML','');
		if(!(typeof cd.lists == 'undefined')){
			var referencedClassNames = [];
			if(cd.lists.length>0){
				rfrndiv.appendChild("<div><h3>werking van de lijsten</h3><b>Volgorde aanpassen:</b> versleep een item binnen de <i>linkerlijst</i>.<br/><br/><b>Items toevoegen:</b> sleep een item van de <i>rechterlijst</i> (database) naar de <i>linkerlijst</i>.<br/><br/><b>Item verwijderen van pagina:</b> sleep gewenst item uit <i>linkerlijst</i> naar 'del' vierkant.<br/><br/><b>Item aanpassen:</b> eerst item uit <i>rechterlijst</i> of <i>linkerlijst</i> op 'edit' vierkant slepen, dan wijzigen.<br/><br/><b>Nieuw item maken:</b> sleep een item uit <i>linker- of rechterlijst</i> op 'new'; leeg item verschijnt onderaan <i>rechterlijst</i> (database).<br/><br/></div>");
			}
			for (index in cd.lists)
			{
				var list = cd.lists[index];
				for (objectType in list)
				{
					var refsnodeId = "objectrefs_"+objectType;
					var refsnode = rfrndiv.appendChild("<div class='objectrefs' id='"+refsnodeId+"'></div>");
					refsnode.setStyle('border','1px solid black');
					refsnode.setStyle('margin','10px');
					refsnode.setStyle('float','left');
					refsnode.setStyle('padding','0');
					refsnode.setStyle('zoom','1');
					refsnode.setStyle('position','relative');
					var typeheader = refsnode.appendChild("<h4>"+objectType+"</h4>");
					typeheader.setStyle('clear','both');
					referencedClassNames.push(objectType);
					var referencingul = refsnode.appendChild("<ul id='"+objectType+"_Refs' class='draglist referencing' style='list-style: none;'></ul>");
					referencingul.setStyle('border','1px solid black');
					referencingul.setStyle('margin','10px');
					referencingul.setStyle('float','left');
					referencingul.setStyle('padding','0');
					referencingul.setStyle('zoom','1');
					referencingul.setStyle('position','relative');
					referencingul.setStyle('width','150px');
					referencingul.setStyle('minHeight','200px');
					var drop = new Y.DD.Drop({
							node: referencingul
					});	
					for(listitemindex in list[objectType])
					{
						var listitem = list[objectType][listitemindex];
						var referencingLi = referencingul.appendChild("<li class='objectref' id='"+listitem.key+"' style='background: #f7f7f7; border: 1px solid gray; margin:0; padding:0;'>"+listitem.name+"</li>");
						createConstrainedDD(referencingLi, refsnodeId,Y);
					}
					var btnsdiv = refsnode.appendChild("<div></div>");
					btnsdiv.setStyle('margin','10px');
					btnsdiv.setStyle('float','left');
					btnsdiv.setStyle('padding','0');
					btnsdiv.setStyle('zoom','1');
					btnsdiv.setStyle('position','relative');
					
					var boxstyle = {
						'border': '2px solid powderblue',
						'color': 'black',
						'text-align': 'center',
						'position': 'relative',
						'margin': '4px',
						'width': '60px',
						'height': '60px'
					};
					
					var verwijderen = btnsdiv.appendChild("<div class='dropbutton deletebutton'>del</div>");
					verwijderen.setStyles(boxstyle);
					var wijzigen = btnsdiv.appendChild("<div class='dropbutton editbutton'>edit</div>");
					wijzigen.setStyles(boxstyle);
					var nieuw = btnsdiv.appendChild("<div class='dropbutton newbutton'>new</div>");
					nieuw.setStyles(boxstyle);
					
					var btns = btnsdiv.all('.dropbutton');
					
					Y.each(btns, function(v, k) {
						var drop = new Y.DD.Drop({
							node: v
						});
					});
					
					
					for(srcindex in cd.dbSources){
						var dbsource = cd.dbSources[srcindex];
						for(srcname in dbsource){
							if(srcname == objectType){
								var referencedul = refsnode.appendChild("<ul id='"+objectType+"_Refd' class='draglist referenced' style='list-style: none;'></ul>");
								referencedul.setStyle('border','1px solid black');
								referencedul.setStyle('margin','10px');
								referencedul.setStyle('float','left');
								referencedul.setStyle('padding','0');
								referencedul.setStyle('zoom','1');
								referencedul.setStyle('position','relative');
								var dbitemsarr = dbsource[srcname];
								for(dbitemsarrkey in dbitemsarr){
									var dbitem = dbitemsarr[dbitemsarrkey];
									var referencedLi = referencedul.appendChild("<li class='dbitem' id='"+dbitem.key+"' style='background: #f7f7f7; border: 1px solid gray; margin:0; padding:0;'>"+dbitem.name+"</li>");
									createConstrainedDD(referencedLi, refsnodeId,Y);
								}
							}
						}
					}
					Y.DD.DDM.on('drag:start', function(e) {
						var drag = e.target;
						if(drag.get('node').hasClass('dbitem')){
							var draggedfrom = drag.get('node');
							var dragreplace = Y.Node.create("<li class='objectref' id='"+draggedfrom.getAttribute('id')+"' style='background: #f7f7f7; border: 1px solid gray; margin:0; padding:0;'>"+draggedfrom.get('innerHTML')+"</li>");
							dragreplace.addClass('dbextract');
							dragreplace.setStyle('borderColor','yellow');
							var constraintID = drag.get('node').get('parentNode').get('parentNode').get('id');
							createConstrainedDD(dragreplace,constraintID,Y);
							drag.set('node', dragreplace);
							drag.get('node').setStyle('opacity', '.25');
							var dbreplace = Y.Node.create("<li class='dbitem' id='"+draggedfrom.getAttribute('id')+"' style='background: #f7f7f7; border: 1px solid gray; margin:0; padding:0;'>"+draggedfrom.get('innerHTML')+"</li>");
							draggedfrom.replace(dbreplace);
							createConstrainedDD(dbreplace,constraintID,Y);
						}else{
							drag.get('node').setStyle('opacity', '.25');
						}
						drag.get('dragNode').set('innerHTML', drag.get('node').get('innerHTML'));
						drag.get('dragNode').setStyles({
							opacity: '.5',
							borderColor: drag.get('node').getStyle('borderColor'),
							backgroundColor: drag.get('node').getStyle('backgroundColor')
						});
					});
					Y.DD.DDM.on('drag:end', function(e) {
						var drag = e.target;
						if(drag.get('node').hasClass('dbextract')){
							drag.get('node').removeClass('dbextract');
						}
						drag.get('node').setStyles({
							visibility: '',
							opacity: '1',
							borderColor: 'gray'
						});
					});
					Y.DD.DDM.on('drag:drag', function(e) {
						var y = e.target.lastXY[1];
						if (y < lastY) {
							goingUp = true;
						} else {
							goingUp = false;
						}
						lastY = y;
					});
					Y.DD.DDM.on('drop:over', function(e) {
						var drag = e.drag.get('node'),
							drop = e.drop.get('node');
						if (drop.get('tagName').toLowerCase() === 'li') {
							if (!goingUp) {
								if(!(drop.get('nextSibling') == null)){
									drop = drop.get('nextSibling');
								}else{
									drop.get('parentNode').append(drag);
									e.drop.sizeShim();
									drop = null;
								}
							}
							if(drop != null){
								if(drop.hasClass('objectref')){
									drop.get('parentNode').insertBefore(drag, drop);
									e.drop.sizeShim();
								}
							}
						}else if(drop.hasClass('dropbutton')){
							if(drop.hasClass('deletebutton')){
								if(!(drag.hasClass('dbextract'))){
									drop.setStyle('borderColor','green');
								}
							}else{
								drop.setStyle('borderColor','green');
							}
						}
					});
					Y.DD.DDM.on('drag:drophit', function(e) {
						var drop = e.drop.get('node'),
							drag = e.drag.get('node');
						if (drop.get('tagName').toLowerCase() !== 'li') {
							if(drop.hasClass('dropbutton')){
								drop.setStyle('borderColor','powderblue');
								if(drop.hasClass('editbutton')){
									var args = {};
									args.name = drag.get('innerHTML');
									args.type = drop.get('parentNode').get('parentNode').getElementsByTagName('h4').item(0).get('innerHTML');
									args.id = drag.get('id');
									if(!dirty){
										flashMovie("AppSkeleton").getEditFieldsForDbItemIdAndNameAndType(args);
									}else{
										alert("er zijn niet-weggeschreven wijzigingen. gaarne eerst op 'preview' of op 'ongedaan maken' klikken");
									}
								}else if(drop.hasClass('deletebutton')){
									dirtyFields();
									var delNode = drag;
									if((delNode.hasClass('objectref'))&&(!(delNode.hasClass('dbextract')))){
										var delNodeParent = delNode.get('parentNode');
										if(!(delNodeParent == null)){
											var parentIdSplitArray = delNodeParent.get('id').split("_");
											if(parentIdSplitArray.length == 2){
												var delType = parentIdSplitArray[0];
												delNodeParent.removeChild(delNode);
											}
										}
									}
								}else if(drop.hasClass('newbutton')){
									//dirtyFields();
									var typeName = drop.get('parentNode').get('parentNode').getElementsByTagName('h4').item(0).get('innerHTML');
									var refdId = typeName + "_Refd";
									var refdnode = Y.one('#'+refdId);
									var highestId = 0;
									var refdnodechildren = refdnode.get('children');
									refdnodechildren.each(function(v, k) {
										var idAsInt = parseInt(v.getAttribute('id'));
										if(idAsInt>highestId){
											highestId = idAsInt;
										}
									});
									highestId = highestId + 1;
									var rnclen = refdnodechildren._nodes.length;
									var lastnode = refdnodechildren.item(rnclen-1);
									var highestidstring = highestId+'';
									var newLi = refdnode.appendChild("<li class='dbitem' id='"+highestidstring+"' style='background: #f7f7f7; border: 1px solid gray; margin:0; padding:0;'>new "+typeName+"</li>");
									createConstrainedDD(newLi, refdnode.get('parentNode').get('id'),Y);
								}
							}
							else if (!drop.contains(drag)) {
								drop.appendChild(drag);
								dirtyFields();
							}else{
								dirtyFields();
							}
						}
						if(drag.hasClass('dbextract')){
							drag.removeClass('dbextract');
						}
					});
					Y.DD.DDM.on('drag:exit', function(e) {
						var drop = e.drop.get('node');
						if(drop.hasClass('dropbutton')){
							drop.setStyle('borderColor','powderblue');
						}
					});
					var spacerdiv = refsnode.appendChild("<div class='spacer'></div>");
					spacerdiv.setStyle('clear','both');
				}
				var spacerdiv = rfrndiv.appendChild("<div class='spacer'></div>");
				spacerdiv.setStyle('clear','both');
			}
		}
		//deactivateSave();
	});
}

function createConstrainedDD(node,constraintID,Y){
	node.setStyle('cursor','move');
	var dd = new Y.DD.Drag({
		node: node,
		target: {
			padding: '0 0 0 20'
		}
	}).plug(Y.Plugin.DDProxy, {
		moveOnEnd: false
	}).plug(Y.Plugin.DDConstrained, {
		constrain2node: "#"+constraintID
	});
}
var editorIdsInDataEdit = [];
function returnDbItem(args){
	//alert(JSON.stringify(args));
	YUI().use('node', 'dd-constrain', 'dd-proxy', 'dd-drop', 'dd-scroll', function(Y) {
		var refsnode = Y.Node.one('#objectrefs_'+args.typeName);
		var fieldsnode = refsnode.one('#'+args.typeName+'_fieldsbox');
		if(fieldsnode == null){
			// append after db items
			var refdnode = refsnode.one('#'+args.typeName+'_Refd');
			fieldsnode = Y.Node.create("<div id='"+args.typeName+"_fieldsbox'></div>");
			refdnode.insert(fieldsnode,'after');
			fieldsnode.setStyle('border','1px solid black');
			fieldsnode.setStyle('margin','10px');
			fieldsnode.setStyle('float','left');
			fieldsnode.setStyle('padding','0');
			fieldsnode.setStyle('zoom','1');
			fieldsnode.setStyle('position','relative');
		}
		
		var ht = "<h5 style='width: 400px;'>Let op: De 'itemName' zie je niet in de uiteindelijke site maar is voor drag en drop gebruik alhier.</h5>";
		ht = ht + "<input type='hidden' id='db_item_key' name='db_item_key' value='"+args.id+"'/>";
		ht = ht + "<table id='fields'>";
		var fd = args.fields;
		var fc = 0;
		
		var domId = args.typeName + '_field_' + fc;
		var fieldName = 'itemName';
		var fieldContent = args.displayName;
		ht = ht + "<tr><td><span>"+ fieldName + "</span></td></tr><tr><td><textarea rows='1' cols='50' onkeydown='dirtyFields();' name='" + fieldName + "' id='" + domId + "'>" + fieldContent + "</textarea></td></tr>";
		
		fc++;
		
		
		// watch out - remove editors before removing / replacing attached textareas
		while (editorIdsInDataEdit.length > 0) {
		  tinyMCE.execCommand('mceRemoveControl',false, editorIdsInDataEdit.shift());
		};
		
		
		
		editorIdsInDataEdit = [];
		for(z in fd){
			fieldName = fd[z].fieldName;
			fieldContent = fd[z].fieldContent;
			var abstractFieldType = fd[z].abstractFieldType;
			var concreteFieldType = fd[z].concreteFieldType;
			domId = args.typeName + '_field_' + fc;
			
			switch(abstractFieldType)
			{
				case "strings":
				  ht = ht + "<tr><td><span>"+ fieldName + " </span>"+((fd[z].lang) ? "<span>lang="+fd[z].lang+"</span>" : "")+"</td></tr><tr><td><textarea rows='5' cols='50' class='"+concreteFieldType+"' onkeydown='dirtyFields();' name='" + fieldName + "' id='" + domId + "'"+((fd[z].lang) ? "style='background-color: "+backgroundColorForEnglish+"' lang='"+fd[z].lang+"'" : "")+">" + fieldContent + "</textarea></td></tr>";
				  editorIdsInDataEdit.push(domId);
				  break;
				case "visuals":
					ht = ht + "<tr><td><span>"+ fieldName + "</span></td></tr><tr><td><textarea rows='1' cols='50' class='"+concreteFieldType+"' onkeydown='dirtyFields();' name='" + fieldName + "' id='" + domId + "'>" + fieldContent + "</textarea><div id='iframe_container_" + domId + "'><iframe src='pmupload/index/" + domId + "/" + concreteFieldType + "' frameborder='0' style='height:75px;' id='iframe_" + domId + "'></iframe></div><div id='images_container_" + domId + "'></div></td></tr>";
				  break;
			}
			fc++;
		}

		
		ht = ht + "</table>";
		fieldsnode.set('innerHTML',ht);
		
		
		// set images for visuals
		
		//alert('watiset: ' + JSON.stringify(fd));
		
		fc = 1;
		for(z in fd){
			var fieldContent = fd[z].fieldContent;
			var abstractFieldType = fd[z].abstractFieldType;
			var concreteFieldType = fd[z].concreteFieldType;
			var domId = args.typeName + '_field_' + fc;
			//alert('iterating ' + abstractFieldType + ' field with args fieldContent ' + fieldContent + ', concreteFieldType ' + concreteFieldType + ', domId ' + domId);
			if(abstractFieldType == 'visuals'){
				setUploadedImage(fieldContent, domId)
			}
			fc++;
		}
		
		//alert('ADD TO DB FIELDS MCE EDITORS FOR: '+editorIdsInDataEdit);
		for(fid in editorIdsInDataEdit){
			tinyMCE.execCommand("mceAddControl", true, editorIdsInDataEdit[fid]);
		}
	});
}

function saveToPreview(){
	//alert('saveToPreview');
	activateSave();
	YUI().use('node', 'dd-constrain', 'dd-proxy', 'dd-drop', 'dd-scroll', function(Y) {
		
		var o = {};
		var pagedata = {};
		o.pagedata = pagedata;
		var fieldsArr = [];
		pagedata['fields'] = fieldsArr;
		var fields = Y.all('#fieldsDisplay table tbody tr td textarea');
		Y.each(fields, function(v, k) {
			var fldobj = {};
			fldobj.fieldName = v.getAttribute('name');
			// editor?
			if(!(tinyMCE.editors[v.get('id')]==null)){
				fldobj.fieldContent = tinyMCE.editors[v.get('id')].getContent();
			}else{
				fldobj.fieldContent = v.get('value');
			}
			// language?
			if(v.getAttribute('lang')){
				fldobj.lang=v.getAttribute('lang');
			}
			fieldsArr.push(fldobj);
		});
		pagedata['lists'] = [];
		var listdivs = Y.all('#referencesDisplay .objectrefs');
		Y.each(listdivs, function(v,k) {
			var refsobj = {};
			pagedata['lists'].push(refsobj);
			var objecttype = v.get('id').split('_')[1];
			var listitems = [];
			refsobj[objecttype] = {};
			refsobj[objecttype]['listitems'] = listitems;
			
			var referencingul = v.one('.draglist.referencing');
			var referencingLis = referencingul.all('li');
			Y.each(referencingLis, function(rli,kk){
				var listitem = {};
				listitems.push(listitem);
				listitem.name = rli.get('innerHTML');
				listitem.key = rli.get('id');
			});
			/*
			var dbfields = {};
			refsobj[objecttype]['dbfields'] = dbfields;
			
			var fieldcells = v.all('#'+objecttype+'_fieldsbox table tbody tr td textarea');
			if(!fieldcells.isEmpty()){
				var hiddenid = v.one('#'+objecttype+'_fieldsbox #db_item_key');
				var itemkey = hiddenid.get('value');
				dbfields.itemKey = itemkey;
				dbfields.typeName = objecttype;
				Y.each(fieldcells, function(fld, k) {
					dbfields[fld.getAttribute('name')] = fld.get('innerHTML');
				});
			}*/
			
			var dbfields = {};
			refsobj[objecttype]['dbfields'] = dbfields;
			
			var fieldcells = v.all('#'+objecttype+'_fieldsbox table tbody tr td textarea');
			
			
			if(!fieldcells.isEmpty()){
				var hiddenid = v.one('#'+objecttype+'_fieldsbox #db_item_key');
				var itemkey = hiddenid.get('value');
				
				dbfields.itemKey=itemkey;
				dbfields.typeName=objecttype;
				dbfields.itemName=fieldcells.filter( '[name="itemName"]' ).get('value')[0];
				
				dbfields.fields=[];
				Y.each(fieldcells, function(fld, k) {
					var fldobj = {};
					fldobj.content = ((tinyMCE.editors[fld.get('id')]!=null)  ?  tinyMCE.editors[fld.get('id')].getContent()  :  fld.get('value')  );
					fldobj.name = fld.getAttribute('name');
					if(fld.getAttribute('lang')){
						fldobj.lang = fld.getAttribute('lang');
					}
					dbfields.fields.push(fldobj);
				});
				//alert(JSON.stringify(dbfields));
			}
			
		});
		//alert(JSON.stringify(o));
		flashMovie("AppSkeleton").setDbItem(o);
	});
}
function saveData(){
	deactivateSave();
	document.getElementsByName("logoutButton")[0].setAttribute("disabled","disabled");
	flashMovie("AppSkeleton").saveData();
}
function activateLogout(){
	document.getElementsByName("logoutButton")[0].removeAttribute("disabled");
}
function activateSave(){
	//alert('activateSav');
	if(!((document.getElementsByName("saveButton")[0].getAttribute("disabled") == null))){
		document.getElementsByName("saveButton")[0].removeAttribute("disabled");
	}
	dirty = false;
}
function deactivateSave(){
	//alert('deactivateSave');
	document.getElementsByName("saveButton")[0].setAttribute("disabled","disabled");
}
function activatePreview(){
	document.getElementsByName("previewButton")[0].removeAttribute("disabled");
}
function deactivatePreview(){
	document.getElementsByName("previewButton")[0].setAttribute("disabled","disabled");
}
var dirty = false;
function dirtyFields(){
	dirty = true;
	activatePreview();
}

function logout(){
	jx.load('logout',logoutResult,'json','post');
}
function logoutResult(value){
	YUI().use('node', 'dd-constrain', 'dd-proxy', 'dd-drop', 'dd-scroll', function(Y) {
		var node = Y.one('#cmsDisplay');
		node.set('innerHTML',"");
		node.setStyle('backgroundColor', 'transparent');
		node.setStyle('border', '1px none black');
		node.setStyle('height', 'auto');
		flashMovie("AppSkeleton").stopSendingData();
	});
}



/*
 *
 * functionality for upload
 *
 */
//Call at the time of upload
function upload(fileObj){
	YUI().use('node', 'dd-constrain', 'dd-proxy', 'dd-drop', 'dd-scroll', function(Y) {
		var formnode = Y.one(fileObj.form);
		var iframename = 'iframe_container_' + formnode.getAttribute('name');
		var iframenode = Y.one('#'+iframename);
		iframenode.setStyle('display','block');
		//var random_id = parseInt(Math.random() * 100000);
		var imagesnode = Y.one('#images_container_'+formnode.getAttribute('name'));
		//alert('setting indicator on ' + '#images_container_'+formnode.getAttribute('name'));
		//var divForRandomId = imagesnode.appendChild("<div></div>");
		//divForRandomId.set('id',random_id);
		imagesnode.appendChild("<img src='icons/indicator2.gif'>");
		//var hiddenInput = formnode.get('div_id');
		//hiddenInput.set('value',random_id);
		setTimeout(function(){formnode.submit()},5000);
	});
}

//Call when upload completed
function setUploadedImage(imgSrc, index) {
	//alert('setUploadedImage for imageSource ' + imgSrc + ' and index ' + index);
	YUI().use('node', 'dd-constrain', 'dd-proxy', 'dd-drop', 'dd-scroll', function(Y) {
		//alert('getting images container by ' + '#images_container_' + index);
		var images = Y.one('#images_container_' + index);
		images.set('innerHTML', '');
		images.appendChild("<img src='" + imgSrc + "'>");
		var fld = Y.one('#' + index);
		fld.set('value',imgSrc);
	});
}
 
// call when error occurred at the time of upload
function uploadError(divId, oName) {
	var par = window.document;
	var images = par.getElementById('images_container');
	var imgdiv = par.getElementById(divId);
	images.removeChild(imgdiv);
	var errorDiv = par.getElementById('error');
	errorDiv.innerHTML = oName + " has invalid file type.";
	errorDiv.style.display = '';
}
 
function labelOnFocus(image_label) {
	if (image_label.value == "Label") {
		image_label.value = "";
	}
}
 
function labelOnBlur(image_label) {
	if (image_label.value == "") {
		image_label.value = "Label";
	}
}
 
function deleteLinkOnClick(delLink, delFlag) {
	var par = window.document;
	var imgDiv = delLink.parentNode;
	var image_hidden = delFlag == '' ? imgDiv.childNodes[2] : par.getElementById(delFlag);
 
	if (image_hidden.value == '1') {
		image_hidden.value = '0';
		delLink.removeChild(delLink.childNodes[0]);
		delLink.appendChild(par.createTextNode("Restore"));
		delLink.style.color = '#FF0000';
	}
	else {
		image_hidden.value = '1';
		delLink.removeChild(delLink.childNodes[0]);
		delLink.appendChild(par.createTextNode("Delete"));
		delLink.style.color = '#64B004';
	}
}
 
 
/*
 *
 * window width and height helpers
 *
 */
function wWidth(){
	if (parseInt(navigator.appVersion)>3) {
		if (navigator.appName=="Netscape") {
			return window.innerWidth;
		}
		if (navigator.appName.indexOf("Microsoft")!=-1) {
			return document.body.offsetWidth;
		}
	}
}
function wHeight(){
	if (parseInt(navigator.appVersion)>3) {
		if (navigator.appName=="Netscape") {
			return window.innerHeight;
		}
		if (navigator.appName.indexOf("Microsoft")!=-1) {
			return document.body.offsetHeight;
		}
	}
}
/*
 *
 * IE switch helper
 *
 */
function isIE(){
	return (navigator.appName.indexOf("Microsoft")!=-1);
}
/*
 *
 * helper function to identify the flash content
 *
 */
function flashMovie(movieName) {
	if (navigator.appName.indexOf("Microsoft") != -1) {
		return window[movieName]
	} else {
		return document[movieName]
	}
}