2/3 Wonderfl本サンプル（Twitterの検索）

Twitterの検索

「yahoo pipes」のドキュメントなど見てますが、全然使い方がわからないので、Wonderfl本のサンプルを勉強したいです。今回は「TwitterAPI」を使ったプログラム。語句を検索して結果を表示するシンプルなものです。

forked from: Twitterの検索 - wonderfl build flash online

KeyCode定数サンプルでは、

[cc lang="actionscript"] if (e.keyCode == 13) { serch(e.currentTarget.text);} [/cc] keyCodeの１３番はEnterキーを表しているので、１３が押された場合serch()が開始されます。

[cc lang="actionscript"] var myURLLoader:URLLoader = new URLLoader(); myURLLoader.addEventListener(Event.COMPLETE,onCompleteXML); myURLLoader.addEventListener(IOErrorEvent.IO_ERROR,onIoError); var xmlURL:String = "http://search.twitter.com/search.atom?q="; //encodeURIComponent()を使うことによって、#や日本語にも対応 xmlURL += encodeURIComponent(serchWord);
myURLLoader.load(new URLRequest(xmlURL));

[/cc]

ここはお馴染み「URLLoader」「URLRequest」を使ってます。ここで初めて出てくる「encodeURIComponent()」はAjaxで送信した日本語文字(～など)が，サーバ側で文字化けする場合への対処しています。 encodeURIComponent()

ページのエンコーディングからUTF-8への変換
その変換結果の，URLエンコーディング

の両方を行ってくれるみたいです。ただ難しそうですので今後もう少し勉強が必要かも。

[cc lang="actionscript"] 　　　　　　　//○　先ほどURLLoaderで読み込んだデータをXML型にキャスト var myXML:XML = new XML(e.currentTarget.data); //namespaceを設定 default xml namespace = new Namespace("http://www.w3.org/2005/Atom");

        //ヘッダーの下、下記に記載のxmlデータの配置の際に利用します。
        var tfY:int = 0;
        //要素を取り出して、textFieldを作りならべる
        var itemLength:int = myXML.entry.length();　// xmlの<entry>タグが何個あるか調べて、その数をitemLengthにおさめている。

        for (var i:int = 0; i < itemLength; i++) {
            //xmlからlink,authorName,titleの各値を取得
            var link:String = myXML.entry[i].link[0].@href;　//　＠はアトリビュート
            var authorName:String = myXML.entry[i].author.name;
            var title:String = myXML.entry[i].title;
            //アイコン画像のURLを取得
            var imgURL:String = myXML.entry[i].link[1].@href;
            //bmpフォーマットのアイコン画像を使っている人も少なくないため、Flashで使えるファイルの拡張子かどうかを判別       
                            // substr()は文字を抜き出すメソッド。-4をしていしてるのは後ろから４文字抜き出している意味すなわち、.jpg .gif  .png　などの拡張子を抜き出している。
            var extention:String = imgURL.substr( -4);
                            //  toLowerCase()  文字列を全部小文字にします。
            extention = extention.toLowerCase();
            if (extention != ".jpg" && extention != ".gif" && extention != ".png") {
                //Flashで使える画像の拡張子ではなかった場合にはデフォルトアイコンを指定
                imgURL = "http://s.twimg.com/a/1254440757/images/default_profile_mini.png";
            }
            //画像のファイル名が日本語などの規定外の文字である場合を考慮しエンコードする
            imgURL = encodeURI(imgURL);     
            //小さい画像で十分なので、名前を差し替える
            imgURL = imgURL.replace(/_normal\./, "_mini\.");

[/cc]

参照にしている「http://search.twitter.com/search.atom?q=wonderfl」の中身を抜粋 [cc lang="xml"] <?xml version="1.0" encoding="UTF-8"?> 早いとこwonderfl進出したい。 k_nanba (Nanba Koji) http://twitter.com/k_nanba

[/cc]

まずはnamespaceを設定している。 xmlのデータの中に「xmlns」とすでにnamespaceの場所がしていされているのでそこに記載のある「http://www.w3.org/2005/Atom」を参照する。

[cc lang="actionscript"] var extention:String = imgURL.substr( -4); extention = extention.toLowerCase(); [/cc] imgURL.substr( -4); アイコンの拡張子を抜き出している。終わりから４つの文字を抜き出している。subster()は文字を抜き出す際のメソッド。 toLowerCase(): 文字列を全部小文字にします

encodeURI エスケープシーケンス：コンピュータシステムにおいて、通常の文字コードでは表せない特殊な文字や機能を表すための一連のバイト列。エンコード：一定の規則に基づいて符号化すること。データの圧縮や暗号化などがこれにあたる

[cc lang="actionscript"] var htmldata:String = ""; htmldata = ""; htmldata += ""; htmldata += "" + authorName + " " + title + "";

            //検索結果のテキストフィールド
            var myTextField:TextField = new TextField();
            myTextField.width = 460;
            myTextField.x = 2;
            myTextField.wordWrap = true;
            myTextField.background = true;
            myTextField.backgroundColor = 0xFFFFFF;
            myTextField.border = true;
            myTextField.borderColor = 0x39CCFF;
            myTextField.htmlText = htmldata;
            myTextField.autoSize = "left";
            //テキストフィールドのy座標はtfYに加算していくことにより、決定
            myTextField.y = tfY;
            tfY += myTextField.height + 3;
            _resultStage.addChild(myTextField);
        }

[/cc]

最後にxmlデータから抜き出した情報を画面に配置していきます。

参考文献