2011年10月31日月曜日

M1のWireless@SGを使うように設定

Android携帯Xperia Activeを買ったので、外でも出来るだけwi-fiを使うようにWireless@SGを設定してみた。

image

Wireless@SGはSIngaporeのいろんな場所で使える無料wi-fi.

電話会社と契約せずに一時的に使う場合は前の記事を参考に。

使うだけならWireless@SGが使える場所で、接続後に表示される認証画面で電話番号などを登録すれば利用できる。

今回は自動接続するための設定。

Android Marketで「Wireless@SG」で検索するといくつかAppが出てくる。電話会社はM1を使っているので、M1用のAppを選択。

M1 Wireless@SG Connect - Android マーケット

Install後、SSA → Wireless@SG → Add Profile

Usernameに
(自分の携帯番号)@M1
を入力。Passwordは未入力のまま「Create New Password」をTap.

15分ぐらいしたら登録した番号にSMSが送られてくる。そこに書かれているPasswordを入力してSave.

これで(Appを起動していれば)自動接続してくれるはず。

 

< Related Posts >

2011年10月27日木曜日

PC Companionを使ってXperia Activeを初期化(修復)してみた

この前手に入れたSony Ericsson製Android携帯Xperia Active. 使い倒す予定なので、おかしくなったときのために初期化(修復)するとどうなるかやってみた。

Sony Ericsson製PC CompanionというToolを使うと簡単にできるみたい。

SingaporeのSony Ericsson Official SiteのLink. User Manualもある(英語)。

Xperia™ active - Downloads - Mobile phones - Support - Sony Ericsson

環境: Windows 7 Home Premium 64bit (英語版), PC Companion 2.0.1.217

以下手順。

最悪起動しなくなることもあるので、あくまでも自己責任で。

PC Companionを起動して、ソフトウェアアップデート → 修復 を選択。

image

・・・失敗のError Messageが出て、携帯の種類を選択する画面で固まった。

下記変更して、もう一度Try

  • USB Cableは付属されていたのを使う
  • PC本体のUSBに直接挿す
  • 再起動

今度は無事終了。

image

image

18:30に開始(失敗したのも含め)して、終了したのが19:50.

購入した状態に戻った。ただ購入したときに入っていたM1のApplicationはInstallされていない。

よしよし。これで思い切ってイジれそう。

 

< Related Posts >

2011年10月25日火曜日

Android携帯Xperia Activeがいくら充電しても"1%"から増えない

最近買ったSony Ericsson製Android携帯Xperia Active.

会社の人から最初に完全放電と完全充電をした方が電池の持ちが良くなると聞いたので、実際にやってみた。

  1. 買ってから1回も充電せずに(自動で電源が切れるまで)使い切る。
  2. 一晩充電器に繋げて100%まで充電
  3. さらに自動で電源が切れるまで使い切る。

このあと充電器に繋げても表示が"1%"から増えない。

電池が死んだ?・・・と思って騒いでいたら、「一回バッテリー外してみたら?」と言われ、やってみたらあっさり直った。

原因は不明。電池の持ちが伸びるのかは謎。オススメはしない。

買ってから14日以内に下記Sony EricssonのSiteで会員登録すると3ヶ月の無料保証期間があるので、登録しておいて損はない。

http://sonyericsson.ewarranty.sg/

このSiteたまにDatabase Errorになる・・・。

ちなみにSingaporeのSony Ericsson Service Centreの場所は下記

Isetan Orchard, 435 Orchard Road, #04-01, Wisma Atria, Singapore 238877 (Google Mapで表示)

 

< Related Posts >

2011年10月24日月曜日

電話会社M1のOnline会員になって請求書の住所を変更する

携帯電話会社はSingTelで契約しようとしたけど、いろいろあって結局M1にした。

image

窓口行って待つのは嫌なので、Online上で手続きが出来るようにM1のOnline会員になってみた。もちろん無料。

新規登録はこちらから。

電話番号を入力して、new userをClickするとActivation CodeがSMSで送られてくる。30分以内にActivation CodeとPasswordを入力すれば完了。


Online上で出来ること。

  • 利用明細の参照
  • Credit Cardを使って、料金の支払い
  • 請求書明細をEmailで受け取る
  • 料金Planの変更
  • 追加Serviceの変更
  • Data Roaming Serviceの追加、管理
  • SIM CardをUnlock
  • 住所変更
  • Password変更

その他いろいろ。画面は見にくいけど普通に便利なので安心した。

 

< Related Posts >

2011年10月21日金曜日

Bluetooth Headset "Jabra WAVE"を買った

