94
edits
Labs/Jetpack/JEP/14: Difference between revisions
Finished up first draft of proposal
Abimanyuraja (talk | contribs) (Started the page) |
Abimanyuraja (talk | contribs) (Finished up first draft of proposal) |
||
| Line 12: | Line 12: | ||
=== Introduction and Rationale === | === Introduction and Rationale === | ||
This JEP describes the API to append items to the | This JEP describes the API to append items to the menu bars. | ||
As Jetpack's goal is to make extension development, it is important that the Jetpack API supports a wide range of chrome UI elements. Adding menu items to the menubar is very common among Firefox extensions. | As Jetpack's goal is to make extension development easier, it is important that the Jetpack API supports a wide range of chrome UI elements. Adding menu items to the menubar is very common among Firefox extensions. | ||
In the spirit of keeping Jetpack proposals focused, there will be no support for submenus in this proposal. That will come later as a separate JEP (and support for submenus is crucial as a number of extensions like Firebug and Greasemonkey make use of submenus). | In the spirit of keeping Jetpack proposals focused, there will be no support for submenus in this proposal. That will come later as a separate JEP (and support for submenus is crucial as a number of extensions like Firebug and Greasemonkey make use of submenus). | ||
=== Proposal === | |||
The Menubar API will live at <code>jetpack.menuBar</code>. It will provide access to anything that relates to the Firefox Menu Bar starting with adding single menu items. | |||
==== Appending a new Menu Item ==== | |||
<pre class="brush:js;toolbar:false;"> | |||
jetpack.menuBar.append(menuName, options) | |||
</pre> | |||
''Arguments'' | |||
<code>menuName</code>: Any of the main menus in the menu bar - file, edit, view, | |||
history, tools and help. | |||
<code>options</code>: A dictionary containing key-value pairs describing the menu item. All properties are optional. | |||
* <code>label</code> (string) | |||
* <code>icon</code> (string) | |||
* <code>onClick</code> (function) | |||
* <code>shortcutKey</code> (object) | |||
**<code>key</code> (character) | |||
**<code>modifiers </code> (array; permissible values are "accel", "shift", "alt", "ctrl") | |||
* <code>disabled</code> (boolean) | |||
'''Example''' | |||
Create a menu item in the Tools menu that submits the page to del.icio.us (as it looks in the official del.icio.us toolbar). | |||
<pre class="brush:js;"> | |||
jetpack.menuBar.append("tools", { | |||
label : "Save a new Bookmark..", | |||
icon : "http://delicious.com/favicon.ico", | |||
shortcutKey : {"key" : "D", modifiers : ["accel"]}, | |||
onClick : function(){ | |||
f='http://delicious.com/save?url='" + | |||
encodeURIComponent(window.location.href)+ | |||
'&title='+encodeURIComponent(document.title)+ | |||
'&v=5&'; | |||
a = function(){ | |||
if(!window.open(f+'noui=1&jump=doclose', | |||
'deliciousuiv5','location=yes,links=no, | |||
scrollbars=no,toolbar=no,width=550,height=550')) | |||
location.href=f+'jump=yes' | |||
}; | |||
if(/Firefox/.test(navigator.userAgent)){ | |||
setTimeout(a,0) | |||
}else{ | |||
a() | |||
} | |||
} // code from del.icio.us bookmarklet | |||
}); | |||
</pre> | |||
How it should look - | |||
[[Image:Example-menuitem-jetpack.png|Example del.icio.us menu item]] | |||