Add DRAGSTART event to goog.events.FileDropHandler

It will be useful to have DRAGSTART event when the user drags a file to the 
browser window.
A use case is showing the drop zone only when the user drags the file similar 
to how gmail does it.

The following code:
1. Adds the DRAGSTART event.
2. Dispatch the DRAGSTART event in the onDocDragEnter_ function.
3. Updated the dispatch_ function to support event type param.
4. Updated the onElemDrop_ function to work with the new dispatch_ function.

Thanks

/**
 * The types of events fired by this class.
 * @enum {string}
 */
goog.events.FileDropHandler.EventType = {
  DROP: goog.events.EventType.DROP,
  DRAGSTART: goog.events.EventType.DRAGSTART // new!!!!
};

/**
 * Dispatches the DROP event.
 * @param {goog.events.BrowserEvent} e The underlying browser event.
 * @param (string) type
 * @private
 */
goog.events.FileDropHandler.prototype.dispatch_ = function(e, type) {
  this.logger_.fine('Firing DROP event...');
  var event = new goog.events.BrowserEvent(e.getBrowserEvent());
  event.type = type;
  try {
    this.dispatchEvent(event);
  } finally {
    event.dispose();
  }
};

/**
 * Handles dragenter on the document.
 * @param {goog.events.BrowserEvent} e The dragenter event.
 * @private
 */
goog.events.FileDropHandler.prototype.onDocDragEnter_ = function(e) {
  this.logger_.finer('"' + e.target.id + '" (' + e.target + ') dispatched: ' +
                     e.type);
  var dt = e.getBrowserEvent().dataTransfer;
  // Check whether the drag event contains files.
  this.dndContainsFiles_ = !!(dt &&
      ((dt.types &&
          (goog.array.contains(dt.types, 'Files') ||
          goog.array.contains(dt.types, 'public.file-url'))) ||
      (dt.files && dt.files.length > 0)));
  // If it does
  if (this.dndContainsFiles_) {
    // Prevent default actions.
    e.preventDefault();
    // Dispatch DRAGSTART event.
    this.dispatch_(e, goog.events.EventType.DRAGSTART); // new!!!!
  }
  this.logger_.finer('dndContainsFiles_: ' + this.dndContainsFiles_);
};

/**
 * Handles dropping something onto the element (drop zone).
 * @param {goog.events.BrowserEvent} e The drop event.
 * @private
 */
goog.events.FileDropHandler.prototype.onElemDrop_ = function(e) {
  this.logger_.finer('"' + e.target.id + '" (' + e.target + ') dispatched: ' +
                     e.type);
  // If the drag and drop event contains files.
  if (this.dndContainsFiles_) {
    // Prevent default actions and stop the event from propagating further to
    // the document. Both lines are needed! (See comment above).
    e.preventDefault();
    e.stopPropagation();
    // Dispatch DROP event.
    this.dispatch_(e, goog.events.EventType.DROP); // new!!!!
  }
};
Original issue reported on code.google.com by pablo.platt@gmail.com on 3 May 2012 at 3:20
diegoles / closure-library

Add DRAGSTART event to goog.events.FileDropHandler #462
