サイドバーに表示される『ココログからのお知らせ』だと、現状、メンテナンス/障害情報があわせて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>
<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 += '<li><div class="cocoTroubleDate">' + info.from + '~' + info.to + '</div><div class="cocoTroubleContent">' + content + '</div></li>' ;
}
}
if ( printInfo != '' ) {
list.innerHTML = printInfo ;
}
else if ( this.notrouble[kind] ) {
list.innerHTML = '<li>' + this.notrouble[kind] + '</li>' ;
}
var div = document.getElementById('cocoTrouble-update-'+kind) ;
if ( div && this.info[kind].update ) {
div.innerHTML = 'Update: ' + this.info[kind].update ;
}
return true ;
} // end of loadComplete()
// ---
, loadScript : function ( src, charset ) {
var callScript = document.createElement("script") ;
callScript.type = "text/javascript" ;
callScript.charset = ( charset ) ? charset : "utf-8" ;
callScript.src = src ;
var target = document.getElementById('cocoTrouble') ;
if ( target ) {
target.appendChild( callScript ) ;
}
} // 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のメンテナンス/トラブル情報は、お知らせココログのものよりも更新が遅れるようなのですね……うーむ。