Developer Guide

Widgetop supports Apple Dashboard widgets and hosts everything online in a web desktop.

Widgetop enables developers to reuse their existing widget HTML, CSS and Javascript code and API knowledge to publish their widgets for the Web 2.0.

Follow Apples Developer Guidelines to create your widgets.
Test your widget with Firefox:
- Use the Widget test page and point to your local widget directory
- Look for Javascript console errors
- The Firefox extension 'DOM Inspector' and 'Web Developer' help with testing and finding bugs
Widgetop runs in the web browser so widgets dont have access to the underlying operating system as in the full Dashboard environment, so you can't:
- access the system console from the widget.system() command
- use Widget Plugins. If your the plugin doesn't contain required functionality make sure all access to the plugin is masked by:
```
if (widget.MyPluginObject) ...
```
- load from the local file system with
```
file://
```
- access the Pasteboard
- access Objective-C code from Javascript
If your widget relies on these features it won't be able to run.
Some minor changes are required to overcome little incompatibilities between Safari and Firefox (none is incompatible with the Dashboard API):
- General Javascript code
  - Always load your Javascript code from separate files.
  - If the code isn't loaded try to change
```
<script src=".." .../>
```
    to
```
<script src=".."></script>
```
  - Replace element.innerText by element.innerHTML. The innerText property is not supported by Firefox.
  - Use standard conform DOM code, e.g. access elements by
```
document.getElementById("theElement")
```
    instead of
```
document.theElement
```
- Javascript event objects
  - Dont use
```
window.event
```
    but use the event parameter in your event handler code:
```
element.onmousedown=function(event){..}
```
  - Use
```
event.clientX
```
    instead of
```
event.x
```
    to access the mouse coordinates.
- The widget startup is a little different from the Dasboard system:
  - Static Javascript code (outside functions) which are loaded on page load don't have access to the window.widget object, and to functions and objects defined in Javascript code which are loaded from
```
/System/Library/WidgetResources/
```
    (like buttons, scrollbars, and sliders)
  - ```
  body.onload
```
  is called twice. Only on the second call:
  - window.widget
    is set
  - you can access libraries loaded from
    /System/Library/WidgetResources/
  - the XMLHttpRequest object works
Rules for widget startup code:
- Avoid static Javascript code. At least don't access
```
  window.widget
```
  form there.
- Make sure your body.onload method can be called twice. Test for
```
  if (window.widget) {..}
```
  before you setup the widget.
- The <canvas> element:
  - Don't use deprecated context methods in Javascript. You can find list of supported commands for the <canvas> implementation here.
Use the Submit Widget link to upload and deploy your widgets on Widgetop
- Once uploaded your widget will be tested before being deployed.
- Please allow some time for Widgetop to test and deploy your widget.
On your web site you can promote your widgets with a Widgetop quick "Add to Widgetop" button.
This button can be placed on your developer web pages for each widget and linked via a unique URL to automatically launch widgets on the Widgetop Web Desktop and place them in the users favorites list.

Steps to include for each widget you want to promote on your web page:
- In the Widget Manager Console (submit widget) press the Show "Add button" link for your widget.
- Copy the snippet HTML to your web page
- Choose between the large, small or tiny button image and then set the src button image
- Once uploaded and deployed test the link works by launching your widget by clicking the link

For any technical questions please contact us on: developer@widgetop.com