やる気がおきない時にテンプレいじってると心が休まるって人、FC2界隈に多くないですか（問題提起）
ガワばかりが新しくなって、ニューエントリが投稿されない（ブログペットを飼うべきか？）。そんなあなた（と私）に向けた警鐘的スクリプトを作りました。投稿からの観覧時までの経過時間を、人間にわかりやすい（アバウトな）文字列にして返します。
> ago.js
<head>要素内でリンクします
<script src="<%url>file/ago.js" type="text/javascript"></script><!--topentry--><hn><%topentry_title></hn><hn><%topentry_year>年<%topentry_month>月<%topentry_day>日<scirpt type="text/javascript">document.write( " - " + ago(<%topentry_year>,<%topentry_month>,<%topentry_day>,<%topentry_hour>,<%topentry_minute>) );</script></hn><%topentry_body>中略<!--/topentry-->ま、del.icio.usやFlickrのコメント欄で見かける、ほにゃほにゃら ago というのをシミュレート、メタモルフォーゼ、なぞらえ･･･えー、パクりました。なので、1分以内の表現”now entered”と、どこまで計算すればいいのかがすごく適当（100年でやめた）です。100年以上前の記事には”many years ago”と表示し、英語の教科書で A MUJINA をやった人に懐かしい仕様となってます（いつの話だ？というか、そんな先の事より今月末の心配をするのが先なのだが）。
最新記事にタイムスタンプがバシっとあるより（アバウトな）経過時間が書かれてあった方が、サボり具合が観測されやすい。また、過去記事でのそれは鮮度のバロメータとなり、さらに、コメント欄においては人気のレブカウンタとなるのだ――（涙なしでは読めない）。
この手のプログラムはサーバサイドで処理するケースが多いようなのでFC2でも実装される気も。
< 使いやすさって何だろう | 研究者と助手 > | 表紙へ戻る |
A MUJINA
Many years ago, One night, an old man was go back to his home in Kyobashi.
He was walking along the road with a chochin in his hand.
わ、スパムみたい。-26日19時
は〜いお呼びでしょうか？（笑）
最初、このエントリを見た時「7 minutes ago」だったから、今から5時間40分前にワタシはここに来たのね...というような使用方法もありますね。
-27日01時
で、私も呼ばれたような気がしまして……
ここのところwikiを触っているものですから、この何時間何分前、という表記はとても親しみがあります。
もっとアバウトに「さっき」「ちょっと前」「だーいぶ前」なんてあると面白いなぁなんて思いつつ。で、管理人の気分で、「さっき」の度合いが変わるの。いや、そんなアナログな（笑）。-27日02時
Chakoさん
読みに行った時に更新はされてないけど「ん、ここんとこ、ちょっと変わったか？」って気づくと、「あー元気でやってるんだな」って思いますよね（オレだけ？）
記事以外でも（ある一部の）ブロガーは、色々なメッセージを発してると言えなくもない？
sugarさん
＞「さっき」「ちょっと前」「だーいぶ前」なんてあると面白いなぁ
「今やってます」「今夜じゅうにはなんとか」「はい、明日朝一、必ず」「･･･探さないでください」だと、読者から同情を得られるかも。
MUJINA、（冒頭は）暗記していたつもりだったけど、かなり抜け落ちてた(´･ω･｀）-27日21時
レンタルブログ「JUGEM」は時間と分を別々に表示する独自タグが無いんです。<span>{entry_time_only}</span>と書くと08:00みたいなフォーマットで表示されます。
":"を","に変更できないがために、エラーが出てしまいます。JUGEMでも動作するようにはできないんでしょうか？もしよろしければ教えて下さい。-23日23時
＞JUGEMでも動作するようにはできないんでしょうか？
JUGEMマニュアル「独自タグ一覧」
→ http://jugem.jp/manual/manual.php?mode=r01#kiji
に追加された
{entry_year} {entry_month} {entry_day} {entry_time_only} を引数にすればOKです。
（コメントやトラックバックにも同変数がありますから応用できるかと）
以下、document.write()を使ったライトな設置方法。
------------------
1）テンプレート編集画面のHTML欄に以下のスクリプト（JUGEM用に編集済み）をコピペします。
<script type="text/javascript">
function ago() {
function adjust( num, str ) {
str = " " + num + " " + str;
return ( num < 1 )? "":( num < 2 )? str:str + "s";
}
var time_stamp=new Date(), now=new Date().getTime(), a=arguments, upper, lower, time=a[3].split(":") ;
time_stamp.setFullYear( a[0],a[1]-1,a[2] ); time_stamp.setHours( time[0],time[1],0 );
min = ( now - time_stamp ) / ( 60 * 1000 ), days = min / ( 60 * 24 );
if ( min < 0) { // 未来
return "";
} else if ( min < 1) { // 1分以内
return "now entered";
} else if ( min < 60 ) { // 1時間以内
upper = Math.floor( min );
return adjust( upper, "minute" )+ " ago";
} else if ( min < 1440 ) { // 1日以内
upper = Math.floor( min / 60 ); lower = Math.floor( min % 60 );
return adjust( upper, "hour" ) + adjust( lower, "minute" ) + " ago";
} else if ( min < 10080 ) { // 1週間以内
upper = Math.floor( days ); lower = Math.floor( min / 60 % 24 );
return adjust( upper, "day" ) + adjust( lower, "hour" ) + " ago";
} else if ( min < 41760 ) { // 1ヶ月以内
upper = Math.floor( days / 7 ); lower = Math.floor( days % 7 );
return adjust( upper, "week" ) + adjust( lower, "day" ) + " ago";
} else if ( min < 525600 ) { // 1年以内
upper = Math.floor( days / 30 ); lower = Math.floor( days % 30 / 7 );
return adjust( upper, "month" ) + adjust( lower, "week" ) + " ago";
} else { // 数年以上
upper = Math.floor( days / 365 ); lower = Math.floor( days % 365 / 30 );
return adjust( upper, "year" ) + adjust( lower, "month" ) + " ago";
}
}
</script><!-- ここまで -->
</head> ← 元からテンプレにあるタグです。
------------------
2）実際に”ホゲホゲago”と書き出したい位置に以下のコードをコピペします。
<script type="text/javascript">
document.write( "<p class='ago_str' title='{entry_eng_week_short} {entry_day} {entry_month}, {entry_year}'>" + ago("{entry_year}","{entry_month}","{entry_day}","{entry_time_only}") + "<\/p>");
</script>
------------------
3）<p class="ago_str" title='{entry_eng_week_short} {entry_day} {entry_month}, {entry_year}'>中略<\/p> が親要素（外側のタグ）になります。class="ago_str" やタイトル属性（経過日数にマウスオンすることで投稿日も知ることができます）はお好みで編集してください。
僕もジュゲマーだったので、あちらに設置してみました。ソースなど覗いてみてくださいね。
→ http://sug.jugem.cc/
あと、とことんカスタムするならFC2ブログ！ と申し上げておきます。立場上^^
-24日20時
JavaScriptに関する知識は皆無に近かったので、丁寧な解説に本当に感謝しています。
おかげさまで無事設置することが出来ました。
あまりに感動的だったので(笑)、別のサイトに設置しているBBSにも応用しようと思ったのですが・・・そのBBSがくせ者で日付から時刻までが1つの独自タグで出力されています。
その表示形式は『2006.08.25 04:00』といった具合です。これを、
<script type="text/javascript">
document.write( ago("<$entry_date>") );
</script>
としてまとめて処理、表示したいのですが・・・。
さすがに日付から時刻までがすべて1つの独自タグで出力された日時表記に対してはこのままでは使えませんよね？
スクリプトを改造するにもどこをどう書き換えたらよいのやら・・・。申し訳ありませんが、よろしければもう一度アドバイス頂けないでしょうか？-25日04時
＞さすがに日付から時刻までがすべて1つの独自タグで出力された日時表記に対してはこのままでは使えませんよね？
昨夜のコードを使って、フィルタを通す、というやり方を説明します。
------------------
1）BBSのテンプレート編集画面のHTML欄に以下のスクリプトをコピペします。
<script type="text/javascript">
function ago() {
function adjust( num, str ) {
（中略）
return adjust( upper, "year" ) + adjust( lower, "month" ) + " ago";
}
}<!-- ここまでは前回のコードと同じもの -->
function ago_b( date ) {
if ( date.match( /(\d+)\.(\d+)\.(\d+)\s(\d+:\d+)/ ) ) {
with ( RegExp ) { return ago( $1, $2, $3, $4 ); }
}
}
</script><!-- ここまで。太字の部分が新しいコードです -->
</head> ← 元からテンプレにあるタグです。
------------------
2)実際に”ホゲホゲago”と書き出したい位置に以下のコードをコピペします。
<script type="text/javascript">
document.write( ago_b("<$entry_date>") );
</script>
------------------
3) ago_b() という関数を通して ago() を呼びますので、2 のように記述してください。
前回のように title属性を使いたい場合は
<script type="text/javascript">
document.write( "<span title='<$entry_date>'>" + ago_b("<$entry_date>") + "<\/span>" );
</script>
のようにすればOKでしょう。
テストできませんので、うまくいかなかったら該当部分のソースかアドレスを添えて、コメントくださいね。-25日21時
このスクリプトはとても応用が利くんですね。改めて勉強になりました。
自分もこれからもっとJavaScriptの知識を付けていきたい所存です。
今回の件はどうもありがとうございました！またおじゃまさせてもらうかも知れません。-26日00時
＞自分もこれからもっとJavaScriptの知識を付けていきたい所存です。
スクリプトは「ちょっと書く」という意味ですから、短いもの、単機能なものを応用して使いまわすってやり方に向いてますね。
javascriptはメモ帳とブラウザだけで作れるので、いろいろ試してみてください。-27日11時