北京に引越しする人からTVとPS3をもらった(買った)ので、この機会にHeadsetを購入しようと価格.comを見ながらResearch.

ちなみにもらったのは

日本にいる頃はJabra BT530を使って満足していたので、Jabra製で満足度も高いJabra WAVEに決定。

Funan Centreの3階あたりでS$99(約6000円)だった。

買ったはいいけど、結局PS3では使えないことが分かったので、気付いた事だけ箇条書き。

  • Jabra WAVEは音楽用のA2DPに対応してないので、(iPod touchで)音楽、動画を聞けない。
  • PS3以外でもiPod touch、携帯での利用を考えてたので、A2DPは欲しい
  • PCなら全ての音をJabra WAVEから再生することは可能
  • PCの再生デバイスの画面で「規定のデバイス」を選択したらおかしくなったので止めた方がいい。
  • PS3の場合、「音声チャット」は問題なくできるらしいけど、Gameの音をBluetoothに出力することは出来ないみたい。

今は携帯で話すことが少ないので、あまり出番がない。

ManualのDownloadはOfficial Siteから。


< 2012/04/27 Modified>
これを買った2011年10月からA2DPに対応したのが発売されているらしい。もうちょい待てば良かった。ショック・・・。

 

< Related Post >

2011年10月20日木曜日

Android携帯Sony Ericsson製Xperia ActiveをM1 Shopで買った

前の記事では、SingTel Online Shopで注文しようとしたけど、EP(Employment Pass)の有効期限が6ヶ月なかったので契約できなかった。

周りの人に聞いたら「期限が切れても雇う予定です」という内容のLetterを会社からもらって、直接Shopに行けば契約できるらしい。なので事務の人に相談してLetterをGet. SingTelは店頭にXperia Activeは置いてないので、Raffles PlaceにあるM1 Shopに行って来た。

必要なもの

  • Employment Pass
  • Passport
  • 住所
  • 連絡先電話番号

Data Planの月S$39を契約して、本体がS$168だった。

↓Nokia携帯との比較。

IMG_0171

銀行から自動引き落としは、最初の請求書が来てから、指定の書類に必要事項を書いてPostに入れると出来るらしい。

↓期待通りの小ささ

IMG_0172

しばらくはこれで遊べそう。

 

< Related Posts >

2011年10月19日水曜日

Google AppsのGmailでBCCを自動で挿入したい

今は別のGmail AccountからPOP Accessしているので、BCCで追加しなくても問題はないのだけど、技術的に出来るか気になったので調査。

Windows + Google Chromeの環境で実現したい。

下記SiteのJavaScriptを使えば出来るみたい(実際に試してはいない)。

hacks/gmailAutoBcc - jaidev.info

Gmail側ではこれを実現するAPIは提供していないので、JavaScriptで定期的に画面を監視して、BCCがあったら追加するという処理を行なっているみたい。

おまけで見つけたGmail Contextual Gadget。これは受信したMailの内容によって特定の処理を実行できる。

Gmailを拡張する「Gmail Contextual Gadget」の作り方 - WebOS Goodies

新規Mailを作成するEventをBind出来るようにしてくれれば、Chrome Extensionとかで実装できるのになぁ・・・。

 

< Related Posts >

2011年10月17日月曜日

DBSに口座を作ったらiBankingに登録して便利に使う

Singaporeで一番大きな銀行DBSに口座を作って、Net経由で残高照会や振込手続きが出来るように"iBanking"に登録したときのMemo.

DBSに口座を作るのは会社の人に一緒に行ってもらって手続きした。必要なもの。

  • Passport
  • Employment Pass
  • 口座を作るのに最低限のお金。最初の給料は小切手でもらったので、それを持っていった。

口座を作るとすぐにCash Cardを貰える。引き落としが出来るのは数日後。このCash CardはDebit Cardとしても使える。

裏側にPLUSが書いてあるので、同じMarkがある世界中のATMで現金が引き出せる(手数料はかかる)。ゆうちょATMでも下ろせる

ちなみにDBSはPOSBと提携しているので、POSBのATMでも手数料なしで引き出せる。

ここからOnlineで自分の口座を操作できるiBankingの話。

iBankingのAccountを作るのにを必要なもの

  • Cash Card(Debit Card)の番号
  • Cash Cardの暗証番号(PIN)
  • Passport番号

DBS iBanking – Internet Banking, Personal iBanking | DBS Singapore

登録すると既に口座を作るときに申請した住所が表示される。登録後実際にLogin出来するためには、登録した住所に送られてくる認証Deviceが必要。↓これ。

