ติดตั้ง+ปรับแต่ง WYSIWYG TextEditor for smf 1.1.4++

<textarea class="editor" cols="75" rows="7" style="width: 95%; height: 100px;" name="message" tabindex="1" onselect="storeCaret(this);" onclick="storeCaret(this);" onkeyup="storeCaret(this);" onchange="storeCaret(this);"></textarea>

<!--//HotEditor MOD - Quick Reply -->
<textarea style="visibility:hidden;position:absolute;top:-20;left:-20;width:1px;height:1px" cols="75" rows="7" id="message" name="message" tabindex="1"></textarea>
<style type="text/css">@import url(richedit/styles/office2007/style.css);</style>        
<script language="JavaScript" type="text/javascript" src="richedit/editor.js?version=4.2"></script>
<script language="JavaScript" type="text/javascript">
   var getdata =document.getElementById("message").value;
   Instantiate("min","editor", getdata , "100%", "150px");
   //For Vietnamese User. Edit file editor.js to enable vietnamese keyboard
   if(enable_vietnamese_keyboard==1){
      document.write("<script language=\"JavaScript\" type=\"text/javascript\" src=\"richedit/avim.js\"><\/script>");
      var hoteditor_avim_method = hot_readCookie("hoteditor_avim_method");
      var him_auto_checked="";
      var him_telex_checked="";
      var him_vni_checked="";
      var him_viqr_checked="";
      var him_viqr2_checked="";
      var him_off_checked="";
      if(hoteditor_avim_method=="0"){him_auto_checked="checked";}
      else if(hoteditor_avim_method=="1"){him_telex_checked="checked";}
      else if(hoteditor_avim_method=="2"){him_vni_checked="checked";}
      else if(hoteditor_avim_method=="3"){him_viqr_checked="checked";}
      else if(hoteditor_avim_method=="4"){him_viqr2_checked="checked";}
      else if(hoteditor_avim_method=="-1"){him_off_checked="checked";}
      document.write("<div style=\'width:100%;text-align:center;font-family:Verdana;font-size:11px;\'><input "+him_auto_checked+" id=him_auto onclick=setMethod(0); type=radio name=viet_method> Auto :: <input "+him_telex_checked+" id=him_telex onclick=setMethod(1); type=radio name=viet_method> Telex :: <input "+him_vni_checked+" id=him_vni onclick=setMethod(2); type=radio name=viet_method> VNI :: <input "+him_viqr_checked+" id=him_viqr onclick=setMethod(3); type=radio name=viet_method> VIQR :: <input "+him_viqr2_checked+" id=him_viqr2 onclick=setMethod(4); type=radio name=viet_method> VIQR* :: <input "+him_off_checked+" id=him_off onclick=setMethod(-1); type=radio name=viet_method> Off<br><img src="+styles_folder_path+"/vietnamese_symbol.gif></div>");
   }
   function get_hoteditor_data(){
      if (HTML_ON == "no"){
         alert ("Please uncheck the HTML checkbox");
         return false;
      }
      else{
         setCodeOutput();
         var bbcode_output=document.getElementById("hoteditor_bbcode_ouput_editor").value;//Output to BBCode
         document.getElementById("message").value = bbcode_output;
      }
   }
</script>
<!--//HotEditor MOD Quick Reply -->

var smf_template_body_edit = \'<div id="error_box" style="padding: 4px; color: red;"></div><textarea class="editor" name="message" rows="12" style="width: 94%; margin-bottom: 10px;">%body%</textarea><br /><input type="hidden" name="sc" value="', $context['session_id'], '" /><input type="hidden" name="topic" value="', $context['current_topic'], '" /><input type="hidden" name="msg" value="%msg_id%" /><div style="text-align: center;"><input type="submit" name="post" value="', $txt[10], '" onclick="return modify_save(\\\'' . $context['session_id'] . '\\\');" accesskey="s" />&nbsp;&nbsp;', $context['show_spellchecking'] ? '<input type="button" value="' . $txt['spell_check'] . '" onclick="spellCheck(\\\'quickModForm\\\', \\\'message\\\');" />&nbsp;&nbsp;' : '', '<input type="submit" name="cancel" value="', $txt['modify_cancel'], '" onclick="return modify_cancel();" /></div>\';

