[Summary view] [Print] [Text view]

   1  /**
   2   * A module to manage dropdowns on the rule add/edit form.
   3   *
   4   * @module moodle-tool_monitor-dropdown
   5   */
   6  
   7  /**
   8   * A module to manage dependent selects on the edit page.
   9   *
  10   * @since Moodle 2.8
  11   * @class moodle-tool_monitor.dropdown
  12   * @extends Base
  13   * @constructor
  14   */
  15  function DropDown() {
  16      DropDown.superclass.constructor.apply(this, arguments);
  17  }
  18  
  19  
  20  var SELECTORS = {
  21          PLUGIN: '#id_plugin',
  22          EVENTNAME: '#id_eventname',
  23          OPTION: 'option',
  24          CHOOSE: 'option[value=""]'
  25      };
  26  
  27  Y.extend(DropDown, Y.Base, {
  28  
  29      /**
  30       * Reference to the plugin node.
  31       *
  32       * @property plugin
  33       * @type Object
  34       * @default null
  35       * @protected
  36       */
  37      plugin: null,
  38  
  39      /**
  40       * Reference to the plugin node.
  41       *
  42       * @property eventname
  43       * @type Object
  44       * @default null
  45       * @protected
  46       */
  47      eventname: null,
  48  
  49      /**
  50       * Initializer.
  51       * Basic setup and delegations.
  52       *
  53       * @method initializer
  54       */
  55      initializer: function() {
  56          this.plugin = Y.one(SELECTORS.PLUGIN);
  57          this.eventname = Y.one(SELECTORS.EVENTNAME);
  58          var selection = this.eventname.get('value'); // Get selected event name.
  59          this.updateEventsList();
  60          this.updateSelection(selection);
  61          this.plugin.on('change', this.updateEventsList, this);
  62      },
  63  
  64      /**
  65       * Method to update the events list drop down when plugin list drop down is changed.
  66       *
  67       * @method updateEventsList
  68       */
  69      updateEventsList: function() {
  70          var node, options, choosenode;
  71          var plugin = this.plugin.get('value'); // Get component name.
  72          var namespace = '\\' + plugin + '\\';
  73          this.eventname.all(SELECTORS.OPTION).remove(true); // Delete all nodes.
  74          options = this.get('eventlist');
  75  
  76          // Mark the default choose node as visible and selected.
  77          choosenode = Y.Node.create('<option value="">' + options[''] + '</option>');
  78          choosenode.set('selected', 'selected');
  79          this.eventname.appendChild(choosenode);
  80  
  81          Y.Object.each(options, function(value, key) {
  82              // Make sure we highlight only nodes with correct namespace.
  83              if (key.substring(0, namespace.length) === namespace) {
  84                  node = Y.Node.create('<option value="' + key + '">' + value + '</option>');
  85                  this.eventname.appendChild(node);
  86              }
  87          }, this);
  88  
  89      },
  90  
  91      /**
  92       * Method to update the selected node from the options list.
  93       *
  94       * @method updateSelection
  95       * @param {string} selection The options node value that should be selected.
  96       */
  97      updateSelection: function(selection) {
  98          this.eventname.get('options').each(function(opt) {
  99              if (opt.get('value') === selection) {
 100                  opt.set('selected', 'selected');
 101              }
 102          }, this);
 103      }
 104  }, {
 105      NAME: 'dropDown',
 106      ATTRS: {
 107          /**
 108           * A list of events with components.
 109           *
 110           * @attribute eventlist
 111           * @default null
 112           * @type Object
 113           */
 114          eventlist: null
 115      }
 116  });
 117  
 118  Y.namespace('M.tool_monitor.DropDown').init = function(config) {
 119      return new DropDown(config);
 120  };