訂閱

上次更新

February 10, 2016 12:00 AM

所有時間皆為協調世界時(UTC)。

Powered By

Planet

摩茲星球 | MozTW Planet

這邊是工作人員碎碎念的地方,您可獲得最新出爐的資訊以及最不成形的想法 :P

October 17, 2015

MozLinks-zh

摩茲人歡慶《軟體自由日》 活動直擊

窗內窗外的 Foxmosa

(English version 閱讀英文版)

每年的軟體自由日,都是 MozTW 成員齊聚一堂的時刻。我們曾經在這天舉辦 Code Rush 電影放映會Summit 行前會翻譯松 …等許許多多的活動。

今年的 9/20,我們趁 Windows 10 上市之際,大舉前進台灣微軟,一同歡慶軟體自由日。不但同時推廣 Firefox、認識微軟的開源平台、聽聽市面少許非 Webkit 引擎的 Microsoft Edge 瀏覽器開發功能,還讓大家小小體驗了一下 SUMO / Amara 翻譯。

與微軟合作舉辦「軟體自由日」活動,是非常有趣的體驗。他們曾經是我們的最大敵人,卻也是現今在網路自由與開源運動上的最強盟友。

以下就跟著我們一起直擊活動現場吧!

摩茲人歡慶軟體自由日 - 微軟的自由軟體 3

Software Freedom Day 2015

分享時間

活動的第一部分是分享時間,由 Irvin、BobChao 及台灣微軟的 Eric 分享以下數個主題。

完整錄影:

開場、MozTW 與軟體自由日介紹

Firefox「開箱影片」放映

Microsoft 的開放原始碼軟體 (Eric)

Firefox OS Add-on 介紹 (BobChao)


Edge 的開發者功能 (Eric)

Firefox 的最新功能 (Irvin)


投影片由 小B 製作

Firefox for Win 10 系列影片:

  • 如何變更 Windows 10 的預設瀏覽器
  • 在升級 Windows 10 時保留你偏好的設定

摩茲工寮 (BobChao)

蛋糕時間

第一部分結束後,大家一起享用了特製的 Foxmosa 主題蛋糕。

Software Freedom Day 2015
Software Freedom Day 2015

翻譯工作坊

活動的第二部分是分組的翻譯工作坊,大家分成 SUMO 補助說明文件與 Amara 影片字幕兩組,各自貢獻了一個小時的翻譯活動。

SUMO 小組現場

摩茲人歡慶軟體自由日 - SUMO Sprint 3
翻譯進度文件:SUMO Article for SFD 2015

Amara 字幕小組現場

摩茲人歡慶軟體自由日 - Amara 字幕工作坊 2
翻譯進度文件:2015 SFD Sprint

尾聲

活動的最後,就是每次都不可或缺的抽獎與合照時間了!

IMG_6597
IMG_6601

最後要感謝活動的工作人員與 45 名參加者、提供場地及協助錄影的台灣微軟、支援現場攝影的 Macpaul、Othree、alexsh 以及 Community Marketing 計畫的預算支援。

附錄

作者 / Irvin
授權 / 創用CC姓名標示-相同方式分享4.0國際 授權條款

by Irvin Chen (noreply@blogger.com) at October 17, 2015 04:00 PM

換個季節佈景,秀出你的個人特色

季節正在改變!美國已經準備要進入秋天了,我們想也是時候來裝飾帶有秋天氣息的佈景主題了!佈景主題可以讓你更換瀏覽器的樣貌、凸顯你的個人特色。

以下是我們推薦的一些秋天佈景主題:

我們並沒有忘記在世界不同角落的朋友們。我們也為你們準備了大量的佈景主題! 如果你很幸運在等待迎接春季時,你可能會喜歡這些:

  • Morning Spring 會喚醒你對於所愛的平靜春季早晨的記憶。
  • Joyful Spring 會讓你想要一邊躺在草地上、一邊凝視天邊的浮雲。
  • Must be Spring 會讓你想準備品嚐庭院中花兒們的味道!

想在安裝佈景主題前看看他會長的如何嗎?只需要簡單的移動滑鼠到你感興趣的主題上,Firefox 就會自動產生預覽畫面。如果你想保留設定,只要按下加入就可以了。你可以在任何時候改變、或移除佈景主題!

還想要看更多佈景?點選這邊就可以找到數以千計的佈景主題了。

原文 / Seasonal Themes for Firefox
授權 / 創用 CC 姓名標示-相同方式分享-3.0

φ @ALEX_RELAX 翻譯 - 極地狐、Irvin 編輯