IMG_0170

このDeviceはSecure Codeを生成してくれて、iBanking上で何か更新したりする際に必要。

その他分からないことはシンガポールお役立ちウェブで質問すれば、親切な人が教えてくれるかもしれない。

iOSでiBankingを使えるAppがあったので今度はこれを試してみる予定。

 

< Related Posts >

シンガポールへのお金の持っていき方(citibankを使う)

2011年10月14日金曜日

Closure LibraryのToolbarにinput type="text"を表示したい

Google Chrome Extension "History Plus"の開発Memo. version 2.0.0から大幅にLayoutを変更。Closure Libraryのtoolbarを使ってheader部分に制御する機能をまとめてみた。

この時ハマったのがtoolbarにinput tagを挿入できない。いや、表示するだけなら問題ないけど、選択したときにtoolbarがfocusを奪うので入力できない状態。

実現したいのはこんな感じ↓

image


< 2012/01/19 Modified >

Source Codeを追いかけてみた。

toolbarをrenderするときに
全ての子要素の"enterDocument" Methodが呼ばれて
"initializeDom"の中で
styleに"-webkit-user-select"が設定
されるから入力できなくなるみたい。

しょうがないので、描画し終わったあとにstyle属性を変更することで対応した。

goog.array.forEach(
  goog.dom.query('#header input'),
  function(element) {
    goog.style.setStyle(element, '-webkit-user-select', 'auto');
  });

詳細はGitHubで公開してるheaderview.jsを参照。

以下の記述は役に立たないので無視でお願いします。


思いついたのはgoog.ui.ComboBoxを利用する方法。menuを追加せずにcssを調整すれば上のような感じで実現できる。

でも、これをToolbar Objectで管理するためにaddChildしようとしても出来ない。addChildの引数はgoog.ui.Controlを継承してないといけない。

試行錯誤の結果。goog.ui.ComboBoxとgoog.ui.Controlの両方を継承したClassを定義し直して利用することにした。

goog.base.jsで提供されているgoog.inheritsはprototypeを上書きしてしまうので、ここを参考に次のような関数を定義。

/**
* Copy the properties. This method is called by historyplus.inherits.
*
* @param {Object} child Child property.
* @param {Object} parent Parent property.
*/
historyplus.copyProperties = function(child, parent) {
  for (var prop in parent) {
    if (typeof(child[prop]) == 'undefined') {
      child[prop] = parent[prop];
    }
  }
};


/**
* Inherit the properties and prototype methods from one constructor into another.
*
* @param {Function} child Child class.
* @param {Function} parent Parent class.
*/
historyplus.inherits = function(child, parent) {
  historyplus.copyProperties(child, parent);
  historyplus.copyProperties(child.prototype, parent.prototype);
};

これを使ってgoog.ui.ComboBoxとgoog.ui.Controlの両方を継承したClassを定義

goog.provide('historyplus.ComboBoxControl');

goog.require('goog.ui.Control');
goog.require('goog.ui.ComboBox');

historyplus.ComboBoxControl = function(content, opt_renderer, opt_domHelper) {
  // Inherits functions and properties from goog.ui.Control.
  historyplus.inherits(historyplus.ComboBoxControl, goog.ui.Control);

  goog.ui.Control.call(this, content, opt_renderer, opt_domHelper);

  goog.ui.ComboBox.call(this, opt_domHelper);
  this.renderer_ = opt_renderer ||
      goog.ui.registry.getDefaultRenderer(this.constructor);
  this.setContentInternal(content);
};
goog.inherits(historyplus.ComboBoxControl, goog.ui.ComboBox);

Source CodeはGitHubで公開しているので、そちらも参考に。もっとSmartな方法があるかもしれないけど、一応toolbar objectで管理できるのでスッキリ。

 

< Related Posts >

2011年10月13日木曜日

Chrome Extension "History Plus" version 2.0.0 Release

Google Chrome Extension "History Plus"を2.0.0にVersion Up。

前のVersionからUI周りを大幅に変更。Screenshotはこんな感じ。

screenshot_1280x800

Closure LibraryのToolbarを使ってApplicationっぽくしてみた。

まだ実装していない機能とかあるけど、使いやすくなったんじゃないかな?

Closure Libraryは情報が少ないので、分からないことがあったらSource Codeを読むのが一番いい。お陰でだいぶ詳しくなった気がする。まだまだ使いこなせてないけど。

このExtensionのSource CodeはGitHubで公開しているので、興味がある人はこちらも参考に。

