FCafe　 新着マーク ３

　　さて、ツリー化で始まりツリー化に終わった６月でありましたが、そろそろ別の話題を。
ナビリスト関連では　「コメント」や「ＴＢ」、「最近の記事」のリスト項目に「新着マーク」 を追加表示するスクリプトも昨年御提案させて戴いておりますが、今回はそれについて再考してみたいと思います。

新着マーク表示スクリプトにはオリジナルタイプと Odinテンプレートに搭載の 「段階型」との二通りがありますが、そのどちらも先月取り上げたような後置型のツリー化スクリプトと相性がよろしくない、という問題がありました。　　昨年までの私の（レベルが規定する）スクリプトスタイルが「埋め込み型」であった為であります。
「ツリー化したナビリストにも新着マークを表示したい」
「新着マーク付きのナビリストをツリー化したい」
という場合に結構面倒だった訳ですが、今回　自ら後置型のツリー化スクリプトを発表させていただいたのを機に、これ（ら）と併用可能なタイプの『新着マーク表示スクリプト』を考案いたしましたので発表します。

【 設置法 】 　ナビリストを以下のような構成にします。

・・・
<!--リスト始-->
・・・
<a href="URL" title="・・・" class="time年月日時">・・項目内容・・</a>
・・・
<!--/リスト終-->
・・・

・・・ の部分は任意

以下はコメントリストの場合の　一例です（ 「ツリー化」にも対応）

<div class="jtree">
<ul><!--rcomment--><li>
<a
 href="<%rcomment_link>#comment<%rcomment_no>"
 title="<%rcomment_etitle>≪<%rcomment_title>"
 class="time<%rcomment_year><%rcomment_month><%rcomment_day><%rcomment_hour>">
<%rcomment_month>/<%rcomment_day> <%rcomment_name>
<!--<%rcomment_etitle>-->
</a>
</li><!--/rcomment--></ul>
</div>

全リストの後〜　</body> タグ手前　に以下のスクリプトを書きます

<script type="text/javascript"><!--
function New(){
if (document.getElementsByTagName){
var Mark='<font color="red">New</font>';
var LIMIT=48;
if (LIMIT>240){LIMIT=240}
var T=new Date();
var Y=T.getFullYear();
var M=T.getMonth();
var D=T.getDate();
var H=T.getHours();
 if (H>=LIMIT) {H=H-LIMIT} else {
  var L2=Math.floor(LIMIT/24);LIMIT=LIMIT%24;
  if (LIMIT<=H) {H=H-LIMIT} else {H=H+24-LIMIT;L2++}
  D-=L2; if (D<1) {
   if (M==4 || M==6 || M==7 || M==9 || M==11) {D+=30}
   else { if (M==2) {D+=28} else {D+=31} } 
   if (M==0) {Y--;M=11} else {M--}
 } }
T=Y*1000000+(M+1)*10000+D*100+H;
var A=document.getElementsByTagName('A');
for (i=0;i<A.length;i++){
 if(A[i].className){ if(A[i].className.indexOf("time")==0){
  if (eval(A[i].className.split("me")[1])>T) {
   A[i].innerHTML=A[i].innerHTML+Mark;
} } } } } }
New();
//--></script>

 

【 使用法 】 　　リストの形式は問いません。（単なるリンクの羅列でも新着マークは付きます）
項目中の Ａタグに time で始まる以下のような内容のクラス名を付加します。
time[年変数][月変数][日変数][時変数] timeという文字列、年・月・日・時刻変数の間にスペース等は置かず連続させます。
スクリプトソースの以下の部分は各自適宜に設定されてください。
Mark という変数の内容は新着印としてＡタグ内末尾に追加されるタグです。
（ 勿論　imgタグ等も使用できます ）
LIMIT という変数の内容は新着として扱われる期限（単位は時間）です。

【 解　説 】 　今回のスクリプトは「埋め込み型（タグを「書き出す」方式）」であった従来のものとは異なり、先月のツリー化スクリプトと同様、既存のHTMLを改変するタイプとなっています。
スクリプトは　ページ中のＡタグの内、クラス名冒頭が"time"となっているものを調べ、条件が適合するものに新着印を付け加えて行きます。　　以前は各項目毎に日付形式に変換して「新着であるか否か」を判定していた方式も、最初に「基準値」を設定し、 その値と各項目の値をそのまま比較する方式に改めました。
（　class="time2006070412" という数字部分のみの大小を比較します　）
⇒　これにより処理が高速化され、グローバル変数も不要となっています

　「ツリー化」との併用が容易となったのも今回のスクリプトの特徴であると言えます。
当店から御提供中のツリー済みナビリスト（プラグイン）の内、新着印表示が意味を持つと思われる　Tree-Comment、 Tree-TB、 Tree-Recent　については既に（７月に入って直に）このスクリプトに対応可能な形にソースを改定済みです（６月中にＤＬされた方は再ＤＬしてから当スクリプトを適用されて下さい）。
また、非ツリー化ナビリスト（プラグイン)である　 (Rcomment/ RTB/ Recent)-mini　シリーズも同じく今月頭に対応処置を終了済みです。　宜しければお試しを

2006 / 07 / 04 　Tue
Navigation   
Comment 16 / TB 0 / Edit