Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (20)
Ähnlich wie 20150317 firefox os勉強会
Ähnlich wie 20150317 firefox os勉強会 (20)
20150317 firefox os勉強会
- 2. 自己紹介 • 関口 直紀（Sekiguchi Naoki） • KDDI研究所 • Web関連の開発
- 3. 自己紹介 • 関口 直紀（Sekiguchi Naoki） • KDDI研究所 • Web関連の開発
- 4. 最近のスキルアップ • 電気回路のはんだ付け • 秋葉原電気街の歩き方 • レーザーカットデザインの作り方 • コンパスによる正八角形の作図 • スペインでの木材加工の頼み方
- 5. Agenda • MozOpenHardの取り組み • B2G(OSS版FirefoxOS)搭載組み込みボード CHIRIMEN • CHIRIMENの開発 • MWC2015ミニレポート
- 7. 現在のWoTの姿
- 10. Web of Lanterns（デモ） • Revolving Lantern ~ A Web browser ~ – 360度ディスプレイ – フィジカルインターフェース • NyoroNyoro Lantern ~ duplicate and fork physical ~ – 3D変形 – モーションのダウンロード – CSS lighting
- 11. 協働プロジェクト Welfare x Web (w/ WATERDESIGN Co.,Ltd.) Satellite x Web (w/ FABSAT project)
- 13. Spec (2015.03. now) B2G(OSS版FirefoxOS)2.5 Hardware: ● Rockchip RK3066 (1.6Ghz) ● 1GB DDR3 DRAM ● 8GB Nand Flash ● HDMI Micro x 1 ● Micro SD Slot x 1 ● USB (Micro x 2, Full x 1) ● I/O 28pin (incl. I2C, UART, GPIO, SPI, Sound in/out etc)
- 14. Size 48mm 80mm
- 15. Interface micro USB (OTG) micro HDMI micro UWB (DEBUG) ADB接続やイメージ の書き込み。 AC電源 Full USB端子 シリアルコンソールなど。電 源ポートも兼ねる。 ちょっと抜けやす い。。 WiFiアダプタや USBハブ用 ローダーモードになる のに使用（後述） recovery key I/O 28pin スルーホールで 用意しました。
- 17. CHIRIMENの開発
- 18. 準備 • まずお手元にCHIRIMENを用意して・・・ ・・・2015.3、現存するCHIRIMENは５枚 • Marsboard RK3066 – 同じチップを使った組み込みボード – ソフトウェア的にはCHIRIMENと一緒 →同じイメージをインストールできる – http://www.marsboard.com/ 代わりのボード
- 19. B2Gのインストール おおまかな手順 • B2Gイメージのビルド • update.imgの生成 • ローダモードで接続しイメージの書き込み • 書き込みに必要なツールなど – https://github.com/MozOpenHard/CHIRIMEN-tools • 詳しい手順は以下 – https://github.com/MozOpenHard/CHIRIMEN- tools/blob/master/doc/installFirefoxOS.pdf
- 20. B2Gイメージのビルド • B2Gのビルドに必要なパッケージのインストール(割愛) • B2Gのソースを取得( Matchstick用のソース) • MozOpenHardのリポジトリのソースを取得 • B2Gをビルド $ git clone https://github.com/flingone/B2G-FlingOne.git $ cd B2G-FlingOne $ ./config.sh –j 4 rk30sdk $ cd.repo $ git clone https://github.com/MozOpenHard/local_manifests.git $ cd .. $ repo sync –d –j 4 $ ./build.sh –j 4 $ ./flash.sh rockdev/Image/にboot.img, kernel.img, recovery.img, system.imgが生成される
- 21. update.imgの生成 • 必要なツールの導入 • ビルドしたboot.img, kernel.img, recovery.img, system.imgをpackage-fileに 従い配置 • mkupdate.shを実行 ->update.imgが生成される $ git clone git@github.com:MozOpenHard/CHIRIMEN.git $ cd B2G-FlingOne/rockdev/Image $ cp boot.img kernel.img recovery.img system.img CHIRIMEN/rockdev- rk3066/Image/ $ cd CHIRIMEN/rockdev-rk3066/ $ ./mkupdate.sh
- 22. イメージの書き込み（ubuntu） • Linux_Upgrade_Tool_v1.2.1.zipを任意の場所に展開し、PATH を設定 • CHIRIMENをローダモードで接続 – recovery keyを押しながら電源投入 – ※Marsboardの場合はVol+ • イメージの書き込み ※自動で再起動するのでFirefoxOSが立ち上がるまで待つ ※書き込みで失敗する現象が何度か確認されているので、うまくいかな い場合、2,3回書き込み直してみると成功するかも $ cd CHIRIMEN $ PATH=${PATH}:`pwd`/Linux_Upgrade_Tool_v1.2.1 $ upgrade_tool uf update.img
- 23. WebアプリからGPIO制御 node （httpサーバ） gecko gonk gaia （Webアプリ） WebGPIOAPI • Gecko APIからGPIO制御（本間さんが実現！？） • nodeを経由してGPIOを制御してみる
- 24. sysfsからのGPIO制御 • まずはshellコマンドからのGPIO制御 • GPIO端子の論理番号確認 – CHIRIMENは基板上のLEDがGPIO6_B3(gpio363)から制御可能 – 6＊32 + 160 + 8+3 = 363 – 計算方法： http://www.hotmcu.com/wiki/Use_GPIO_in_marsboard_RK3066 • sysfsからGPIO制御 # echo 363 > /sys/class/gpio/export # echo “out” > /sys/class/gpio/gpio363/direction # echo 1 > /sys/class/gpio/gpio363/value $ adb shell CHIRIMENにログイン ※ 後ほど使うので、これをledon.shとして保存しておく ledon.sh
- 25. nodeのインストール • nodeのバイナリファイルをCHIRIMENにpush – ビルドしてくれたバイナリファイル（感謝） • https://www.facebook.com/groups/305208196333685/353904911464013/ • nodeからshellコマンドでGPIO制御のコマンドを実行 – ※ shellスクリプトを実行する場合/system/binへのシンボリックリンクを 作っておく $ adb root $ adb remount $ adb push node /system/bin/node $ adb shell # mount –o remount, rm / # ln –s /system/bin /bin
- 26. nodeサンプルコード var http = require('http'), url = require("url"); exec = require('child_process').exec; http.createServer(function (req, res) { var path = url.parse(req.url).pathname; if(path.charAt(0) == "/"){ if(path.split("/")[1] == "ledon"){ console.log("ledon"); ledOn(); } } }).listen(8000); console.log('Server running at port 8000'); function ledOn(){ var child = exec("/etc/www/nodeGpio/ledon.sh", function(err, stdout, stderr) { if (!err) { console.log("success"); }else{ } }); } server.js
- 27. サーバプログラムの実行 • server.jsとledon.shをpush • shellスクリプトのパーミッションを変更し、サーバプログラムの実行 • サーバへアクセス → 基板上のLEDが点灯するはず！ $ adb push server.js /etc/www/nodeGpio $ adb push ledon.sh /etc/www/nodeGpio $ adb shell # cd /etc/www/nodeGpio # chmod 755 ledon.sh # node server.js # busybox wget http://127.0.0.1:8000/ledon
- 29. 便利グッズの紹介 • スルーホール用テストワイヤ – http://www.marutsu.co.jp/pc/i/137556/ – スルーホールに直接挿すことができる – ブレッドボードにも挿せる（但し接触は弱め）
- 30. MWC２０１５
- 35. Summary • MozOpenHardの取り組み • B2G(OSS版FirefoxOS)搭載組み込みボード CHIRIMEN • CHIRIMENの開発 • MWC2015ミニレポート
- 36. 今後のこと • Maker Faire @ all over the world！ – Tokyo, NY,… • CHIRIMENおさわりイベント – 随時 ※facebookコミュニティでアナウンスします
- 37. プロジェクトに参加してくれる方 • MozOpenHard – http://mozopenhard.mozillafactory.org/ • Facebookコミュニティ（議論の場） – https://www.facebook.com/groups/30520819633 3685/?pnref=lhc • CHIRIMEN技術情報 – http://mozopenhard.mozillafactory.org/techinfo# hardspec
Hinweis der Redaktion
- 今回私達は2つのlanternデバイスを作りました。revolving LanternとNyoroNyoro Lanternです。 まず、こちらのRevlvingLanternですが、 日本の”回り灯籠”をモチーフにしたWebDeviceで、そのインターフェースに2つの特徴を備えています。 まず、ご覧のとおりに、360度全方向にWebコンテンツを表示することができる円筒状のディスプレイを備えています。 また、このランプシェード部分は物理的なインターフェースになっていて、ランプシェードを動かすという物理的な操作がWebコンテンツ にも影響を与え、表示内容が変化します。 このコンテンツやデバイスの制御は全てWeb twist lantern こちらはnyoronyoroランタンです。 にょろにょろというのはへびのような動きを表す日本語で、そのとおりにょろにょろとリアルな変形を行うことができます。 この動きはWebコンテンツとしてダウンロードすることも考えられ、別のランタンとシンクロさせることもできます。 このボードを使うと、こういったデバイスの制御をWebブラウザから行うことができます。 そのため、ランプシェードの動きをイベントとして検出したり、CSSでランタンの動きを制御できるようになっていくでしょう ---- We created two types of “andon” devices using this board. First, Revolving lantern. Second, Twist lantern. This Revolving lantern has two special features. The first feature is rendering web contents in 360 degrees orientations. Moreover, the second feature is physical user interface to control the web contents with rotating operation. We prepare the puzzle game for the device. On the other hand, the Twist lantern has a feature to control the form with real 3D transformation. The transformation motion is given as a web content. Moreover, if the same motion are given to the multiple lantern, their motions are synchronized each other. Please enjoy the new web experience in our exhibition booth. --------------------- We built two “tourou” type browsers using this board. First one is the revolving lantern. It is able to render web contents in 360 degrees directions. It is also able to control by physically moving the display from side to side. We prepare the famous puzzle game, please enjoy it. Second one is the twist lantern. Twist lantern allows the objects to be transformed in “real” 3-dimensional space. It is able to download the transform motion as a web content, and then synchronize their motion between devices. Please enjoy the new web experience in the exhibition booth. ---------------------------- 我々はこのボードを使って“灯籠”型のブラウザを作りました。 revolving lanternはWebコンテンツを360度全方位に投影することができます。 また、この画面は物理的に回転し、画面を左右に動かすことでinteractionができます。 展示ブースでは日本風にアレンジした有名なパズルゲームを用意していますので、 playしてみてください。 Twist lantern allows elements to be transformed in “real” 3-dimensional space. また、transfrom motionをWeb コンテンツとしてダウンロードし、デバイス間での連携を行うことができます。 これらのブラウザで新しいweb体験を味わってください。 -------------------- このブラウザ面白いでしょって感じてもらう 今回私達はこのボードを使ってランタンを作った。 3つの特徴を持っている。 Hardware control by browser-based technology WebアプリからGPIOを制御してランタンの動かし方やセンシングを行っている Service discovery and control from other device これらは手元のスマートフォンにより簡単に発見してコントールすることができる Collaboration with other devices and services 他のデバイスとwebを介して連携したり、すでに広まっているwebコンテンツを表示することも簡単。 ブースでは有名なパズルゲーム（テトリス）や 新しいWebの体験を味わってください。