1. Thunderbird extensions Weishin Pan 2010/08/26

2. OutLine • Introduction • XPCOM • Demo • Reference

3. Introduction • XUL (XML User Interface Language) Mozilla以XML為基礎所發展的語言,用來描述用戶介面 • CSS (Cascading Style Sheets) 使用者自定規則來控制HTML/XUL/XML所產生的介面外觀,背景,字型 • DOM(Document Object Model) 給予HTML與XML所使用的API,可以用來連結JavaScript或其他的程式語言與網頁

4. XPConnect 將XPCOM與JavaScript連接起來的技術 • XBL (Extensible Binding Language) 一種標記語言,應用於各個XUL應用程式當中 • RDF (Resource Definition Framework) 透過這個格式來存放Extension的註冊訊息與描述資訊 • JavaScript 開發extension的核心語言,這種腳本語言的特色為其原始碼在送到用戶端前不須經過編譯,而是透過Browser來解釋其字元代碼並執行 • XPInstall Mozilla 的跨平台安裝技術,提供了一個標準的方式將 XUL 應用程式的各個元件包裝成安裝檔，讓 Mozilla users 可以下載並且安裝執行,以 XPI 格式為標準。XPI 的格式同 ZIP 及 JAR，為 PKZIP 壓縮後的檔案，只是內含可供管理安裝方式的腳本

5. XPCOM(Cross-platform Component Object Model) • 它是個用來撰寫跨平台與軟體模組化的一種架構,有自身的API,定義著所提供的核心元件,介面與函式,與Microsoft所推出的COM( Common Object Model)屬相同性質,透過介面(Interface)的概念,來解決不同階段所開發的Components在相容性問題以及系統的需求 • 透過XPIDL(Interface Description Language)的定義可使其XPCOM物件可使用C、C++ 和 JavaScript 來創造，也可以在C、C++、JavaScript、Python、與 Perl 擴充集的環境下來進行開發

6. Mozilla application model User Interface layer Glue layer XPCOM layer

7. XPconnect • XPConnect 建立XPCOM物件與 JavaScript 之間的溝通 • XPConnect 允許 JavaScript 物件存取與運用 XPCOM 物件,也能使 JavaScript 物件可以表示成 XPCOM 相容介面以供 XPCOM 物件呼叫使用

8. http://m-alexandre.developpez.com/articles/xul/presentation/#note2http://m-alexandre.developpez.com/articles/xul/presentation/#note2

9. Environment OS : Windows XP SP3 MUA : Thunderbird2 (v2.0.0.9) (Win32) ftp://ftp.mozilla.org/pub/mozilla.org/thunderbird/releases/2.0.0.9/win32/en-US/Thunderbird%20Setup%202.0.0.9.exe (Source) ftp://ftp.mozilla.org/pub/mozilla.org/thunderbird/releases/2.0.0.9/source/thunderbird-2.0.0.9-source.tar.bz2 SDK: gecko-sdk-i586-pc-msvc-1.8b1 http://ftp.mozilla.org/pub/mozilla.org/mozilla/releases/mozilla1.8b1/gecko-sdk-i586-pc-msvc-1.8b1.zip Mozilla builder http://ftp.mozilla.org/pub/mozilla.org/mozilla/libraries/win32/MozillaBuildSetup-Latest.exe IDE: Visual studio 2005

10. Hello world • helloworld/  chrome.manifest -> Tells thunderbird where your chrome files(UI) are and what to do with them  install.rdf -> The description file for your extension ("Install manifest") helloworld.xpi -> Installing packagechrome/    helloworld.jar/ content/        contents.rdf -> The information file for package and overlay         overlay.js -> The file with scripts to run in the browser window         overlay.xul -> The file describing UI elements to add to the browser window

11. Chrome.manifest

12. Install.rdf

13. Contents.rdf

14. Overlay.js

15. Overlay.xul

16. helloworld.xpi • 壓縮 content資料夾成helloworld.zip,接著更改檔案類型為.jar • 接著將chrome資料夾以及chrome.manifest,install.rdf壓縮成helloworld.zip,街著將檔案類型改成.xpi以進行後續的安裝

