Download
slide1 n.
Skip this Video
Loading SlideShow in 5 Seconds..
Chapter 3 Building your own Extensions PowerPoint Presentation
Download Presentation
Chapter 3 Building your own Extensions

Chapter 3 Building your own Extensions

76 Views Download Presentation
Download Presentation

Chapter 3 Building your own Extensions

- - - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

  1. Chapter 3 Building your own Extensions

  2. Development Environment

  3. Must Haves ・Text Editor  (UTF-8 compatible) ・File Archiver  (ZIP compatible)

  4. Nice to Have ・JavaScript debugger (Venkman) ・Hidden preferences for development

  5. Text Editor

  6. Hidemaru Editor http://hide.maruo.co.jp/ TeraPad http://www5f.biglobe.ne.jp/~t-susumu/

  7. File Archiver

  8. 7-Zip http://www.7-zip.org/

  9. Debugger

  10. Venkman JavaScript debugger https://addons.mozilla.org/firefox/216 Japanese language package http://piro.sakura.ne.jp/latest/blosxom.cgi/mozilla/extension/2005-09-30_venkman-ja.htm

  11. Hidden Preferences

  12. ・browser.dom.window.dump.enabled  Enables dump output to console  →true ・javascript.options.showInConsole  Enables errors to be reported to console  →true

  13. Create a new profile for development work

  14. ・firefox.exe -p  Start profile manager ・firefox.exe -p "foobar"  Start up using specific profile ・firefox.exe -p "foobar" -no-remote  Start multiple Firefox instances using different profiles

  15. Now, on to actually building an Extension

  16. …… But

  17. Try modifying the Firefox code first

  18. C:\Program Files \Mozilla Firefox \chrome\browser.jar

  19. Implementation steps for the Firefox browser

  20. Step1. Extract browser.jar Step2. Modify browser.xul Step3. Compress browser.jar Step4. Double check * It's a good idea to back up a copy of browser.jar

  21. Displaying a “Hello, world!!” message

  22. content\browser\browser.xul <menuitem observes="blockedPopupAllowSite"/> <menuitem observes="blockedPopupEditSettings"/> <menuitem observes="blockedPopupDontShowMessage"/> <menuseparator observes="blockedPopupsSeparator"/> </menupopup> </statusbarpanel> </statusbar> <label value="Hello, world!!"/> </window> Add this to the end of the file

  23. Restart Firefox

  24. Display “Hello, world!!” in the “Tools” menu

  25. content\browser\browser.xul <menu id="tools-menu" label="&toolsMenu.label;" accesskey="&toolsMenu.accesskey;"> <menupopup id="menu_ToolsPopup"> <menuitem label="&search.label;" accesskey="&search.accesskey;" key="key_search" command="Tools:Search"/> (snipped)‏ <menuitem accesskey="&pageInfoCmd.accesskey;" label="&page...l;" command="View:PageInfo"/> <menuitem id="hellloworldMenuitem" label="Hello, world!"/> <menuseparator id="sanitizeSeparator"/> <menuitem id="sanitizeItem" accesskey="&clearPrivateDataCmd.accesskey;" label="&clearPrivateDataCmd.label;" key="key_sanitize" command="Tools:Sanitize"/> (snipped)‏ </menupopup> </menu> Add this to the file

  26. Restart Firefox

  27. Turn these modifications into an Extension

  28. Upload your work to ftp://sfc-ftp.ai3.net/ ~incoming/mozilla24-ws/

  29. http://piro.sakura.ne.jp/ xul/doc/20070726keio/XUL3-1.zip

  30. Step1. Prepare files and folders Step2. Create manifest file Step3. Create XPI package

  31. Preparing files and folders

  32. helloworld chrome content overlay.xul install.rdf chrome.manifest

  33. Isolate the XUL modifications for the overlay file

  34. (snipped)‏ <menu id="tools-menu" label="&toolsMenu.label;" accesskey="&toolsMenu.accesskey;"> <menupopup id="menu_ToolsPopup"> (snipped)‏ <menuitem id="hellloworldMenuitem" label="Hello, world!"/> (snipped)‏ </menupopup> </menu> (snipped)‏ overlay.xul <?xml version="1.0" encoding="UTF-8"?> <overlay id="helloworldOverlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <menupopup id="menu_ToolsPopup"> <menuitem id="helloworldMenuitem" label="Hello, world!" insertbefore="sanitizeSeparator"/> </menupopup> </overlay>

  35. overlay.xul <?xml version="1.0" encoding="UTF-8"?> <overlay id="helloworldOverlay" xmlns="http://www.mozilla.org/ keymaster/gatekeeper/there.is.only.xul"> <menupopup id="menu_ToolsPopup"> <menuitem id="helloworldMenuitem" label="Hello, world!" insertbefore="sanitizeSeparator"/> </menupopup> </overlay>

  36. Creating a manifest file

  37. 1 install.rdf extension metadata

  38. install.rdf <?xml version="1.0" encoding="UTF-8"?> <RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#"> <Description about="urn:mozilla:install-manifest"> <em:id>helloworld@piro.sakura.ne.jp</em:id> <em:type>2</em:type> <em:name>Hellow, world!</em:name> <em:version>0.1</em:version> <em:description>My first extension.</em:description> <em:creator>SHIMODA Hiroshi</em:creator> <em:homepageURL>http://piro.sakura.ne.jp/xul/</em:homepageURL> <em:targetApplication> <Description> <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <em:minVersion>2.0</em:minVersion> <em:maxVersion>2.0.0.*</em:maxVersion> </em:targetApplication> </Description> </RDF>

  39. install.rdf (1)‏ <?xml version="1.0" encoding="UTF-8"?> <RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#"> <Description about="urn:mozilla:install-manifest"> <em:id>helloworld@piro.sakura.ne.jp</em:id> <em:type>2</em:type> <em:name>Hellow, world!</em:name> <em:version>0.1</em:version> <em:description>My first extension.</em:description> <em:creator>SHIMODA Hiroshi</em:creator> <em:homepageURL>http://piro.sakura.ne.jp/xul/</em:homepageURL>

  40. install.rdf (2)‏ <em:targetApplication> <Description> <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <em:minVersion>2.0</em:minVersion> <em:maxVersion>2.0.0.*</em:maxVersion> </em:targetApplication> </Description> </RDF> IDs that can be assigned to targetApplication Firefox :{ec8030f7-c20a-464f-9b0e-13a3a9e97384} Thunderbird :{3550f703-e582-4d05-9a08-453d09bdfdc6}

  41. 2 chrome.manifest file path and designating overlay

  42. chrome.manifest content helloworld chrome/content/ overlay chrome://browser/content/browser.xul chrome://helloworld/content/overlay.xul

  43. chrome.manifest(1)‏ content helloworld chrome/content/ chrome://helloworld/content/ Chrome URL

  44. chrome.manifest(2)‏ overlay chrome://browser/content/browser.xul chrome://helloworld/content/overlay.xul browser.xul

  45. chrome.manifest(2)‏ overlay chrome://browser/content/browser.xulchrome://helloworld/content/overlay.xul overlay.xul browser.xul