Gitも慣れてきたので、だいぶ良さが分かってきた。TortoiseSVNとTortoiseGitで簡単に使い分けができるので、今後は二刀流でいくつもり。Installの仕方は前の記事を参考に。

Chrome Web Storeは更新済みなので、既にInstall済みの人は勝手にUpdateされているはず。自動更新の間隔は3~6時間らしい。詳しくは下記。

エクステンション - Google Chrome まとめWiki

この開発でClosure LibraryとGitを覚えることが出来たのはかなり収穫だったと思う。

 

< Related Posts >

2011年10月11日火曜日

GitHubをTortoiseGitで利用する。TortoiseSVN User向け

今まではSubversion + TortoiseSVNでVersion管理していたけど、Chrome Extension "History Plus"GitHubで公開したときにGitHubの使い方でいろいろ戸惑ったのでMemo.

環境はWindows 7 Home Premium 英語版. TortoiseGit 1.7.3

GitHubの設定とTortoiseGitのInstall、設定までは前の記事を参考に。

Gitを使ったProjectの運用方法(Branchの作り方)は下記記事を参考に。

その他GitHubとTortoiseGitの使い方で戸惑った部分を箇条書き

  • "Commit"でLocalにcommitされる。"push"すると今までのCommitがGitHubに反映される。
  • BranchやTagはGitHub上で作るのではなくClientで作成してpushする
  • Branch作ってpushしてもFileが変更されていないとGitHubに反映されなかった。
  • Subversionみたいにbranches, tags, trunkのFolderを作る必要はなく、同じFolderで現在位置を切り替える。
  • Folderごと無視したい場合は、"Delete and add to ignore list"を選択。次のDialogでFileを残すか聞いてくる。
  • TortoiseSVNとTortoiseGitは共存できる。Iconが同じになるので見分けがつかないのが難点。
  • masterへdevelopの内容を反映したい場合はmasterへ"Switch/Checkout..."してから、"Merge..."する。このとき"No Fast Forward"のCheckを忘れずに。
  • Mergeしたときは、最新のFileで上書きされる。Subversionみたいに変更箇所だけ反映したりしないのでconflictは起きない。
  • いつの間にか改行CodeがCRLFに変換されていたので、Configの"AutoCrlf"のcheckを外す。

SubversionとGitの違いを理解すれば、あとはTortoiseSVNとほぼ同じなので使いやすい。

会社で使う分には権限の設定や排他LockができるSubversionかなとも思った。

 

< Related Posts >

2011年10月10日月曜日

外務省に在留届の提出をネットでしてみる

シンガポール情報局を読んでいて、初めて知った「在留届」。義務らしいので一応Web上でやってみた。

Q2:    在留届って出さなくてはいけないのですか?

在留届の詳細に関しては、外務省のOfficial Sitewikipediaを参照。

ORRnet - インターネットによる在留届電子届出システム

万が一のときに安否確認とか家族への連絡がスムーズに出来るみたい。

あと会社の人に聞いたら、出してないと緊急時の日本行き飛行機の乗る順番が一番最後になるらしい。本当かどうかは知らない。

住所が変わったときや帰国したときにも忘れずに更新する必要があるので、それがめんどくさそう。

入力するときに必要な情報(Passportが手元にあれば大丈夫)

  • 氏名
  • 生年月日
  • 旅券(Passport)番号

上のWeb Systemに情報を登録して、数日後に確認のEmailが届く。

2011年10月7日金曜日

Android携帯Sony Ericsson製Xperia ActiveをSingTel Online Shopで買った。けど。。。

Singaporeに来て7ヶ月、ずっとPrepaid携帯(Nokia + SingTel)を使っていたけど、日本語入力できないし、電話帳も貧弱なので、新しい携帯を模索していた(でも圧倒的に安上がり)。

Androidにするか、iPhoneにするか。

迷ったあげくAndroidに決定。理由はこちら。

  • Androidを使ってみたい
  • Android Appを作りたい
    昔仕事でHT-03A向けのAndroid Appは開発したことがある
  • iPod Touch(4th)を持っているので、iOSの環境はある
  • iPhone5が出なかった
  • 今後はAndroidが主流になってくると思う。でもSingaporeでは圧倒的にiPhoneが多い。

欲しかったのは、Sony Ericsson Xperia Active

xperia-active..colourful

決めては

  • 小さい
  • 防水、防塵

以上。

SingTelのshopに行ったら「shopに在庫はない。onlineだけで受け付けている」と言われたので、SingTel Online Shopで注文してみた。

