« 背中で語る | トップページ | 洋式お盆のこと »

2006/10/22

【ココログ】メンテナンス・障害情報を表示するスクリプト

サイドバーに表示される『ココログからのお知らせ』だと、現状、メンテナンス/障害情報があわせて1件しか表示されず、いまいち不便に思えるので、個人的にメンテナンスと障害情報をそれぞれ独立して表示するスクリプトを試作してみました。
メモタイプのマイリスト(リストの名前は適当に『ココログ障害情報』とでも)を作成し、下記のスクリプトを貼り付けます。
<div id="cocoTrouble">

<div id="cocoTrouble-maintenance-info">
<div class="cocoTroubleTitle"><a href="http://support.nifty.com/support/cs/maintenance/supinfo/cocolog/1.htm">メンテナンス情報</a></div>
<div class="cocoTrouble-update" id="cocoTrouble-update-maintenance" style="display:none;"></div>
<ul id="cocoTrouble-maintenance"></ul>
</div><!-- id="cocoTrouble-maintenance-info" -->

<div id="cocoTrouble-trouble-info">
<div class="cocoTroubleTitle"><a href="http://support.nifty.com/support/cs/trouble/supinfo/cocolog/1.htm">トラブル情報</a></div>
<div class="cocoTrouble-update" id="cocoTrouble-update-trouble" style="display:none;"></div>
<ul id="cocoTrouble-trouble"></ul>
</div><!-- id="cocoTrouble-trouble-info" -->

</div><!-- id="cocoTrouble" -->


<script type="text/javascript" src="https://furyu.tea-nifty.com/script/cocoTrouble.js"></script>

<script type="text/javascript" >

// 表示期間(終了日時からの時間(hours))
cocoTrouble.newperiod.trouble=24; // トラブル用
cocoTrouble.newperiod.maintenance=24; // メンテナンス用

// 情報無しの場合表示する文字列 
cocoTrouble.notrouble.trouble='ありません。'; // トラブル用
cocoTrouble.notrouble.maintenance='ありません。'; // メンテナンス用

cocoTrouble.init() ;
</script>
<!--旧版ソース-->
<div id="cocoTrouble">

<div id="cocoTrouble-maintenance-info">
<div class="cocoTroubleTitle"><a href="http://support.nifty.com/support/cs/maintenance/supinfo/cocolog/1.htm">メンテナンス情報</a></div>
<div class="cocoTrouble-update" id="cocoTrouble-update-maintenance" style="display:none;"></div>
<ul id="cocoTrouble-maintenance"></ul>
</div><!-- id="cocoTrouble-maintenance-info" -->

<div id="cocoTrouble-trouble-info">
<div class="cocoTroubleTitle"><a href="http://support.nifty.com/support/cs/trouble/supinfo/cocolog/1.htm">トラブル情報</a></div>
<div class="cocoTrouble-update" id="cocoTrouble-update-trouble" style="display:none;"></div>
<ul id="cocoTrouble-trouble"></ul>
</div><!-- id="cocoTrouble-trouble-info" -->

</div><!-- id="cocoTrouble" -->