by 極地狐 (noreply@blogger.com) at October 17, 2015 04:00 AM

August 31, 2015

RJ

HKOSC 2015

前情提要

因為一些突發狀況,四月中我拿了一些資遣費,從公司離職了…雖然是自願離職的就是。因為是突發狀況,所以當時沒有新工作可以馬上銜接,除了找工作,就是在家閒著(儘管如此,也是沒有把累積的動畫看完Orz)。當然找工作也是多少會遇到不如意的狀況,例如本來就對自己的能力沒啥自信,遇到面試被電,自然是因此失意不少,所以就發文說想要去日本散心但是年初才去過一次,這次再去就會把存款燒完之類的…於是就收到我們偉大的摩茲戰神 (Irvin) 拍的電報 (Telegram,MozTW 主要的交流管道之一,比起用 Line 我更喜歡用這個 IM)…

摩茲戰神:不然你跟我們去 HKOSC 2015 好了

我:我考慮一下…

摩茲戰神:走啦~機票也沒多少錢,大家住一起攤住宿費也很便宜

我:….好阿!走!

…我之後才知道我們有在 HKOSC 2015 擺攤位,我其實是被叫去幫忙的 (他們去年也有去,不過我一直以為只是去參加而沒有擺攤),反正最近去參加研討會都是顧攤和跟人交(Liao)流(Tian),議程基本上沒有進去,好像沒差XD

出發!

我們的計畫就是大家各自出發,到香港再直接到旅館會合。跟我一起搭CX421班機出發的有 ErnestOrin,不過他們的機票居然升等了…O.Q

抵達

下飛機出海關拿行李後第一件事情當然就是要搞定上網跟交通阿不然要幹嘛?所以我們自然就買了八達通跟香港任縱橫儲值卡,因為五日HKD$88的版本賣完了,所以我們買了八日HKD$118的版本,還好是買這個版本,因為飯店的 Wi-Fi 上網基本上沒法用, HKOSC 會場的無線網路打到攤位的訊號也很弱了,連線不順,幾乎都透過手機連上網,流量差點用完。

因為我們的旅館位於離 HKOSC 會場比較近的沙田,所以我們不是選擇搭機場快線進入香港,而是搭機場巴士 A41 直接抵達飯店門口。

住宿

我們停留在香港的這幾天都住在沙田的帝都酒店 Royal Park Hotel。從旅館步行到港鐵東鐵線沙田站僅需5到10分鐘,而且是走室內連通道,不但可以遮風避雨,還能順便逛逛新城市廣場 New Town Plaza 內的商家,非常便利。順便一提,旁邊就是 Snoopy World

另外,會選擇住這邊主要是因為離會場近,而且有可以容納4人的大房間,當然最重要的是價格實惠,CP值極高。其實從沙田到香港熱鬧的景點其實並不會太久,特別是習慣了日本長距離移動的旅遊,更會這樣覺得。當然房間乾進舒適,裝潢也很用心,不過早餐是要另外付錢的。

講者晚宴

雖然我不是講者,也有幸被邀請參加講者晚宴。在這裡遇到不少香港參與開源社群的伙伴、外國講者,還有意外發現其他認識的人也出現在其中,像是 Canonical 的 Penk 跟 Rex,主持 Gandi 台灣辦公室的 Thomas。

會場

HKOSC 今年的會場在香港科學園的高錕會議中心,正是標題照片中央的金色橢圓球體建築。從連通道看出去的景色也是不錯的。下面的照片是透過 Google Photo 特效處理過的照片,我還蠻喜歡的。另外第一天結束前的抽獎也有幸拿到藍牙喇叭,還不賴 (周杰倫調)。

攤位

社團成員參加研討會就是要擺攤阿不然要幹嘛?所以我們也是擺攤了!我們這次算是跟 MozHK 的伙伴一起擺攤,不過 MozHK 的伙伴們都是 HKOSC 的 Staff 所以…

我們被分配了兩個攤位,一個攤位上面擺著 Firefox OS 的 device,另一個則是擺著文宣、貼紙跟手環、徽章等等,要分給來看看我們攤位並配合我們攤位活動——選擇一個寫著 Firefox 的優點作為自己使用 Firefox 理由的看板一起拍照——的朋友。照片有很多,但很多都不是我拍的XD 下面那張是我唯一用自己的手機拍攝的照片。

除了我們的攤位之外,也有其他例如香港 maker 、embedded system consultant 的攤位。Embedded system consultant 攤位的人對我們 Firefox OS 表示很有興趣,希望未來有機會看到他們使用 Firefox OS 做為他們販售 solution 的底層 OS。

旅遊

