fix editor getting stuck in drag mode
This commit is contained in:
parent
9ab5d50e0e
commit
5f8fc32dbc
1 changed files with 49 additions and 40 deletions
69
lib/ace/mouse/dragdrop.js
vendored
69
lib/ace/mouse/dragdrop.js
vendored
|
|
@ -36,7 +36,7 @@ var event = require("../lib/event");
|
||||||
var DragdropHandler = function(mouseHandler) {
|
var DragdropHandler = function(mouseHandler) {
|
||||||
var editor = mouseHandler.editor;
|
var editor = mouseHandler.editor;
|
||||||
var dragSelectionMarker, x, y;
|
var dragSelectionMarker, x, y;
|
||||||
var timerId, range, isBackwards;
|
var timerId, range;
|
||||||
var dragCursor, counter = 0;
|
var dragCursor, counter = 0;
|
||||||
|
|
||||||
var mouseTarget = editor.container;
|
var mouseTarget = editor.container;
|
||||||
|
|
@ -44,18 +44,11 @@ var DragdropHandler = function(mouseHandler) {
|
||||||
if (editor.getReadOnly())
|
if (editor.getReadOnly())
|
||||||
return;
|
return;
|
||||||
var types = e.dataTransfer.types;
|
var types = e.dataTransfer.types;
|
||||||
if (types && Array.prototype.indexOf.call(types, 'Files') !== -1)
|
if (types && Array.prototype.indexOf.call(types, "text/plain") === -1)
|
||||||
return;
|
return;
|
||||||
|
if (!dragSelectionMarker)
|
||||||
|
addDragMarker();
|
||||||
counter++;
|
counter++;
|
||||||
if (!dragSelectionMarker) {
|
|
||||||
range = editor.getSelectionRange();
|
|
||||||
isBackwards = editor.selection.isBackwards();
|
|
||||||
var style = editor.getSelectionStyle();
|
|
||||||
dragSelectionMarker = editor.session.addMarker(range, "ace_selection", style);
|
|
||||||
editor.clearSelection();
|
|
||||||
clearInterval(timerId);
|
|
||||||
timerId = setInterval(onDragInterval, 20);
|
|
||||||
}
|
|
||||||
return event.preventDefault(e);
|
return event.preventDefault(e);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -63,8 +56,10 @@ var DragdropHandler = function(mouseHandler) {
|
||||||
if (editor.getReadOnly())
|
if (editor.getReadOnly())
|
||||||
return;
|
return;
|
||||||
var types = e.dataTransfer.types;
|
var types = e.dataTransfer.types;
|
||||||
if (types && Array.prototype.indexOf.call(types, 'Files') !== -1)
|
if (types && Array.prototype.indexOf.call(types, "text/plain") === -1)
|
||||||
return;
|
return;
|
||||||
|
if (onMouseMoveTimer !== null)
|
||||||
|
onMouseMoveTimer = null;
|
||||||
x = e.clientX;
|
x = e.clientX;
|
||||||
y = e.clientY;
|
y = e.clientY;
|
||||||
return event.preventDefault(e);
|
return event.preventDefault(e);
|
||||||
|
|
@ -77,36 +72,50 @@ var DragdropHandler = function(mouseHandler) {
|
||||||
};
|
};
|
||||||
|
|
||||||
event.addListener(mouseTarget, "dragleave", function(e) {
|
event.addListener(mouseTarget, "dragleave", function(e) {
|
||||||
if (editor.getReadOnly())
|
|
||||||
return;
|
|
||||||
var types = e.dataTransfer.types;
|
|
||||||
if (types && Array.prototype.indexOf.call(types, 'Files') !== -1)
|
|
||||||
return;
|
|
||||||
counter--;
|
counter--;
|
||||||
if (counter > 0)
|
if (counter <= 0 && dragSelectionMarker) {
|
||||||
return;
|
clearDragMarker();
|
||||||
clearInterval(timerId);
|
|
||||||
editor.session.removeMarker(dragSelectionMarker);
|
|
||||||
dragSelectionMarker = null;
|
|
||||||
editor.selection.setSelectionRange(range, isBackwards);
|
|
||||||
return event.preventDefault(e);
|
return event.preventDefault(e);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
event.addListener(mouseTarget, "drop", function(e) {
|
event.addListener(mouseTarget, "drop", function(e) {
|
||||||
if (editor.getReadOnly())
|
if (!dragSelectionMarker)
|
||||||
return;
|
return;
|
||||||
counter = 0;
|
|
||||||
clearInterval(timerId);
|
|
||||||
editor.session.removeMarker(dragSelectionMarker);
|
|
||||||
dragSelectionMarker = null;
|
|
||||||
|
|
||||||
range.end = editor.session.insert(dragCursor, e.dataTransfer.getData('Text'));
|
range.end = editor.session.insert(dragCursor, e.dataTransfer.getData('Text'));
|
||||||
range.start = dragCursor;
|
range.start = dragCursor;
|
||||||
|
clearDragMarker();
|
||||||
editor.focus();
|
editor.focus();
|
||||||
editor.selection.setSelectionRange(range);
|
|
||||||
return event.preventDefault(e);
|
return event.preventDefault(e);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
function addDragMarker() {
|
||||||
|
range = editor.selection.toOrientedRange();
|
||||||
|
dragSelectionMarker = editor.session.addMarker(range, "ace_selection", editor.getSelectionStyle());
|
||||||
|
editor.clearSelection();
|
||||||
|
clearInterval(timerId);
|
||||||
|
timerId = setInterval(onDragInterval, 20);
|
||||||
|
counter = 0;
|
||||||
|
event.addListener(document, "mousemove", onMouseMove);
|
||||||
|
}
|
||||||
|
function clearDragMarker() {
|
||||||
|
clearInterval(timerId);
|
||||||
|
editor.session.removeMarker(dragSelectionMarker);
|
||||||
|
dragSelectionMarker = null;
|
||||||
|
editor.selection.fromOrientedRange(range);
|
||||||
|
counter = 0;
|
||||||
|
event.removeListener(document, "mousemove", onMouseMove);
|
||||||
|
}
|
||||||
|
// sometimes other code on the page can stop dragleave event leaving editor stuck in the drag state
|
||||||
|
var onMouseMoveTimer = null;
|
||||||
|
function onMouseMove() {
|
||||||
|
if (onMouseMoveTimer == null) {
|
||||||
|
onMouseMoveTimer = setTimeout(function() {
|
||||||
|
if (onMouseMoveTimer != null && dragSelectionMarker)
|
||||||
|
clearDragMarker();
|
||||||
|
}, 20);
|
||||||
|
}
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
exports.DragdropHandler = DragdropHandler;
|
exports.DragdropHandler = DragdropHandler;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue