[Summary view] [Print] [Text view]

   1  /**
   2   * Provides a tool for enabling/disabling elements using AJAX/REST.
   3   *
   4   * @module moodle-message_airnotifier-toolboxes
   5   */
   6  
   7  // The CSS selectors we use.
   8  var CSS = {
   9      AIRNOTIFIERCONTENT: 'fieldset#messageprocessor_airnotifier',
  10      HIDEDEVICE: 'a.hidedevice',
  11      DEVICELI: 'li.airnotifierdevice',
  12      DIMCLASS: 'dimmed',
  13      DIMMEDTEXT: 'dimmed_text',
  14      DEVICEIDPREFIX: 'deviceid-'
  15  };
  16  
  17  /**
  18   * The toolbox classes
  19   *
  20   * TOOLBOX is a generic class which should never be directly instantiated
  21   * DEVICETOOLBOX is a class extending TOOLBOX containing code specific to devices
  22   */
  23  var TOOLBOX = function() {
  24      TOOLBOX.superclass.constructor.apply(this, arguments);
  25  };
  26  
  27  Y.extend(TOOLBOX, Y.Base, {
  28      /**
  29       * Replace the button click at the selector with the specified
  30       * callback
  31       *
  32       * @param toolboxtarget The selector of the working area
  33       * @param selector The 'button' to replace
  34       * @param callback The callback to apply
  35       * @param cursor An optional cursor style to apply
  36       */
  37      replace_button: function(toolboxtarget, selector, callback, cursor) {
  38          if (!cursor) {
  39              // Set the default cursor type to pointer to match the anchor.
  40              cursor = 'pointer';
  41          }
  42          var button = Y.one(toolboxtarget).all(selector)
  43          .setStyle('cursor', cursor);
  44  
  45          // On isn't chainable and will return an event.
  46          button.on('click', callback, this);
  47  
  48          return button;
  49      },
  50      /**
  51       * Toggle the visibility and availability for the specified
  52       * device show/hide button
  53       */
  54      toggle_hide_device_ui: function(button) {
  55  
  56          var element = button.ancestor(CSS.DEVICELI);
  57          var hideicon = button.one('img');
  58  
  59          var toggle_class = CSS.DIMMEDTEXT;
  60  
  61          var status = '';
  62          if (element.hasClass(toggle_class)) {
  63              status = 'hide';
  64          } else {
  65              status = 'show';
  66          }
  67  
  68          // Change the UI.
  69          element.toggleClass(toggle_class);
  70          // We need to toggle dimming on the description too element.all(CSS.CONTENTAFTERLINK).toggleClass(CSS.DIMMEDTEXT);.
  71          var newstring = M.util.get_string(status, 'moodle');
  72          hideicon.setAttrs({
  73              'alt': newstring,
  74              'title': newstring,
  75              'src': M.util.image_url('t/' + status)
  76          });
  77          button.set('title', newstring);
  78          button.set('className', 'editing_' + status);
  79      },
  80      /**
  81       * Send a request using the REST API
  82       *
  83       * @param data The data to submit
  84       * @param statusspinner (optional) A statusspinner which may contain a section loader
  85       * @param callbacksuccess Call back on success
  86       * @return response responseText field from responce
  87       */
  88      send_request: function(data, statusspinner, callbacksuccess) {
  89          // Default data structure
  90          if (!data) {
  91              data = {};
  92          }
  93          // Handle any variables which we must pass back through to.
  94          var pageparams = this.get('config').pageparams,
  95              varname;
  96          for (varname in pageparams) {
  97              data[varname] = pageparams[varname];
  98          }
  99  
 100          if (statusspinner) {
 101              statusspinner.show();
 102          }
 103  
 104          data.sesskey = M.cfg.sesskey;
 105  
 106          var uri = M.cfg.wwwroot + this.get('ajaxurl');
 107  
 108          // Define the configuration to send with the request.
 109          var responsetext = [];
 110          var config = {
 111              method: 'POST',
 112              data: data,
 113              on: {
 114                  success: function(tid, response) {
 115                      try {
 116                          responsetext = Y.JSON.parse(response.responseText);
 117                          if (responsetext.error) {
 118                              Y.use('moodle-core-notification-ajaxexception', function() {
 119                                  return new M.core.ajaxException(responsetext).show();
 120                              });
 121                          } else if (responsetext.success) {
 122                              callbacksuccess();
 123                          }
 124                      } catch (e) {
 125                          // Ignore.
 126                      }
 127                      if (statusspinner) {
 128                          statusspinner.hide();
 129                      }
 130                  },
 131                  failure: function(tid, response) {
 132                      if (statusspinner) {
 133                          statusspinner.hide();
 134                      }
 135                      Y.use('moodle-core-notification-ajaxexception', function() {
 136                          return new M.core.ajaxException(response).show();
 137                      });
 138                  }
 139              },
 140              context: this,
 141              sync: false
 142          };
 143  
 144          // Send the request.
 145          Y.io(uri, config);
 146          return responsetext;
 147      },
 148      /**
 149       * Return the module ID for the specified element
 150       *
 151       * @param element The <li> element to determine a module-id number for
 152       * @return string The module ID
 153       */
 154      get_element_id: function(element) {
 155          return element.get('id').replace(CSS.DEVICEIDPREFIX, '');
 156      }
 157  },
 158  {
 159      NAME: 'device-toolbox',
 160      ATTRS: {
 161          ajaxurl: {
 162              'value': 0
 163          },
 164          config: {
 165              'value': 0
 166          }
 167      }
 168  }
 169  );
 170  
 171  var DEVICETOOLBOX = function() {
 172      DEVICETOOLBOX.superclass.constructor.apply(this, arguments);
 173  };
 174  
 175  Y.extend(DEVICETOOLBOX, TOOLBOX, {
 176  
 177      /**
 178       * Initialize the device toolbox
 179       *
 180       * Updates all span.commands with relevant handlers and other required changes
 181       */
 182      initializer: function() {
 183          this.setup_for_device();
 184      },
 185      /**
 186       * Update any span.commands within the scope of the specified
 187       * selector with AJAX equivelants
 188       *
 189       * @param baseselector The selector to limit scope to
 190       * @return void
 191       */
 192      setup_for_device: function(baseselector) {
 193          if (!baseselector) {
 194              baseselector = CSS.AIRNOTIFIERCONTENT;
 195          }
 196  
 197          Y.all(baseselector).each(this._setup_for_device, this);
 198      },
 199      _setup_for_device: function(toolboxtarget) {
 200  
 201          // Show/Hide.
 202          this.replace_button(toolboxtarget, CSS.HIDEDEVICE, this.toggle_hide_device);
 203      },
 204      toggle_hide_device: function(e) {
 205          // Prevent the default button action.
 206          e.preventDefault();
 207  
 208          // Get the element we're working on.
 209          var element = e.target.ancestor(CSS.DEVICELI);
 210  
 211          var button = e.target.ancestor('a', true);
 212  
 213          var value;
 214          // Enable the device in case the CSS is dimmed.
 215          if (element.hasClass(CSS.DIMMEDTEXT)) {
 216              value = 1;
 217          } else {
 218              value = 0;
 219          }
 220  
 221          // Send the request.
 222          var data = {
 223              'field': 'enable',
 224              'enable': value,
 225              'id': this.get_element_id(element)
 226          };
 227          var spinner = M.util.add_spinner(Y, element);
 228  
 229          var context = this;
 230          var callback = function() {
 231              context.toggle_hide_device_ui(button);
 232          };
 233          this.send_request(data, spinner, callback);
 234      }
 235  }, {
 236      NAME: 'message-device-toolbox',
 237      ATTRS: {
 238  }
 239  });
 240  
 241  M.message = M.message || {};
 242  
 243  M.message.init_device_toolbox = function(config) {
 244      return new DEVICETOOLBOX(config);
 245  };
 246