//*********************************	
var oSelSave;
var sSelType; 
function saveSelection()
	{
	//idContent.focus() //or <BODY onselectstart...>
	
	oSelSave = idContent.document.selection.createRange()
	sSelType = idContent.document.selection.type
	}
function restoreSelection()
	{
	oSelSave.select()
	}
//*********************************
function drawIcon(left,width,id,title,command)
	{
	document.write("<span style=\"width: "+width+";height:22;\">")
	document.write("	<span unselectable='on' style=\"position:absolute;clip: rect(0 "+width+" 22 0)\">")	
	document.write("	<img unselectable='on' id=\""+id+"\" ") 
	document.write("	title=\""+title+"\" onclick=\""+command+"\" src=\"bce.gif\" ")
	document.write("		style=\"position:absolute;top:0;left:-"+left+";\" ")
	document.write("		onmouseover=\"if(this.en==false)return;this.style.pixelTop=-22\" ")
	document.write("		onmousedown=\"if(this.en==false)return;this.style.pixelTop=-44\" ")
	document.write("		onmouseup=\"if(this.en==false)return;this.style.pixelTop=-22\" ")
	document.write("		onmouseout=\"if(this.en==false)return;this.style.pixelTop=0\" ")
	document.write("		width=\"1151\" ")
	document.write("		height=\"110\">")
	document.write("		<table width="+width+"><tr><td onselectstart='return false' style=\"position:absolute;top:4;left:7;\" id=\""+id+"Text\"></td></tr></table>")
	document.write("	</span>")	
	document.write("</span>")
	}
function initEditor()
	{
	var sHTML = ""
	sHTML += ""
		+ "<STYLE>"
		+	"BODY {border: 1px lightgrey solid;}"
		+ "</STYLE>"
		+ "<BODY ONCONTEXTMENU=\"return false\">"
		+	"<DIV></DIV>"
		+ "</BODY>"
	idContent.document.designMode = "on"
	idContent.document.open("text/html","replace")
	idContent.document.write(sHTML)
	idContent.document.close()
/*
	for(i=0;i<document.all.length;i++) 
		{
		if(document.all(i).unselectable != "off")
		document.all(i).unselectable = "on";
		}	
	idContent.unselectable = "off";
*/	
	LoadDoc()
	idContent.document.designMode = "on"
	btnSave.disabled = false
	}
function doCmd(sCmd,sOption)
	{
	popupHide()
	idContent.focus()
	var oSel	= idContent.document.selection.createRange()
	var sType = idContent.document.selection.type	
	var oTarget = (sType == "None" ? idContent.document : oSel)
	
	if(sCmd=="DialogLink") 
		{
		oTarget.execCommand("CreateLink",true);
		idContent.focus();
		return true;
		} 
	if (sCmd=="DialogImage") 
		{
		var popleft=((document.body.clientWidth - 440) / 2)+window.screenLeft; 
		var poptop=(((document.body.clientHeight - 460) / 2))+window.screenTop-40;		
		window.open("default_Image.asp","NewWindow","scrollbars=NO,width=480,height=520,left="+popleft+",top="+poptop)
		return true;
		}

	oTarget.execCommand(sCmd, false, sOption)
	}
function doCmd2(sCmd,sOption)
	{
	popupHide()
	
	//idContent.focus()
	var oSel	= oSelSave//idContent.document.selection.createRange()
	var sType = sSelType//idContent.document.selection.type	
	
	var oTarget = (sType == "None" ? idContent.document : oSel)
	oSel.select()//tambahan

	oTarget.execCommand(sCmd, false, sOption)
	}
	