這次去香港的預算本來只有大約NT$10,000左右,不過因為回來後要開始新工作了,順便到 Apple Store 買了新的 MBPR 15″ ,花費暴增6倍…

我很喜歡香港的夜生活,也去了新城市廣場 (就在旅館旁邊阿不然勒) 、AQUA、星光大道、又一城 Festival Walk、IFC,在 HKOSC 會後跟 Staff、講師們一起去酒吧慶祝,跟著戰神在接近店家休息的時間前到各香港著名服飾品牌店面購買特價服飾,搭纜車到大嶼山看天壇大佛 (原來天壇大佛的建造跟台灣彰化八卦山大佛有關連!),到東涌東薈城 Citygate Outlet 享受在香港最後的晚餐。IFC 的 Apple Store 真是潮到出水,不過 我的 MBPR 是在又一城 Apple Store 買的。我一直覺得香港的天際線很特別,每棟建築都蓋到山的半山腰以上,街景看起來就像是 16:9 的畫面用 4:3 來呈現那樣,都被拉長了XD

最後搭上了被延後超晚的 CX464 回到台灣,結束這次的香港行。

結語

我還蠻喜歡這次的香港之旅。感謝推我過來的摩茲戰神以及招待的 HKOSC staff。

這次沒有拍太多照片,覺得有點可惜,我記得我拍了不少照片的說…

還有香港的物價也是高於台灣,一般的生活用品、飲食要是一一換算回台幣根本買不下去。我常說去日本只要把價格除以10當成台幣來看可以接受就是合理價格,香港版的公式是乘以2…還有一件跟物價沒關的事情:下圖是天壇大佛周圍昂坪市集內賣台灣小吃的店家的價目表,不特別提的話我想台灣人大概會以為上面標示的是台幣吧?XD

See Also

August 31, 2015 06:37 PM

August 28, 2015

BobChao

Use Firefox OS "lightsaber" on Flame

EN: I'll make a note as a "lightsaber quick install guide" here.

Firefox OS 新的 Add-on 等功能都在 lightsaber 上,要安裝稍微得費點勁,這邊分享一下最速達陣手法:

「不必」自己 build Gecko

EN: You don't have to build the whole gecko from mozilla-central, just use the nightly and it works. Check Updating your Flame and choose the https://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-central-flame-kk/ builds.

lightsaber 上面叫你自己從 mozilla-central 重新自建 Gecko,但其實光是要嘗試新東西的話無此必要,只要更新 Flame 到 mozilla-central 的 nightly-build 就好:

https://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-central-flame-kk/

如果不知道怎麼升級,請見 Updating your Flame

拿把光劍

EN: then, follow the quick setup section in the README.md of lightsaber, but be sure to remove the "GAIA_DEV_PIXELS_PER_PX=2.25" part.

接著就要把光劍裝上去,其 Readme 裡有最速捷徑

sudo npm install -g bower && sudo npm install -g gulp && sudo npm install -g apm && sudo npm install -g grunt-cli && sudo npm install -g browserify
git clone https://github.com/fxos/lightsaber
cd lightsaber
make install
make sync

我這邊故意少複製了一行,原因有三:

  1. 我在 make sync 時有跳錯誤,如果發生錯誤無論如何就上網查一下,通常都是什麼東西沒裝好。
  2. 這邊有可能會問你要裝哪種 gaia-icon,我反正是挑最新的
  3. 這份 Readme 主要寫給 Z3C 用,如果你好傻好天真地照辦那在 Flame 上就有問題了。

最後一行是真的要把 Gaia 裝上去,作為日用機,我常用的參數是這樣:

  • 要掛 Mozilla 的品牌: MOZILLA_OFFICIAL=1
  • 日用,跳過測試用 App: PRODUCTION=1
  • 跳過啟用導覽與設定: NOFTU=1
  • 開啟 adb 連線除錯: DEVICE_DEBUG=1
  • 開英文跟注音鍵盤: GAIA_KEYBOARD_LAYOUTS=en,zh-Hant-Zhuyin

如果你也要裝中文語系和設定上去,參考小帥提提供的古早資料,將語系抓下來,再以 language.json 指定一下啟用的語系即可。你的最後一行指令可能長得像這樣:

DEVICE_DEBUG=1 PRODUCTION=1 MOZILLA_OFFICIAL=1 GAIA_KEYBOARD_LAYOUTS=en,zh-Hant-Zhuyin LOCALE_BASEDIR=locales/ LOCALES_FILE=locales/l.json make reset-gaia

最後