//HotEditor MOD QUICK EDIT / MODIFY POST
var edit_session_id = "', $context['session_id'], '";
var smf_template_body_edit = \'<div id="error_box" style="padding: 4px; color: red;"></div><iframe frameborder=0 width=100% height=550px src="hoteditor_quickedit.html" scrolling=no target="_top"></iframe><textarea style="visibility:hidden;width:1px;height:1px" id="message" class="editor" name="message" rows="12" style="width: 94%; margin-bottom: 10px;">%body%</textarea><input type="hidden" name="sc" value="', $context['session_id'], '" /><input type="hidden" name="topic" value="', $context['current_topic'], '" /><input type="hidden" name="msg" value="%msg_id%" /><div style="text-align: center;"><input type="hidden" name="post" value="', $txt[10], '" onclick="return modify_save(\\\'' . $context['session_id'] . '\\\');" accesskey="s" />&nbsp;&nbsp;', $context['show_spellchecking'] ? '<input type="button" value="' . $txt['spell_check'] . '" onclick="spellCheck(\\\'quickModForm\\\', \\\'message\\\');" />&nbsp;&nbsp;' : '', '<input type="hidden" name="cancel" value="', $txt['modify_cancel'], '" onclick="return modify_cancel();" /></div>\';

// Finally the most important bit - the actual text box to write in!
echo '
<tr>
<td valign="top" align="right"></td>
<td>
<textarea class="editor" name="', $context['post_box_name'], '" rows="', $context['post_box_rows'], '" cols="', $context['post_box_columns'], '" onselect="storeCaret(this);" onclick="storeCaret(this);" onkeyup="storeCaret(this);" onchange="storeCaret(this);" tabindex="', $context['tabindex']++, '"', isset($context['post_error']['no_message']) || isset($context['post_error']['long_message']) ? ' style="border: 1px solid red;"' : '', '>', $message, '</textarea>
</td>
</tr>';

// Finally the most important bit - the actual Hoteditor box to write in!
//HotEditor MOD
print<<<EOF
<tr>
<td valign="top" align="right"></td>
<td>
<textarea style="visibility:hidden;position:absolute;top:-20;left:-20;width:1px;height:1px" class="editor" id="hoteditor_holder" name="$context[post_box_name]" >$message</textarea>
<style type="text/css">@import url(richedit/styles/office2007/style.css);</style>
<script language="JavaScript" type="text/javascript" src="richedit/editor.js?version=4.2"></script>
<script language="JavaScript" type="text/javascript">
var getdata =document.getElementById("hoteditor_holder").value;
getdata=getdata.replace(/\[S\]/gi,"[STRIKE]");
getdata=getdata.replace(/\[\/S\]/gi,"[/STRIKE]");
Instantiate("max","editor", getdata , "100%", "300px");
function get_hoteditor_data(){
if (HTML_ON == "no"){
alert ("Please uncheck the HTML checkbox");
return false;
}
else{
setCodeOutput();
var bbcode_output=document.getElementById("hoteditor_bbcode_ouput_editor").value;//Output to BBCode
document.getElementById("hoteditor_holder").value = bbcode_output;
}
}
</script>
</td>
</tr>
EOF;

// Assuming BBC code is enabled then print the buttons and some javascript to handle it.

smileyPopupWindow.document.write(\'</td></tr>\n\t\t\t<tr><td align="center" class="windowbg"><a href="javascript:window.close();\\">', $txt['more_smileys_close_window'], '</a></td></tr>\n\t\t</table>\n\t</body>\n</html>\');
smileyPopupWindow.document.close();
}
// ]]></script>';
}

