﻿var doc;
var arrChooseImg = new Array();
function BtnOver(btn) {
    btn.style.borderTopColor = "#FFFFFF";
    btn.style.borderBottomColor = "#CAD9EA";
    btn.style.borderLeftColor = "#FFFFFF";
    btn.style.borderRightColor = "#CAD9EA";
}
function BtnClick(btn) {
    btn.style.borderTopColor = "#CAD9EA";
    btn.style.borderBottomColor = "#FFFFFF";
    btn.style.borderLeftColor = "#CAD9EA";
    btn.style.borderRightColor = "#FFFFFF";
}
function BtnOut(btn) {
    btn.style.borderColor = "#EBF2F8";
}
function doUndo() {
    doc.execCommand('Undo', false, "");
    Editor.focus();
}
function doDelete() {
    doc.execCommand('Delete', false, "");
    Editor.focus();
}
function doFontName(fn) {
    doc.execCommand('FontName', false, fn);
    Editor.focus();
}
function doFontSize(fs) {
    doc.execCommand('FontSize', false, fs);
    Editor.focus();
}
function doBold() {
    doc.execCommand('Bold',false,"");
    Editor.focus();
}
function doItalic() {
    doc.execCommand('Italic', false, "");
    Editor.focus();
}
function doUnderline() {
    doc.execCommand('Underline', false, "");
    Editor.focus();
}
function doStrikeThrough() {
    doc.execCommand('StrikeThrough', false, "");
    Editor.focus();
}
function doSubscript() {
    doc.execCommand('Subscript', false, "");
    Editor.focus();
}
function doSuperscript() {
    doc.execCommand('Superscript', false, "");
    Editor.focus();
}
function doJustifyLeft() {
    doc.execCommand('JustifyLeft', false, "");
    Editor.focus();
}
function doJustifyRight() {
    doc.execCommand('JustifyRight', false, "");
    Editor.focus();
}
function doJustifyCenter() {
    doc.execCommand('JustifyCenter', false, "");
    Editor.focus();
}
function doIndent() {
    doc.execCommand('Indent', false, "");
    Editor.focus();
}
function doOutdent() {
    doc.execCommand('Outdent', false, "");
    Editor.focus();
}
function doForeColor() {
    var fcolor = showModalDialog("/richedit/editor_color.htm", false, "dialogWidth:106px;dialogHeight:126px;status:0;");
    doc.execCommand('ForeColor', false, fcolor);
    Editor.focus();
}
function doBackColor() {
    var bcolor = showModalDialog("/richedit/editor_color.htm", false, "dialogWidth:106px;dialogHeight:126px;status:0;");
    doc.execCommand('BackColor', false, bcolor);
    Editor.focus();
}
function doInsertTable() {
    var dotable = showModalDialog("/richedit/editor_table.htm", false, "dialogWidth:200px;dialogHeight:156px;status:0;");
    if (dotable != undefined) {
        doc.body.innerHTML = doc.body.innerHTML + dotable;
    } else {
        return false;
    }
    Editor.focus();
}
function doInsertUnorderedList() {
    doc.execCommand('InsertUnorderedList', false, "");
    Editor.focus();
}
function doCreateLink() {
    var urllinkPath = prompt("請輸入連結。", "");
    if (urllinkPath != undefined && urllinkPath != "") {
        doc.execCommand('CreateLink', null, urllinkPath);
    }
    Editor.focus();
}
function doInsertImage() {
    Editor.focus();
    var imgPath = prompt("請輸入圖片連結。", "http://");
    if (imgPath != "http://" && imgPath != "" && imgPath != undefined) {
        doc.execCommand('InsertImage', false, imgPath);
    }
}
function doInsertPic() {
    Editor.focus();
    var imgPath = showModalDialog("/richedit/piclist.htm", false, "dialogWidth:428px;dialogHeight:613px;status:0;");
    if (imgPath != undefined && imgPath != "" ) {
        doc.execCommand('InsertImage', false, imgPath);
    }
}

function doUpimg() {
    Editor.focus();
    var imgPath = showModalDialog("/richedit/uploadimage.aspx", false, "dialogWidth:520px;dialogHeight:400px;status:0;");
    if (imgPath != undefined && imgPath != "") {
        doc.execCommand('InsertImage', false, imgPath+".jpg");
        var canPush = true;
        for (i = 0; i < arrChooseImg.length; i++) {
            if(arrChooseImg[i] == imgPath){
                canPush = false;
            }
        }
        if(canPush){
            arrChooseImg.push(imgPath);
        }
    }
}

