先日、東京てら子Vol.16『ドキッ、JavaScriptだらけの240分』にて発表を行って来ましたのでそれについて簡単にまとめた物をアップします。

Link:東京てら子

  • -

まずはじめにこのテーマを選んだ理由ですが、JavaScriptをこれから学んでみたいという人向けにこういう練習環境もあるんだと言う事を知っておいて貰いたかったので選びました。
かなりニッチな内容だったかと思いますw



■そもそもIRCクライアントってなんぞ?
簡単に言うとサーバーを利用したチャットソフトです。
集まった人達は部屋を作って仲間内でチャットするなどが可能です。



■今回使用したIRCクライアント
LimeChat2:http://limechat.net/



JavaScriptの設定方法
1) JSファイルの設置
 OSやインストールしたバージョンによって依存するようです。
 [設定]->[スクリプトの設定]から開かれるウィンドウの[スクリプトフォルダの表示]を選択すると設置するフォルダが開かれますのでそこで確認可能です。

2) クライアントの設定
[設定]->[スクリプトの設定]から開かれるウィンドウに1)で設置したJSファイルが表示されているはずなので、ファイル名横のIRCnetと書いてある場所で右クリックを行います。
 そうすると○マークが付きます。これが認識された印になります。

■実際に処理を作ってみる
1) 誰かの入力に対して反応する処理 (簡単に言うとbotみたいな処理)
 ・以下の関数を使用

function event::onChannelText(prefix, channel, text) { }
誰かが発言したときに呼び出されるハンドラ
prefix: 発言者の情報
channel: チャンネルの情報
text: 発言内容

void send(String target, String text)
指定したチャンネルにテキストを送信する
target: 送信するチャンネル情報
text: 送信するテキスト

実際にここで作成したコードは以下のようなものです。

function event::onChannelText(prefix, channel, text)
{
	if( text.match(/^おはよう$/i) )
	{
		send(channel,'おはようなぎ');
	}
	if( text.match(/^さようなら$/i) )
	{
		send(channel,'さようならいおん');
	}
}

正規表現を使って発言内容を解析し、それに対応したテキストをチャンネルに送信しています。

2) Web API を利用
LimeChatではActiveScriptが実装に利用されています。
そのため、XML HTTP などの ActiveX コントロールを使うことができます。
今回はlivedoorが提供しているWeatherHacks
というお天気情報検索APIを利用してクライアント上に
検索結果を表示する処理を作ってみます。

まずこのようなコードを書きます

var req = new ActiveXObject("Microsoft.XMLHTTP");
if (req) {
  req.onreadystatechange = function() {
    var xml = req.responseXML;
    var pinpoint = xml.getElementsByTagName("pinpoint");

    if( pinpoint[0] != null ){
      var locations = pinpoint[0].childNodes;
      for( var i = 0; i < locations.length; i++ ){
        var locationchild = locations[i].childNodes;
        send(channel, "[地域]" + locationchild[0].text + " [URL]"+ locationchild[1].text ); // ここで解析したデータをチャンネルに送信
      }
    }
  }
}
var url = 'http://weather.livedoor.com/forecast/webservice/rest/v1?city=63&day=tommorow'; // WebAPIの部分
req.open('get', url, true);
req.setRequestHeader('User-Agent', 'Mozilla/5.0');
req.send('');

実際に送られてきたデータは以下のような物になっています。

<lwws version="livedoor Weather Web Service 1.0">
<author>livedoor Weather Team.</author>
<location area="関東" pref="東京都" city="東京" />

<pinpoint>

<location>
<title>千代田区</title>
<link>http://weather.livedoor.com/p/13/63/13101.html</link>
<publictime>Tue, 21 Jun 2011 00:00:00 +0900</publictime>
</location></pinpoint>


■作ってみて動かなかった場合
エラーが出ている可能性があります。
先ほどのスクリプトの設定の時に表示したウィンドウからスクリプトコンソールの表示を選択します。すると下のようなウィンドウが表示されますので、そこでエラーの有無が確認できます。


その他にもsetIntervalやsetTimeoutなどが使えるため定期処理を行うことも可能です。
ファイル入出力系の処理もありますので基本的な部分は触れるかと思います。
詳しくはLimeChatのドキュメントに載っていますのでそちらを参照してください。

LimeChatJavaScriptを勉強するのになかなかいい環境だと思いますので是非みなさん使ってみてください。

  • -

ここまでが先日の東京てら子で発表した内容となります。
ここまで読んでいただきありがとうございました。