万年床生活者の自由帳

livedoor wikiのコメントの文字数制限ってlivedoor blogと同じ全角400文字(800バイト)なんですね。
文字数制限自体はどうすることもできないけどコメントの入力中にせめて現在の文字数がリアルタイムで表示されるようになればいいのになあと考えて自分のブログに設置したコメント入力欄の文字数カウンターですが、この度このカスタマイズをlivedoor wikiでもやってみようかと思いまして。

ブログみたいにHTMLテンプレートがイジれないので私の知識では無理かと思いましたがなんとかできたっぽいです。興味のある方はこのページのコメント入力欄をご覧いただければと。

設置方法は上記リンク先にあるライブドアブログ用のそれよりも全然簡単です。以下のソースコードを「フリーエリア」にペタッと貼り付けるだけという手軽さです。フリーエリアの改行設定はもちろん「改行を<br/>タグに“変換しない”」で。

（wikiにソースコードをそのまま載せるのは無理があるだろうか…）

<script type="text/javascript"><!--

var isGecko = false;
if(navigator){
if(navigator.userAgent){
if(navigator.userAgent.indexOf("Gecko/") != -1){
isGecko = true;
}
}
}

// コメント入力欄の文字数カウンター　for livedoor wiki(2008/02/17)
function wc(){
var text = document.comment_form.body.value;
var bc = 0;
for(var i=0 ; i<text.length; i++){
if(text.charCodeAt(i)<0x100){
bc+=1; // case:ascii character.
}else{
bc+=2; // case:double byte character.
}
}

var tl = text.length;
var lines = text.split("\n").length;
if(isGecko){
bc = bc + lines -1; // Gecko系ブラウザはバイト数に(行数-1)を加算する
}else{
tl = tl - lines +1; // その他のブラウザは便宜上改行を1文字とする
}
var bccolor = ''; //カウンターの文字色
if(bc>800){
bccolor='color:#ff0;background-color:#f00;font-weight:bold;';
}else if(bc>700){
bccolor = 'color:#000;background-color:#ff0;';
}
var display = document.getElementById('wikibodybottom');
display.innerHTML='<div style="text-align:center;">只今の文字数は<span style="' + bccolor + ';"> ' + Math.ceil(bc/2) + ' <\/span>です<\/div>';
}


// イベントリスナーの追加
window.onload = function(){

var eventTarget = document.getElementById("text");

if(!eventTarget)
return;

if(eventTarget.addEventListener){
eventTarget.addEventListener("click", wc, false);
eventTarget.addEventListener("keyup", wc, false);
eventTarget.addEventListener("blur", wc, false);
}
else if(eventTarget.attachEvent){
eventTarget.attachEvent("onclick", wc);
eventTarget.attachEvent("onkeyup", wc);
eventTarget.attachEvent("onblur", wc);
}
document.getElementById('wikibodybottom').innerHTML='<div style="text-align:center;">コメントは全角400文字までとなっております<\/div>';
}
//--></script>

※お使いのデザインによっては表示がかなりヘンだったり最悪まったく動作しないかもしれませんがご容赦くださいませ<( _ _ )>