gadget.xml

   1 <?xml version="1.0" encoding="UTF-8"?>
   2 <Module>
   3
   4   <ModulePrefs
   5       title="dygraphs Gadget"
   6       description="Interactive, zoomable chart"
   7       author="Dan Vanderkam"
   8       author_email="dan@dygraphs.com"
   9       thumbnail="http://dygraphs.com/thumbnail.png"
  10       screenshot="http://dygraphs.com/screenshot.png"
  11       author_location="US"
  12       >
  13     <Require feature="idi" />
  14     <Require feature="locked-domain" />
  15   </ModulePrefs>
  16
  17   <UserPref name="_table_query_url" display_name="Data source url" required="true"/>
  18   <UserPref name="_table_query_refresh_interval" display_name="Data refresh interval (minutes)" default_value="300" datatype="enum" required="false">
  19     <EnumValue value="0" display_value="Do not refresh"/>
  20     <EnumValue value="60" display_value="1"/>
  21     <EnumValue value="300" display_value="5"/>
  22     <EnumValue value="1800" display_value="30"/>
  23   </UserPref>
  24   <UserPref name="_dg_rollPeriod" display_name="Roll Period" required="false" default_value="1" />
  25   <UserPref name="_dg_showRoller" display_name="Show Roller" required="false" default_value="false" datatype="bool" />
  26   <UserPref name="_dg_minY" display_name="Min Y Value" required="false" default_value="" />
  27   <UserPref name="_dg_maxY" display_name="Max Y Value" required="false" default_value="" />
  28   <UserPref name="_dg_kmb" display_name="KMB labels" required="false" default_value="false" datatype="bool" />
  29   <UserPref name="_dg_errorbars" display_name="Error Bars" required="false" default_value="false" datatype="bool" />
  30   <UserPref name="_dg_fillGraph" display_name="Fill Chart" required="false" default_value="false" datatype="bool" />
  31
  32   <Content type="html"><![CDATA[
  33
  34   <!-- Load the Google common loader, that is later used to load the Visualization API. -->
  35   <script src="http://www.google.com/jsapi" type="text/javascript"></script>
  36   <script src="http://dygraphs.com/dygraph-combined.js" type="text/javascript"></script>
  37
  38   <div id="chartdiv" style="overflow: auto;"><img src="http://www.google.com/ig/images/spinner.gif" /></div>
  39
  40   <script>
  41     var gadgetHelper = null;
  42     var table = null;
  43     var kPadding = 5;  // pixels of padding on any side of the chart.
  44
  45     _IG_RegisterOnloadHandler(loadVisualizationAPI);
  46
  47     /**
  48      * Load the Google Visualization API
  49      */
  50     function loadVisualizationAPI() {
  51       google.load("visualization", "1");
  52       google.setOnLoadCallback(sendQuery);
  53     }
  54
  55     /**
  56      * Create a query from the user prefs, and then send it to the data source.
  57      * This method is called once the visualization API is fully loaded.
  58      * Note that in the last line, a callback function is specified to be
  59      * called once the response is received from the data source.
  60      */
  61     function sendQuery() {
  62       var prefs = new _IG_Prefs(); // User preferences
  63       var chartDiv = _gel('chartdiv');
  64       chartDiv.style.width = (document.body.clientWidth - 2 * kPadding) + 'px';
  65       chartDiv.style.height = (document.body.clientHeight - 2 * kPadding) + 'px';
  66       chartDiv.style.left = kPadding + 'px';
  67       chartDiv.style.top = kPadding + 'px';
  68       chartDiv.style.position = 'absolute';
  69       chart = new DateGraph.GVizChart(chartDiv);
  70
  71       gadgetHelper = new google.visualization.GadgetHelper();
  72       var query = gadgetHelper.createQueryFromPrefs(prefs);
  73       query.send(handleQueryResponse);
  74     }
  75
  76     /**
  77      * Query response handler function.
  78      * Called by the Google Visualization API once the response is received.
  79      * Takes the query response and formats it as a table.
  80      */
  81     function handleQueryResponse(response) {
  82       // Use the visualization GadgetHelper class to validate the data, and
  83       // for error handling.
  84       if (!gadgetHelper.validateResponse(response)) {
  85         // Default error handling was done, just leave.
  86         return;
  87       };
  88       var data = response.getDataTable();
  89
  90       // Take the data table from the response, and format it.
  91       // var options = {showRowNumber: true};
  92       var prefs = new _IG_Prefs(); // User preferences
  93       var showRoller = prefs.getBool("_dg_showRoller");
  94       var rollPeriod = prefs.getInt("_dg_rollPeriod");
  95       var labelsKMB = prefs.getBool("_dg_kmb");
  96       var errorBars = prefs.getBool("_dg_errorbars");
  97       var fillGraph = prefs.getBool("_dg_fillGraph");
  98       var opts = {
  99         showRoller: showRoller,
 100         rollPeriod: rollPeriod,
 101         labelsKMB: labelsKMB,
 102         errorBars: errorBars,
 103         fillGraph: fillGraph
 104       };
 105
 106       var minY = prefs.getString("_dg_minY");
 107       var maxY = prefs.getString("_dg_maxY");
 108       if (minY && maxY) {
 109         opts.valueRange = [parseInt(minY), parseInt(maxY)];
 110       }
 111
 112       chart.draw(data, opts);
 113     };
 114
 115   </script>
 116
 117   ]]>
 118   </Content>
 119 </Module>