[Summary view] [Print] [Text view]

   1  // This file is part of Moodle - http://moodle.org/
   2  //
   3  // Moodle is free software: you can redistribute it and/or modify
   4  // it under the terms of the GNU General Public License as published by
   5  // the Free Software Foundation, either version 3 of the License, or
   6  // (at your option) any later version.
   7  //
   8  // Moodle is distributed in the hope that it will be useful,
   9  // but WITHOUT ANY WARRANTY; without even the implied warranty of
  10  // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  11  // GNU General Public License for more details.
  12  //
  13  // You should have received a copy of the GNU General Public License
  14  // along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
  15  
  16  /**
  17   * Javascript controller for the "Review" panel at the left of the page.
  18   *
  19   * @module     mod_assign/grading_review_panel
  20   * @package    mod_assign
  21   * @class      GradingReviewPanel
  22   * @copyright  2016 Damyon Wiese <damyon@moodle.com>
  23   * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
  24   * @since      3.1
  25   */
  26  define(['jquery', 'mod_assign/grading_events'], function($, GradingEvents) {
  27  
  28      /**
  29       * GradingReviewPanel class.
  30       *
  31       * @class GradingReviewPanel
  32       * @param {String} selector The selector for the page region containing the user navigation.
  33       */
  34      var GradingReviewPanel = function() {
  35          this._region = $('[data-region="review-panel-content"]');
  36          this.registerEventListeners();
  37      };
  38  
  39      /** @type {JQuery} JQuery node for the page region containing the user navigation. */
  40      GradingReviewPanel.prototype._region = null;
  41  
  42      /**
  43       * It is first come first served to get ownership of the grading review panel.
  44       * There can be only one.
  45       *
  46       * @public
  47       * @method getReviewPanel
  48       * @param {String} pluginname - the first plugin to ask for the panel gets it.
  49       * @return {DOMNode} or false
  50       */
  51      GradingReviewPanel.prototype.getReviewPanel = function(pluginname) {
  52          var owner = this._region.data('panel-owner');
  53          if (typeof owner == "undefined") {
  54              this._region.data('review-panel-plugin', pluginname);
  55          }
  56          if (this._region.data('review-panel-plugin') == pluginname) {
  57              return this._region[0];
  58          }
  59          return false;
  60      };
  61  
  62      /**
  63       * Get the toggle review panel button.
  64       *
  65       * @method getTogglePanelButton
  66       * @return {jQuery}
  67       */
  68      GradingReviewPanel.prototype.getTogglePanelButton = function() {
  69          return this.getPanelElement().find('[data-region="review-panel-toggle"]');
  70      };
  71  
  72      /**
  73       * Get the review panel element.
  74       *
  75       * @method getPanelElement
  76       * @return {jQuery}
  77       */
  78      GradingReviewPanel.prototype.getPanelElement = function() {
  79          return $('[data-region="review-panel"]');
  80      };
  81  
  82      /**
  83       * Get the review panel content element.
  84       *
  85       * @method getPanelContentElement
  86       * @return {jQuery}
  87       */
  88      GradingReviewPanel.prototype.getPanelContentElement = function() {
  89          return $('[data-region="review-panel-content"]');
  90      };
  91  
  92      /**
  93       * Show/Hide the review panel.
  94       *
  95       * @method togglePanel
  96       */
  97      GradingReviewPanel.prototype.togglePanel = function() {
  98          if (this.getPanelElement().hasClass('collapsed')) {
  99              $(document).trigger(GradingEvents.EXPAND_REVIEW_PANEL);
 100          } else {
 101              $(document).trigger(GradingEvents.COLLAPSE_REVIEW_PANEL);
 102          }
 103      };
 104  
 105      /**
 106       * Hide the review panel.
 107       *
 108       * @method collapsePanel
 109       */
 110      GradingReviewPanel.prototype.collapsePanel = function() {
 111          this.getPanelElement().addClass('collapsed').removeClass('grade-panel-collapsed');
 112          this.getPanelContentElement().attr('aria-hidden', true);
 113      };
 114  
 115      /**
 116       * Show the review panel.
 117       *
 118       * @method expandPanel
 119       */
 120      GradingReviewPanel.prototype.expandPanel = function() {
 121          this.getPanelElement().removeClass('collapsed');
 122          this.getPanelContentElement().removeAttr('aria-hidden');
 123      };
 124  
 125      /**
 126       * Register event listeners for the review panel.
 127       *
 128       * @method registerEventListeners
 129       */
 130      GradingReviewPanel.prototype.registerEventListeners = function() {
 131          var toggleReviewPanelButton = this.getTogglePanelButton();
 132          toggleReviewPanelButton.click(function(e) {
 133              this.togglePanel();
 134              e.preventDefault();
 135          }.bind(this));
 136  
 137          toggleReviewPanelButton.keydown(function(e) {
 138              if (!e.metaKey && !e.shiftKey && !e.altKey && !e.ctrlKey) {
 139                  if (e.keyCode === 13 || e.keyCode === 32) {
 140                      this.togglePanel();
 141                      e.preventDefault();
 142                  }
 143              }
 144          }.bind(this));
 145  
 146          var docElement = $(document);
 147          docElement.on(GradingEvents.COLLAPSE_REVIEW_PANEL, function() {
 148              this.collapsePanel();
 149          }.bind(this));
 150  
 151          // Need special styling when grade panel is collapsed.
 152          docElement.on(GradingEvents.COLLAPSE_GRADE_PANEL, function() {
 153              this.expandPanel();
 154              this.getPanelElement().addClass('grade-panel-collapsed');
 155          }.bind(this));
 156  
 157          docElement.on(GradingEvents.EXPAND_REVIEW_PANEL, function() {
 158              this.expandPanel();
 159          }.bind(this));
 160  
 161          docElement.on(GradingEvents.EXPAND_GRADE_PANEL, function() {
 162              this.getPanelElement().removeClass('grade-panel-collapsed');
 163          }.bind(this));
 164      };
 165  
 166      return GradingReviewPanel;
 167  });