沒有下一步了,就是這樣喵。雖然手上有 Flame 又不屬於 MoCo 的華人不多,但還是分享一下順便當自己的筆記 -- 我近兩年前寫的 build Firefox OS 筆記,現在還是很好用 :P

by Po-chiang Chao (noreply@blogger.com) at August 28, 2015 03:46 PM

August 25, 2015

MozLinks-zh

Webmaker app — 數位掃盲新方法

編案: 日前 Mozilla 正式釋出 Android 平台的 Webmaker app。為此我們於此刊載 Mozilla 基金會執行董事 Mark Surman 於四月時撰寫的文章,希望能讓大家更加了解 Webmaker app 的設計與涵義。

年初在巴塞隆納的 MWC(世界行動通信大會)上,Mozilla 啟動了 Webmaker app 的公開測試。這是一個自由且獨立運作的網路出版工具,對於 Mozilla 所致力的「提高世界各地的數位素養(digital literacy)」也是重要的一步。

Webmaker app 的想法,是源自於我們過去一年在孟加拉、印度和肯亞的研究成果。這份研究指出兩件事情:智慧型手機的新使用者面臨陡峭的學習曲線,常被侷限在諸如 Facebook 之類的基本 app,甚至不知道自己正在「上網」;與此同時,使用者仍然渴望創造在地相關的內容,並期望從中獲益。

Webmaker app 讓每個人都能夠在打開他們的第一隻智慧型手機時,就能快速發佈網站或 app,以滿足這些渴求。學生可以為同儕製作數位公布欄、教師可以製作和發佈教案、商家也可以架設網站來推廣自己的產品。

我們的想法是,讓智慧型手機用戶甫上網之際先快速上手,再協助他們與時俱進。這種「先做再說」的數位素養策略,鼓勵人們視自己為主動的創作者,而非被動的消費者。數十億人在今後幾年內都將開始捫心自問「我為何上網、我該如何使用網路」,而這種觀念將在此扮演重要角色。

Webmaker app 自由且開源,提供超過 20 種語言支援。使用者可以透過手機簡訊、Facebook、WhatsApp…等工具傳送網址,以分享創作成果。Webmaker 中建立的內容,可以在任何手機瀏覽器上打開。目前提供 Android、Firefox OS 和當代手機瀏覽器的版本,更完整的平台將在今年稍晚釋出。

另有一個讓 Webmaker app 更為完善的要素,就是 Mozilla 廣泛且面對面的教學計劃。我們的創作者、輔導者與教育者志工網絡,正在全球超過 80 個國家中運作。這些配備有 app 及其他工具的志工,為協助人們了解網路的運作原理、創造與其日常生活習習相關的內容,已在學校、圖書館和其他公共場所,舉辦了許許多多的非正式工作坊。僅僅去年一年,Mozilla 志工們就在 450 個城市中舉辦了 2,513 場工作坊!

此一數位素養運動,是我們與合作夥伴共同推展而出。Mozilla 和那些對開放網路、在地內容及賦權用戶,與我們一樣感到熱情、且深具影響力的非政府組織、行動電話營運商、和其他全球性組織聯手合作,以確保我們的數位素養計劃能幫助到最需要的人。

當數十億位首次接觸網路的用戶上網時,他們會發現一個可以打造、型塑並每天使用,以改善自身、業務和教育的平台。這是一個具有雄心壯志的目標,但 Mozilla 已經準備好了。想要參加、或更家了解我們的數位素養行動,請到 webmaker.org/localweb

原文 / Webmaker App Takes Fresh Approach to Digital Literacy | The Mozilla Blog
作者 / Mark Surman
授權 / 創用 CC 姓名標示-相同方式分享-3.0

φ Nini Hsu、楊椀婷 翻譯 - Irvin 編輯

by Irvin Chen (noreply@blogger.com) at August 25, 2015 04:15 PM

August 20, 2015

Othree

React 入門

京都嵐山

其實這篇想寫一陣子了,不過拖太久本來想放掉,是後來又看到 TonyQ 在說他的經驗,就覺得還是寫一下,搞不好可以幫到人(?),然後其實我對 React 沒深入研究,目前也只寫過一次,也沒做到複雜的 App,所以這篇純粹是我的觀察啦。

