//First lets initiate some variables

var isEditable= false;
var isIE;
var isGecko;
var isSafari;
var isKonqueror;
var browser = navigator.userAgent.toLowerCase();
var oEditor = null;

var li_ids = new Array();
var menu_ids = new Array();
var a_ids = new Array();

var img_path_editor = "img/editor/";

var toolbar =[
	{ "title":"Bold", "cmd":"bold", "img":"bold.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Underline", "cmd":"underline", "img":"underline.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Italic", "cmd":"italic", "img":"italic.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Strike through", "cmd":"strikethrough", "img":"strikethrough.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Justify left", "cmd":"justifyleft", "img":"align-left.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Justify center", "cmd":"justifycenter", "img":"align-center.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Justify right", "cmd":"justifyright", "img":"align-right.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Indent", "cmd":"indent", "img":"indent.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Outdent", "cmd":"outdent", "img":"outdent.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Undo", "cmd":"undo", "img":"undo.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Redo", "cmd":"redo", "img":"redo.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Insert ordered list", "cmd":"insertorderedlist", "img":"list-ordered.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Insert unordered list", "cmd":"insertunorderedlist", "img":"list-unordered.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Subscript", "cmd":"subscript", "img":"subscript.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Superscript", "cmd":"superscript", "img":"superscript.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Delete", "cmd":"delete", "img":"delete.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Remove format", "cmd":"removeformat", "img":"removeformat.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Create link", "cmd":"createlink", "img":"link.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Unlink", "cmd":"unlink", "img":"unlink.gif" , "show":true, "css_class":"", "values":null },
	{ "title":"Font color", "cmd":"forecolor", "img":"font-color.gif" , "show":true, "css_class":"", "values":["#000000", "#FF0000", "#00FF00", "#0000FF", "#FFFF00","#00FFFF", "#FF00FF", "#C0C0C0", "#FFFFFF", "custom"] },
	{ "title":"Font size", "cmd":"fontsize", "img":"font-size.gif" , "show":true, "css_class":"", "values":["8pt","10pt","12pt","14pt","18pt","24pt","36pt"] },
	{ "title":"Font name", "cmd":"fontname", "img":"font.gif" , "show":true, "css_class":"", "values":["Arial","Verdana","Geneva","Helvetica","Georgia","Times New Roman","Courier New","Courier","Impact","Tahoma","Comic Sans MS"] },
	{ "title":"Heading", "cmd":"formatblock", "img":"heading.gif" , "show":true, "css_class":"", "values":["p","h1","h2","h3","h4","h5","h6","address","pre"] }
];

function createEditor(editor, width, height, text, active_cmds){
	document.write('<div class="editor-html" style="float: left; width: ' + width +'px;">');
	printToolbar(editor, active_cmds);
	printTextArea(editor, width, height, text);
	document.write('</div>');
}

function printToolbar(editor, active_cmds){
	document.write('<div class="editor-html-toolbar"><ul class="edit">');
	
	if(active_cmds != "" && active_cmds != "all"){
		active_cmds_list = active_cmds.split(' ');
		for(var i = 0; i < toolbar.length; i++){
			for(var j = 0; j < active_cmds_list.length; j++){
				if(toolbar[i].cmd == active_cmds_list[j]){
					
					if(active_cmds_list[j] != "|" && active_cmds_list[j+1] == "|"){
						toolbar[i].css_class = "rl";
					}
					if(toolbar[i].css_class != ""){
						document.write('<li class="' + toolbar[i].css_class + '">');
					}else{
						document.write('<li>');
					}
					if(toolbar[i].cmd == "createlink"){
						linkButton(editor, toolbar[i].title, toolbar[i].cmd, img_path_editor+toolbar[i].img, toolbar[i].css_class);
					}else if(toolbar[i].values != null){
						cssSelectboxButton(editor, toolbar[i].title, toolbar[i].cmd, img_path_editor+toolbar[i].img, toolbar[i].css_class, toolbar[i].values);
					}else{
						commonButton(editor, toolbar[i].title, toolbar[i].cmd,img_path_editor+toolbar[i].img, toolbar[i].css_class);
					}
				}
			}
		}
	}else{
		for(var i = 0; i < toolbar.length; i++){
			if(toolbar[i].cmd == "createlink"){
				linkButton(editor, toolbar[i].title, toolbar[i].cmd, img_path_editor+toolbar[i].img, toolbar[i].css_class);
			}else if(toolbar[i].values != null){
				cssSelectboxButton(editor, toolbar[i].title, toolbar[i].cmd, img_path_editor+toolbar[i].img, toolbar[i].css_class, toolbar[i].values);
			}else{
				commonButton(editor, toolbar[i].title, toolbar[i].cmd,img_path_editor+toolbar[i].img, toolbar[i].css_class);
			}
		}
	}

	document.write("</ul></div>");
}

