November 21, 2009

LaTeX for BloggerをSafariと新しい編集インターフェイスのために改造する



Bloggerの新しいインターフェイスになってLaTeX for Bloggerが機能しない。(そもそもSafariだと微妙だった。)なのでちょっと書き換えた。正規表現を使ったり。チェックとかはしてない。

ダウンロード

LaTeX for Blogger w/ Undo in the Updated Editor

References

WolverineX02 - LaTeX for Blogger
http://wolverinex02.googlepages.com/emoticonsforblogger2

クリボウの Blogger Tips: Blogger に LaTeX 数式を挿入するユーザースクリプト「LaTeX for Blogger」更新
http://www.kuribo.info/2009/05/blogger-latex-latex-for-blogger.html


コード

// ==/UserScript== 以下を次のように書き換える。

function setlatex(domname) 
{
var editbar = document.getElementById(domname);
  if (editbar) {
    var latexbar = document.createElement('div');
    latexbar.setAttribute("id", "latexbar");
    latexbar.setAttribute("class", "goog-toolbar goog-toolbar-horizontal");

    var buttons = emoticonButton("Latex", "http://wolverinex02.googlepages.com/latex.gif");
    buttons += separator();
    buttons += emoticonButton2("Unlatex", "http://www.codecogs.com/gif.latex?Un%5CLaTeX");

    latexbar.innerHTML = buttons;
    editbar.appendChild(latexbar);
  }
}

function emoticonButton(name, url) {
    var button = " \
    <div class='goog-inline-block goog-toolbar-button' id='htmlbar_undefined' onmousedown=' \
    (function latex_compilator() { \
        var rich_edit = document.getElementById(\"postingComposeBox\"); \
        var rich_body = rich_edit.contentDocument.getElementsByTagName(\"body\"); \
        var contenu = rich_body[0].innerHTML; \
        contenu = contenu.replace(/\\$\\$(.+?)\\$\\$/g,\"<img src=\\\"http://www.codecogs.com/gif.latex?$1\\\" border=0 align=middle />\"); \
        rich_body[0].innerHTML = contenu; } \
    )();'> \
        <img src='" + url + "' alt='" + name + "' border='0'> \
    </div> \
    ";
 return button;
}

function emoticonButton2(name, url) {
    var button = " \
    <div class='goog-inline-block goog-toolbar-button' id='htmlbar_undefined' onmousedown=' \
    (function latex_decompilator() { \
        var rich_edit = document.getElementById(\"postingComposeBox\"); \
        var rich_body = rich_edit.contentDocument.getElementsByTagName(\"body\"); \
        var contentu = rich_body[0].innerHTML; \
        contentu = contentu.replace(/<img(.+?)gif.latex\\\?(.+?)\\\"(.*?)>/g, \"$$$$$2$$$$\"); \
        rich_body[0].innerHTML = contentu; \
    })();'> \
        <img src='" + url + "' alt='" + name + "' border='0'> \
    </div> \
    ";
 return button;
}

function separator() {
  return '<div class="goog-toolbar-separator goog-inline-block">&nbsp;</div>';
}

setlatex("postingComposeToolbar");


以下HTML編集モードに使うときのための自分用メモ

var html_edit = document.getElementById(\"postingHtmlBox\");
var contentu = html_edit.value;
...
html_edit = html_edit.value;
...
setlatex("postingHtmlToolbar");