{"id":1813,"date":"2010-09-02T16:01:06","date_gmt":"2010-09-02T23:01:06","guid":{"rendered":"http:\/\/blog.mozilla.org\/addons\/?p=1813"},"modified":"2010-09-03T09:02:58","modified_gmt":"2010-09-03T16:02:58","slug":"mozilla-add-ons-sdk-0-7-example","status":"publish","type":"post","link":"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/","title":{"rendered":"Mozilla Add-ons SDK 0.7 Example"},"content":{"rendered":"<p>The release of the Mozilla Add-ons SDK 0.7 brings with it many useful APIs developers can leverage to create an even wider variety of Firefox add-ons without touching a single line of code from the underlying Mozilla platform. Notable APIs from 0.7 include Clipboard, Notifications, and the topic of this post, the Panel API.<\/p>\n<p>The addition of Panel in the SDK provides for numerous UI and display implementations that were not nearly as easy to accomplish in earlier versions of the SDK. You can now easily display detailed, interactive content in response to a user interacting with your add-on&#8217;s widget, toolbar, or other browser UI.<\/p>\n<p>Here is an example of what creating a simple Panel API instance looks like:<\/p>\n<pre>\r\nvar panels = require(\"panel\");\r\nvar data = require(\"self\").data;\r\n\r\nvar myPanel = panels.add(panels.Panel({\r\n    contentURL: data.url(\"somepage.html\")\r\n}));\r\n<\/pre>\n<p>In the example extension MailPing, panels are used to show the user detailed information about their unread email messages. You can download <a href=\"https:\/\/addons.mozilla.org\/en-US\/firefox\/addon\/162066\/\">MailPing<\/a> from addons.mozilla.org or grab a zippy of the <a href=\"http:\/\/people.mozilla.com\/~dbuchner\/demos\/extensions\/mailping.rar\">entire package<\/a>, add-on, source files and all.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The release of the Mozilla Add-ons SDK 0.7 brings with it many useful APIs developers can leverage to create an even wider variety of Firefox add-ons without touching a single &hellip; <a class=\"go\" href=\"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/\">Read more<\/a><\/p>\n","protected":false},"author":204,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[121],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Mozilla Add-ons SDK 0.7 Example - Mozilla Add-ons Community Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/\",\"url\":\"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/\",\"name\":\"Mozilla Add-ons SDK 0.7 Example - Mozilla Add-ons Community Blog\",\"isPartOf\":{\"@id\":\"https:\/\/blog.mozilla.org\/addons\/#website\"},\"datePublished\":\"2010-09-02T23:01:06+00:00\",\"dateModified\":\"2010-09-03T16:02:58+00:00\",\"author\":{\"@id\":\"\"},\"breadcrumb\":{\"@id\":\"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/blog.mozilla.org\/addons\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Mozilla Add-ons SDK 0.7 Example\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/blog.mozilla.org\/addons\/#website\",\"url\":\"https:\/\/blog.mozilla.org\/addons\/\",\"name\":\"Mozilla Add-ons Community Blog\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/blog.mozilla.org\/addons\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"\",\"url\":\"https:\/\/blog.mozilla.org\/addons\/author\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Mozilla Add-ons SDK 0.7 Example - Mozilla Add-ons Community Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/","twitter_misc":{"Written by":"","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/","url":"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/","name":"Mozilla Add-ons SDK 0.7 Example - Mozilla Add-ons Community Blog","isPartOf":{"@id":"https:\/\/blog.mozilla.org\/addons\/#website"},"datePublished":"2010-09-02T23:01:06+00:00","dateModified":"2010-09-03T16:02:58+00:00","author":{"@id":""},"breadcrumb":{"@id":"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/blog.mozilla.org\/addons\/2010\/09\/02\/mozilla-add-ons-sdk-0-7-example\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/blog.mozilla.org\/addons\/"},{"@type":"ListItem","position":2,"name":"Mozilla Add-ons SDK 0.7 Example"}]},{"@type":"WebSite","@id":"https:\/\/blog.mozilla.org\/addons\/#website","url":"https:\/\/blog.mozilla.org\/addons\/","name":"Mozilla Add-ons Community Blog","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/blog.mozilla.org\/addons\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"","url":"https:\/\/blog.mozilla.org\/addons\/author\/"}]}},"_links":{"self":[{"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/posts\/1813"}],"collection":[{"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/users\/204"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/comments?post=1813"}],"version-history":[{"count":0,"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/posts\/1813\/revisions"}],"wp:attachment":[{"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/media?parent=1813"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/categories?post=1813"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/tags?post=1813"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}