ローカライズについて

国際化したガジェットをつくって
世界のみんなに使ってもらおうとしたときは
日本語バージョンと英語バージョンの
メッセージだけを変更すれば基本OKです。
文字長がかわるのでレイアウトを確認しないといけないですが。

どうやって実現するかというと
各ガジェットでローカライズ対象ディレクトリが大体あります。
そこにファイルをおいておきます。
ファイルを探そうとしたときに対象ディレクトリになかったら
ローカライズ対象ディレクトリを探してくれるので
それでローカライズを行うことができます。

ローカライズするメッセージは
JavaScriptのファイルとします。
そしてメッセージを入れておく配列をつくり
配列の連想キーにメッセージを取得するキーとなる文字列、
値にそのメッセージを入れておくのがお勧めです。

そして取り出すときにはそのJavaScriptの配列に対して
メッセージキーをいれて表示したいメッセージを取得します。

言葉で表現するのは難しいですね。
まあ、こんな感じです。
 ローカライズメッセージのJavaScript:
  [<ベースディレクトリ>/<ローカライズ対象ディレクトリ>/localizedStrings.js]
   var localizedStrings = new Array();
   localizedStrings[“foo”] = “bar”;

 呼び出しJavaScript:
  [<ベースディレクトリ>/main.js]
  var msg = localizedStrings[“foo”];

setTimeoutについて

イベントを受け取って別スレッド処理を行いたいときなど
タイマーのsetTimeout、setIntervalなどを使用するかと思いますが
Google デスクトップ ガジェットとYahoo!ウィジェットだけは
使えないのです。

Google デスクトップ ガジェットではviewオブジェクトの配下に
setTimeoutがあり第1引数には通常、呼び出したいメソッド
または処理を記述した文字列を渡すのですが
文字列しか受け取ってくれません。

逆にAdobe AIRではメソッドしか受け取ってくれませんので
これも要注意です。

Yahoo!ウィジェットではTimerオブジェクトを使用します。
こんな感じで。
 Google デスクトップ ガジェット:
  iid = view.setTimeout(‘foo()’, 100);

 Yahoo!ウィジェット:
  var timer = null;
  if(timer != null){
   timer.ticking = false;
   timer.reset();
  }
  if(timer == null){
   timer = new Timer();
   timer.interval = 100 / 1000; // sec
   timer.onTimerFired = checkUpdate;
  }
  timer.ticking = true;

クリップボードへのコピー

クリップボードへのコピーを行い時に
Windows サイドバーガジェット、Mac OS X Dashboard ウィジェット、
Adobe AIR、iGoogle ガジェット(IEでみたときのみ)、
Yahoo!ウィジェットでは拡張APIをつかって行えます。
iGoogle ガジェット(IEでみたときのみ)は
Windows サイドバーガジェットと同じ方法なんだけれどもね。

Mac OS X Dashboard ウィジェットは拡張APIというよりも
シェルにアクセスできるのでシェルを通じてのアクセスになります。
もちろんマニフェストファイルに
 <key>AllowSystem</key>
 <true />
と記述しておかないとセキュリティエラーで動かないです。

それ以外ではそのくらいの拡張API作っておいてもよさそうなんだけれども
やるのであればFlash経由で
クリップボードへアクセスするしかないようです。

そのやり方は下記です。
 Windows サイドバーガジェット:
  clipboardData.setData(“Text”, value);

  clipboardData.getData(“Text”);

 Mac OS X Dashboard ウィジェット:
  widget.system(“/bin/echo -n ‘” + value + “‘ | /usr/bin/pbcopy”, null);

  value = widget.system(“/usr/bin/pbpaste”, null).outputString;

 Adobe AIR:
  var copyObj = air.Clipboard.generalClipboard;
  copyObj.clear();
  copyObj.setData(air.ClipboardFormats.TEXT_FORMAT, value);

  var pasteObj = air.Clipboard.generalClipboard;
  value = pasteObj.getData(air.ClipboardFormats.TEXT_FORMAT);

 Yahoo!ウィジェット:
  system.clipboard = value;

  value = system.clipboard;

 

透過PNGが透過されない

IE6では透過PNGをサポートしていなくて
苦労なさっている人も多いと思います。
IE7になってやっと対応してくてもちろん
Windows サイドバーガジェットも対応しているんだけれども
中途半端です。
ときどき透過PNG画像のはじっこが赤紫になってしまいます。
ならないのもあるし、なるのもあるしどうしてなのか不明です。

Silverlight2.0を使っての
Windows サイドバーガジェットを作っているときに
気づいたんだけれども背景を完全に透過にしたら赤紫になりました。
なんででしょうね。。

ちなみにiGoogleではIE6の透過PNG対応として
iepngfixというものを導入して
ごまかしています。
まったくシェアが多いから無視できないので苦肉の策です。。

設定ファイルへの読み書込み

今回は各種ガジェットでの設定ファイルへの読み書込みについてです。
キーに対して値の書込みを行い、キーを指定して値の読込みを行います。
なのでいっぱいキーを作っても面倒なので
値をJSONにしておくと便利です。
そしてOpera ウィジェット、Mac OS X Dashboard ウィジェットでは
書き込みを行う際に通常、キーと値なところが
値、キーの順番で設定しますのでちょっと紛らわしいです。

