Fetching contributors…
Cannot retrieve contributors at this time
66 lines (44 sloc) 2.19 KB

Dashboard Widgets


Basic example of a dynamic and configurable widget can be browsed and downloaded at

Plugins can provide dashboard widgets by extending the :class:`aj.plugins.dashboard.api.Widget` abstract class:

class RandomWidget(Widget):
    id = 'random'

    # display name
    name = 'Random'

    # template of the widget
    template = '/demo_5_widget:resources/partial/widget.html'

    # template of the configuration dialog
    config_template = '/demo_5_widget:resources/partial/widget.config.html'

    def __init__(self, context):
        Widget.__init__(self, context)

    def get_value(self, config):
        # generate value based on widget's config
        if 'bytes' not in config:
            return 'Not configured'
        return os.urandom(int(config['bytes'])).encode('hex')

There are some CSS classes available for the standard widget looks:

<div ng:controller="Demo5WidgetController">
    <div class="widget-header">
    <div class="widget-value">
        {{value || 'Unknown'}}

The templates should reference appropriate controllers:

angular.module('ajenti.demo5').controller 'Demo5WidgetController', ($scope) ->
    # $scope.widget is our widget descriptor here
    $scope.$on 'widget-update', ($event, id, data) ->
        if id != $
        $scope.value = data

angular.module('ajenti.demo5').controller 'Demo5WidgetConfigController', ($scope) ->
    # $scope.configuredWidget is our widget descriptor here
    # some defaults
    $scope.configuredWidget.config.bytes ?= 4

Initially, dashboard will create your widget with an empty ({}) config and show the configuration dialog you provided.

Dashboard will issue periodic requests to your :class:`aj.plugins.dashboard.api.Widget` implementations. Your widget classes should not retain any state. If user creates multiple widgets of same type, a single instance will be created to service their requests.