Skip to main content

· One min read

As the Firefox OS Settings Peer, I still feel its not efficient to toggle everything in Settings, because it needs too many steps such as: 1. Open Settings app, 2. Find proper item, which may located in sub panels, 3. Do the action with that setting.

During hackthon in Taipei last month, Yifan and I made the Quick Settings Enhancement Addon, and now its available on marketplace (within the :debug mode).

How it looks like?

The addon add plenty of Settings switch(NFC, Internet Sharing, Lock Orientation, Battery Saving Mode, Geolocation, Enable USB Storage), Settings shortcut (Developer panel configs), Power menu shortcut (Silence Incomming Calls) and.....the Flashlight to quick settings menu!

We also found it will take a lot of estate of your utility tray, so FYR we'd propose a at most 2 clicks mockup to handle those quick settings.

The codebase is at https://github.com/gasolin/fxos-quick-settings Welcome to contribute.

· 4 min read

Here she is!!

要開始開發 Firefox OS 的 Web 端(Gaia),並不像開發一般網站一樣那麼容易。在開始改網頁之前,通常要把相關的開發文件讀一遍 / 試一遍,才能順利把開發環境設定好。 而把環境設定好可能已經花了半天時間,這時原本想要改程式的精力也所剩不多了。

去年有感於此,花了些時間整合了一套快速設定 Firefox OS 開發環境的工具「FoxBox」,透過 Virtualbox 虛擬機與 vagrant 自動化工具來達成自動部署 Gaia 的開發環境。最近把 FoxBox 基礎作業系統版本升級了一下(使用 Ubuntu 14.04LTS),在 Macbook 或 Ubuntu 桌面電腦上,只需用一個小時左右的時間,就可以自動安裝好整套開發環境。

Vagrant + VM 的優點

使用 Vagrant 搭配虛擬機(VMWare 或免費的 Virtualbox)的好處多多,其一是簡化了開發環境的需求,由於主流的作業系統(Windows,Mac,Ubuntu/RedHat)都支援虛擬機,透過在虛擬機上使用單一的作業系統,可以大幅簡化安裝指令。 其二則是自動化安裝,透過 Vagrantfile 指定要執行的指令 (放在 scripts 資料夾下),最後跑出來的結果只有安裝成功一種。如果失敗了表示自動安裝的指令沒寫好,初級開發者不用在環境安裝時就強迫得學太多細節。 其三是開發環境隔離,命令都跑在 VM 中,在之後開發或升級的過程中出現任何問題,隨時都可以重新建立一個乾淨的開發環境。

使用 FoxBox 這套開發環境設定工具,當其他人碰到問題時,也可以更容易地重現問題。

透過 Vagrant 設定,FoxBox 提供實體機與虛擬機共享檔案夾,並支援 USB 實機偵錯。

雖然開發環境隔離,但是 FoxBox 預設的設定即提供實體機與虛擬機共享檔案夾。裝好開發環境後,你依然可以使用目前作業系統上自己習慣的編輯器來修改程式碼,然後在 VM 中執行命令。

FoxBox 預設也將 USB port 串接到 VM 中,所以在 VM 中也可以直接接收到實機的偵錯訊息 。

設定的流程

連上網路,在主機上執行以下命令

$ git clone https://github.com/gasolin/foxbox.git $ cd foxbox $ ./configure.sh 除了開始時需要指定網路介面卡,並輸入主機的密碼(用來和虛擬機共享檔案夾)外,其中大部分的流程都是自動化的。

當 VM 跑起來後,登入 VM(帳號 / 密碼為 vagrant/vagrant)並執行以下命令:

> $ gaia_init.sh
> $ cd gaia
> $ make`

即可順利編譯好 Firefox OS 的 Web 端(Gaia)程式碼囉!

· 2 min read

Last week I've post on dev-gaia to notice the change of JSDoc generator.

Now gaia's jsdoc generator takes standard jsdoc config format from each app's jsdoc.json file. And app owner could customize its look and feel if they prefer to do so. http://usejsdoc.org/about-configuring-jsdoc.html

Here's the working jsdoc for Firefox OS settings app http://gasolin.github.io/gaia/settings/ .

The trick is done by gulp and shell commands, which can be apply on any other projects. Here's how I did it.

First of all is install required packages

$ npm install gulp gulp-shell jsdoc --save-dev Then open gulpfile.js and add following scripts:

var gulp = require('gulp'); var shell = require('gulp-shell');

gulp.task('jsdoc', shell.task([   './node_modules/jsdoc/jsdoc.js -c jsdoc.json' ])); (It's an simplified version because gaia contains 20+ web apps in it, so I add some tree-walking code to create bunch of gulp tasks. But basically its the same) The simplified version is now available for reuse in webapplate.

Bonus section:

Here's how I upload jsdoc (http://gasolin.github.io/gaia/settings/ , http://gasolin.github.io/gaia/system/) to github gh pages.

Add another section in gulpfile.js with following script

var gulp = require('gulp'); var ghPages = require('gulp-gh-pages');

...

gulp.task('github', ['jsdoc'], function() {   return gulp.src('./docs/*/')     .pipe(ghPages()); }); Run gulp github command and the build tool will generate jsdoc and upload to github page automatically.

· 2 min read

幾週前在 Modern Web 2015 分享了以「Javascript,征服世界是可能的嗎?」為主題的演講。

演講主題靈感來自於 The JavaScript World Domination 一文。

原本想用編年史的形式表現,一直發展到演講的前幾天,才演變成最終使用的形式。

公布講題後,一些人先跑來問我 JS 是不是真的可能征服世界。
我能理解大家想要知道最終的答案迫切。但其實大多數時候,聽別人的預測,還是不準確的比率更高。

就我而言,了解別人推論的過程,與他所引用的資料,會影響我對他預測結果的信賴度。哪些資訊是我所不知道的(秘密),哪些是我知道但沒有意識到與推斷目標關聯性的。從推敲的過程中,我可以學到一些新東西,也可以產生一些新想法。這樣的過程比偷看答案有趣地多。

這份投影片裡面分享了四個 JS 征服世界的秘密,你是否已經知道?我的觀察跟你的觀察一致嗎?有沒有什麼其他你觀察到的秘密想分享哩?

· One min read

I've finished another iteration of dogfooding with Firefox OS 2.2. This is the version by far I'm pretty enjoy to use in daily base, without a backup Android phone.

Since my main usage of smart phone is browsing news and web sites, the new Browser frame serves me well.

The edge swiping is still awesome. Swipe left to right or vice versa from the off screen is more efficient than task manager.

In task manager, a small close button in bottom left of each card, make a more intuitive way to clean a web app.

Some web app made the dogfood more easier.

  • FeedSpider: The news feed via feedly

  • Social

  • Facebook and Twitter: Browse their web site, then add them on Homescreen* Map

  • Google Map:  Browse the web site, then add it on Homescreen* Note taking The last thing I want to have is the bookmark sync.

Since the dogfooding experience is so positive, I'll challenge with dogfooding nightly build in next month.