17. Installation 開啟thunderbird,”Tools” -> “Add-ons” -> “Install …” -> 選擇套件目錄 -> 選擇xxx.xpi來進行安裝 -> 安裝成功後,重新開啟thunderbird -> 在工作列上可以看到 “test”的項目 -> 點選執行

19. Hello world (2) • Implantation an add() function for thunderbird • helloworld/  chrome.manifest -> Tells thunderbird where your chrome files(UI) are and what to do with them  install.rdf -> The description file for your extension ("Install manifest") install.js -> Register the package helloworld.xpi -> Installing packagechrome/helloworld.jar/       content/         contents.rdf -> The information file for package and overlay          overlay.js -> The file with scripts to run in the browser window          overlay.xul -> The file describing UI elements to add to the browser window components/ helloworld.dll -> C++ Source code contains add() function IMycomponent.xpt -> IDL in binary code

20. 開發環境設定 1. Copy C:\mozilla-build\moztools-180compat\bin\ libIDL-0.6.dlland glib-1.2.dll 2. To \gecko-sdk-i586-pc-msvc-1.8b1\gecko-sdk\bin

21. 3. Create \gecko-sdk-i586-pc-msvc-1.8b1\gecko-sdk\bin\Imycomponent.idl 4. Open visual studio 2005 -> “Tools” -> 建立GUID

22. XPCOM Component

23. 在COM的IUnknown和XPCOM的nsISupports interface,它們的基本目的是一樣的,要求所有的Component都應該實作IUnknown/nsISupports interface, 接著user可以透過QueryInterface()這個函式來得知這個Component是否支援”某個版本的介面”的資訊

24. 5. Add Gecko-sdk path to windows PATH PATH -> …;\gecko-sdk-i586-pc-msvc-1.8b1\gecko-sdk\bin;\gecko-sdk-i586-pc-msvc-1.8b1\gecko- sdk\idl;\gecko-sdk-i586-pc-msvc-1.8b1\gecko-sdk\include; 6. ExecuteXpidl.exe in command line(CMD) xpidl -m header -I ..\idl  IMyComponent.idl -> Create IMyComponent.hxpidl -m typelib -I ..\idl   IMyComponent.idl -> Create IMyComponent.xpt

25. 7. Create a VC project for .dll (helloworld) and set the properties

29. 7. Generate a helloworld.dll 8. Add helloworld.dll and IMyComponent.xpi to dictionary “components”

30. Install.js

31. Install.js(2)

32. overlay.js

33. helloworld.xpi • 壓縮 content資料夾成helloworld.zip,接著更改檔案類型為.jar • 接著將chrome和components資料夾以及chrome.manifest,install.rdf,install.js壓縮成helloworld.zip,接著將檔案類型改成.xpi以進行後續的安裝

34. Reference • http://www.cnblogs.com/phinecos/archive/2008/04/25/1171614.html Thunderbird extension(1) • http://www.cnblogs.com/phinecos/archive/2008/04/21/1164466.html Thunderbird extension(2) • https://developer.mozilla.org/zh_tw/XPCOM Mozilla.org XPCOM • https://developer.mozilla.org/en/building_an_extension#XPCOM_Components Create a XPCOM • https://developer.mozilla.org/en/Extensions/Thunderbird/Building_a_Thunderbird_extension Build thunderbird • http://starkravingfinkle.org/blog/2006/10/mozilla-platform-xpcom-in-c/ XPCOM in c++ • http://www.csie.ntu.edu.tw/~piaip/docs/CreateMozApp/index.html E Books for Mozilla developer • http://www.cnblogs.com/chio/archive/2007/09/26/907245.html XPIDL • http://rintarou.dyndns.org/2010/05/02/why-common-object-model-com/#more-441 XPCOM & COM • http://blog.csdn.net/SystemBug/archive/2006/02/28/612053.aspx XPIDL • https://developer.mozilla.org/zh_tw/The_Joy_of_XUL XUL • http://hi.baidu.com/kinsonhe/blog/item/b39dbcefd2ad454379f0555a.html XPCOM • http://kb.mozillazine.org/Getting_started_with_extension_development extension development • ftp://ftp.mozilla.org/pub/ Mozilla resource