//Hoteditor MOD - Remove original BBCode and Smileys

replaceText(text, document.forms.postmodify.message);

//HotEditor MOD
if(editor_type=="0"){//BBCode Editor
WriteTEXT(text,"editor");
}
else{//WYSIWYG Editor
text=BBCodeToHTML(text);
WriteHTML(text,"editor");
}

// Finally, the submit buttons.
echo '
<tr>
<td align="center" colspan="2">
<span class="smalltext"><br />', $txt['smf16'], '</span><br />
<input type="submit" name="post" value="', $context['submit_label'], '" tabindex="', $context['tabindex']++, '" onclick="return submitThisOnce(this);" accesskey="s" />
<input type="submit" name="preview" value="', $txt[507], '" tabindex="', $context['tabindex']++, '" onclick="return event.ctrlKey || previewPost();" accesskey="p" />';

// HotEditor MOD - add code get_hoteditor_data() - Finally, the submit buttons.
echo '
<tr>
<td align="center" colspan="2">
<span class="smalltext"><br />', $txt['smf16'], '</span><br />
<input type="submit" name="post" value="', $context['submit_label'], '" tabindex="', $context['tabindex']++, '" onclick="return get_hoteditor_data();submitThisOnce(this);" accesskey="s" />
<input type="submit" name="preview" value="', $txt[507], '" tabindex="', $context['tabindex']++, '" onclick="return event.ctrlKey || get_hoteditor_data();previewPost();" accesskey="p" />';

function submitThisOnce(form)
{

//HotEditor MOD
get_hoteditor_data();

function submitonce(theform)
{
smf_formSubmitted = true;
}

function submitonce(theform)
{
//HotEditor MOD
get_hoteditor_data();

smf_formSubmitted = true;
}

// Replaces the currently selected text with the passed text.
function replaceText(text, textarea)
{
// Attempt to create a text range (IE).
if (typeof(textarea.caretPos) != "undefined" && textarea.createTextRange)
{
var caretPos = textarea.caretPos;

caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == ' ' ? text + ' ' : text;
caretPos.select();
}
// Mozilla text range replace.
else if (typeof(textarea.selectionStart) != "undefined")
{
var begin = textarea.value.substr(0, textarea.selectionStart);
var end = textarea.value.substr(textarea.selectionEnd);
var scrollPos = textarea.scrollTop;

textarea.value = begin + text + end;

if (textarea.setSelectionRange)
{
textarea.focus();
textarea.setSelectionRange(begin.length + text.length, begin.length + text.length);
}
textarea.scrollTop = scrollPos;
}
// Just put it on the end.
else
{
textarea.value += text;
textarea.focus(textarea.value.length - 1);
}
}

//HotEditor MOD
// Replaces the currently selected text with the passed text.
function replaceText(text, textarea)
{
if(editor_type==1){
text=BBCodeToHTML(text);
WriteHTML(text,"editor");
}
else{
WriteTEXT(text,"editor");
}
}

$codes = array(

//HotEditor MOD
array(
'tag' => 'highlight',
'type' => 'unparsed_equals',
'test' => '(#[\da-fA-F]{3}|#[\da-fA-F]{6}|[A-Za-z]{1,12})\]',
'before' => '<span style="background-color: $1;">',
'after' => '</span>',
),
array(
'tag' => 'strike',
'before' => '<strike>',
'after' => '</strike>',
),

'before' => '<table style="font: inherit; color: inherit;">',

'before' => '<table align=center style="border-collapse: collapse;border-spacing: 0px;border: 1px solid #6CAFF7;background-color: #F4F4F4;width:98%;font-family:Verdana,Arial,Sans-Serif,Tahoma;font-size:12px;color: black;">',

'before' => '<td valign="top" style="font: inherit; color: inherit;">',

'before' => '<td style="height:25px; border: 1px solid #6CAFF7">',