[Summary view] [Print] [Text view]

   1  var DROPDOWN_NAME = "Dropdown menu",
   2      DROPDOWN;
   3  
   4  /**
   5   * Provides an in browser PDF editor.
   6   *
   7   * @module moodle-assignfeedback_editpdf-editor
   8   */
   9  
  10  /**
  11   * This is a drop down list of buttons triggered (and aligned to) a button.
  12   *
  13   * @namespace M.assignfeedback_editpdf
  14   * @class dropdown
  15   * @constructor
  16   * @extends M.core.dialogue
  17   */
  18  DROPDOWN = function(config) {
  19      config.draggable = false;
  20      config.centered = false;
  21      config.width = 'auto';
  22      config.visible = false;
  23      config.footerContent = '';
  24      DROPDOWN.superclass.constructor.apply(this, [config]);
  25  };
  26  
  27  Y.extend(DROPDOWN, M.core.dialogue, {
  28      /**
  29       * Initialise the menu.
  30       *
  31       * @method initializer
  32       * @return void
  33       */
  34      initializer : function(config) {
  35          var button, body, headertext, bb;
  36          DROPDOWN.superclass.initializer.call(this, config);
  37  
  38          bb = this.get('boundingBox');
  39          bb.addClass('assignfeedback_editpdf_dropdown');
  40  
  41          // Align the menu to the button that opens it.
  42          button = this.get('buttonNode');
  43  
  44          // Close the menu when clicked outside (excluding the button that opened the menu).
  45          body = this.bodyNode;
  46  
  47          headertext = Y.Node.create('<h3/>');
  48          headertext.addClass('accesshide');
  49          headertext.setHTML(this.get('headerText'));
  50          body.prepend(headertext);
  51  
  52          body.on('clickoutside', function(e) {
  53              if (this.get('visible')) {
  54                  // Note: we need to compare ids because for some reason - sometimes button is an Object, not a Y.Node.
  55                  if (e.target.get('id') !== button.get('id') && e.target.ancestor().get('id') !== button.get('id')) {
  56                      e.preventDefault();
  57                      this.hide();
  58                  }
  59              }
  60          }, this);
  61  
  62          button.on('click', function(e) {e.preventDefault(); this.show();}, this);
  63          button.on('key', this.show, 'enter,space', this);
  64      },
  65  
  66      /**
  67       * Override the show method to align to the button.
  68       *
  69       * @method show
  70       * @return void
  71       */
  72      show : function() {
  73          var button = this.get('buttonNode');
  74  
  75          result = DROPDOWN.superclass.show.call(this);
  76          this.align(button, [Y.WidgetPositionAlign.TL, Y.WidgetPositionAlign.BL]);
  77      }
  78  }, {
  79      NAME : DROPDOWN_NAME,
  80      ATTRS : {
  81          /**
  82           * The header for the drop down (only accessible to screen readers).
  83           *
  84           * @attribute headerText
  85           * @type String
  86           * @default ''
  87           */
  88          headerText : {
  89              value : ''
  90          },
  91  
  92          /**
  93           * The button used to show/hide this drop down menu.
  94           *
  95           * @attribute buttonNode
  96           * @type Y.Node
  97           * @default null
  98           */
  99          buttonNode : {
 100              value : null
 101          }
 102      }
 103  });
 104  
 105  Y.Base.modifyAttrs(DROPDOWN, {
 106      /**
 107       * Whether the widget should be modal or not.
 108       *
 109       * Moodle override: We override this for commentsearch to force it always false.
 110       *
 111       * @attribute Modal
 112       * @type Boolean
 113       * @default false
 114       */
 115      modal: {
 116          getter: function() {
 117              return false;
 118          }
 119      }
 120  });
 121  
 122  M.assignfeedback_editpdf = M.assignfeedback_editpdf || {};
 123  M.assignfeedback_editpdf.dropdown = DROPDOWN;