Wiki

Widgets

Each widget is comprised of a HTML file (the HTML that fills the widget's

element on the dashboard), a CSS file and, most importantly, a JavaScript file. Each of these files must have the same name as the folder they're located in.

This is a basic widget to print plaintext provided by the "Hello World" job above (where widgetName is the name of the widget):

widget = {
    //runs when we receive data from the job
    onData: function(el, data) {

        //The parameters our job passed through are in the data object
        //el is our widget element, so our actions should all be relative to that
        if (data.title) {
            $('h2', el).text(data.title);
        }

        $('.content', el).html(data.text);
    }
};

How to refer to per widget static assets:

In your html:

#!code

<img src="/widgets/resources?resource=atlassian/shipit/myimage.png">

will fetch the image located on

#!code

packages
- atlassian
  - widgets
    - shipit
       - myimage.png