2. What is a Chrome extension? Chrome policy: only add features that everyone will use Extra functionality added to pages or generally, to the browser Usually written using standard ‘web technologies’ Javascript HTML CSS JSON/XML data Special ZIP package with header information 2 Adam Horvath September 27, 2011 - Sydney
3. Why is it interesting? Business cases Add extra/new functionality to legacy systems Translate (localise) an existing web UI Provide custom UI for third party services Learn proper/sustainable (Java)script programming Increasing your ‘brand awareness’ However: unlikely to sell from the store! 3 Adam Horvath September 27, 2011 - Sydney
4. Types of extensions Browser action (for every webpage) Page action (based/filtered on the URL) Override pages (Bookmark manager, History, New tab) Omnibox helpers (custom search function) NPAPI native code (Netscape Plugin Application Programming Interface) (Themes) 4 Adam Horvath September 27, 2011 - Sydney
5. Supporting pages/objects Background page (always running) Options page (opened when necessary) Popup page (for browser actions) Content (scripts, css, ...) Desktop notification 5 Adam Horvath September 27, 2011 - Sydney
7. Messaging / storage Isolated world – One page, multiple extensions, no collision Almost all of the APIs are async Async communication between processes Send messages between extension/background pages Cross domain XMLHttpRequest / External services Storage (localStorage, 5Mb) 7 Adam Horvath September 27, 2011 - Sydney
8. Browser interaction Need to ask for permissions before installing Chrome.* namespace can access Bookmarks Cookies Events History Management Tabs Windows APIs are never removed after making their way into Stable branch 8 Adam Horvath September 27, 2011 - Sydney
9. Hosting / publishing Manifest JSON description or the extension Chrome web store (easy autoupdate) Free to host Connects with Google Analytics Can upload sample screenshots/YouTube video Custom location (Autoupdate possible) 9 Adam Horvath September 27, 2011 - Sydney
10. How to develop Need a good toolset Netbeans, Closure compiler, SED, batch job Crafting by small modules, iteratively Create sample page with sample Javascript Test, fix Merge into extension Testing (unpacked, compiled + packed) Debugging Do not rely on debugging, although Chrome is a good debugger Embedding images in CSS (base64) 10 Adam Horvath September 27, 2011 - Sydney
11. Demo 11 Adam Horvath September 27, 2011 - Sydney
12. Final thoughts Platform problems Users might randomly report ‘Does not work for me’ Psychology of voting Hard to change the vote average after just a few votes Votes are dependent on the type of audience Localisation Not covered here, but extensions can support many languages 12 Adam Horvath September 27, 2011 - Sydney
13. URLs This presentationhttp://slidesha.re/chromeextension efTwo (F2) Advanced Find on Pagehttp://bit.ly/eftwochrome Chrome Extensions Getting Started http://code.google.com/chrome/extensions Closure compilerhttp://code.google.com/closure/compiler/ Image/CSS converterhttp://webcodertools.com/imagetobase64converter encoded = urllib.parse.quote( base64.b64encode(open(filename, "rb").read()) ) Netbeanshttp://netbeans.org/downloads/ GNU Win32 (sed)http://sourceforge.net/projects/gnuwin32 13 Adam Horvath September 27, 2011 - Sydney
14. Questions 14 Adam Horvath Adam Horvath (adam@teamleadnet.com) September 27, 2011 - Sydney
