Tag Archives: Planet Mozilla

Posts get sync’d to Planet Mozilla.

Gaia, OS shell in a <html>

Posted on by

This is the talk I gave in MozCamp Asia 2012. I talked about how the shell of Firefox OS (codenamed Gaia) is engineered and communicate with the rest of the operating system.

One thing to note is that you are not required to know anything mentioned in this slide to create a website or a web application, or even an Open Web Application; Gaia, or Firefox OS, should be just another browser for you. Only if you want to help out the roll out of Firefox OS v1, or hack the shell to design your own phone, you would need to know how Gaia works. To test your app on a simulated phone, check out r2d2b2g.

Having OS shells and application platforms engineered entirely with web technologies bring tremendous opportunities to the web developers. Web is already a dynamic visual playground — with layouts being invented everyday, from infinite scroll to Mansonry; imaging when these potential being unleashed to the web — Firefox OS is the platform doing that. Join us.

CSS transition on visibility property

Posted on by

There are various occasions that I found I need to do this:

CSS


#el {
  transition: opacity 1s ease;
}

#el.fade-out {
  opacity: 0;
}

JavaScript


el.classList.add('fade-out');
el.addEventListener('transitionend', function afterFadeOut() {
  el.removeEventListener('transitionend', afterFadeOut);
  el.style.display = 'none';
});

but later I am being told that the same effect can be achieved with 0 line of JavaScript:


#el {
  transition: opacity 1s ease, visibility 1s ease;
}

#el.hide {
  opacity: 0;
  visibility: hidden;
}

Where visibility: hidden will be actually applied 1 sec later at the end of the CSS transition.

For a fade in effect (transition away from hidden), the element will be visible at the very start. Read the spec working draft for formal definition.

We are not there yet – Code Rush 雜感

Posted on by

感謝 MozTW 的 Irvin 等人籌辦活動，今天終於有機會坐在電影院好好看完 Code Rush 這部電影。

這部電影是從 1998 年 3 月 31 日，Netscape 釋出 Mozilla 原始碼，建立 Mozilla 自由軟體專案的前幾週開始講起，一路講到最後 Netscape 決定賣給 AOL 的時刻。1998 年，Netscape 在微軟強大的競爭之下，決定以釋出原始碼，建立自由軟體專案的方式奮力一博來維繫自己的影響力，以及作為一家公司的營利命脈。這件事，就我們後來所知，是完全失敗的。Netscape 逃不了售出的命運（雖然換股的價碼很不錯），員工在併購之後各奔東西，微軟成功壟斷瀏覽器市場；作為故事背景的 Mozilla 自由軟體專案，直到 2004 年才以 Firefox 這個產品重新樹立影響力，如鳳凰般從灰燼中重生（Firefox 最早的產品名是 Phoenix）。

在電影院沉浸的感受是強烈的。就我去了幾次的粗淺感受，矽谷的確和 1998 年一樣，是個掏金的地方。辦公室有堆滿點心的廚房、懶骨頭沙發、熔岩燈——程式設計師可以帶著一技之長去大公司（「establishment」）享受看似成功的人生，或是到新創公司充滿夢想，拿股票選擇權，即片中 Jamie Zawinski 所稱的樂透彩票。Milestone 前的風雨欲來，朝向「Zarro Boogs」前進的感覺也是一模一樣的（連 face-palm 也一樣）。片中的 Michael Toy、Jamie Zawinski、Tara Hernandez 等人趕上了 1998 年 3 月 31 日 Milestone，然後再隨著 Netscape 的瓦解往人生下一階段前進。

我喜歡片中 Zawinski 對 Mozilla 自由軟體專案的精準描述。很欣慰的，雖然沒有成功拯救 Netscape，Mozilla 後來的確也重生了，發揮了使命與影響力（順便賞了我一個工作）。但 1998 年與 2012 年的差異真的不大。Mozilla 基金會與公司作為 Mozilla 軟體專案的主要貢獻者，必須在主導專案，維繫 Mozilla 使命的同時保持自己的影響力與金流。Mozilla 抵抗的依然是奉行封閉、獨佔的公司與其軟體生態圈。Zawinski 對網路也有精準的預測：「我們處在一個產業的起點。誰知道這個產業會怎樣發展，搞不好又會變成像電視一樣，被少數公司所掌控，決定我們能看到、聽到什麼，這有太多先例了。」

感謝 OrinX 的聯絡，今天的活動最後有一段 Tara 向參與同好的打招呼影片；她後來加入了 Pixar 動畫，在影片中也和我們展示了他們現在用的一模一樣的工具：Tinderbox、Bugzilla …。她說我們好像真的成功了，「網路已經無所不在 … 想必台灣和美國一樣，走在路上看到的廣告上面一定都有個網址」。但其實我們還沒有成功：現在在路上的廣告出現的並不是網址，而是「請上 Yahoo! 奇摩搜尋『…』」或是「請上 Facebook 『…』粉絲團」，人們偏好的是封閉平台的「體驗」與「安全」，而不是開放與自由。

最後我聽到 Irvin 在活動會場宣傳 Mozilla Taiwan 的 Facebook 粉絲團以及線上 Code Rush 電影院活動，心中覺得相當的諷刺。沒有不敬的意思，這是當下能做把事情做好的方法。但有一天，我希望我們能不用在「對」與「好」之間選擇。

有一天。

如果有興趣的話，可以 clone mozilla-central repository，然後輸入 git log --topo-order --reverse | head，你會得到這個：

commit 781c48087175615674b38b31fcc0aae17f0651b6
Author: ltabb 
Date:   Sat Mar 28 02:44:41 1998 +0000

    Free the lizard

mozilla-central 即 Mozilla 所有程式，包含目前 Firefox 的程式碼的 repository。歷史呀。