var editor;

function Editor() {
    this.iframe;
    this.doc;
    this.selection;
    this.range;

    this.colorset = "white";

    this.init = initEditor;
    this.isIE = isBrowserIE;
    this.focus = focusEditor;
    this.setColorset = setColorset;
    this.getEditorSource = getEditorSource;
    this.getFrame = getFrame;
    this.getContent = getContent;
    this.getContentNoCache = getContentNoCache;
    this.setContent = setContent;
    this.getSelection = getSelection;
    this.createRange = createRange;
    this.setFontColorBoxPosition = setFontColorBoxPosition;
    this.setBGColorBoxPosition = setBGColorBoxPosition;
}
function initEditor(width, height)
{
    this.frame = this.getFrame(width, height);    
    this.doc = this.frame.document;
    this.doc.designMode = "on";

    this.doc.open("text/html");
    this.doc.write(this.getEditorSource());
    this.doc.close();

    this.doc.body.style.fontSize = "9pt";
    this.doc.body.style.fontFamily = "";

    this.focus();
}
function isBrowserIE()
{
    var ua = navigator.userAgent.toLowerCase();

    return (ua.indexOf("msie") != -1) && (ua.indexOf("opera") == -1) && (ua.indexOf("webtv") == -1);
}
function focusEditor()
{
    this.frame.focus();
}
function setColorset(colorset)
{
    this.colorset = colorset;
}
function getFrame(width, height)
{
    if (this.isIE())
    {
        //document.getElementById("content").style.display = "none";
        this.frame = EDITOR;
    }
    else
    {
        var textarea = document.getElementById("content");
        var htmlarea = document.createElement("div");
        textarea.parentNode.insertBefore(htmlarea, textarea);
        textarea.style.display = "none";
        document.getElementById("EDITOR").style.display = "none";

        iframe = document.createElement("iframe");
        htmlarea.appendChild(iframe);
        
        iframe.style.width = width + "px";
        iframe.style.height = height + "px";
        iframe.className = document.getElementById('EDITOR').className;

        this.frame = iframe.contentWindow;
    }

    return this.frame;
}
function getContent()
{

    return this.doc.body.innerHTML;
}
function getContentNoCache()
{
    return this.doc.body.innerHTML;
}
function setContent(html)
{
    this.doc.body.innerHTML = html;
}
function getSelection()
{
    if (this.isIE()) 
        return this.doc.selection;
    else
        return this.frame.getSelection();
}
function createRange(sel) 
{
    if (this.isIE()) 
    {
        return sel.createRange();
    } 
    else 
    {
        this.focus();
        if (typeof sel != "undefined") 
        {
            try {
                return sel.getRangeAt(0);
            } catch(e) {
                return this.doc.createRange();
            }
        } 
        else 
        {
            return this.doc.createRange();
        }
    }
}
function setFontColorBoxPosition(top, left)
{
    document.getElementById("TableFontColor").style.top = top;
    document.getElementById("TableFontColor").style.left = left;
}

function setBGColorBoxPosition(top, left)
{
    document.getElementById("TableBGColor").style.top = top;
    document.getElementById("TableBGColor").style.left = left;
}


function getEditorSource()
{
    var source = "";
    var style = "";
    var body = "";

    if (this.colorset == "silver")
    {
        style = "<style>.Background {background-color:#EFEFEF} P {margin-top:2px;margin-bottom:2px;} table {border:1 solid C6C3C6}</style>";
        body = "<body class=\"Background\"></body>";
    }
    else if (this.colorset == "gray")
    {
        style = "<style>P {margin-top:2px;margin-bottom:2px;} table {border:1 solid C6C3C6}</style>";
        body = "<body bgcolor=#545454 text=#C1C0C1 link=#6F93FF vlink=#6F93FF alink=#6F93FF></body>";
    }
    else if (this.colorset == "black")
    {
        style = "<style>P {margin-top:2px;margin-bottom:2px;} table {border:1 solid C6C3C6}</style>";
        body = "<body bgcolor=#292929 text=#C1C0C1 link=#6F93FF vlink=#6F93FF alink=#6F93FF></body>";
    }
    else
    {
        style = "<style>.Background {background-color:#FFFFFF} P {margin-top:2px;margin-bottom:2px;} table {border:1 solid C6C3C6}</style>";
        body = "<body class=\"Background\"></body>";
    }

    source = "<html><head>" + style + "<script>function resizeImage(num){};function popview(){};</script></head>" + body + "</html>";

    return source;
}

function editContent(act)
{
    var selection = editor.getSelection();
    var range = editor.createRange(selection);
    editor.range = range;

    switch (act)
    {
        case "Bold" :
        case "Italic" :
        case "Underline" :
        case "StrikeThrough" :
        case "JustifyLeft" :
        case "JustifyCenter" :
        case "JustifyRight" :
            editor.doc.execCommand(act, false, null);
            break;
        case "fontcolor" :
        case "bgcolor" :
            showFontColorBox(act);
            break;
        case "link" :
            showLinkBox();
    }
}

