Google Gadget API part12

では,インラインガジェットの作り方について見てみましょう.





Step1:口をすっぱくいいますが,本当にインラインガジェットにするかどうかをよく考えてね.インライン化は,DOMコンテナを何らかの形でいじくるときに必要です.つまり,ガジェットの外側(iframeでは無理でしたね)をいじくるときです.たとえば,DOMを変更するガジェットが,開発モジュールそれ自身だったことを考えてみます.ガジェットがサイズ変化するテキストを使おうとを考えている場合には,インライン化はよろしいかと思います.具体的には,RSSフィードのガジェットだったりね.インライン化するにあたっては,読み込み時に遅くなったり,ハングアップしたりしてもなんもおしえてくれません.で,HTML-typeに対してのみインライン化は利用することができます.URL-typeの場合にはダメです.





Step2:です.ガジェットスペックファイルのrender_inlineをoptionalにしましょう.


ここ->render_inline="optional


そういった設定をすると,ガジェットをインラインライン化することができます.








Step3:


他のガジェットで使われている名前空間とかぶらないように,HTMLやjavascriptを変更しましょう.


・すべての,フォーム要素をname=fooってな感じから,name=foo__MODULE_ID__へ変更してちょ.


・idも同じ,id=fooからid=foo__MODULE_ID__へ


javascriptの関数名をfuncnameからfuncname__MODULE_ID__へ


javascriptのグローバルな変数名をvarnameからvarname__MODULE_ID__へ


__MODULE_ID__に関連した話は,Robust Gadgetsの項目をみてちょ.





Step4:


君の書いたjavascriptコードが_IG_RegisterOnloadHandler()でラッピングされているか確認してね.インラインガジェットは親ページが読み込まれるまで,表示(==レンダリング)が遅らされます.このステップは重要でして,もしなければ,よくわからん振る舞いをすることになるからです.注意してほしいのは,iframeの時には,onload hanlerをバインドする必要はなかったのね.なぜかというと,javascriptコードが自動的にその辺をやってくれていたからなんですね.





Step 5:


パーソナライズドホームページに開発者モジュールを追加してください.もしやってないなら,もう説明しているからそっちみてちょ.





Step 6:


作ったガジェットを追加してちょ.





Step 7:開発モジュールで,追加したガジェットのインラインチェックボックスをONにしてね.こうすうると,インライン化を強制可能です.以下,しつこいので省略.





Step 8:テストしようぜ.


他のガジェットととのテストをしてね.あと,もう一回ホームページに追加すれば,自分自身のガジェット同士の問題がないかもテストできます





Step9:


準備ができたら,グーグルへ追加してみそ.