function popupShow(width,title,html)
	{
	//construct & display popup
	/*
	var sHTML = "<style>" +
				"	body {border: 0px lightgrey solid;}" +
				"	.bar{	border-top: #99ccff 1px solid; background: #316AC5; WIDTH: 100%; border-bottom: #000000 1px solid;height: 20px}" +
				"</style>" +
				"<body oncontextmenu=\"return false\" topmargin=0 leftmargin=0 rightmargin=0 bottommargin=0>" +
				"<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"table-layout: fixed\" bgcolor=Gainsboro ID=\"tblPopup\">" +
				"<col width="+width+"><col width=13>" +
				"<tr>" +
				"<td>" +
				"	<div class=\"bar\" style=\"padding-left: 5px;\">" +
				"	<font size=2 face=tahoma color=white><b>"+title+"</b></font>" +
				"	</div>" +
				"</td>" +
				"<td style=\"cursor:hand\" onclick=\"parent.popupHide()\">" +
				"	<div class=\"bar\">" +
				"	<font size=2 face=tahoma color=white><b>X</b></font>" +
				"	</div>" +
				"</td>" +
				"</tr>" +
				"<tr>" +
				"<td colspan=2 style=\"border-left: #336699 1px solid;border-right: #336699 1px solid;border-bottom: #336699 1px solid;\">" +
				"	<br>" +
				"	<div id=\"divPopup\"></div>" +
				"	<br>" +
				"</td>" +
				"</tr>" +
				"</table>" +
				"</body>"
		*/
	popupHide();
	var sHTML = "<style>" +
				"	body {border: 0px lightgrey solid;}" +
				"	.bar{	border-top: #99ccff 1px solid; background: #316AC5; WIDTH: 100%; border-bottom: #000000 1px solid;height: 20px}" +
				"	.cellSymbol{border:solid black 1.0pt; border-left:none; padding:0in 2pt 0in 2pt; font-size:10pt; font-family:'Tahoma';}" +
				"	td {	font:8pt verdana,arial,sans-serif}" +
				"	div	{	font:10pt tahoma,arial,sans-serif}" +
				"</style>" +
				"<body style=\"overflow:hidden\" oncontextmenu=\"return false\" topmargin=0 leftmargin=0 rightmargin=0 bottommargin=0 ONSELECTSTART=\"return event.srcElement.tagName=='INPUT'\">" +
				"<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"table-layout: fixed\" bgcolor=Gainsboro ID=\"tblPopup\">" +
				"<col width="+width+"><col width=13>" +
				"<tr>" +
				"<td>" +
				"	<div class=\"bar\" style=\"padding-left: 5px;\">" +
				"	<font size=2 face=tahoma color=white><b>"+title+"</b></font>" +
				"	</div>" +
				"</td>" +
				"<td style=\"cursor:hand\" onclick=\"parent.popupHide()\">" +
				"	<div class=\"bar\">" +
				"	<font size=2 face=tahoma color=white><b>X</b></font>" +
				"	</div>" +
				"</td>" +
				"</tr>" +
				"<tr>" +
				"<td colspan=2 style=\"border-left: #336699 1px solid;border-right: #336699 1px solid;border-bottom: #336699 1px solid;\" valign=top>" +
				"	<br>" +
				"	<div id=\"divPopup\" align=center></div>" +
				"	<br>" +
				"</td>" +
				"</tr>" +
				"</table>" +
				"</body>"		
		
	idContentTmp.document.open("text/html","replace")
	idContentTmp.document.write(sHTML)
	idContentTmp.document.close()
	document.all.idContentTmp.style.zIndex = 2
	document.all.idContentTmp.style.visibility = ""
	
	idContentTmp.document.all.tblPopup.focus()
	
	//fill popup content
	idContentTmp.divPopup.innerHTML = html
	
	//set dimension
	document.all.idContentTmp.style.width = idContentTmp.document.all.tblPopup.offsetWidth
	document.all.idContentTmp.style.height = idContentTmp.document.all.tblPopup.offsetHeight
	
	//set position
	if(document.body.clientHeight - document.all.idContentTmp.offsetHeight > 0)
		document.all.idContentTmp.style.pixelTop=((document.body.clientHeight - document.all.idContentTmp.offsetHeight) / 2);
	else
		document.all.idContentTmp.style.pixelTop=0
	if(document.body.clientWidth - document.all.idContentTmp.offsetWidth > 0)
		document.all.idContentTmp.style.pixelLeft=(document.body.clientWidth - document.all.idContentTmp.offsetWidth) / 2 ;
	else
		document.all.idContentTmp.style.pixelLeft=0
	}
	
function popupHide()
	{
	document.all.idContentTmp.style.visibility = "hidden"
	}
	