function setFont(oSelect)
{
    execSelect("FontName", oSelect);
}
function execSelect(act, el)
{
    if (el.options[el.selectedIndex].value != '')
        editor.doc.execCommand(act, null, el.options[el.selectedIndex].value);

    el.selectedIndex = 0;
}
function setFontSize(oSelect)
{
    execSelect("FontSize", oSelect);
}
function setFontColor(color)
{
    if (editor.range != null && editor.isIE())
    {
        editor.range.select();
    }
    editor.doc.execCommand("ForeColor", false, color);

    displayFontColorBox(false);
}

function setBGColor(color, ftcolor)
{
    if (editor.range != null && editor.isIE())
    {
            editor.range.select();
    }
    editor.doc.execCommand("BackColor", null, color);
    if (ftcolor != "") editor.doc.execCommand("ForeColor", null, ftcolor);

    displayBGColorBox(false);
}
function showLinkBox()
{
    editor.focus();
    editor.doc.execCommand("CreateLink", true, null);
}

function showFontColorBox(act)
{
    if (act == "fontcolor")
    {
        displayFontColorBox(true);
        displayBGColorBox(false);
    }
    if (act == "bgcolor")
    {
        displayFontColorBox(false);
        displayBGColorBox(true);
    }
}

function displayFontColorBox(flag)
{
    if (flag)
        document.getElementById("TableFontColor").style.display = "";
    else
        document.getElementById("TableFontColor").style.display = "none";
}

function displayBGColorBox(flag)
{
    if (flag)
        document.getElementById("TableBGColor").style.display = "";
    else
        document.getElementById("TableBGColor").style.display = "none";
}
function decodeContent(str)
{
    return str.replace(/&lt;/gi,"<").replace(/&gt;/gi,">").replace(/&amp;/gi,"&");
}
document.write("" 
  + "<div id='TableFontColor' style='position:absolute;top:150;left:240;display:none;'>"
  + "<table width='200' border='0' cellspacing='1' cellpadding='0' bgcolor='#CCCCCC'>"
  + "<tr>" 
  + "<td align='center' bgcolor='#FFFFFF' width='85'>" 
  + "<table width='111' border='0' cellspacing='4' cellpadding='0' height='88' style='cursor:hand'>"
  + "<tr>" 
  + "<td bgcolor='#008000' onclick='setFontColor(\"#008000\");'>&nbsp;</td>"
  + "<td bgcolor='#009966' onclick='setFontColor(\"#009966\");'>&nbsp;</td>"
  + "<td bgcolor='#99CC66' onclick='setFontColor(\"#99CC66\");'>&nbsp;</td>"
  + "<td bgcolor='#999966' onclick='setFontColor(\"#999966\");'>&nbsp;</td>"
  + "<td bgcolor='#CC9900' onclick='setFontColor(\"#CC9900\");'>&nbsp;</td>"
  + "</tr>"
  + "<tr>" 
  + "<td bgcolor='#D41A01' onclick='setFontColor(\"#D41A01\");'>&nbsp;</td>"
  + "<td bgcolor='#FF0000' onclick='setFontColor(\"#FF0000\");'>&nbsp;</td>"
  + "<td bgcolor='#FF7635' onclick='setFontColor(\"#FF7635\");'>&nbsp;</td>"
  + "<td bgcolor='#FF9900' onclick='setFontColor(\"#FF9900\");'>&nbsp;</td>"
  + "<td bgcolor='#FF3399' onclick='setFontColor(\"#FF3399\");'>&nbsp;</td>"
  + "</tr>"
  + "<tr>" 
  + "<td bgcolor='#9B18C1' onclick='setFontColor(\"#9B18C1\");'>&nbsp;</td>"
  + "<td bgcolor='#993366' onclick='setFontColor(\"#993366\");'>&nbsp;</td>"
  + "<td bgcolor='#666699' onclick='setFontColor(\"#666699\");'>&nbsp;</td>"
  + "<td bgcolor='#0000FF' onclick='setFontColor(\"#0000FF\");'>&nbsp;</td>"
  + "<td bgcolor='#177FCD' onclick='setFontColor(\"#177FCD\");'>&nbsp;</td>"
  + "</tr>"
  + "<tr>" 
  + "<td bgcolor='#006699' onclick='setFontColor(\"#006699\");'>&nbsp;</td>"
  + "<td bgcolor='#003366' onclick='setFontColor(\"#003366\");'>&nbsp;</td>"
  + "<td bgcolor='#333333' onclick='setFontColor(\"#333333\");'>&nbsp;</td>"
  + "<td bgcolor='#8E8E8E' onclick='setFontColor(\"#8E8E8E\");'>&nbsp;</td>"
  + "<td bgcolor='#C1C1C1' onclick='setFontColor(\"#C1C1C1\");'>&nbsp;</td>"
  + "</tr>"
  + "</table>"
  + "</td>"
  + "<td align='center' bgcolor='#FFFFFF' width='162' valign='top'>"
  + "<br>"
  + "ม๗มขภิทย"
  + "<font face='Verdana' size='1'>" 
  + "<input type='text' name='FontBox' id='FontBox' style='width:60px' maxlength='7' class='box' value=''>"
  + "</font>"
  + "<br>"
  + "<table width='5' border='0' cellspacing='0' cellpadding='0' height='10'>"
  + "<tr>" 
  + "<td>&nbsp;</td>"
  + "</tr>"
  + "</table>"
  + "<a href='javascript:setFontColor(document.getElementById(\"FontBox\").value);'><img src='http://cafeimgs.naver.com/img/btn_ok01.gif' width='32' height='19' align='absmiddle'></a>"
  + "<br>"
  + "</td>"
  + "</tr>"
  + "</table>"
  + "</div>");