こんな感じで行います。
 Windows サイドバーガジェット:
  value = System.Gadget.Settings.readString(key);

  System.Gadget.Settings.writeString(key, value);

 Opera ウィジェット:
  value = widget.preferenceForKey(key);

  widget.setPreferenceForKey(value, key);

 Mac OS X Dashboard ウィジェット:
  value = widget.preferenceForKey(key);

  widget.setPreferenceForKey(value, key);

 Adobe AIR:
  var dir  = air.File.applicationStorageDirectory;
  var file = dir.resolvePath(key);
  if (file.exists) {
   var fileStream = new air.FileStream();
   fileStream.open(file, air.FileMode.READ);
   value = fileStream.readUTFBytes(fileStream.bytesAvailable);
   fileStream.close();
  }

  var dir        = air.File.applicationStorageDirectory;
  var file       = dir.resolvePath(key);
  var fileStream = new air.FileStream();
  fileStream.open(file, air.FileMode.WRITE);
  fileStream.writeUTFBytes(value);
  fileStream.close();

 iGoogle ガジェット:
  var pref = new _IG_Prefs(__MODULE_ID__); // new gadgets.Prefs();
  value = pref.getString(key);

  pref.set(key, value);

 Google デスクトップ ガジェット:
  value  = options.getValue(key);

  options.putValue(key, value);

 Yahoo!ウィジェット:
  value = preferences.key.value;

  preferences.key.value = value;

ガジェットでのAjaxセキュリティ

ガジェットからのAjax使っての外部通信ですが
ローカルからのブラウザアクセスと同様に結構バラバラです。
基本はマニフェストファイルに接続先ドメインを記述します。

まあ、下記のようになっています。
 Windows サイドバーガジェット: (特になし、今後かかりそう)

 Opera ウィジェット: 下記のようにconfig.xmlに接続先ドメインを記述
  <security>
   <access>
    <protocol>http</protocol>
    <port>80</port>
    <host>www.aaoh.co.jp</host>
    <host>aaoh.co.jp</host>
   </access>
  </security>

 Mac OS X Dashboard ウィジェット: 下記のように Info.plistに
  外部通信を許可することを記述
  <key>AllowNetworkAccess</key>
  <true />

 Adobe AIR: (特になし)

 iGoogle ガジェット: _IG_FetchXmlContentメソッドを使用すれば問題なし

 Google デスクトップ ガジェット: (特になし)

 Yahoo!ウィジェット: 下記のようにIwidget.xmlにに接続先ドメインを記述
  <security>
   <http name=”aaoh_co_jp”>www.aaoh.co.jp</http>
  </security>

Silverlightはちょっと特殊で通信を行うサーバー側に
このクライアントと通信してもよいという
マニフェストファイルを置きます。
こんな感じで。
 <cross-domain-policy>

  <!– すべてのクライアントからのアクセスを許可する –>
  <allow-http-request-headers-from
   domain=”*”
   headers=”*”
  />
 </cross-domain-policy>

ローカルからのブラウザでのAjaxセキュリティ

ブラウザでのAjaxのセキュリティモデルは
異なるドメイン間はできないで統一されていますが
ローカルからのアクセスだと結構バラバラなんですよね。
IEだと制限ないしOperaだとどこともアクセスできないし。
ちなみにFirefoxだと下記のメソッドを呼ぶと出来るようになります。
もちろん”よいですか?”ときかれますが。

 try{
  if(netscape){
   netscape.security.PrivilegeManager.enablePrivilege(“UniversalBrowserRead”);
  }
 }catch (ex){
 }

なきむし

いよいよ長渕剛、ユニバーサルミュージック移籍第1弾シングルの
“卒業”発売まで10日を切りました。
カップリングは通常のパターンだと
ライブ盤のラブソングなんかが多いけれども
今回はこちらも新曲の”なきむし”だそうです。
どんな唄か楽しみです。

でも一般的な卒業ソングとしては定着しないような気がする。。

リンクをブラウザで開く

ガジェット作成していてリンクをクリックしたら
ブラウザでそのURLを開きたいとき。
Mac OS X Dashboard ウィジェット、Adobe AIRだけは
拡張APIを呼んであげなければいけません。
JavaScriptからブラウザを開きたいときにはわかるんだけれども
“aタグ”で記述しているんだからそれを解釈してよと思います。

ちなみにリンクをブラウザで開く拡張APIは下記となっております。
 Windows サイドバーガジェット: <aタグ> または System.Shell.execute(url);

 Opera ウィジェット: <aタグ> または window.open(url);

 Mac OS X Dashboard ウィジェット: widget.openURL(url);

 Adobe AIR: air.navigateToURL(new air.URLRequest(url));

 iGoogle ガジェット: <aタグ> または window.open(url);

 Google デスクトップ ガジェット: <aタグ> またはframework.openUrl(url);

 Yahoo!ウィジェット: openURL(url);

ガジェットプラットフォームの違いについて

ガジェット、ウィジェットは基本はXML(HTML)と
JavaScriptで記述していくのですが
設定情報の保存などの特殊な処理は各種ガジェットプラットフォームにて
拡張APIを提供してくれています。
Opera ウィジェットとMac OS X Dashboard ウィジェットは
結構似ているのですがその他はバラバラです。
一つに統合してほしいです。

Opera ウィジェットはその上、拡張API少なすぎ。

そしてWindows サイドバーガジェット、
Google デスクトップ ガジェットにはonDock、unDockというのがあります。
要するにサイトバーとして表示されているガジェットプラットフォームでは
ガジェットがサイトバーに納まっているときにはonDockで
サイトバーから外されたときがunDockとなります。
当然イベントが取れるわけでunDock時には
大きさを変更することもできます。

また、Windows サイドバーガジェットではflyoutというのもあります。
サイドバーの横っちょに表示することができるのです。
通常は表示していなくてボタンを押下されたら
にょきっと表示するってことです。
びみょーな機能です。