function printTextArea(editor, width, height, text){
	document.write('<div class="editor-html-iframe">');
	initiateEditor();
	displayEditor(editor, text, width, height);
	document.write('</div>');
}

// common buttons are all beside createlink, fonts, headings
function commonButton(editor, title, cmd, img, btn_class){
	document.write("<li class='" + btn_class+"'><a href= \"javascript:editorCommand('" + editor + "', '" + cmd + "', '')\" ><img src=\"" + img + "\" alt=\"" + title + "\" title=\"" + title + "\"></a></li>");
}

function linkButton(editor, title, cmd, img, btn_class){
	document.write('<li class="' + btn_class + '"><a href="javascript:void(0);" onclick="var prompter_url=prompt(\'URL:\',\'http://\'); editorCommand(\'' + editor + '\', \'' + cmd + '\', prompter_url); if(prompter_url!=\'\'){ confirmation=confirm(\'Linkul se va deschide in ferastrea noua?\'); setLinkTarget(prompter_url,confirmation,\'' + editor + '\');}"><img src="' + img + '" alt="' + title + '" title="' + title + '"></a></li>');
}

function cssSelectboxButton(editor, title, cmd, img, btn_class, values){
	var css_select_box_content = "";
	
	switch(cmd){
		case "fontname":
			css_setting = "font-family";
		break;
		
		case "fontsize":
			css_setting = "font-size";
		break;
		
		case "forecolor":
			css_setting = "background-color";
		break;
	}
	
	for(var i = 0; i < values.length; i++){
		if(cmd == "fontsize"){
			css_select_box_content += '<div style="'+css_setting+':' + values[i] + '" onmousedown="editorCommand(\'' + editor + '\', \'' + cmd + '\',  \'' + (i+1) + '\');">' + values[i] + '</div>';
		}else if(cmd == "formatblock"){
			css_select_box_content += '<div onmousedown="editorCommand(\'' + editor + '\', \'' + cmd + '\',  \'' + values[i] + '\');"><'+values[i] + ' style="margin: 0; padding: 0;">' + values[i] + '</' + values[i] + '></div>';
		}else if(cmd == "forecolor" && values[i] == "custom"){
			css_select_box_content += '<div onmousedown="document.getElementById(\'menu_' + editor + '_' + cmd + '\').style.display=\'none\'; document.getElementById(\'custom_' + editor + '_' + cmd + '\').style.display=\'inline\'; document.getElementById(\'apply_color_' + editor + '_' + cmd + '\').style.display=\'inline\';" style="' + css_setting + ':' + values[i] + ';" >' + values[i] + '</div>';
		}else{
			css_select_box_content += '<div style="' + css_setting + ':' + values[i] + '" onmousedown="editorCommand(\'' + editor + '\', \'' + cmd + '\',  \'' + values[i] + '\');">' + values[i] + '</div>';
		}
	}
	
	if(cmd == "forecolor"){
		var input_custom_color = '<input id="custom_' + editor + '_' + cmd + '" type="text" size="10" class="custom" style="display:none;"><img src="' + img_path_editor + 'confirm.gif" id="apply_color_' + editor + '_' + cmd + '" style="display:none;" onclick="editorCommand(\'' + editor + '\',\'' + cmd + '\', document.getElementById(\'custom_' + editor + '_' + cmd + '\').value); document.getElementById(\'custom_' + editor + '_' + cmd + '\').style.display=\'none\'; document.getElementById(\'apply_color_' + editor + '_' + cmd + '\').style.display=\'none\';">';
	}else{
		var input_custom_color = '';
	}
	
	document.write('<script language= "JavaScript" type= "text/javascript">li_ids.push("li_' + editor + '_' + cmd + '");menu_ids.push("menu_' + editor + '_' + cmd + '");a_ids.push("a_' + editor + '_' + cmd + '");</script><li class="' + btn_class + '" id="li_' + editor + '_' + cmd + '"><a href="javascript:void(0);"><img src="' + img + '" id="a_' + editor + '_' + cmd + '" alt="' + title + '" title="' + title + '"></a>' + input_custom_color + '<br><div id="menu_' + editor + '_' + cmd + '" class="ophtmleditormenu" style="display:none;">' + css_select_box_content + '</div></li>');
}