必要なもの

  • Employment Pass( or "S Pass Card" or "Work Permit Card")の画像
  • 連絡先電話番号
  • 住所(請求書の送り先、本体の届け先)
  • Credit Card

Empoyment Pass画像のUpload画面↓

image

まずはAccountを作成する。

あとは画面に従って入力していけば、特に問題なく終了。

・・・で、これを書いている途中で電話が掛かってきた。

「Employment Passの有効期限が6ヶ月ないので契約できません。」

他の人に聞いたら、「普通期限は2年なのに、お前なんで1年なの?」と言われた。

明日聞いてみよう。

続く。。。

 

< Related Posts >

2011年10月6日木曜日

Closure LinterをInstallしてCoding規約に従っているかCheck

Google Linterを使うと自分のCodeがGoogle JavaScript Style Guideに従っているかCheckしてくれる。

環境は Windows 7 Home Premium 64bit 英語版

Official Documentが十分詳しい。ただWindows Supportは試験的らしい。

PythonのInstallやPowerShellについては、前の記事を参考に。

1. Python moduleのeasy_installをInstall.

基本はOfficial Helpを参考に。

  1. こちらのSiteからez_setup.pyをDownload. 現時点では0.6c11
  2. PowerShellからCommand実行
    > cd C:\Python27\Tools\Scripts
    > C:\Python27\python.exe ez_setup.py

出力結果:

python.exe : Downloading http://pypi.python.org/packages/2.7/s/setuptools/setuptools-0.6c11-py2.7.egg
At line:1 char:23
+ C:\Python27\python.exe <<<<  ez_setup.py
    + CategoryInfo          : NotSpecified: (Downloading htt....6c11-py2.7.egg:String) [], RemoteException
    + FullyQualifiedErrorId : NativeCommandError
 
Processing setuptools-0.6c11-py2.7.egg
Copying setuptools-0.6c11-py2.7.egg to c:\python27\lib\site-packages
Adding setuptools 0.6c11 to easy-install.pth file
Installing easy_install-script.py script to C:\Python27\Scripts
Installing easy_install.exe script to C:\Python27\Scripts
Installing easy_install.exe.manifest script to C:\Python27\Scripts
Installing easy_install-2.7-script.py script to C:\Python27\Scripts
Installing easy_install-2.7.exe script to C:\Python27\Scripts
Installing easy_install-2.7.exe.manifest script to C:\Python27\Scripts

Installed c:\python27\lib\site-packages\setuptools-0.6c11-py2.7.egg
Processing dependencies for setuptools==0.6c11
Finished processing dependencies for setuptools==0.6c11

これでC:\Python27\Scriptsにeasy_install.exeがあるはず。

2. System環境変数に追記

Computer → 右Click → Properties → Advanced system settings → Environment Variables ... → System Variables
でPathを選択してEdit...

Python.exeまでのPathを追加
C:\Python27;C:\Python27\Scripts

PowerShellを再起動。

3. Closure LinterをInstall

準備が整ったので下記Commandを実行

> easy_install http://closure-linter.googlecode.com/files/closure_linter-latest.tar.gz

出力結果:

Downloading http://closure-linter.googlecode.com/files/closure_linter-latest.tar.gz
Processing closure_linter-latest.tar.gz
Running closure_linter-2.3.2b\setup.py -q bdist_egg --dist-dir c:\users\owner\appdata\local\temp\easy_install-x1bwb8\closure_linter-2.3.2b\egg-dist-tm
p-7uxcds
easy_install.exe : zip_safe flag not set; analyzing archive contents...
At line:1 char:13
+ easy_install <<<<  http://closure-linter.googlecode.com/files/closure_linter-latest.tar.gz
    + CategoryInfo          : NotSpecified: (zip_safe flag n...ive contents...:String) [], RemoteException
    + FullyQualifiedErrorId : NativeCommandError
 
Adding closure-linter 2.3.2b to easy-install.pth file
Installing fixjsstyle-script.py script to C:\Python27\Scripts
Installing fixjsstyle.exe script to C:\Python27\Scripts
Installing fixjsstyle.exe.manifest script to C:\Python27\Scripts
Installing gjslint-script.py script to C:\Python27\Scripts
Installing gjslint.exe script to C:\Python27\Scripts
Installing gjslint.exe.manifest script to C:\Python27\Scripts