先講結論,寫過目前一般 Web App 的人,要來寫 React 大概都要一些撞牆期吧,我的狀況是要寫 React + Flux 架構的 Web App,但是一開始對 Flux 的介紹沒認真看,在一知半解的狀態下就開始做了,結果就一直出現些靈異現象,大部分是覺得應該要更新畫面了但是沒有,追到後來大概就兩個原因:

  • 亂用 props 和 state,總之就是 React 只會在 state 變化的時候更新畫面,props 變化的時候不會(其實設計上是 immutable 的),而用 props 的時機基本上是父層 component 要設定資料給子 component 的時候才會用,至於父層收到不同的資料給子 component 時,同樣是改 props,為什麼畫面就會更新了,事實上是因為父層 component 更新的時候,才有機會改動到子 component 的 prop,而因為有重新 render,子 component 的內容也會一起更新,也才更新了畫面。

  • 想要只更新子 component,這個問題就是沒把 flux 的設計弄清楚,Flux 的 store 其實有點代表所有的資料的意思,而不管是什麼動作,都要把整包的 store 資料更新回去,根 component 會綁事件在 store 的更新事件上,發現 store 資料有更新就開始重新 render component,然後跟著它的子 component 就會因為 prop 更新而跟著更新。

當然 store 是可以有多個的,重點在於每次更新都要整個 store 的資料重新給根 component,不能從 store 裡面某一層開始送,然後想要只更新某個子 component,這樣結果就很容易發生靈異事件,當然 React 可以不用 Flux 架構,不過我覺得那條路走起來更困難,所以還是乖乖使用 Flux 架構,其實我後來做的結構很簡單,action 就只是一個事件,store 就是 POJSO 而已,沒用到一些市面上的 Flux framework。

最後一點要提的就是每次都整包 store 更新,可能就會有人想到效能問題,當然 React 本身效能不錯,不過資料量要是超大,可能還是會有出現狀況,我想這也是為什麼 Facebook 要發展 Immutable.js 的原因,其實我仔細瞭解後,發現 Immutable 配合 Flux 架構真的是超適合的,而且他在大量資料更新的時候,可以保持蠻不錯的效能,因為只有 reference 的變化,而不是真的重新產生整包資料,沒變化的資料都是本來就已經在記憶體裡面的,整體的資源消耗少很多。

August 20, 2015 04:38 PM

August 17, 2015

Othree

fetch is the new XHR

這次 COSCUP 講的是新的 Web API: fetch,其實這個東西要用只要看 HTML5 Rocks 那篇文章就好了,只是我在使用和做 fetch-er 的時候發覺很多的細節和問題(投影片裡面的 facts),有一些不跟最新進度也不知道狀況是怎樣,連 Stack Overflow 上也沒有,可能有人遇到但是不知道,所以就和我的 fetch-er 專案一起投稿。

和 fetch-er 專案一起投稿的另一個考量是,在 COSCUP 和 OSDC 分享這麼多次,年初我突然才發現我的講題和 Open Source 的關連度實在太低(嚴格說來我在那時才認真意識到 open source 和社群的差異),只有 2013 的 COSCUP 是講我在 Vim Plugin 開發上的歷程,其他有一場有介紹到 underscore,之外就大部分是在介紹 Web 的新東西,所以認真的覺得今年要投和 Open Source 相關的東西,而不是只是 Web 相關的而已。

August 17, 2015 10:28 AM

August 07, 2015

Othree

My First Patch to Firefox

zh download dialog

OSX 自從升級到 10.10 之後,繁體中文版 Firefox 就冒出了一個 bug,一堆使用到作業系統原生的視窗,像是下載圖片,開啟檔案等等的,都會變成簡體中文介面,這個問題在 Bugzilla 上的編號是 1089363,畫面看起來就像上面的圖一樣,這個問題的狀況,推測是 OSX 本來在這種系統對話框,會使用使用者現在設定的系統 locale,但是 10.10 改成應用程式正在運作的 locale,然後 Firefox 本來會用 locale AB_CD 中的 AB 段而已,所以 zh_TWzh_CN 就都會變成 zh,然後 OSX 的 zh 又會變成簡體中文,結果就變成這樣了。

其實這個 bug 的解法, Steven Michaud 很早就提出了,就是把本來 locale 的 resource 目錄的名稱改成 zh_TW,大概 diff 如下:

 AB_CD = $(MOZ_UI_LOCALE)

-AB := $(firstword $(subst -, ,$(AB_CD)))
+ifeq (zh-TW,$(AB_CD))
+LPROJ_ROOT := $(subst -,_,$(AB_CD))
+else
+LPROJ_ROOT := $(firstword $(subst -, ,$(AB_CD)))
+endif
+LPROJ := Contents/Resources/$(LPROJ_ROOT).lproj