function initiateEditor() {
	//check what browser is in use
	
	isIE = ((browser.indexOf("msie") != -1) && (browser.indexOf("opera") == -1) && (browser.indexOf("webtv") == -1)); 
	isGecko = (browser.indexOf("gecko") != -1);
	isSafari = (browser.indexOf("safari") != -1);
	isKonqueror = (browser.indexOf("konqueror") != -1);
	
	//enable designMode
	if (document.getElementById && document.designMode) {
		isEditable= true;
	}
}

//Javascript function dislpayEditor will create the textarea.
function displayEditor(editor, html, width, height){
	//alert(html);
	if(isEditable){
		document.writeln('<iframe frameborder="0" id="' + editor + '" name="' + editor + '" width="' + width + 'px" height="' + height + 'px" class="iframe">'+'</iframe>');
		
		//create a hidden field that will hold everything that is typed in the textarea
		document.writeln('<input type="hidden" id="hidden' + editor + '" name="hidden' + editor + '" style="display: none;" value="">');
		
		//assign html (textarea value) to hiddeneditor 
		document.getElementById('hidden' + editor).value = html;
		
		//call function designer
		designer(editor, html);
	}else{
		document.writeln('<textarea name="' + editor + '" id="' + editor + '" cols="30" rows="10">' + html + '</textarea>');
	}
}

//this is designer function that enables designMode and writes defalut text to the text area
function designer(editor, html) {
	var jsText = "";
	var mainContent= '<html id="' + editor + '"><head><link type="text/css" href="css/editor-iframe.css" rel="stylesheet"></head><body>' + html  + jsText +  '</body></html>' ;
	
	//assign the frame(textarea) to the edit variable using that frames id
	var edit = document.getElementById(editor).contentWindow.document;
	
	//write the content to the textarea
	edit.write(mainContent);
	edit.close();
	
	try {
		//enable the designMode	
		edit.designMode = "On";
		if (edit.body.contentEditable) 
			edit.body.contentEditable = true;
		
		var editorC = document.getElementById(editor).contentDocument;
		if (editorC) {
			editorC.designMode = "on";
		}
	}catch(e){ }
	//oEditor = edit;
}

//To execute command we will use javascript function editorCommand. 
function editorCommand(editor, command, option) {
	// first we assign the content of the textarea to the variable mainField
	var mainField;
	var edit = document.getElementById(editor);
	mainField = edit.contentWindow;
	
	// then we will use execCommand to execute the option on the textarea making sure the textarea stays in focus
	try {
		mainField.focus();
		mainField.document.execCommand(command, false, option);
		mainField.focus();
	}catch (e) { }
}

function updateEditor(editor) {
	if (!isEditable) return;
	
	//assign the value of the textarea to the hidden field. 
	var hiddenField = document.getElementById('hidden' + editor);
	if (hiddenField.value == null) { hiddenField.value = ""; }
	hiddenField.value = document.getElementById(editor).contentWindow.document.body.innerHTML;
	//alert(hiddenField.value);
}

function submitForm(contentNames){
	for(i = 0; i < contentNames.length; i++){
		updateEditor(contentNames[i]);
	}
	
	return true;
}

function setLinkTarget(url, confirmation, editor){
	var mainField;
	var edit = document.getElementById(editor);
	mainField = edit.contentWindow;
	var description_content = mainField.document.body.innerHTML;

	if(confirmation == true){
		description_content = description_content.replace( 'href="' + url + '"', 'target="_blank"' + ' href="' + url + '"' );
	}
	alert(description_content);
	mainField.document.body.innerHTML = description_content;
}

function showCombo(id){
	var combo = document.getElementById(id);		
	if(combo != null){
		if(visibles[id]){
			combo.style.display = "none";
			visibles[id] = false;
		}else{
			combo.style.display = "block";
			visibles[id] = true;
		}
	}
}

function getEl(){
	var ev = arguments[0] || window.event;
	origEl = ev.target || ev.srcElement;
	for(var i = 0; i < li_ids.length; i++){
		if(document.getElementById(a_ids[i]).id == origEl.id){
			if(document.getElementById(menu_ids[i]).style.display == "none"){
				document.getElementById(menu_ids[i]).style.display = "block";
			}else{
				document.getElementById(menu_ids[i]).style.display = "none"
			}
		}else if(document.getElementById(li_ids[i]).id != origEl.id){
			document.getElementById(menu_ids[i]).style.display = "none";
		}
	}
}

document.onmouseup = getEl;