1,273
edits
Changes
no edit summary
{{draft}}
== JEP 33 - Window Gadget ==
* Champion: Daniel Buchner <daniel@mozilla.com>
* Type: API Track
* Created: 2 Dec 2009
* Reference Implementation: new WindowGadget({options})
* [[Labs/Jetpack/JEPs|JEP Index]]
=== Introduction and Rationale ===
=== Proposal ===
A new Window Gadget instantiation:<code>new WindowGadget({options})</code>
Where <tt>options</tt> is an object:
Properties
* <tt>icon</tt> <i>uri</i> - icon to show in the title bar section of the windowGadget
* <tt>html</tt> <i>text/xml</i> - html content for the feature
* <tt>url</tt> <i>uri</i> - url to load content for the feature
* <tt>width</tt> <i>num</i> - initial width of the Window Gadget (defaults: 320px - standard smartphone width resolution)* <tt>height</tt> <i>num</i> - initial height of the Window Gadget (defaults: 480px - standard smartphone height resolution)* <tt>persist</tt> <i>bool</i> - specifies whether or not a Window stay open when a user closes the browser instance* <tt>allowMaximize</tt> <i>bool</i> - specifies whether or not a Window Gadget will have the ability to maximize* <tt>allowResize</tt> <i>bool</i> - specifies whether or not a user can resize a windowGadget
Events
* <tt>onFocus</tt> <i>func</i> - event triggered when the Window Gadget is focused* <tt>onBlur</tt> <i>func</i> - event triggered when the Window Gadget losses focus* <tt>onReady</tt> <i>func</i> - event triggered when the WindowGadget's content is loaded and ready for manipulation* <tt>onMinimize</tt> <i>func</i> - event triggered when the Window Gadget is minimized to the task bar* <tt>onMaximize</tt> <i>func</i> - event triggered when the Window Gadget is maximized* <tt>onRestore</tt> <i>func</i> - event triggered when the Window Gadget is restored from the task bar
All events are passed the following property hash:
* <tt>icon</tt> - a pointer to the icon used in the Window Gadget title bar.
** <tt>icon.toDefault()</tt> - reload icon to original icon
* <tt>contentDocument</tt> - document element of the content area
* <tt>position</tt> - an object that includes the WindowGadget's position on the screen: {x: 400, y: 500} * <tt>location</tt> - the URL of the Gadget's windowobject, http://, chrome://
=== Example ===
Show mozilla.com in a Window Gadget and change the background color of the document when clicked.
<pre class="brush:js;toolbar:false;">
new WindowGadget({,
url: "http://www.mozilla.com/",
width: 300,
onFocus: function(windowgadget) { windowgadget.contentWindow.document.body.style.background = '#ffffff';
},
onBlur: function(gadget){ windowgadget.contentWindow.document.body.style.background = '#ff0000';
}
});
</pre>
