橋本商会

1年ぶりぐらいにchrome拡張を作っているのだが、開発しやすくなっていた。ymrlとmyatsumotoに教わった。


chrome://extensions か chrome://settings/extensionSettingsを開く。



右上の「デベロッパーモード」を押して、「パッケージ化されていない拡張機能を読み込む」ボタンを押す。フォルダを拡張として読み込める。

拡張の名前に（開発中）とつく。再読み込みを押すとリロードできる。

アイコンの左側の三角をクリックすると、background.htmlへのリンクがでる。ここでjsコンソールが出せるので、console.logを使ったりしてdebugできる。

昨日まで東京ミッドタウンで開催していたSFC ORF2011の増井研でデモしていました。


■実世界コピペ
実世界コピペはAndroidとNFCタグを使ってコピペできるアプリなのですが、これはAndroid側のアプリは全てJavaScriptで書かれています。




■GoldFish
GoldFishというプラットフォームを自作していて、これを使うとJavaなしでJavaScriptだけでアプリが書けて、しかも端末にインストールする必要がなくなります。（今学校のサーバーが落ちていて見れないがそのうち復活するはず）

先週書いたAndroidとNFCで研究室の鍵を開けるシステムもGoldFish上で実装されているし、他にも置く場所によって自動的にAndroidがパソコンを操作するタッチパッドになったり、写真立てになったりするデモをしました。


GoldFishは、実世界志向なユーザインタフェースを作る時によくある5つの機能を簡単にJavaScriptだけで扱えます。

• 操作する物体や機器の指定をタッチで直接指示する … GUIでは名前を入力するかアイコンをクリックしていた
• ジェスチャーで操作する … 大量のボタンは必要なく、画面を見る必要もない
• 状況によってインタフェースが変わる … タグによって起動するアプリを切り替えられる、またGoldFishアプリ内からもタグの情報が読める
• 使用者によってコンテンツが切り替わる … 安全な方法で端末IDを生成しているので、ユーザ名を入れたりする事なくユニークユーザを検出できる。居間のTVで見ていたビデオを台所の小型モニタで継続する等も簡単。
• 他のアプリと通信する … 中身がWebブラウザなのでAjaxは使えるのは勿論だが、普通のTCPやUDP SocketもwebsocketっぽいAPIで簡単に使える。TCPでチャットを実装した例

Javaを書かなければ使えなかった機能をラップしてJavaScriptから使えるようにしています。



■他のGoldFishアプリ
MacとUDPで通信して操作できるタッチパッドが86行で書けたり（ソースコード）




空中マウスが62行ぐらいで書けたりする。（ソースコード）



空中マウスは操作が難しくてボツになりました。でもこういうのを実験的に作る時に、イチからAndroidアプリを書くのと比べて全然楽に実装できます。プロトタイピングにも向いている。


研究室のドアの鍵開ける奴も、ほとんどプログラム書いたこと無い後輩にサンプル見せて、作ってよーって頼んだら1日でできてしまったので、それなりに使いやすいんじゃないかなと思います。setIntervalで50msecごとにジャイロスコープを監視して、+90度以上回ったらドアを開けるだけだし。

最近cometとかいう最新技術が流行っているらしいので、eventmachine_httpserverで作ってみた。


ここにサーバーとクライアントの例がある。どっちも50行ぐらいで実装できた。
comet at master from shokai/eventmachine-study – GitHub

サーバー起動して、タイムアウトを10秒に指定。
このサーバーは、POSTされた値を保持して、GETされたら返す。GETに対してはレスポンスを遅らせて返す。

ruby server.rb 8080 10

クライアントを起動。GETしてから25秒後にPOST

ruby client.rb 25

GET(comet) -> wait 25 sec -> POST

* GET

sleep 25 sec

404  ## 10秒経過、切断された



* GET  ## 再接続

404



* GET  ## 3回目

* POST kazusuke

POST success

200

kazusuke

200  ## 5秒待ってようやく値が返ってきた

kazusuke

* GET

サーバー側のログはこんなんなってた

http server start, port:8080, comet_timeout:10(sec)

load: 2.20  cmd: ruby 11481 waiting 0.45u 0.32s

request_method : GET

path_info : /message

query_str :

post_content :

request_method : GET

path_info : /message

query_str :

post_content :

request_method : POST

path_info : /message

query_str :

post_content : kazusuke

kazusuke

request_method : GET

path_info : /message

query_str :

post_content :

cometサーバー、接続が不安定なクライアントにpush通知するのに便利。

大学で仮想サーバーが無料で借りれる時代が来てしまった。
電源とか配線とか置き場所の問題をクリアして、グローバルIPありport全開root権限ありのサーバーが手に入る。

最近はすごい重い計算をさせるとかはあんまり無くて、単にどこからでも参照できるwebサーバーが必要だったり、node.js使うのにportがたくさん必要だったり、webサイトをクロールするためにずっと起動しているマシンが必要だったりするわけで実に研究設備として有益ですばらしい。ERNSの人ありがとう。


SFCの大学院生はVPS (個人用仮想サーバ)サービスの試験運用開始について — Erns web siteの要項を埋めてメールで申し込める。学内からしか見れないページだけど。

ちょうどサーバーが2台必要だったので申し込んだ。



スペックはこれ。

• CPU : 2.67GHz 1コア
• メインメモリ：512MB
• ネットワーク：動的IPv4アドレス　1アドレス
• ストレージ：20GB
• OSもLinux系から選べる。UbuntuやDebianやFedoraCoreやCentOSなど

コントロールパネルからサーバー起動できる。



起動して、右のTerminalのアイコンを押したらJavaのVNCコンソールが起動して、Ubuntuのインストール画面が出た。ハイテク！！



ふつうにUbuntuをセットアップして、sshdを起動して

sudo apt-get install sshd

sudo ifconfig

でIP確認して、sshで外から接続できるようにした。


あとは自分のMacから

ssh yourname@133.27.xx.xxx

で接続できる。

先週、後輩のN園が作ってくれました。

1. AndroidでNFCタグを読むと鍵開けアプリが起動
2. ジェスチャー入力をSinatraで書かれたドアサーバーに伝える
3. ドアサーバーはPhidgetsのサーボモーターを駆動し、鍵をヒモで引っ張って開ける

最近はAndroidでNFCタグを読むとタグ毎のwebアプリが起動し、しかもPhoneGapみたいにJavaとJavaScriptのブリッジが書かれているのでセンサーが使えるというシステムを作っている。
6月にNHKのITホワイトボックスでデモした奴の発展版で、GoldFishという開発コードで呼んでいる。


こんなメリットがある

• HTMLとJS（と必要あればwebアプリ）が書ければアプリを作れる環境
• 実世界の物体を指し示して、「アレをコレに」とか操作できる
• GUIだけではなくジェスチャーも入力できる
• 状況によってインタフェースが変化する
• 誰が使っているかによって内容が変化させられる