function doInsertInputButton() {
    Editor.focus();
    doc.execCommand('InsertInputButton', false, "");
}
function doInsertHorizontalRule() {
    Editor.focus();
    doc.execCommand('InsertHorizontalRule', false, "");
}
function doInsertMarquee() {
    Editor.focus();
    doc.execCommand('InsertMarquee', false, "");
    ShowMessage();
}
function doInsertObject() {
    Editor.focus();
    var objPath = prompt("請輸入欲嵌入的影片代碼。", "");
    if (objPath != "" && objPath != undefined) {
        objPath = objPath.replace(/<script.*?>.*?<\/script>/ig, '');  
        doc.selection.createRange().pasteHTML(objPath);
    }
}

function ShowMessage() {

}
var DOC;
function RichEdit() {
    this.doc;
    this.width = 907;
    this.height = 582;
    this.Bind = function(obj, ElementName) {
        obj.innerHTML = this.GetTamp();
        
        //this.doc = $("#" + ElementName)[0].contentWindow.document;
        //doc.body.designMode = "on";
        //doc.body.contentEditable = true;
    }

    this.GetText = function() {
        return doc.body.innerHTML;
    }

    this.GetTamp = function() {
    var menuTable = new Array();
        /*
        menuTable.push('<table width="' + this.width + '" style="height:' + this.height + ';"  border="1" cellpadding="0" cellspacing="0" bordercolorlight="#CAD9EA"  bordercolordark="#FFFFFF">');
        menuTable.push('<tr><td bgcolor="#EBF2F8" style="height:20px;">');
        */
        menuTable.push('<table border="0" cellpadding="0" cellspacing="1">');
        menuTable.push('<tr><td ><img src="/images/editor_s.gif"></td><td>');
        menuTable.push('<select onchange="doFontName(this[this.selectedIndex].value);this.selectedIndex=0;">');
        menuTable.push('<option value="">字型</option>');
        menuTable.push('<option value="細明體">細明體</option>');
        menuTable.push('<option value="新細明體">新細明體</option>');
        menuTable.push('<option value="標楷體">標楷體</option>');
        menuTable.push('<option value="arial">arial</option>');
        menuTable.push('<option value="wingdings">wingdings</option>');
        menuTable.push('</select>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<select onchange="doFontSize(this[this.selectedIndex].value);this.selectedIndex=0;">');
        menuTable.push('<option value="">大小</option>');
        menuTable.push('<option value="1">1</option>');
        menuTable.push('<option value="2">2</option>');
        menuTable.push('<option value="3">3(預設)</option>');
        menuTable.push('<option value="4">4</option>');
        menuTable.push('<option value="5">5</option>');
        menuTable.push('<option value="6">6</option>');
        menuTable.push('<option value="7">7</option>');
        menuTable.push('</select>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<img src="/images/editor_s.gif">');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="粗體字" onclick="doBold();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f08.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="斜體字" onclick="doItalic();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f09.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="劃底線" onclick="doUnderline();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f10.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="刪除線" onclick="doStrikeThrough();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f11.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="文字顏色" onclick="doForeColor();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f14.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="背景顏色" onclick="doBackColor();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f15.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="復原" onclick="doUndo();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f07.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="靠左對齊" onclick="doJustifyLeft();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f16.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="靠中對齊" onclick="doJustifyCenter();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f17.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="靠右對齊" onclick="doJustifyRight();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f18.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="增加縮排" onclick="doIndent();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f19.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="減少縮排" onclick="doOutdent();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f20.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="插入分隔線" onclick="doInsertHorizontalRule();" onmouseover="BtnOver(this);"');
        menuTable.push('onmouseout="BtnOut(this);" onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f23.gif"></div>');
        menuTable.push('</td>');        
        menuTable.push('<td>');
        menuTable.push('<div title="插入表格" onclick="doInsertTable();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f24.gif"></div>');
        menuTable.push('</td>');        
        menuTable.push('<td>');
        menuTable.push('<div title="插入連結" onclick="doCreateLink();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f25.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="插入圖片" onclick="doInsertImage();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f26.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="插入影音" onclick="doInsertObject();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f28.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="插入表情符號" onclick="doInsertPic();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f31.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('<td>');
        menuTable.push('<div title="上傳圖片" onclick="doUpimg();" onmouseover="BtnOver(this);" onmouseout="BtnOut(this);"');
        menuTable.push('onmousedown="BtnClick(this);" onmouseup="BtnOver(this);">');
        menuTable.push('<img src="/images/editor_f32.gif"></div>');
        menuTable.push('</td>');
        menuTable.push('</tr>');
        menuTable.push('</table>');
        /*
        menuTable.push('</td>');
        menuTable.push('</tr>');
        menuTable.push('<tr>');
        menuTable.push('<td height="550" >');
        menuTable.push('<iframe id="Editor" scrolling="auto" style="width: 100%; height:100%; background-color: white;"></iframe>');
        menuTable.push('</td>');
        menuTable.push('</tr>');
        menuTable.push('</table>');
        */
        return menuTable.join('');
    }
}