Installed c:\python27\lib\site-packages\closure_linter-2.3.2b-py2.7.egg
Processing dependencies for closure-linter==2.3.2b
Searching for python-gflags
Reading http://pypi.python.org/simple/python-gflags/
Reading http://code.google.com/p/python-gflags
Best match: python-gflags 1.6
Downloading http://python-gflags.googlecode.com/files/python-gflags-1.6.tar.gz
Processing python-gflags-1.6.tar.gz
Running python-gflags-1.6\setup.py -q bdist_egg --dist-dir c:\users\owner\appdata\local\temp\easy_install-npxm1o\python-gflags-1.6\egg-dist-tmp-qaertr
zip_safe flag not set; analyzing archive contents...

Adding python-gflags 1.6 to easy-install.pth file

Installed c:\python27\lib\site-packages\python_gflags-1.6-py2.7.egg
Finished processing dependencies for closure-linter==2.3.2b

C:\Python27\Scriptsにgjslint.exeがいるはず。

4. 使ってみる。

この前作ったGoogle Chrome Extension"History Plus"(Web Store) (GitHub)で試してみた。

> cd "C:\Users\Owner\Develop\Google Chrome Extension\history-plus\git\src"
> gjslint.exe .\js\history.js

いっぱい出てきた。56 errors... (^^;

なぜか嬉しい。

ちなみに試したのはCommit No:"a276196768"のhistory.js

 

< Related Posts >

2011年10月5日水曜日

Closure LibraryをClosure Compilerで圧縮(ADVANCED_OPTIMIZATIONS編)

Google Chrome Extension "History Plus"を開発しているときのMemo.

前の記事では、Closure LibraryのCodeをClosure Compilerを使って結合するまでの環境設定や手順とか。

今度は
--compilation_level=ADVANCED_OPTIMIZATIONS
を追加して、最小Sizeのjs fileにする方法を試してみた。

環境はWindows 7 Home Premium 64bit (英語版)

実行するだけなら簡単。見やすくするために改行しているけど、実際は1行で実行。

> cd "C:\Users\Owner\Develop\Google Chrome Extension\"
> C:\Python27\python.exe
   "closure-library\closure\bin\build\closurebuilder.py"
   --root="closure-library"
   --root="History+\src\js"
   --namespace="historyplus.SearchController"
   --output_mode=compiled
   --compiler_jar="compiler.jar"
   --compiler_flags="--compilation_level=ADVANCED_OPTIMIZATIONS"
   --output_file="History+\history.min.js"

だけど、下記Errorが出て動かない。

Uncaught Error: Invalid value for argument 1. Property 'Ic': Unexpected property, Property 'dc': Unexpected property.

ここから試行錯誤。

1. まずはClosure Libraryの依存関係について理解する。

jQueryに慣れていると、関数を定義したあと、onreadyもしくはonload時に実行するというやり方になる。下記のような感じ。

window.onload = function(){
  var ctrl = new historyplus.SearchController();
};

これだと全て読み込まれた後なので、安心してInstanceを作成することが出来る。

Closure Libraryの場合は依存関係定義Fileを作成して、onReadyを待たずに実行していく方法が推奨されているらしい。下記Siteとかでなぜdeps.jsを構築しているのかやっと理解できた。

Closure Libraryによるアプリ開発のはじめ方 - WebOS Goodies

deps.jsの作り方はOfficial Siteを参考に。

Using DepsWriter - Closure Library - Google Code

--root_with_prefixに渡す値がbase.jsからの相対Pathなので、closure-libraryはLocalにCheckoutし直した。Folder構成は次のような感じ。

image

PowerShellからCommand実行。

> cd "C:\Users\Owner\Develop\Google Chrome Extension\History+\src"

> C:\Python27\python.exe
   "closure-library/closure/bin/build/depswriter.py"
    --root_with_prefix="js ../../../js"
    --output_file="js\deps.js"

htmlは

<script src="closure-library/closure/goog/base.js"></script>
<script src="js/deps.js"></script>
<body>
...
<script>goog.require('historyplus.SearchController');</script>
</body>

これで動作確認。

2. 準備が整ったのでADVANCED_OPTIMIZATIONSしてみる。

> C:\Python27\python.exe
   "closure-library\closure\bin\build\closurebuilder.py"
   --root="closure-library"
   --root="js"
   --namespace="historyplus.SearchController"
   --output_mode=compiled
   --compiler_jar="..\..\compiler.jar"
   --compiler_flags="--compilation_level=ADVANCED_OPTIMIZATIONS"
   --output_file="js\history.min.js"

63KBだった。htmlを修正。

<body>
...
<script src="js/history.min.js"></script>
</body>

これで実行してみると・・・。同じError・・・。ここで気付いた。chrome.history.searchなどのBrowserが提供しているAPIまで置き換えられてしまう。なので、

Closure Compilerに最適化を除外する関数を教えてあげないといけない。

この解決策は下記Siteを参考に。

上記Siteを参考にObjectのPropertyの記述方法を変更。除外FileをDownloadしてきて、再度Compile.

> C:\Python27\python.exe
   "closure-library\closure\bin\build\closurebuilder.py"
   --root="closure-library"
   --root="js"
   --namespace="historyplus.SearchController"
   --output_mode=compiled
   --compiler_jar="..\..\compiler.jar"
   --compiler_flags="--compilation_level=ADVANCED_OPTIMIZATIONS"
   --compiler_flags="--externs=..\..\chrome_extensions_ja_stable_Simple.js"
   --output_file="js\history.min.js"

でもErrorが取れない。

Propertyが置き換えられるときと、そうでないときがあるのが謎。解決に時間かかりそうなので、ADVANCED_OPTIMIZATIONS付けないで公開することにした。

> C:\Python27\python.exe
   "closure-library\closure\bin\build\closurebuilder.py"
   --root="closure-library"
   --root="js" 
   --namespace="historyplus.SearchController"
   --output_mode=compiled
   --compiler_jar="..\..\compiler.jar"
   --output_file="js\history.min.js"

 

< Related Posts >

2011年10月4日火曜日

Closure LibraryをClosure Compilerで圧縮(設定編)

Google Chrome ExtensionのHistory Plusを開発しているときのMemo. 開発段階では、Closure LibraryのRepositoryに直接Linkして(下記のようにheaderに書いて)利用していた。

<script src="http://closure-library.googlecode.com/svn/trunk/closure/goog/base.js"></script>

< 2011/10/08 modified >
※本格的に開発する場合は、localにcheckoutしてdeps.jsを作った方が圧倒的に開発効率がいい。deps.jsはこちらの記事を参考に。

次の段階として、Releaseに向けてClosure Compilerを使って圧縮する方法を試してみた。

環境はWindows 7 Home Premium 64bit (英語版)

参考にした記事は下記。Subversion Client "TortoiseSVN"のInstallとかも下記を参考に。

まずはpythonのInstall. Official SiteからPython 2.x系の最新版をDownload. 現時点では、2.7.2が最新。

Installが完了したらCommandを叩く。cmd.exeを使うよりPowerShellを使った方が見やすい。詳しくは前の記事を参考に。

開発用Folderに移動
> cd "C:\Users\Owner\Develop\Google Chrome Extension\"

※このFolderにclosure-libraryがCheckoutされている。↓Folderの階層構造はこんな感じ。

image

まずは、動作確認も含めて、一つのJS Fileに統合するCommandを実行してみる。
> C:\Python27\python.exe
    "closure-library\closure\bin\build\closurebuilder.py"
    --root="closure-library"
    --root="History+\src\js"
    --namespace="historyplus.SearchController"
    --output_mode=script
    --output_file="History+\history.combine.js"

見やすくするために改行してあるけど、実際は1行で実行。これを実行すると、History+\src\jsにあるjs fileの中から
goog.provide('historyplus.SearchController');
の記述があるFileを元に結合してくれる。

各Optionの意味はclosurebuilder.pyのSource Code(のHelp)が一番詳しい。

この時点でhistory.combine.jsは1,207KB。

goog/base.jsを削除して、history.jsをhistory.combine.jsに置き換えれば動くはず。

次はClosure Compilerを使ってScript Fileを圧縮。

Official Siteの「Download the application」をClickして、「compiler-latest.zip」をDownloadする。

Javaで動くのでJRE(Java Runtime Environment)を事前にInstallしておく必要あり。Java Official Site.

compiler.jarをCurrent Directoryに置いて次のCommandを実行。

> C:\Python27\python.exe 
   "closure-library\closure\bin\build\closurebuilder.py"
   --root="closure-library"
   --root="History+\src\js"
   --namespace="historyplus"
   --output_mode=compiled
   --compiler_jar="compiler.jar"
   --output_file="History+\history.min.js"

すると下記Error

python.exe : closure-library\closure\bin\build\closurebuilder.py: Scanning paths...
At line:1 char:23
+ C:\Python27\python.exe <<<<  closure-library\closure\bin\build\closurebuilder.py --root=closure-library --root=History+\src\js --namespace=history
plus --output_mode=compiled --compiler_jar=compiler.jar --output_file=History+\history.min.js
    + CategoryInfo          : NotSpecified: (closure-library...anning paths...:String) [], RemoteException
    + FullyQualifiedErrorId : NativeCommandError
 
closure-library\closure\bin\build\closurebuilder.py: 771 sources scanned.

closure-library\closure\bin\build\closurebuilder.py: Building dependency tree..

Traceback (most recent call last):
  File "closure-library\closure\bin\build\closurebuilder.py", line 254, in <module>
    main()
  File "closure-library\closure\bin\build\closurebuilder.py", line 239, in main
    options.compiler_flags)
  File "C:\Users\Owner\Develop\Google Chrome Extension\closure-library\closure\bin\build\jscompiler.py", line 48, in Compile
    if not (distutils.version.LooseVersion(_GetJavaVersion()) >
  File "C:\Users\Owner\Develop\Google Chrome Extension\closure-library\closure\bin\build\jscompiler.py", line 29, in _GetJavaVersion
    proc = subprocess.Popen(['java', '-version'], stderr=subprocess.PIPE)
  File "C:\Python27\lib\subprocess.py", line 679, in __init__
    errread, errwrite)
  File "C:\Python27\lib\subprocess.py", line 893, in _execute_child
    startupinfo)