function displayParagraphBox()
	{
	saveSelection()

	var sHTML = "<table align=center border=0 width=100% height=100% cellpadding=0 cellspacing=0>" +
				"<tr onclick=\"parent.doCmd2('FormatBlock','<H1>');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center height=10><h1>Header 1</h1></td></tr>" +
				"<tr onclick=\"parent.doCmd2('FormatBlock','<H2>');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><h2>Header 2</h2></td></tr>" +
				"<tr onclick=\"parent.doCmd2('FormatBlock','<H3>');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><h3>Header 3</h3></td></tr>" +
				"<tr onclick=\"parent.doCmd2('FormatBlock','<H4>');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><h4>Header 4</h4></td></tr>" +
				"<tr onclick=\"parent.doCmd2('FormatBlock','<H5>');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><h5>Header 5</h5></td></tr>" +
				"<tr onclick=\"parent.doCmd2('FormatBlock','<H6>');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><h6>Header 6</h6></td></tr>" +
				"<tr onclick=\"parent.doCmd2('FormatBlock','<PRE>');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><pre>Preformatted</pre></td></tr>" +
				"<tr onclick=\"parent.doCmd2('FormatBlock','<P>');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center height=10><p>Normal</p></td></tr>" +
				"</table>"	
	popupShow(253,"Paragraph Style",sHTML)
	}
function displayFontNameBox()
	{
	saveSelection()

	var sHTML = "<table align=center border=0 width=100% height=100% cellpadding=0 cellspacing=2>" +
				"<tr onclick=\"parent.doCmd2('fontname','Arial');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font face=\"Arial\" size=1>Arial</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontname','Arial Black');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font face=\"Arial Black\" size=1>Arial Black</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontname','Arial Narrow');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font face=\"Arial Narrow\" size=1>Arial Narrow</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontname','Comic Sans MS');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font face=\"Comic Sans MS\" size=1>Comic Sans MS</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontname','Courier New');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font face=\"Courier New\" size=1>Courier New</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontname','System');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font face=\"System\" size=1>System</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontname','Tahoma');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font face=\"Tahoma\" size=1>Tahoma</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontname','Times New Roman');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font face=\"Times New Roman\" size=1>Times New Roman</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontname','Verdana');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font face=\"Verdana\" size=1>Verdana</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontname','Wingdings');\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font face=\"Wingdings\" size=1>Wingdings</font></td></tr>" +
				"</table>"
	popupShow(213,"Font Name",sHTML)
	}
function displayFontSizeBox()
	{
	saveSelection()
	
	var sHTML = "<table align=center border=0 width=100% height=100% cellpadding=0 cellspacing=0>" +
				"<tr onclick=\"parent.doCmd2('fontsize',1);\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font size=1>Size 1</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontsize',2);\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font size=2>Size 2</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontsize',3);\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font size=3>Size 3</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontsize',4);\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font size=4>Size 4</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontsize',5);\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font size=5>Size 5</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontsize',6);\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font size=6>Size 6</font></td></tr>" +
				"<tr onclick=\"parent.doCmd2('fontsize',7);\" onmouseover=\"this.style.color='tomato'\" onmouseout=\"this.style.color='black'\" style=\"cursor:hand\"><td align=center><font size=7>Size 7</font></td></tr>" +
				"</table>"
	popupShow(253,"Font Size",sHTML)
	}

function displayFgColorBox()
	{
	saveSelection()
	
	var sHTML = writeColorPicker("idForeColor","parent.doCmd2('ForeColor',idForeColor.value);",0);

	popupShow(433,"Foreground Color",sHTML)
	}
function displayBgColorBox()
	{
	saveSelection()
	
	var sHTML = writeColorPicker("idBackColor","parent.doCmd2('BackColor',idBackColor.value);",0);

	popupShow(433,"Background Color",sHTML)
	}
