Javascript:XMLを使った日時指定可能なメッセージ表示

JavascriptとXMLを使って指定した日時の間だけメッセージを表示します。仕事で運営しているECサイトで指定された日時の間だけサーバーメンテナンスのお知らせを表示することになりました。しかも立て続けに2回!!いちいち差し替えるのは面倒なので指定した日時になったら自動的にメッセージの表示・非表示をするスクリプトを作りました。 XMLないの<news>~</news>を増やすことで複数のメッセージが表示できます。

※XMLの解析にKawa.netさんの JKL.ParseXMLを使用しています。こちらからライブラリをダウンロードしてください。
→ライブラリのダウンロード

Javascriptのソース
<script>
<!--
//ニュース情報が入ったXMLファイル
var url = "news.xml";
//XML解析オブジェクト
var xml = new JKL.ParseXML( url );
//表示メッセージ
var message="";
//XMLデータ読み込み
var data = xml.parse();
//今日の日付ゲット
date = new Date();
var y = String(date.getFullYear());
var mt = String(date.getMonth() + 1);
if(mt.length<=1) mt = "0"+mt;
var d = String(date.getDate());
if(d.length<=1) d = "0"+d;
var h = String(date.getHours());
if(h.length<=1) h = "0"+h;
var today = Number(y+mt+d+h);
if(data!=null){
//データ数分繰り返す
for(var i = 0;i < data["data"]["news"].length; i++){
//開始時日ゲット
var s_date = data["data"]["news"][i]["sdate"];
//終了日時ゲット
var e_date = data["data"]["news"][i]["edate"];
//開始・終了日時生成
s_date = s_date.replace("/", "");
s_date = s_date.replace("/", "");
s_date = s_date.replace("/", "");
e_date = e_date.replace("/", "");
e_date = e_date.replace("/", "");
e_date = e_date.replace("/", "");
s_date = Number(s_date);
e_date = Number(e_date);
//指定日時内ならメッセージ表示
if((today >= s_date) && (today <= e_date)){
//メッセージの最初だけ
if(message==""){
message = "<div id='news'>";
}
message += data["data"]["news"][i]["title"]+"<br>";
message += data["data"]["news"][i]["description"];
message += data["data"]["news"][i]["ps"]+"<br><br>";
}//if
}//for
//表示するメッセージがあれば表示
if(message!=null){
message+="</div>";
document.write(message);
}
}//if
//--></script> 

XMLファイル <data>
<news>
<!--2005年11月19日0時から-->
<sdate>2005/11/19/00</sdate>
<!--2005年11月22日9時まで表示-->
<edate>2005/11/22/08</edate> 
<!--メッセージのタイトル-->
<title> サーバメンテナンスのお知らせ</title>
<!--メッセージ本文-->
<description> メッセージです。
</description>
<!--追記がある場合はこちらに-->
<ps>
</ps>
</news>
</data> 

**** Javascript参考書 ****
古い入門書しか持っていないので新しく購入したいなぁ。Javascriptといったら古旗さんの本は外せませんね。
→改訂第3版 JavaScriptポケットリファレンス Pocket reference

→速効!図解プログラミング JavaScript

→JavaScript逆引きクイックリファレンスfor Windows & Macintosh


それ以外のおすすめ
→JavaScriptビジュアル・リファレンス

Posted in Javascript | 3 Comments

FLASH:Actionscriptで湯気

Actionscriptで湯気を作ってみました。画面をクリックすると湯気の表示・非表示を切り替えます。湯気のアタッチ時に湯気の移動スピードや、幅、高さ、それと移動しながら大きさやアルファを変化させるので、その目標値を設定。onEnterFrameで湯気の左右の移動と角度の変化、アタッチ時に設定した目標値へ近づける処理をしています。湯気そのものはPhotoshopのエアブラシでちょちょっと作ったものです。
→湯気を見る

詳しい解説を書いたので興味のある方はどうぞ。

***** おすすめの参考書 *****
macromedia FLASH ActionScriptスーパーサンプル集
FLASH ActionScript 2.0入門完全ガイド+実践サンプル集 [CD-ROM付]

Posted in FLASH Actionscript | Leave a comment

PHP:1行おきに色をつける

DBのデータの最終更新日を知りたいとのことで社内向けにツールを作る. 見やすい表にするために一行おきに背景色を変えることに.やってみると簡単で奇数行と偶数行でそれぞれ違うスタイルシートを設定すれば一行おきに色を変えられるます 奇数か偶数かは今何行目かをもっている変数を2で割った余りを求めると偶数/奇数がそれぞれ0/1という結果にます。

PHPソース
print "<table>";
for($i = 0; $i< 10; $i++){
$sel = $i % 2;
print "<tr><td class=’tdBack$sel’>$data[$i]</td></tr>¥n";
}
print "</table>¥n";

CSS
td.tdBack0 {
background-color:#ffa000;
}
td.tdBack1 {
background-color:#ffffff;
}

●↓いつも机の上においているPHPの参考書

→[改訂版] PHP ポケットリファレンス

Posted in PHP | Leave a comment

Essential Actionscript 2.0

10月に購入した「 Essential Actionscript 2.0」。Actionscript2.0によるOOP(オブジェクト指向プログラミング)の解説本.もたもた読んでいるうちにはや一ヶ月半。まだまだ理解出来てない所が多いけれども読む前に比べたら雲泥の差。最後まで通しで読むだけでもためになりそう。来週中には新しい本が届きそうだしそろそろペースをあげなくては。

Posted in FLASH Actionscript | Leave a comment