[Summary view] [Print] [Text view]

   1  /**
   2   * Resource drag and drop.
   3   *
   4   * @class M.course.dragdrop.resource
   5   * @constructor
   6   * @extends M.core.dragdrop
   7   */
   8  var DRAGRESOURCE = function() {
   9      DRAGRESOURCE.superclass.constructor.apply(this, arguments);
  10  };
  11  Y.extend(DRAGRESOURCE, M.core.dragdrop, {
  12      initializer: function() {
  13          // Set group for parent class
  14          this.groups = ['resource'];
  15          this.samenodeclass = CSS.ACTIVITY;
  16          this.parentnodeclass = CSS.SECTION;
  17          this.resourcedraghandle = this.get_drag_handle(M.str.moodle.move, CSS.EDITINGMOVE, CSS.ICONCLASS, true);
  18  
  19          this.samenodelabel = {
  20              identifier: 'dragtoafter',
  21              component: 'quiz'
  22          };
  23          this.parentnodelabel = {
  24              identifier: 'dragtostart',
  25              component: 'quiz'
  26          };
  27  
  28          // Go through all sections
  29          var sectionlistselector = M.mod_quiz.edit.get_section_selector(Y);
  30          if (sectionlistselector) {
  31              sectionlistselector = '.' + CSS.COURSECONTENT + ' ' + sectionlistselector;
  32              this.setup_for_section(sectionlistselector);
  33  
  34              // Initialise drag & drop for all resources/activities
  35              var nodeselector = sectionlistselector.slice(CSS.COURSECONTENT.length + 2) + ' li.' + CSS.ACTIVITY;
  36              var del = new Y.DD.Delegate({
  37                  container: '.' + CSS.COURSECONTENT,
  38                  nodes: nodeselector,
  39                  target: true,
  40                  handles: ['.' + CSS.EDITINGMOVE],
  41                  dragConfig: {groups: this.groups}
  42              });
  43              del.dd.plug(Y.Plugin.DDProxy, {
  44                  // Don't move the node at the end of the drag
  45                  moveOnEnd: false,
  46                  cloneNode: true
  47              });
  48              del.dd.plug(Y.Plugin.DDConstrained, {
  49                  // Keep it inside the .mod-quiz-edit-content
  50                  constrain: '#' + CSS.SLOTS
  51              });
  52              del.dd.plug(Y.Plugin.DDWinScroll);
  53  
  54              M.mod_quiz.quizbase.register_module(this);
  55              M.mod_quiz.dragres = this;
  56          }
  57      },
  58  
  59      /**
  60       * Apply dragdrop features to the specified selector or node that refers to section(s)
  61       *
  62       * @method setup_for_section
  63       * @param {String} baseselector The CSS selector or node to limit scope to
  64       */
  65      setup_for_section: function(baseselector) {
  66          Y.Node.all(baseselector).each(function(sectionnode) {
  67              var resources = sectionnode.one('.' + CSS.CONTENT + ' ul.' + CSS.SECTION);
  68              // See if resources ul exists, if not create one.
  69              if (!resources) {
  70                  resources = Y.Node.create('<ul></ul>');
  71                  resources.addClass(CSS.SECTION);
  72                  sectionnode.one('.' + CSS.CONTENT + ' div.' + CSS.SUMMARY).insert(resources, 'after');
  73              }
  74              resources.setAttribute('data-draggroups', this.groups.join(' '));
  75              // Define empty ul as droptarget, so that item could be moved to empty list
  76              new Y.DD.Drop({
  77                  node: resources,
  78                  groups: this.groups,
  79                  padding: '20 0 20 0'
  80              });
  81  
  82              // Initialise each resource/activity in this section
  83              this.setup_for_resource('#' + sectionnode.get('id') + ' li.' + CSS.ACTIVITY);
  84          }, this);
  85      },
  86  
  87      /**
  88       * Apply dragdrop features to the specified selector or node that refers to resource(s)
  89       *
  90       * @method setup_for_resource
  91       * @param {String} baseselector The CSS selector or node to limit scope to
  92       */
  93      setup_for_resource: function(baseselector) {
  94          Y.Node.all(baseselector).each(function(resourcesnode) {
  95              // Replace move icons
  96              var move = resourcesnode.one('a.' + CSS.EDITINGMOVE);
  97              if (move) {
  98                  move.replace(this.resourcedraghandle.cloneNode(true));
  99              }
 100          }, this);
 101      },
 102  
 103      drag_start: function(e) {
 104          // Get our drag object
 105          var drag = e.target;
 106          drag.get('dragNode').setContent(drag.get('node').get('innerHTML'));
 107          drag.get('dragNode').all('img.iconsmall').setStyle('vertical-align', 'baseline');
 108      },
 109  
 110      drag_dropmiss: function(e) {
 111          // Missed the target, but we assume the user intended to drop it
 112          // on the last ghost node location, e.drag and e.drop should be
 113          // prepared by global_drag_dropmiss parent so simulate drop_hit(e).
 114          this.drop_hit(e);
 115      },
 116  
 117      drop_hit: function(e) {
 118          var drag = e.drag;
 119          // Get a reference to our drag node
 120          var dragnode = drag.get('node');
 121          var dropnode = e.drop.get('node');
 122  
 123          // Add spinner if it not there
 124          var actionarea = dragnode.one(CSS.ACTIONAREA);
 125          var spinner = M.util.add_spinner(Y, actionarea);
 126  
 127          var params = {};
 128  
 129          // Handle any variables which we must pass back through to
 130          var pageparams = this.get('config').pageparams;
 131          var varname;
 132          for (varname in pageparams) {
 133              params[varname] = pageparams[varname];
 134          }
 135  
 136          // Prepare request parameters
 137          params.sesskey = M.cfg.sesskey;
 138          params.courseid = this.get('courseid');
 139          params.quizid = this.get('quizid');
 140          params['class'] = 'resource';
 141          params.field = 'move';
 142          params.id = Number(Y.Moodle.mod_quiz.util.slot.getId(dragnode));
 143          params.sectionId = Y.Moodle.core_course.util.section.getId(dropnode.ancestor(M.mod_quiz.edit.get_section_wrapper(Y), true));
 144  
 145          var previousslot = dragnode.previous(SELECTOR.SLOT);
 146          if (previousslot) {
 147              params.previousid = Number(Y.Moodle.mod_quiz.util.slot.getId(previousslot));
 148          }
 149  
 150          var previouspage = dragnode.previous(SELECTOR.PAGE);
 151          if (previouspage) {
 152              params.page = Number(Y.Moodle.mod_quiz.util.page.getId(previouspage));
 153          }
 154  
 155          // Do AJAX request
 156          var uri = M.cfg.wwwroot + this.get('ajaxurl');
 157  
 158          Y.io(uri, {
 159              method: 'POST',
 160              data: params,
 161              on: {
 162                  start: function() {
 163                      this.lock_drag_handle(drag, CSS.EDITINGMOVE);
 164                      spinner.show();
 165                  },
 166                  success: function(tid, response) {
 167                      var responsetext = Y.JSON.parse(response.responseText);
 168                      var params = {element: dragnode, visible: responsetext.visible};
 169                      M.mod_quiz.quizbase.invoke_function('set_visibility_resource_ui', params);
 170                      this.unlock_drag_handle(drag, CSS.EDITINGMOVE);
 171                      window.setTimeout(function() {
 172                          spinner.hide();
 173                      }, 250);
 174                      M.mod_quiz.resource_toolbox.reorganise_edit_page();
 175                  },
 176                  failure: function(tid, response) {
 177                      this.ajax_failure(response);
 178                      this.unlock_drag_handle(drag, CSS.SECTIONHANDLE);
 179                      spinner.hide();
 180                      window.location.reload(true);
 181                  }
 182              },
 183              context:this
 184          });
 185      },
 186  
 187      global_drop_over: function(e) {
 188          //Overriding parent method so we can stop the slots being dragged before the first page node.
 189  
 190          // Check that drop object belong to correct group.
 191          if (!e.drop || !e.drop.inGroup(this.groups)) {
 192              return;
 193          }
 194  
 195          // Get a reference to our drag and drop nodes.
 196          var drag = e.drag.get('node'),
 197              drop = e.drop.get('node');
 198  
 199          // Save last drop target for the case of missed target processing.
 200          this.lastdroptarget = e.drop;
 201  
 202          // Are we dropping within the same parent node?
 203          if (drop.hasClass(this.samenodeclass)) {
 204              var where;
 205  
 206              if (this.goingup) {
 207                  where = "before";
 208              } else {
 209                  where = "after";
 210              }
 211  
 212              drop.insert(drag, where);
 213          } else if ((drop.hasClass(this.parentnodeclass) || drop.test('[data-droptarget="1"]')) && !drop.contains(drag)) {
 214              // We are dropping on parent node and it is empty
 215              if (this.goingup) {
 216                  drop.append(drag);
 217              } else {
 218                  drop.prepend(drag);
 219              }
 220          }
 221          this.drop_over(e);
 222      }
 223  }, {
 224      NAME: 'mod_quiz-dragdrop-resource',
 225      ATTRS: {
 226          courseid: {
 227              value: null
 228          },
 229          quizid: {
 230              value: null
 231          },
 232          ajaxurl: {
 233              value: 0
 234          },
 235          config: {
 236              value: 0
 237          }
 238      }
 239  });
 240  
 241  M.mod_quiz = M.mod_quiz || {};
 242  M.mod_quiz.init_resource_dragdrop = function(params) {
 243      new DRAGRESOURCE(params);
 244  };