Ajax Archive

jsapiってなんだよまったく。GMap2とかがgoogle.maps.Map2になるって？まあ、名前変更しといたら動いたけどさ。というわけで、いろいろはまったけど、悔しいのがインターフェースの日本語化。マップの右上のMapとかSateliteを地図とか航空写真にしたいの。
GMap2の時代は（といってもその時代のこともよく知らないんだけど古いWebの情報によると）、api受け取るときのURLを

<script src="http://maps.google.com/maps?file=api&v=2&key=hoge" type="text/javascript"></script>

じゃなくて（hogeはapiキー）

<script src="http://maps.google.co.jp/maps?file=api&v=2&key=hoge" type="text/javascript"></script>

って感じにしとけば日本語になった。（.com⇒.co.jp）
でもjsapiだとこれだとだめ。どうしたらいいんだと結構探し回ったら、結局ドキュメントに書いてあった。。
http://code.google.com/intl/ja/apis/ajax/documentation/

google.load("maps", "2", {"language" : "ja_JP"});

でも、日本語にならない！えぇえええーjsapiってなんなのーーーって思ってたら、こっちのほう
http://code.google.com/apis/ajax/documentation/
にはlunguageで指定できるのはISO639って書いてある。サンプルは全く同じだけどISO639って何だと思って調べたら日本語はja・・・。そういうわけで、

google.load("maps", "2", {"language" : "ja"});

ってやればちゃんと日本語になったというわけさ！

疲れた。
以上

マイクロソフトカンファレンスが本日（4/15）から2日間開催されてます。
第一日目に参加してきたので簡単に報告。

場所：ザ・プリンス パークタワー東京
日時：2008-04-15

１．基調講演
　時間になると突然ドラム音が鳴り響き、なぜかライブが始まった。「あれ？会場間違えた？」などと思いながら最後まで聞いた。そしたらステージのセンターがババーーンと開いて草野仁（ふしぎ発見の）が登場。さすがマイクロソフト。
　今回のカンファレンスのテーマがHEROなので「ヒーローとは」的な話を始める仁くん。なぜか松井（ヤンキースの）の話になり10分くらい延々と松井がいかにヒーローであるかを語る。「まさか松井登場か！？」と誰しもが思ったところで仁くん退場。普通にマイクロソフトのジェフ・レイクスとやらが代わって登場。期待させやがって。
　で、そこからはマイクロソフトの製品やら戦略やらの話。フォースカフェとか言うあるのかないのか私は知らない会社がVisual Studio 2008をうまく使ってプロジェクトを進めるデモが3人のプレゼンターによって行われた。（その間時々仁くんも登場してた。）しかしまあ、Visual Studio 2008とWindows Server 2008とかを使ってなかなか面白いことができるんだなという感じ。ここで強調されていたのはVisual Studio 2008でWebページをお絵かき的に作れるところと、仮想サーバによって負荷コントロールが容易だとか言う話、だった気がする。
　最後に日本のマイクロソフトの樋口さんが出てきてなんか言ってた。（あと伊藤忠の後藤さんが出てきてなんかしゃべってたが、たいしたことは言ってない。と思う。）

２．昼飯
　基調講演が終わると12:20。昼飯時。レストラン込みすぎ。昼食は（Googleとは違い）無料ではなかった。完全にキャパを超えたレストランは30分待ち。疲れた。

３．Visual Studio 2008の概要
　まあ、本当に概要。「VisualStudioは～という3本柱を軸に機能を提供します。しかし今回はこれとはちがった視点で～」お前はあほかと。じゃあ3本柱説明スンナと。
　閑古休題。WPF（Windows Presentation Foundation）っていうのがWebページをグラフィカルに簡単に作成できそうでちょっと興味がわいた。今度調べる。あとはWebアプリケーションとかLINQの話があったが、それは別セッションで個別にやっていたのでそっちで。

４．進化したASP.NETで実現するリッチなWebアプリケーション開発
　実際にコードを書きながらデモが行われた。Visual Studioもいろんなことができるようになったんだなーという感じ。Javascriptのデバッグとか、ドラッグ＆ドロップでHTMLのフォームとかを作れたり、作ったフォームにロジックを乗せるのもフォームのプロパティをちょこっといじったりでできるという。ログイン処理をドラッグ＆ドロップで作れたり、マスターページを作って全部のページのベースにできたりと、ビジュアル・フレームワークって感じ。ASPで作るならなかなか便利そうではある。MicrosoftAjax.jsなんてものもあるんだね。Silverlightの話も期待したが、名前くらいしか出てこなかった。とりあえず聴講者多すぎ。