WindowsError: [Error 2] The system cannot find the file specified

何やらjava -versionを実行するときにErrorになっているっぽい。JREをInstallしたときに自動でPATHに追加されないんだっけ?と思いながら環境変数に追加。

Computer → Properties → Advanced system settings → Environment Variables ... → System variables → Path → Edit...

Javaは下記FolderにInstallされていると思うのでこれを追記

C:\Program Files (x86)\Java\jre6\bin

確認はcmd.exeで「path」を入力。PowerShell ISEを起動し直して、もう一度先ほどのCommandを叩くと今度は成功。411KBまで圧縮。

次回はADVANCED_OPTIMIZATIONSをつけて、名前まで置き換えてしまう積極的な圧縮を試してみようと思う。

このとき作成したGoogle Chrome Extension "History Plus"はGitHubで公開しているので、興味がある人はそちらも参考に。

 

< Related Posts >

2011年10月3日月曜日

GitHubのWindows Client "Git for Windows"をInstall。TortoiseGitも設定。

Google Chrome Extension "History Plus"を開発して、Source CodeをGitHubに登録したときのMemo.

環境はWindows 7 Home Premium 64bit 英語版

Official HelpにInstall方法が詳しく書いてあるので、そちらを参考に(英語)。

今の最新はv1.7.6. Install後、Git BashでSSH keyを作成したCommand

