[Summary view] [Print] [Text view]

   1  /* global CALENDAR, MOODLECALENDAR */
   2  
   3  /**
   4   * Add some custom methods to the node class to make our lives a little
   5   * easier within this module.
   6   */
   7  Y.mix(Y.Node.prototype, {
   8      /**
   9       * Gets the value of the first option in the select box
  10       */
  11      firstOptionValue: function() {
  12          if (this.get('nodeName').toLowerCase() !== 'select') {
  13              return false;
  14          }
  15          return this.one('option').get('value');
  16      },
  17      /**
  18       * Gets the value of the last option in the select box
  19       */
  20      lastOptionValue: function() {
  21          if (this.get('nodeName').toLowerCase() !== 'select') {
  22              return false;
  23          }
  24          return this.all('option').item(this.optionSize() - 1).get('value');
  25      },
  26      /**
  27       * Gets the number of options in the select box
  28       */
  29      optionSize: function() {
  30          if (this.get('nodeName').toLowerCase() !== 'select') {
  31              return false;
  32          }
  33          return parseInt(this.all('option').size(), 10);
  34      },
  35      /**
  36       * Gets the value of the selected option in the select box
  37       */
  38      selectedOptionValue: function() {
  39          if (this.get('nodeName').toLowerCase() !== 'select') {
  40              return false;
  41          }
  42          return this.all('option').item(this.get('selectedIndex')).get('value');
  43      }
  44  });
  45  
  46  M.form = M.form || {};
  47  M.form.dateselector = {
  48      panel: null,
  49      calendar: null,
  50      currentowner: null,
  51      hidetimeout: null,
  52      repositiontimeout: null,
  53      init_date_selectors: function(config) {
  54          if (this.panel === null) {
  55              this.initPanel(config);
  56          }
  57          Y.all('.fdate_time_selector').each(function() {
  58              config.node = this;
  59              new CALENDAR(config);
  60          });
  61          Y.all('.fdate_selector').each(function() {
  62              config.node = this;
  63              new CALENDAR(config);
  64          });
  65      },
  66      initPanel: function(config) {
  67          this.panel = new Y.Overlay({
  68              visible: false,
  69              bodyContent: Y.Node.create('<div id="dateselector-calendar-content"></div>'),
  70              id: 'dateselector-calendar-panel'
  71          });
  72          this.panel.render(document.body);
  73          // zIndex is added by panel.render() and is set to 0.
  74          // Remove zIndex from panel, as this should be set by CSS. This can be done by removeAttr but
  75          // ie8 fails and there is know issue for it.
  76          Y.one('#dateselector-calendar-panel').setStyle('zIndex', null);
  77          this.panel.on('heightChange', this.fix_position, this);
  78  
  79          Y.one('#dateselector-calendar-panel').on('click', function(e) {
  80              e.halt();
  81          });
  82          Y.one(document.body).on('click', this.document_click, this);
  83  
  84          this.calendar = new MOODLECALENDAR({
  85              contentBox: "#dateselector-calendar-content",
  86              width: "300px",
  87              showPrevMonth: true,
  88              showNextMonth: true,
  89              firstdayofweek: parseInt(config.firstdayofweek, 10),
  90              WEEKDAYS_MEDIUM: [
  91                  config.sun,
  92                  config.mon,
  93                  config.tue,
  94                  config.wed,
  95                  config.thu,
  96                  config.fri,
  97                  config.sat]
  98          });
  99      },
 100      cancel_any_timeout: function() {
 101          if (this.hidetimeout) {
 102              clearTimeout(this.hidetimeout);
 103              this.hidetimeout = null;
 104          }
 105          if (this.repositiontimeout) {
 106              clearTimeout(this.repositiontimeout);
 107              this.repositiontimeout = null;
 108          }
 109      },
 110      delayed_reposition: function() {
 111          if (this.repositiontimeout) {
 112              clearTimeout(this.repositiontimeout);
 113              this.repositiontimeout = null;
 114          }
 115          this.repositiontimeout = setTimeout(this.fix_position, 500);
 116      },
 117      fix_position: function() {
 118          if (this.currentowner) {
 119              var alignpoints = [
 120                  Y.WidgetPositionAlign.BL,
 121                  Y.WidgetPositionAlign.TL
 122              ];
 123  
 124              // Change the alignment if this is an RTL language.
 125              if (window.right_to_left()) {
 126                  alignpoints = [
 127                      Y.WidgetPositionAlign.BR,
 128                      Y.WidgetPositionAlign.TR
 129                  ];
 130              }
 131  
 132  
 133              this.panel.set('align', {
 134                  node: this.currentowner.get('node').one('select'),
 135                  points: alignpoints
 136              });
 137          }
 138      },
 139      document_click: function(e) {
 140          if (this.currentowner) {
 141              if (this.currentowner.get('node').ancestor('div').contains(e.target)) {
 142                  setTimeout(function() {
 143                      M.form.dateselector.cancel_any_timeout();
 144                  }, 100);
 145              } else {
 146                  this.currentowner.release_calendar(e);
 147              }
 148          }
 149      }
 150  };