//splatter.js
var url = '?';
var contentdiv;

function do_request(q, pars, complete) { //q:String pars:Object complete:Function
	var myAjax = new Ajax.Request(
		url+'q='+q+'&',
		{method: 'post', parameters: Object.toQueryString(pars), onComplete:complete}
	);
}

function do_replace(q, pars, toReplace) {
	var myAjax = new Ajax.Updater(
		toReplace,
		url+'q='+q+'&',
		{method: 'post', parameters: Object.toQueryString(pars)}
	);
}

function toggleEditor(id, theButton) {
	if (tinyMCE.getInstanceById(id) == null) {
		if($(id).getHeight() < 200)
			$(id).style.height = "200px";
		if($(id).getHeight() > 600)
			$(id).style.height = "600px";
		$(id).style.width = "450px";
		contentdiv = $(id);
		tinyMCE.execCommand('mceAddControl', false, id);
		theButton.innerHTML = "save";
	}
	else {
		$$('input')[0].remove();
		tinyMCE.execCommand('mceRemoveControl', false, id);
		theButton.innerHTML = "edit";
		do_request("saveContent", {"fldName":id, "content":contentdiv.innerHTML, "page":page});
	}
}

function openEditor(id) {
	do_request("openEditor", {"fldName":id, "page":page}, openEditorReturn);
	field = id;
}

function openEditorReturn(request) {
	result = eval( "(" + request.responseText + ")" );
	var theEditor = new Element("div", {"id":"editorWindow", "class":result.style});
	theEditor.innerHTML = "<div class=\"titlebar\">Editor</div><div id=\"editorContent\"></div>";
	document.body.appendChild(theEditor);
	if(result.style == "short") {
		$('editorContent').innerHTML = "<input type=\"text\" id=\"editorValue\" name=\"editorValue\" size=\"20\" value=\""+$(field).innerHTML+"\"> <br \> <a href=\"javascript:void(0);\" onclick=\"saveFromEditor();\">Save</a>";
	}
	else {
		$('editorContent').innerHTML = "<textarea id=\"editorValue\" name=\"editorValue\" rows=\"20\" cols=\"60\">"+$(field).innerHTML+"</textarea>  <a href=\"javascript:void(0);\" onclick=\"saveFromEditor();\">Save</a>";
		tinyMCE.execCommand('mceAddControl', false, "editorValue");
	}
	new Draggable('editorWindow', {handle: "titlebar"});
}

function saveFromEditor() {
	if (tinyMCE.getInstanceById("editorValue") != null) {
		tinyMCE.execCommand('mceRemoveControl', false, "editorValue");
	}
	$(field).innerHTML = $('editorValue').value;
	do_request("saveContent", {"fldName":field, "content":$('editorValue').value, "page":page}, void(0));
	$('editorWindow').remove();
}

function openImageEditor(imgName) {
	var theEditor = new Element("div", {"id":"editorWindow", "class":"imageEditor"});
	theEditor.innerHTML = "<div class=\"titlebar\">Editor</div><div id=\"editorContent\"></div>";
	document.body.appendChild(theEditor);	
	$("editorContent").innerHTML = "src=<input type=\"text\" id=\"newImgSrc\" size=\"20\"/><br />list=<span id=\"imageSelect\"><select><option>loading...</option></select></span><br /><a href=\"javascript:void(0)\" onclick=\"changeImage('"+page+"', '"+imgName+"')\">Save</a><br/><a href=\"javascript:void(0)\" onclick=\"$('editorWindow').remove()\">Cancel</a>";
	new Draggable('editorWindow', {handle: "titlebar"});
	do_replace("getImageSelector", {}, $('imageSelect'));
}

function updateImageSrc(index) {
	$('newImgSrc').value = $('imageSelector').value;
}

function changeImage(page, image) {
	do_request("changeImage", {"page":page, "imgName":image, "imgSrc":$F("newImgSrc")}, changeImageReturn);
}

function changeImageReturn(request) {
	response = eval( "(" + request.responseText + ")" );
	if(response.status == "success") {
		$('editorWindow').remove();
		$(response.imgName).src = response.imgSrc;
	}
	else {
		alert("There was an ajax problem: "+response.error);	
	}
}