$ cd .ssh
$ ssh-keygen.exe -t rsa -C "hoge@gmail.com"

これで生成されたpublic key(id_rsa.pub)をGitHubのAccount Settings → SSH Public Keysに登録。

接続できるか確認

$ ssh -T git@github.com

Permission denied (publickey)・・・失敗。

Windows版EmacsがInstallしてあると、System環境変数の"HOME"が設定してあるので、これをHome Directoryと判断してしまうみたい。

なので、環境変数を"C:\Users\Owner"に変更。Git Bashを起動し直して、再度実行すると成功。

次はUser情報を登録

$ git config --global user.name "Daiki Suganuma"
$ git config --global user.email "hoge@mail.com"

GitHub Account情報を登録

$ git config --global github.user hogehoge
$ git config --global github.token 123456789abcdefghijk

あとは実際にRepositoryを作って試す。

TortoiseSVNに慣れているのでGit用のTortoiseがないものかと検索すると普通にあった。今の最新はv1.6.5

TortoiseSVNとUIが同じなので直感的に分かる。区別するためにIcon Setを変更しておくといいかもしれない(TortoiseSVNとIcon Setは共用みたい)。

SSH ClientにTortoisePlinkを選択した場合の設定(Official Wikiを参考に)。いちいちPass Phraseを入力しなくても済むようになる。

  1. Install Folderにあるputtygen.exeを実行
  2. Load → .ssh\id_rsaを選択(All Filesで表示)
  3. Pass Phraseを聞かれるので入力
  4. "Save private key" → id_rsa.ppkで保存
  5. pageant.exeを起動。
  6. task barにいるpageantを右Click → add keyで先ほどのid_rsa.ppkを選択
  7. Pass Phraseを入力
  8. pageant.exeをStartupに登録して、常時起動させておく。
  9. Settings → Git → Remoteで名前を変更しておくと分かりやすい。

TortoiseSVN使いが最低限知っておくことは

"commit"でlocalに登録され、"push"でGitHubに反映される。

あとは、SubversionとGit, Google CodeとGitHub, それぞれの違いや利点を理解するのに下記記事が参考になった。

 

< Related Posts >

Related Posts Plugin for WordPress, Blogger...

Blog Archives