templates/CRM/common/dashboard.tpl

   1 {*
   2  +--------------------------------------------------------------------+
   3  | CiviCRM version 4.7                                                |
   4  +--------------------------------------------------------------------+
   5  | Copyright CiviCRM LLC (c) 2004-2015                                |
   6  +--------------------------------------------------------------------+
   7  | This file is a part of CiviCRM.                                    |
   8  |                                                                    |
   9  | CiviCRM is free software; you can copy, modify, and distribute it  |
  10  | under the terms of the GNU Affero General Public License           |
  11  | Version 3, 19 November 2007 and the CiviCRM Licensing Exception.   |
  12  |                                                                    |
  13  | CiviCRM is distributed in the hope that it will be useful, but     |
  14  | WITHOUT ANY WARRANTY; without even the implied warranty of         |
  15  | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.               |
  16  | See the GNU Affero General Public License for more details.        |
  17  |                                                                    |
  18  | You should have received a copy of the GNU Affero General Public   |
  19  | License and the CiviCRM Licensing Exception along                  |
  20  | with this program; if not, contact CiviCRM LLC                     |
  21  | at info[AT]civicrm[DOT]org. If you have questions about the        |
  22  | GNU Affero General Public License or the licensing of CiviCRM,     |
  23  | see the CiviCRM license FAQ at http://civicrm.org/licensing        |
  24  +--------------------------------------------------------------------+
  25 *}
  26 {literal}
  27 <script type="text/javascript">
  28
  29 CRM.$(function($) {
  30   // The set of options we can use to initialize jQuery.dashboard().
  31   var options = {
  32     // Optional. Defaults to 3.  You'll need to change the width of columns in CSS too.
  33     columns: 2,
  34
  35     // Set this to a link to your server-side script that adds widgets to the dashboard.
  36     // The server will need to choose a column to add it to, and change the user's settings
  37     // stored server-side.
  38     // Required.
  39     emptyPlaceholderInner: '',
  40
  41     // These define the urls and data objects used for all of the ajax requests to the server.
  42     // data objects are extended with more properties, as defined below.
  43     // All are required.  All should return JSON.
  44     ajaxCallbacks: {
  45
  46       // Server returns the configuration of widgets for this user;
  47       // An array (keyed by zero-indexed column ID), of arrays (keyed by widget ID) of
  48       // booleans; true if the widget is minimized.  False if not.
  49       // E.g. [{ widgetID: isMinimized, ...}, ...]
  50       getWidgetsByColumn: {
  51         url:  {/literal}'{crmURL p='civicrm/ajax/dashboard' h=0 }'{literal},
  52         data: {
  53           op: 'get_widgets_by_column', key: {/literal}"{crmKey name='civicrm/ajax/dashboard'}"{literal}
  54         }
  55       },
  56
  57       // Given the widget ID, the server returns the widget object as an associative array.
  58       // E.g. {content: '<p>Widget content</p>', title: 'Widget Title', }
  59       //
  60       // Required properties:
  61       //  * title: Text string.  Widget title
  62       //  * content: HTML string.  Widget content
  63       //
  64       // Optional properties:
  65       //  * classes: String CSS classes that will be added to the widget's <li>
  66       //  * fullscreen: HTML string for the content of the widget's full screen display.
  67       //  * settings: Boolean.  True if widget has settings pane/display and server-side
  68       //    callback.
  69       //
  70       // Server-side executable script callbacks are called and executed on certain
  71       // events.  They can use the widgets property of the dashboard object returned
  72       // from jQuery.dashboard().  E.g. dashboard.widgets[widgetID].  They should be
  73       // javascript files on the server.  Set the property to the path of the js file:
  74       //  * initScript:  Called when dashboard is initialising (but not finished).
  75       //  * fullscreenInitScript:  Called when the full screen element is initialising
  76       //    (being created for the first time).
  77       //  * fullscreenScript:  Called when switching into full screen mode.  Executed
  78       //    every time the widget goes into full-screen mode.
  79       //  * reloadContentScript:  Called when the widget's reloadContent() method is
  80       //    called.  (The widget.reloadContent() method is not used internally so must
  81       //    have either the callback function or this server-side executable javascript
  82       //    file implemented for the method to do anything.)
  83       //
  84       // The 'id' property of data is reserved for the widget ID – a string.
  85       getWidget: {
  86         url: {/literal}'{crmURL p='civicrm/ajax/dashboard' h=0 }'{literal},
  87         data: {
  88           // id: widgetID,
  89           op: 'get_widget', key: {/literal}"{crmKey name='civicrm/ajax/dashboard'}"{literal}
  90         }
  91       },
  92
  93       // jQuery.dashboard() POSTs the widget-to-column settings here.  The server's
  94       // response is sent to console.log() (if it exists), but is not used.  No checks
  95       // for errors have been implemented yet.
  96       // The 'columns' property of data is reserved for the widget-to-columns settings:
  97       //    An array (keyed by zero-indexed column ID), of arrays (keyed by widget ID)
  98       //    of ints; 1 if the widget is minimized.  0 if not.
  99       saveColumns: {
 100         url: {/literal}'{crmURL p='civicrm/ajax/dashboard' h=0 }'{literal},
 101         data: {
 102           // columns: array(0 => array(widgetId => isMinimized, ...), ...),
 103           op: 'save_columns', key: {/literal}"{crmKey name='civicrm/ajax/dashboard'}"{literal}
 104         }
 105       },
 106
 107       // jQuery.dashboard() GETs a widget's settings object and POST's a users submitted
 108       // settings back to the server.  The return, in both cases, is an associative
 109       // array with the new settings markup and other info:
 110       //
 111       // Required properties:
 112       //  * markup: HTML string.  The inner HTML of the settings form.  jQuery.dashboard()
 113       //    provides the Save and Cancel buttons and wrapping <form> element.  Can include
 114       //    <input>s of any standard type and <select>s, nested in <div>s etc.
 115       //
 116       // Server-side executable script callbacks (See documentation for
 117       // ajaxCallbacks.getWidgets):
 118       //  * initScript:  Called when widget settings are initialising.
 119       //  * script:  Called when switching into settings mode.  Executed every time
 120       //    the widget goes into settings-edit mode.
 121       //
 122       // The 'id' property of data is reserved for the widget ID.
 123       // The 'settings' property of data is reserved for the user-submitted settings.
 124       //    An array (keyed by the name="" attributes of <input>s), of <input> values.
 125       widgetSettings: {
 126         url: {/literal}'{crmURL p='civicrm/ajax/dashboard' h=0 }'{literal},
 127         data: {
 128           // id: widgetId,
 129           // settings: array(name => value, ...),
 130           op: 'widget_settings', key: {/literal}"{crmKey name='civicrm/ajax/dashboard'}"{literal}
 131         }
 132       }
 133     },
 134
 135     // Optional javascript callbacks for dashboard events.
 136     // All callbacks have the dashboard object available as the 'this' variable.
 137     // This property and all of it's members are optional.
 138     callbacks: {
 139       // Called when dashboard is initializing.
 140       init: function() {
 141         var dashboard = this;
 142       },
 143
 144       // Called when dashboard has finished initializing.
 145       ready: function() {
 146         var dashboard = this;
 147       },
 148
 149       // Called when dashboard has saved columns to the server.
 150       saveColumns: function() {
 151         var dashboard = this;
 152       },
 153
 154       // Called when a widget has gone into fullscreen mode.
 155       // Takes one argument for the widget.
 156       enterFullscreen: function(widget) {
 157         var dashboard = this;
 158       },
 159
 160       // Called when a widget has come out of fullscreen mode.
 161       // Takes one argument for the widget.
 162       exitFullscreen: function(widget) {
 163         var dashboard = this;
 164       }
 165     },
 166
 167     // Optional javascript callbacks for widget events.
 168     // All callbacks have the respective widget object available as the 'this' variable.
 169     // This property and all of it's members are optional.
 170     widgetCallbacks: {
 171       // Called when a widget has been gotten from the server.
 172       get: function() {
 173         var widget = this;
 174       },
 175
 176       // Called when an external script has invoked the widget.reloadContent() method.
 177       // (The widget.reloadContent() method is not used internally so must have either
 178       // this callback function or a server-side executable javascript file implemented
 179       // for the method to do anything.)
 180       reloadContent: function() {
 181         var widget = this;
 182       },
 183
 184       // Called when the widget has gone into settings-edit mode.
 185       showSettings: function() {
 186         var widget = this;
 187       },
 188
 189       // Called when the widget's settings have been saved to the server.
 190       saveSettings: function() {
 191         var widget = this;
 192       },
 193
 194       // Called when the widget has gone out of settings-edit mode.
 195       hideSettings: function() {
 196         var widget = this;
 197       },
 198
 199       // Called when the widget has been removed from the dashboard.
 200       remove: function() {
 201         var widget = this;
 202       }
 203     }
 204   };
 205
 206   // Initialize the dashboard using these options
 207   $('#civicrm-dashboard').dashboard(options);
 208
 209 });
 210
 211 </script>
 212 {/literal}