function writeColorPicker(Name,Command,Type)
	{
	var OutputID = Name
	var TextID = Name + "_1"
	var ColorID = Name + "_2"
	var c1 = new Array("FFFFCC","FFCC66","FF9900","FFCC99","FF6633","FFCCCC","CC9999","FF6699","FF99CC","FF66CC","FFCCFF","CC99CC","CC66FF","CC99FF","9966CC","CCCCFF","9999CC","3333FF","6699FF","0066FF","99CCFF","66CCFF","99CCCC","CCFFFF","99FFCC","66CC99","66FF99","99FF99","CCFFCC","33FF33","66FF00","CCFF99","99FF00","CCFF66","CCCC66","FFFFFF")
	var c2 = new Array("FFFF99","FFCC00","FF9933","FF9966","CC3300","FF9999","CC6666","FF3366","FF3399","FF00CC","FF99FF","CC66CC","CC33FF","9933CC","9966FF","9999FF","6666FF","3300FF","3366FF","0066CC","3399FF","33CCFF","66CCCC","99FFFF","66FFCC","33CC99","33FF99","66FF66","99CC99","00FF33","66FF33","99FF66","99FF33","CCFF00","CCCC33","CCCCCC")
	var c3 = new Array("FFFF66","FFCC33","CC9966","FF6600","FF3300","FF6666","CC3333","FF0066","FF0099","FF33CC","FF66FF","CC00CC","CC00FF","9933FF","6600CC","6633FF","6666CC","3300CC","0000FF","3366CC","0099FF","00CCFF","339999","66FFFF","33FFCC","00CC99","00FF99","33FF66","66CC66","00FF00","33FF00","66CC00","99CC66","CCFF33","999966","999999")
	var c4 = new Array("FFFF33","CC9900","CC6600","CC6633","FF0000","FF3333","993333","CC3366","CC0066","CC6699","FF33FF","CC33CC","9900CC","9900FF","6633CC","6600FF","666699","3333CC","0000CC","0033FF","6699CC","3399CC","669999","33FFFF","00FFCC","339966","33CC66","00FF66","669966","00CC00","33CC00","66CC33","99CC00","CCCC99","999933","666666")
	var c5 = new Array("FFFF00","CC9933","996633","993300","CC0000","FF0033","990033","996666","993366","CC0099","FF00FF","990099","996699","660099","663399","330099","333399","000099","0033CC","003399","336699","0099CC","006666","00FFFF","33CCCC","009966","00CC66","339933","336633","33CC33","339900","669933","99CC33","666633","999900","333333")
	var c6 = new Array("CCCC00","996600","663300","660000","990000","CC0033","330000","663333","660033","990066","CC3399","993399","660066","663366","330033","330066","333366","000066","000033","003366","006699","003333","336666","00CCCC","009999","006633","009933","006600","003300","00CC33","009900","336600","669900","333300","666600","000000")
	
	
	var sHTML = "";
	sHTML += ("<table border=0 width=370 align=center cellpadding=0 cellspacing=0><tr><td width=45>  <table border=1 cellpadding=0 cellspacing=0><tr><td id='"+ColorID+"' width=25 height=25></td></tr></table>   <div id='"+TextID+"'><font size=1>&nbsp;</font></div> </td><td>&nbsp;</td><td>")
	sHTML += ("<table cellpadding=0 cellspacing=1 bgcolor=black>")
	if(Type==0)
		{
		for(var i=1;i<=6;i++)
			{
			sHTML += ("<tr>")
			for(var r=0;r<eval("c"+i).length;r++)
				{
				var colour = eval("c"+i+"[r]")
				sHTML += ("<td onclick=\""+OutputID+".value='"+colour+"';"+Command+"\" style=\"cursor:hand;background-color:"+colour+";\" width=9 height=6 onmouseover=\""+ColorID+".style.background='#"+colour+"';"+TextID+".innerHTML='<font size=1>"+colour+"</font>'\"></td>")
				}	
			sHTML += ("</tr>")
			}
		}
	if(Type==1)
		{
		for(var i=1;i<=6;i++)
			{
			sHTML += ("<tr>")
			for(var r=0;r<eval("c"+i).length;r++)
				{
				var colour = eval("c"+i+"[r]")
				sHTML += ("<td onclick=\""+ColorID+".style.background='#"+colour+"';"+TextID+".innerHTML='<font size=1>"+colour+"</font>';"+OutputID+".value='"+colour+"';"+Command+"\" style=\"cursor:hand;background-color:"+colour+";\" width=9 height=6 onmouseover=\"\"></td>")
				}	
			sHTML += ("</tr>")
			}
		}
	sHTML += ("</table>")
	sHTML += ("<input type=hidden id='"+OutputID+"'>")
	sHTML += ("</td></tr></table>")	
	return sHTML;		
	}
	
	
var displayMode = "RICH"
function setDisplayMode() 
	{
	if(displayMode=='RICH')
		{
		idContent.document.body.clearAttributes;
		idContent.document.body.style.fontFamily = 'Courier New';
		idContent.document.body.style.fontSize = '12px';
		idContent.document.body.innerText = idContent.document.body.innerHTML;
		idContent.document.body.innerHTML = "<DIV>" + idContent.document.body.innerHTML + "</DIV>"
		displayMode = 'HTML';
		idToolbar.style.display = "none"
		} 
	else 
		{
		idContent.document.body.clearAttributes;
		idContent.document.body.style.fontFamily = '';
		idContent.document.body.style.fontSize = '';
		idContent.document.body.innerHTML = idContent.document.body.innerText;
		displayMode = 'RICH';
		idToolbar.style.display = "block"
		}
	}