其實不會很難,不過因為 Firefox 的程式碼變動很快,連 build script 也常常變動,那個 patch 檔出來的時候已經不能用了,然後又沒人處理就這樣一直拖下去,前陣子 Moztw 那邊又被提出來一次,剛好我為了弄 WebIDL 相關應用的時候有 build 過 Firefox,想說應該可以處理看看,就接下來嘗試了,build 本身蠻簡單的,就照著網路上的文件就好,比較難的是要 build 成特定語系的,找很久才在 Moztw 討論區找到答案,要在 .mozconfig 裡面加上:

ac_add_options --with-l10n-base=/d/lang
ac_add_options --enable-ui-locale=zh-TW

其中第一行設定的路徑要指定到你指定的位置,而且要絕對路徑,然後在該目錄 clone 翻譯的 repository 下來,可以在 l10n-central 那邊找自己的語系,以 zh-TW 來說:

cd /d/lang
git clone http://hg.mozilla.org/l10n-central/zh-TW/

然後這樣就可以 build 中文版了,build 完執行就看到精美的黃底紅字 XML 解析錯誤視窗。

Firefox Missing String

還好我有點經驗,知道 Firefox 的介面是 XUL 寫的,然後字串是用 XML entity 方式存在,所以很快就想倒是翻譯問題,於是上去找了 l10n dashboard 看看繁體中文的狀況,看的是 fx_central 這棵樹下的字串:

Firefox l10n stat

可以看到目前有缺哪些字串,因為字串還沒穩定所以也還不會有翻譯,所以就需要手動進去把這些 entity 的定義補上,內容隨便填,然後重新 build 一次,結果就修好了!

nightly zh_TW download dialog

然後就開始想辦法生 patch 檔案了,中間也有用過 hg mq,最後都固定改好,commit 後用 hg export . > fix.patch,總之改好我就丟上 bugzilla 了,結果第一個 patch 只改到一個檔案,實際上應該有五個檔案要改,而且才隔一天,Makefile 就被別人改過了,只好重新找位置修改,重新生 patch,到最後一個 review 過,build 也過的 patch 中間還發生了不少事情,包括 Makefile 被別人又改動一次,用 AB or LPROJ 的命名問題,字串的變化造成假翻譯又要增加,還有 build 工具 mach 被人改壞,和推上去之後有 build 失敗的狀況等等,非常的一波三折。

其中 build 失敗是 b2g 的 build 失敗,原因是我有地方改錯,不過要測試也是要重新設定,參考的是 Building the Firefox OS Simulator 這份文件,把 .mozconfig 改成:

. "$topsrcdir/b2g/config/mozconfigs/common"

mk_add_options MOZ_OBJDIR=../build
mk_add_options MOZ_MAKE_FLAGS="-j9 -s"

ac_add_options --enable-application=b2g
ac_add_options --disable-libjpeg-turbo

重新 build 看能不能過。

改完產生的 patch 檔上傳到 bugzilla 時,要勾選 Content Type 是 patch,然後 review flag 設定成 ?,選一個 reviewer,通常會有 mentor 來跟你說選誰好,我的情形是 timdream 在幫忙,接著就等 reviewer review,他 review 過的話, review flag 就會變成 +,然後就會收到一封「Congratulations on having your first patch approved」的信件,說了一些後續可以做的事情,接著要做的就是讓 patch 真的進去 repository,可以在票的 keyword 加上 checkin-needed,就會有機器人自己來把你的 patch check in 進 mozilla-inbound 這個 repository,然後丟上機器人自動編譯和測試,例如這個我 B2G build 失敗的例子,都過了就會進 mozilla-central,之後才照順序進 mozilla-aurora、mozilla-beta、mozilla-release,現在進去 mozilla-central 的大概要等 Firefox 42 才會上線了,應該是和 OSX 10.11 同時吧。

August 07, 2015 01:06 AM

August 03, 2015

Othree

Electron 入門

electron

前陣子花了些時間用 Electron 寫了個桌面應用程式,覺得有些資訊應該記錄一下,其實我覺得 Electron 的文件弄得超爛的,非常沒有 Github 的水準,Github 當初能夠起來,我認為一個很大的原因就是文件做的很好,而且在頁面上都會提供相對應操作的說明文件,不只讓網站的易用性提昇很多,連帶的也推廣了 Git 的使用,算是相輔相成起來的,不過 Electron 剛推出的時候,我就覺得,這是有文件嗎?甚至讓我有個印像是,我們雖然推出 Electron 但是沒很想讓你們用,所以文件隨便寫寫。

