diff --git a/src/ol/events.js b/src/ol/events.js
index 9e31192fc1..542e4e5800 100644
--- a/src/ol/events.js
+++ b/src/ol/events.js
@@ -14,6 +14,9 @@ ol.events.EventType = {
CHANGE: 'change',
CLICK: 'click',
DBLCLICK: 'dblclick',
+ DRAGENTER: 'dragenter',
+ DRAGOVER: 'dragover',
+ DROP: 'drop',
ERROR: 'error',
LOAD: 'load',
MOUSEDOWN: 'mousedown',
diff --git a/src/ol/interaction/draganddropinteraction.js b/src/ol/interaction/draganddropinteraction.js
index a238848cbf..b1f867efcb 100644
--- a/src/ol/interaction/draganddropinteraction.js
+++ b/src/ol/interaction/draganddropinteraction.js
@@ -4,12 +4,10 @@ goog.provide('ol.interaction.DragAndDrop');
goog.provide('ol.interaction.DragAndDropEvent');
goog.require('goog.asserts');
+goog.require('goog.functions');
goog.require('ol.events');
goog.require('ol.events.Event');
-goog.require('goog.events.FileDropHandler');
-goog.require('goog.events.FileDropHandler.EventType');
-goog.require('goog.fs.FileReader');
-goog.require('goog.functions');
+goog.require('ol.events.EventType');
goog.require('ol.interaction.Interaction');
goog.require('ol.proj');
@@ -48,28 +46,29 @@ ol.interaction.DragAndDrop = function(opt_options) {
/**
* @private
- * @type {goog.events.FileDropHandler}
+ * @type {Array.
}
*/
- this.fileDropHandler_ = null;
-
- /**
- * @private
- * @type {ol.events.Key|undefined}
- */
- this.dropListenKey_ = undefined;
+ this.dropListenKeys_ = null;
};
goog.inherits(ol.interaction.DragAndDrop, ol.interaction.Interaction);
/**
- * @inheritDoc
+ * @param {Event} event Event.
+ * @this {ol.interaction.DragAndDrop}
+ * @private
*/
-ol.interaction.DragAndDrop.prototype.disposeInternal = function() {
- if (this.dropListenKey_) {
- ol.events.unlistenByKey(this.dropListenKey_);
+ol.interaction.DragAndDrop.handleDrop_ = function(event) {
+ var files = event.dataTransfer.files;
+ var i, ii, file;
+ for (i = 0, ii = files.length; i < ii; ++i) {
+ file = files.item(i);
+ var reader = new FileReader();
+ reader.addEventListener(ol.events.EventType.LOAD,
+ goog.partial(this.handleResult_, file).bind(this));
+ reader.readAsText(file);
}
- goog.base(this, 'disposeInternal');
};
@@ -77,25 +76,20 @@ ol.interaction.DragAndDrop.prototype.disposeInternal = function() {
* @param {Event} event Event.
* @private
*/
-ol.interaction.DragAndDrop.prototype.handleDrop_ = function(event) {
- var files = event.dataTransfer.files;
- var i, ii, file;
- for (i = 0, ii = files.length; i < ii; ++i) {
- file = files[i];
- // The empty string param is a workaround for
- // https://code.google.com/p/closure-library/issues/detail?id=524
- var reader = goog.fs.FileReader.readAsText(file, '');
- reader.addCallback(goog.partial(this.handleResult_, file), this);
- }
+ol.interaction.DragAndDrop.handleStop_ = function(event) {
+ event.stopPropagation();
+ event.preventDefault();
+ event.dataTransfer.dropEffect = 'copy';
};
/**
* @param {File} file File.
- * @param {string} result Result.
+ * @param {Event} event Load event.
* @private
*/
-ol.interaction.DragAndDrop.prototype.handleResult_ = function(file, result) {
+ol.interaction.DragAndDrop.prototype.handleResult_ = function(file, event) {
+ var result = event.target.result;
var map = this.getMap();
goog.asserts.assert(map, 'map must be set');
var projection = this.projection_;
@@ -149,22 +143,20 @@ ol.interaction.DragAndDrop.handleEvent = goog.functions.TRUE;
* @inheritDoc
*/
ol.interaction.DragAndDrop.prototype.setMap = function(map) {
- if (this.dropListenKey_) {
- ol.events.unlistenByKey(this.dropListenKey_);
- this.dropListenKey_ = undefined;
+ if (this.dropListenKeys_) {
+ this.dropListenKeys_.forEach(ol.events.unlistenByKey);
+ this.dropListenKeys_ = null;
}
- if (this.fileDropHandler_) {
- goog.dispose(this.fileDropHandler_);
- this.fileDropHandler_ = null;
- }
- goog.asserts.assert(this.dropListenKey_ === undefined,
- 'this.dropListenKey_ should be undefined');
goog.base(this, 'setMap', map);
if (map) {
- this.fileDropHandler_ = new goog.events.FileDropHandler(map.getViewport());
- this.dropListenKey_ = ol.events.listen(
- this.fileDropHandler_, goog.events.FileDropHandler.EventType.DROP,
- this.handleDrop_, false, this);
+ var dropArea = map.getViewport();
+ this.dropListenKeys_ = [
+ ol.events.listen(dropArea, ol.events.EventType.DROP,
+ ol.interaction.DragAndDrop.handleDrop_, false, this),
+ ol.events.listen(dropArea, [ol.events.EventType.DRAGENTER,
+ ol.events.EventType.DRAGOVER, ol.events.EventType.DROP],
+ ol.interaction.DragAndDrop.handleStop_, false, this)
+ ]
}
};