Labs/Jetpack/JEP/33

	THIS PAGE IS A WORKING DRAFT
	The page may be difficult to navigate, and some information on its subject might be incomplete and/or evolving rapidly. If you have any questions or ideas, please add them as a new topic on the discussion page.

JEP 33 - Window

Champion: Daniel Buchner <daniel@mozilla.com>
Status: Concept
Type: API Track
Created: 2 Dec 2009
Reference Implementation: jetpack.addElement('window')
JEP Index

Introduction and Rationale

Window for Jetpack is a crucial API enhancement that allows developers using the Jetpack extension development platform to extend both functional and presentational capabilities of their Jetpacks. Window abilities are the gateway to a large, uncharted mass of applications that can be developed in concert with the other useful tools provided by Jetpack.

Proposal

A new Window instantiation: jetpack.addElement('window', {options})

Where options is an object:

Properties

icon uri - icon to show in the title bar section of the window
html text/xml - html content for the feature
url uri - url to load content for the feature
width num - initial width of the Window (320 - standard smartphone width resolution)
height num - initial height of the Window (480 - standard smartphone height resolution)
persist bool - specifies whether or not a Window stay open when a user closes the browser instanc
allowMaximize bool - specifies whether or not a Window will have the ability to maximize
allowResize bool - specifies whether or not a user can resize a window

Events

onFocus func - event triggered when the Window is focused
onBlur func - event triggered when the Window losses focus
onReady func - event triggered when the Window's content is loaded and ready for manipulation
onMinimize func - event triggered when the Window is minimized to the task bar
onMaximize func - event triggered when the Window is maximized
onRestore func - event triggered when the Window is restored from the task bar

 All events are passed the following property hash:
 * icon - a pointer to the icon used in the Window title bar.
 ** icon.default() - reload icon to original icon
 * contentDocument - document element of the content area
 * position - an object that includes the Window's position on the screen: {x: 400, y: 500}
 * location - the URL of the window, http://, chrome://

Example

Show mozilla.com in a Window and change the background color of the document when clicked.

jetpack.addElement('window',
    url: "http://www.mozilla.com/",
    width: 300,
    onFocus: function(window) {
        window.contentWindow.document.body.style.background = '#ffffff';
    },
    onBlur: function(){
        window.contentWindow.document.body.style.background = '#ff0000';
    }
});