まいにち@ぐだぐだ

明日と言わず、今日から…ぐだぐだ(^_^;

Jotでコメントの返信に返信元のコメントも引用しちゃおう

Jotでコメントの返信に返信元のコメントも引用しちゃおう

Jotでコメントの返信にreを付けてタイトルを貼り付けるを、さらに進化(?)させてみましたw

MEGUさんのご要望で、返信元のコメント内容も引用できませんか?と言うことだったのでなんとか頑張ってみました。

用意するモノは前回と同様、chunk.comment.inc.htmlのみとなります。

2009/07/09追記:SEO Strict URLsプラグインを使っている場合は、javascriptの部分をコンテンツにして、テンプレートから外部呼び出しをした方がすっきりします。
使っていない場合は、chunk.form.inc.htmlの方にjavascriptコードを書き加えてください。
そうしないと、コメントの数だけjavascriptが列記されてしまいます。誤動作はしないようですが…(^_^;

前回同様、javascriptコードを貼り付けてください。

<script language="javascript" type="text/javascript">
<!--
function retitleno(commno)
{
    jot_id_str=document.getElementsByName("JotForm")[0].value;
    target_box_id="title"+jot_id_str;
    target_box_elements=document.getElementById(target_box_id);

    getsubject=document.getElementById("jot-subject"+commno);
    tmp_subject=getsubject.innerHTML;
    reg_str=/^re\[[0-9]*\]:/gi;
    res_str=tmp_subject.match(reg_str);
    if(res_str!=null)
    {
        pure_title=RegExp.rightContext;
    }else{
        pure_title=tmp_subject;
    }
   
   
    target_box_elements.value="re["+commno+"]:"+pure_title;
    target_box_elements.focus();
}
function recontents(commno)
{
    titles=retitleno(commno);
   
    target_contents_id="content"+jot_id_str;
    target_contents_elements=document.getElementById(target_contents_id);
   
    getcontents=document.getElementById("jot-message"+commno);
    tmp_contents=getcontents.innerHTML;
   
    target_contents_elements.value=">"+tmp_contents;
}
//-->
</script>

前回追加したコードと丸ごと差し替えても大丈夫です。と言うか、残しておいても意味はないのですが…(^_^;

スクリプトコードは行数が増えました。
機能が増えたのですから、当たり前ですw 頑張って打ち込んでくださいw

次に追加する部分ですね。
前回同様、ボタンを表示する部分を追加します。
35行目くらいの

<span class="jot-subject"></span><br />

の部分に赤文字の部分を追加してください。

<span class="jot-subject" id="jot-subject[+comment.postnumber+]">[+comment.title:limit:esc+]</span><form><input type="button" value="re[No]:" onclick="retitleno('[+comment.postnumber+]')"><input type="button" value="coments>" onclick="recontents('[+comment.postnumber+]')"></form><br />

そして、今回は、さらにもう一行あります。
38行目くらいの

<div class="jot-message">[+comment.content:wordwrap:esc:nl2br+]</div>

の部分にも、同様に赤文字の部分を追加してください。

<div class="jot-message" id="jot-message[+comment.postnumber+]">[+comment.content:esc:nl2br+]</div>

こんな感じです。

今回の機能アップは

  1. reという文字列を追加するのは前回と同様ですが、reの後に[返信元の番号]を追加してre[15]:タイトルという書式になります。
    当然、単なる返信元を追加しているだけではre[16]:re[15]:のように数珠つなぎになって見苦しくなってくるので、返信元に付いているre[15]:と言う文字列を取り除いた上で、元になったコメントの番号で振り直すという機能にしてあります。これで、このコメントの返信元が解るようになります。
  2. もう一つのボタンで、タイトルを貼り付けて、なおかつ本文も引用して貼り付けるようにしました。
    まあ、引用した文の先頭に”>”を付けているだけなんですけどね(^_^;

まあ、そんなにたいした機能ではないですがw
所詮、十数行のスクリプトです(^_^; 大それた事は出来ませんw

前回のお手軽スクリプトと同じ手法にしてしまうと、スクリプトを呼び出すトリガーの部分に、タイトルだの、引用されるコメントなどを引数で渡してあげる必要があります。
これが何を意味するのかと言えば、例えばMEGUさんのところのように掲示板として使っている場合、表示されるページの実に、倍くらいの大きさのHTMLファイルとなってしまうのです(極論ですが)。
これを回避する方法をいろいろと探ってきたのですが、javascript素人なおいらにはストレートな方法が見つけられずに前回と同程度のカスタマイズ…とはいきませんでした。
今回の方法は引用元のタイトルの要素(jotのデフォルトテンプレートだと<span class="jot-subject">)を探し出すために、id属性を追加して、それを探すことにしました。
もちろん、ただ、id属性をただ追加しただけでは駄目で、ここのコメントを識別するプラスアルファが必要でした。
そこで目を付けたのが、コメントに一意で付けられている番号([+comment.postnumber+])です。 この番号をid属性に追記することでそれぞれのコメントを識別できるようにしました。
こうすることによって、スクリプトを呼び出すときに、コメントの番号だけを渡せば良くなり、HTMLファイルにも優しくなります。

一応、簡単な動作チェックはしましたが、完全に動作することを保証するわけではありません。
Firefox3.0でしか、動作確認はしていませんが、スクリプト的にはIE、Safariでも、動作すると思います。

ここに記載してあるスクリプトおよび、カスタマイズ方法は、自己の責任において行ってください。
その結果として何らかの損害を受けたとしても、おいらは一切の責任は負いません。すべて、実行される方の責任の下で行ってください。