為什麼這樣說,拿現在最新版 0.3.0 來說,其實這應該只是自動產生的文件,整頁的第一篇文章是 Application distribution,這真的沒有哪裡搞錯嗎?而且這份文件還很爛,有關鍵的地方沒說,之後會講。總之,要開始寫 Electron App 應該要看的是 Quick Start 才對,這份文件用了一個很簡單的範例讓你開始可以跑 Electron App,只要會寫網頁,從這邊就可以開始做 Electron App,但是一個應用程式哪有這麼單純,只靠 Web 端的技術一定是有不足的,例如我要做的程式就需要讀取 key 去登入 SSH 然後做事情,這登入 SSH 然後做事的部分用的是 node 的 code,不能跑在瀏覽器環境,在 Electron 的架構下,瀏覽器環境稱為 renderer,而另外一邊用來起始 renderer process 的則稱為 main process,要登入 SSH 的 code 就要寫在 main process 這邊,那兩邊要怎麼溝通呢?Electron 提供了 IPC 模組來用。

IPC 模組應該是稱為 Inter Process Communication 吧,我覺得這在 Electron App 開發當中應該是超重要的一部份,結果在 Quick Start 那篇文章中竟然沒有範例介紹,只有簡單的一句話說如果兩邊要溝通要用這個(或是另外一個 remote 模組),而且點過去也只有 API 文件,沒有範例,後來出的 remote 模組的文件才有範例說明,總之這樣弄來弄去還是有解決兩邊的溝通問題,所以下一個遇到的,就是我要怎麼讓使用者選檔案了。

因為 Electron 是跨平台的,我的程式設計是用 private key 去登入遠端的機器做事情,Linux 或 OSX 都可以假設 key 的位置,但是 Windows 不行,所以我就要提供可以讓使用者選檔案的功能,這部分文件也是沒有好好的連結,你看完 Quick Start,看一遍文件目錄,其實都看不出來到底要怎麼做到這件事,事實上它被稱為 dialog,這不把整份 API 文件翻完真的不知道是放在這名字下面。

然後,Electron 的 renderer process 端雖然和瀏覽器環境幾乎一樣,不過還是有些差異,一部份是 Chrome 引擎的問題,例如最近的 fetch,在 renderer process 會受到 CORS 限制,但是 XHR 不會,這是因為 fetch 還沒有檢查 Chrome 的 safety flag,所以如果要用 fetch API 接 ES6 Promise 的話,就要用 Github 的 polyfill,自己把檢查的程式碼拿掉,另外一個類似的問題是,如果要在 renderer process 中,引入第三方的 library,有兩種用法,一個是用新出現的 require 來引入 npm module,或是像一般網頁一樣,直接用 <script> 標籤引入 js 檔案,但是就會發生一個問題,因為 jQuery 會判斷現在的環境,然後來決定要不要 expose $ 變數到 global scope 下,剛好,Electron 的環境下,雖然是要當成瀏覽器環境,但是又多了 require 可以用,結果就是被誤判成在 Node 環境,想當成一般網頁環境用 jQuery 就會找不到 $,結果也是要自己去修改檢查部分的程式碼。

最後,把程式功能弄得差不多了,要打包給其他人時,發現竟然無從下手,本文開頭提到的 Application distribution 這份文件說的很簡單,就是把某個目錄換掉就好了,可是真的到了這一步才意識到,是換掉哪裡的目錄?結果只好上網找別人弄好的打包工具,這邊我用的是 electron-packager,研究一下才發現,原來是要抓 Github 上 release 那的檔案下來處理,整個過程其實還蠻不愉快的,因為根本不是難懂,而是文件作不好造成一堆時間浪費啊。

August 03, 2015 01:27 PM

July 28, 2015

Irvin

TW Mozillians @ 香港開源年會 HKOSCon 2015

In the end of June, totally 7 Taiwan Mozillians (5 reps, 2 core contributors) flew to Hong Kong to host a Mozilla booth at HKOSCon 2015 (Hong Kong Open Source Conference). The following are 2 blog posts from Yao Wei and Ernest.

Mozilla Links 正體中文版: Showing off Firefox in HKOSCon 2015
Participating HKOSC 2015 — Medium

日前, ErnestBobChaoOrinRJ魏藥Peter 等共七位 MozTW 成員,一同前往香港開源年會,並擺設 Mozilla 攤位。關於活動的情形,歡迎閱讀以上魏藥及 Ernest 的直擊文章。

Here I will add some of my own experience & observation.
以下紀錄一些我個人的經驗與觀察。

Booth 攤位

MozTW Mozillians #FoxYeah @ HKOSCon2015
(TW Mozillians with Sammy Fung, Bob & Ernest is not in this photo)
(台灣成員與香港的 Sammy,Bob 與 Ernest 不在這張照片中)