document.write(""
  + "<div id='TableBGColor' style='position:absolute;top:80;left:260;display:none;'>"
  + "<table width='200' border='0' cellspacing='1' cellpadding='0' bgcolor='#CCCCCC'>"
  + "<tr>" 
  + "<td align='center' bgcolor='#FFFFFF' width='85'>"
  + "<table width='111' border='0' cellspacing='5' cellpadding='0' height='88' style='cursor:hand'>"
  + "<tr valign='top'>"
  + "<td bgcolor='#FFDAED' width='53' onclick='setBGColor(\"#FFDAED\",\"\");'>นูลมป๖</td>"
  + "<td bgcolor='#FF0000' width='53' onclick='setBGColor(\"#FF0000\",\"#FFFFFF\");'><font color='#FFFFFF'>นูลมป๖</font></td>"
  + "</tr>"
  + "<tr valign='top'>"
  + "<td bgcolor='#99DCFF' width='53' onclick='setBGColor(\"#99DCFF\",\"\");'>นูลมป๖</td>"
  + "<td bgcolor='#0000FF' width='53' onclick='setBGColor(\"#0000FF\",\"#FFFFFF\");'><font color='#FFFFFF'>นูลมป๖</font></td>"
  + "</tr>"
  + "<tr valign='top'>"
  + "<td bgcolor='#A6FF4D' width='53' onclick='setBGColor(\"#A6FF4D\",\"\");'>นูลมป๖</td>"
  + "<td bgcolor='#009966' width='53' onclick='setBGColor(\"#009966\",\"#FFFFFF\");'><font color='#FFFFFF'>นูลมป๖</font></td>"
  + "</tr>"
  + "<tr valign='top'>"
  + "<td bgcolor='#E4FF75' width='53' onclick='setBGColor(\"#E4FF75\",\"\");'>นูลมป๖</td>"
  + "<td bgcolor='#E4E4E4' width='53' onclick='setBGColor(\"#E4E4E4\",\"\");'>นูลมป๖</td>"
  + "</tr>"
  + "<tr valign='top'>"
  + "<td bgcolor='#333333' width='53' onclick='setBGColor(\"#333333\",\"#FFFFFF\");'><font color='#FFFFFF'>นูลมป๖</font></td>"
  + "<td bgcolor='#333333' width='53' onclick='setBGColor(\"#333333\",\"#FFFF00\");'><font color='#FFFF00'>นูลมป๖</font></td>"
  + "</tr>"
  + "<tr valign='top'>"
  + "<td bgcolor='#8E8E8E' width='53' onclick='setBGColor(\"#8E8E8E\",\"#FFFFFF\");'><font color='#FFFFFF'>นูลมป๖</font></td>"
  + "<td bgcolor='#CDCDCD' width='53' onclick='setBGColor(\"#CDCDCD\",\"#FFFFFF\");'><font color='#FFFFFF'>นูลมป๖</font></td>"
  + "</tr>"
  + "<tr valign='top'>"
  + "<td width='53' onclick='setBGColor(\"\",\"\");'>นูลมป๖</td>"
  + "<td width='53'>&nbsp;</td>"
  + "</tr>"
  + "</table>"
  + "</td>"
  + "<td align='center' bgcolor='#FFFFFF' width='162'>"
  + "<br>"
  + "ม๗มขภิทย"
  + "<br>"
  + "<input type='text' name='FontBox2' id='FontBox2' style='width:60px' maxlength='7' class='box' value='' align='absmiddle'>"
  + "<br>"
  + "<table width='5' border='0' cellspacing='0' cellpadding='0' height='10'>"
  + "<tr>"
  + "<td>&nbsp;</td>"
  + "</tr>"
  + "</table>"
  + "<a href='javascript:setBGColor(document.getElementById(\"FontBox2\").value,\"\");'><img src='http://cafeimgs.naver.com/img/btn_ok01.gif' width='32' height='19' align='absmiddle'></a>"
  + "<br>"
  + "<br>"
  + "</td>"
  + "</tr>"
  + "</table>"
  + "</div>");