５．データアクセスは次の時代へ。LINQを活用した効率的アプリケーション開発術
　結論から言うと、これが一番面白かった。これもコードを書きながらデモが行われた。LINQっていうC#からでもVBからでも使えるSQLっぽい構文で、オブジェクトからもDBからもデータを抽出できるというなかなか面白そうな機能。これは熱い。例えばC#で配列から一部を抽出する場合、

int[] data = {1, 2, 3, 4, 5};

var hoge = from foo in data
             where foo > 3
             orderby foo desending
             select new {
                 foo
             };
hoge.ToList();

って感じにするとhoge.ToList()で[5, 4]ってのが得られる。（コードは記憶だけを頼りに何も見ずに書いているので細かいところは間違っているかもしれないが、まあこんな感じ。）
　データベースからデータを抽出する場合も同じ。LINQオブジェクト（？）にデータソースとしてデータベースを関連付けておいて、あとは同じでよいのだ。これはいい！と思うんだけど、これはいい！と思ったGoogleマップレットもGoogle Gearsもぜんぜん流行らないので私の直感は当てにならない可能性がある。

６．展示会
　マイクロソフトのパートナー企業の展示会。いまいち面白いものはなかった。いや、まじで。あと、なにも説明してないのにアンケートだけ求めるのはどうかと思うよ、キャンペーンガールのねえちゃん。ばかうけが置いてあったのは評価できるが、私がいったときにはすでに弾切れだったため、評価ダウン。

７．休憩
　で、そろそろ疲れたので休憩。しようと思ったけど休憩できる場所がない。廊下にいすが全部で11個ほど確認できたが何千人かいるんじゃなかったっけ？ぜんぜん足りん。カフェっぽいのを見つけたがコーラ700円、ありえん。すごいのどが渇いてて、背に腹は代えられないのでカフェに入って、仕方がないのでチョコレートサンデーを食った。飲み物くらい用意すれ、マイクロソフト。

８．ビジネスを支える新世代サーバーオペレーティングシステム Windows Server 2008概要
　IISが7.0になってがんばりました、って話。Zendと協力してFastCGIでPHPが高速動作するようになったらしい。頑健性も増したとか。

９．おみやげ
　というわけで、とりあえず2つ以上のセッション参加でVisual Studio 2008、Windows Server 2008、SQL Server 2008の製品版がもらえる。もろた。あとVistaの体験版も。まあ、ここは計画通り。

１０．エピローグ
　なんと、セッション参加証でXBOX360の抽選が行われとった。結果から言うと外れたわけですが、30人くらいに当たる模様。明日も30人くらいに当たるんではないでしょうか。ただいけてないのは、当選番号を小さいボードで掲示するだけのため、人が殺到。ぜんぜん見えん。そしてぜんぜん人が掃けない。なぜかと思っていたら、番号が見えたときに理解した。表に当選番号が手書きで書いてあるんだが、番号がソートされていない。そして大体の人が参加証を3、4枚持っている。・・・明日は改善されるかも。

１１．感想
　まあまあおもしろかった。ただ、初日のためか全体的に手際がいまいち悪かった。

タグ：Microsoft Conference 2008 Day-1

以上

IE7のキャッシュがすごい。
AJAX的な感じで動的に読み込んでるにもかかわらずキャッシュされて更新されない。
例えばhttp://red-treasure.com/monitor/
なんというめんどくさいブラウザ。
インターネットオプションの全般→閲覧の履歴で「Webサイトを表示する度に確認する」にチェックをつけたら更新されるようになった。

以上

またjsonか。いちいちつまづくのでメモ。

例えばjQueryでajaxを以下のようにして使うことを考える。

function display(data) {
    // dataがきっとJSON！
}
$.get("hoge.php", null, display);

上記の場合、display()がコールバック関数での第一引数（data）にはhoge.phpの出力が入ってくる。
hoge.phpが例えば

[100,200,300]

って返すようになっているとき、display()でdataをJSONとして使うには

function display(data) {
   jsondata = eval(data);
   if (jsondata[0] == 100) {
      ～～～
      ～～～
   }
}

見たいな感じで使う。dataには文字列として入ってくるので

data = "[100,200,300]"

となってるから注意。
もしhoge.phpが

{"a":100,"b":200,"c":300}

な感じで連想配列になっている場合は、

jsondata = eval("("+data+")");

って感じで丸カッコを両端にくっつけた上でevalすればいいっぽい。

以上

jQueryとCakePHPの異種格闘技戦。jQueryが勝っとる。これからはjQueryか。prototypeはそれ自体が汎用的な単語のため、フェアな勝負にならない。

そういうわけでjQueryのajaxを使ってみて（とりあえず挫折）したのでメモ。（いや、ajaxを使うというだけなら簡単。使い方が悪いだけ。）
$.ajax()を使えばいい。