Create big banners from FoxYeah stickers to demostrate, is indeed good try on our booth. We can take chance to sharing ideas with people on those topics of banner (security, customize...), and ask people to choose their favorite one to take photo, has really positive feedback.

將 FoxYeah 標語製作成大扛棒在攤位上展示,並讓人拿著最喜歡的標語拍照,是一個準備簡單,卻非常有笑點的小活動。不但容易吸引目光,也成為與參觀者的交流話題。

Thomas #FoxYeah @ HKOSCon2015
(We even got a "Gandi love Firefox" big thumb up from Gandi.net's Asia COO Thomas)
(我們甚至獲得了 Gandi 的 Asia COO Thomas 的「Gandi Love Firefox」認證)

Hong Kong local mozillians were basically all workers for HKOSCon, so we had to self-help on organize booth. Carry those Firefox OS devices and Firefox souvenir were not easy - the stickers are so-heavy. We had to separate them to everyone to carry in luggage when flight. Printer big stickers and make slogan banner on sight is good idea.

香港當地的 Mozillians 都是 HKOSCon 的主辦成員,我們只好自力救濟。要把這麼多展示品(包含近十台 Firefox OS 裝置、與各類 Firefox 紀念品)從台灣帶到香港,的確是蠻麻煩的一件事,貼紙卡片又重又多,要讓大家平均分攤裝行李箱托運。印貼紙跟買瓦楞版當場製作,又快效果又好。

We also got 21 filled contribute forms at the booth. Hope that we can get some more contributors at Hong Kong. (BTW, on our contribute form, we had various contributed area for people to choose their prefer, and most of people select multiple area. We should improve our [online form](http://mozilla.org/contribute) to accepting multiple choices too.)

本次攤位上,我們亦收集到 21 名有意貢獻者的聯絡方式。希望未來在香港能有更多 Mozilla 貢獻者。

Webmaker Workshop 工作坊

Webmaker Workshop @HKOSCon2015

Host a Webmaker workshop is one of my main topic in HKOSCon. But the lecture room is under "speak" mode, and not too easy for workshop that it's hard to see how attendees' status. Fortunately that my content is half exercise and half lecture intro.

主講 Webmaker 工作坊,是這次參與 HKOSCon 的主要任務。可惜的是,雖然參加者大多都有攜帶電腦,但是演講形式的座位安排,不太好掌握台下參加者的參與狀況,還是不太適合工作坊。幸好我準備的內容是實作與演講兼具。

This is also my first time to connecting Keynote, iPad (remote control and viewing keynote speaker note), Firefox, iPhone (share internet to mac), Reflector 2 (receive Chrome Cast mirrow from Mi2S), and Mi2S Android phone all together on stage. Perhaps the environment is too complicated thus my Mac hang for twice and it tooks me 5 mins to reboot when in 2/3 of workshop. Too bad that it cost me too much time and I cannot play last video in slide. I'll need to simplified the environment next time.

這也是我第一次同時使用 Keynote、iPad(連動 Keynote 看講者備忘)、Firefox、iPhone(分享網路給 Mac,再作熱點給 iPad 與 Android 手機)、Reflector 2(用於接收 Chrome Cast Mirrow 展示 Android 手機的 Webmaker App)與一台小米 2S Android 手機等六項裝置與軟體,在進行到約 2/3 時,遭遇到電腦當機了兩次,浪費了約五分鐘,讓最後一片短片來不及播放。環境太複雜,下次最好還是精簡一點,避免再次發生。

Here is my workshop slide,
以下是這次的投影片:


Webmaker + Workshop @HKOSCon 2015

Accommodation 住宿

Our accommodation "Royal Park Hotel" is really really valuable! Locating in central Shatin, 10 mins walk from train station all inside mall (cool and easy for luggage!), half hour metro to downtown, 1 hour Airport bus directly to hotel door. The best is price, 4 star hotel with large room (twice as large as hotel room in Kowloon) equipment with bathtub, the price only about 130 USD per 4pax room per night. (Almost same price to 2pax room.)

這次我們的住宿「帝都酒店」真的非常超值!極力推薦給四人以上一起到香港的朋友。地點位於沙田市中心,沙田車站約只要走十分鐘,全程都是室內商場(又涼又好拉行李)。搭地鐵不用半小時就能進到九龍,且 A41 機場巴士一小時直達飯店門口。最棒的是,四星級飯店,兩間四人房共定七晚,稅前一晚不到一千港幣(跟兩人房價格差不多),而且房間是九龍飯店的兩倍大以上(甚至有浴缸!)

by Irvin Chen (noreply@blogger.com) at July 28, 2015 01:41 PM