<script type="text/javascript" >
<!--
var cocoTrouble = {
//  ===
    newperiod       :   {   /* 表示期間(終了日時からの時間(hours))  */
        trouble         :   48
    ,   maintenance     :   24
    }
,   notrouble       :   {   /* 情報無しの場合表示する文字列 */
        trouble         :   'ありません。'
    ,   maintenance     :   'ありません。'
    }
//  ===
,   info            :   new Array()
//  ===
,   loadComplete    :   function ( kind ) {
        var list = document.getElementById('cocoTrouble-'+kind) ;
        if ( !list ) return false ;
        var printInfo = '' ;
        for ( var ci=0; ci < this.info[kind].data.length-1; ci++ ) {
            var info = this.info[kind].data[ci] ;
            var now = (new Date()).getTime() ;
            var todate = Date.parse(info.to) ;
            if ( isNaN(todate) == true || ( this.newperiod[kind] && (now-todate) < (this.newperiod[kind]*60*60*1000) ) ) {
                var content = info.content ;
                content = content.replace(/<font.*<\/font>/g,'') ;
                content = content.replace(/<br[^>]*>/g,'') ;
                content = content.replace(/左記/g,'上記') ;
                printInfo += [
                    '<div class="' + ( ((isNaN(todate)==true)||(0<=(todate-now))) ?'cocoTroubleDate':'cocoTroubleDatePassed' ) + '">'
                ,   info.from
                ,   '~'
                ,   info.to
                ,   '</div>'
                ,   '<div class="cocoTroubleContent">' + content + '</div>'
                ].join('\n') ;
            }
        }
        var listObj = document.createElement('li') ;
        if ( printInfo != '' ) {
            listObj.innerHTML = printInfo ;
        }
        else if ( this.notrouble[kind] ) {
            listObj.innerHTML = this.notrouble[kind] ;
        }
        list.appendChild(listObj) ;
        
        var div = document.getElementById('cocoTrouble-update-'+kind) ;
        if ( div && this.info[kind].update ) {
            var txtObj = document.createTextNode('Update: ' + this.info[kind].update) ;
            div.appendChild(txtObj) ;
        }
        return true ;
    }   //  end of loadComplete()
//  ===
,   loadScript      :   function ( src, charset ) {
        var scriptStr = [
            '<scr' + 'ipt type="text/javascript" '
        ,   'charset="' + ((charset)?charset:'utf-8') + '" '
        ,   'src="' + src + '"></scr' + 'ipt>'
        ].join('') ;
        document.write( scriptStr ) ;
    }   //  end of loadScript()
//  ===
,   init            :   function () {
        this.loadScript( "http://homepage3.nifty.com/furyu/cocoMaintenance.js?reload=" + (new Date).getTime() ) ;
        this.loadScript( "http://homepage3.nifty.com/furyu/cocoTrouble.js?reload=" + (new Date).getTime() ) ;
    }   //  end of init()
}   //  end of cocoTrouble object definition

cocoTrouble.init() ;

//-->
</script>
このスクリプトでは、JavaScript形式に加工済のメンテナンス/トラブル情報をダウンロードして表示しています。
元情報は、@niftyの『ココログのメンテナンス情報』及び『ココログのトラブル情報』から、自宅サーバにて定期的に取得し、JavaScript形式に加工したあと、@niftyのホームページサーバ上にアップロードしています。
従って、自宅サーバでトラブルが発生すると更新されなくなります(汗)。
本当は『お知らせココログ』の情報が使えれば良いのですが、今ひとつ加工しにくいこともあって、このような形となっています。
ただ、@niftyのメンテナンス/トラブル情報は、お知らせココログのものよりも更新が遅れるようなのですね……うーむ。
■修正履歴
  • [2008/12/20]
    1. 外部スクリプト化に伴う設置用スクリプト修正。
      外部スクリプト化した後、記事を修正するのをすっかり忘れていた……。
  • [2007/01/24]
    1. 終了時刻が現在よりも前の場合、classを変えるように修正(cocoTroubleDate→cocoTroubleDatePassed)。
      newperiodを設定して過去の情報もしばらく表示するようにしている場合に属性(色等)を変えられるようにした。
    2. Firefoxで動作が不安定になるのを修正。
      スクリプト中で別の外部スクリプトを貼り付けたい場合、documentが閉じられる(onload状態)まではdocument.write()を、閉じられてからはappendChild()を、それぞれ使用した方が良い模様。
    3. loadComplete()内の処理で、既に存在する要素のinnerHTMLを直接変更していたのを、新規に作成した要素をappendChild()する形に修正。
      こうしておかないと、IE6で誤動作する可能性有り。

« 背中で語る | トップページ | 洋式お盆のこと »

ウェブログ・ココログ関連」カテゴリの記事

おもいつき」カテゴリの記事

コメント

コメントを書く

(ウェブ上には掲載しません)

トラックバック


この記事へのトラックバック一覧です: 【ココログ】メンテナンス・障害情報を表示するスクリプト:

« 背中で語る | トップページ | 洋式お盆のこと »

戻るリンク追加

カレンダー

2020年3月
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31        

ココログカレンダーPlus(旧2)

検索


    • Web全体 サイト内
    • 蔵書のISBNを入力して下さい
    • はじめる前
      初級者向け
      上級者向け
      ブログ紹介
      結果を表示

コメントリストツリー化

無料ブログはココログ