$.ajax({
    url: 'hogehoge.htm',
    type: 'POST',
    dataType: 'json',   // xml、 html、script、json
    data: params,
    timeout: 1000,
    error: function(){
        // エラー時
        alert('Error');
    },
    success: function(htm){
        // コールバック
    }
});

上記コードで’hogehoge.htm’にpostでparams（JSON）を送ったことになります。
dataはあってもなくても良いような雰囲気です。
ただし、上記のような単純なものはもうちょっと簡単に書けます。

$.post("hogehoge.htm",
          {"key":params},
           function(){});

paramsは送りたいデータです。json形式で渡すのが良いらしい。functionはコールバック関数。メソッドをgetにしたい場合は、$.getでいい気がする。$.postも内部でajax()を呼んでいます。

以上

DSでオープンソース。そのうち手を出してみたいですな。

ブラウザでツールチップを出したいと思い、jQueryのjTipっていうプラグインを使ってみたのでメモ。ここの「DownLoad This Example」からダウンロードしたけど、それでいいんだろうか？

１．初期化
jtip.jsを読み込めば初期化されるが、自分の初期化プロセスに組み込むときは

JT_init();

を呼べばいいと思う。たぶん。

２．使い方
ツールチップを出したい部分をaタグで囲む。表示したい内容を返すページのURLをhrefに書く。?以降は多分ウインドウ幅。
idはちゃんと指定する。このidで要素を取得して、その近くにツールチップを出すっぽい。
同封のglobal.cssを使う場合はclass=”jTip”。この場合、同封のimagesを使うとロード中の画像とか出てカッコイイ。Ajaxです。
nameで指定したものがツールチップのタイトルになる。

<a href="hogehoge.htm?300" id="foo" class="jTip" name="bar">ツールチップ</a>

３．CakePHP
CakePHPで使ってみた。まあ、別にどうということはないけど。ちょっとはまったことは、hrefのURL。CakePHPとかの場合、URLが「コントローラ名＋メソッド名＋引数」などになって、URL相対指定するとわけがわからないURLになってしまう。
ということで絶対指定すればいいわけだが、あるいは「$this->webroot」をビューでechoすれば、ルートからのURLが得られます。

webroot = "<?php echo $this->webroot; ?>";
$(function(){
    $("#tooltip").html('<a href="'+webroot+'hogehoge/hoge?300" id="foo" class="jTip" name="bar">ツールチップ</a>');
});

<div id="tooltip"></div>

以上

wordpressのwp.Vicunaは軽そうでいいんだけど、どうもiG:Syntax Hiliter のレイアウトがくずれるな。

最近CakePHPを使ってみているけれども、ちょっとはまったのでメモ。
はまった状況は下記の通り。

1. 現象
   下記をもちいた文字列コンプリーション機能を持つテキストボックスの作成において、意図したとおりの動作をしないケースがあった。
   1. CakePHP
   2. jQuery
   3. autocompleteライブラリ(JSON使用)
   4. IE

   ただし、Firefoxでは正常に動作した。

2. 実装
   今回の問題となった実装を述べる。
   CakePHPを用いて作成したWebページにおいて、Ajaxによる文字列コンプリーションを行った。
   具体的な実装方法は以下の通り。
   1. jQueryのautompleteプラグインを用いてコンプリーション機能を持つテキストボックス(input type=”text”)を作成する。コンプリート用のデータはJSON形式でJavascript側に渡すとする。データ取得用のURLは“～～/モデル名/autocomplete/”とする。
   2. Javascript側に渡すJSONデータを返すページをCakePHPで作成する。適当なコントローラにfunction autocomplete()を追加し、対応するビュー(autocomplete.thtml)を作成する。 autocomplete()内で$this->layout = “ajax”;とし、余計なhtmlタグを出力しないようにする。
   3. autocomplete.thml内にJSON形式でデータを出力するコードをかく。
3. 原因
   “～～/モデル名/autocomplete/”で返すページにCakePHPが自動的に表示にかかった時間を出力していた。
   出力されていたのはHTMLコメント形式のデータ<!– x.xxx s –>。
   結果として返されていたデータは下記のような形式となっていた。
   [‘aaa’,’bbb’,’ccc’] <!– 0.123s –>
   jQueryのJSONパーザにおいて、Firefoxでは上記形式を正しくパーズできるが、IEでは処理できずにエラーとなっていた。
4. 対処
   “config/core.php”で定義されているdefine(‘DEBUG’, 1);を0にすれば、時間出力はされなくなるので、実際にリリースする際は問題ない。ただし開発中はDEBUGを定義しておきたいため、今回は “webroot/index.php”の最下段

   
   if (Configure::read() > 0) {
   echo "<!-- " . round(getMicrotime() - $TIME_START, 4) . "s -->";
   }
   

   をコメントアウトした。

5. 参考文献
   1. CakePHP
   2. jQuery
   3. autocomplete

以上