jyapayne/ace
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added hold-mousedown delay to enable selection drag

Browse source
This commit is contained in:
Mihai Sucan 2011-02-18 19:56:08 +02:00
commit c6b4fc93f2
2 changed files with 56 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

4
lib/ace/css/editor.css
View file

@ -152,3 +152,7 @@
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.ace_dragging .ace_marker-layer, .ace_dragging .ace_text-layer {
cursor: move;
}

67
lib/ace/mouse_handler.js
View file

@ -40,6 +40,14 @@
define(function(require, exports, module) {
var event = require("pilot/event");
var dom = require("pilot/dom");
const STATE_UNKNOWN = 0;
const STATE_SELECT = 1;
const STATE_DRAG = 2;
const DRAG_TIMER = 500; // milliseconds
const DRAG_OFFSET = 5; // pixels
var MouseHandler = function(editor) {
this.editor = editor;
@ -77,6 +85,10 @@ var MouseHandler = function(editor) {
return pos;
};
this.$distance = function(ax, ay, bx, by) {
return Math.sqrt(Math.pow(bx - ax, 2) + Math.pow(by - ay, 2));
};
this.onMouseDown = function(e) {
var pageX = event.getDocumentX(e);
var pageY = event.getDocumentY(e);
@ -84,6 +96,7 @@ var MouseHandler = function(editor) {
var editor = this.editor;
var selectionRange = editor.getSelectionRange();
var selectionEmpty = selectionRange.isEmpty();
var state = STATE_UNKNOWN;
var inSelection = false;
var button = event.getButton(e)
@ -109,6 +122,10 @@ var MouseHandler = function(editor) {
if (!editor.$clickSelection)
editor.selection.clearSelection(pos.row, pos.column);
}
// Directly pick STATE_SELECT, since the user is not clicking inside
// a selection.
state = STATE_SELECT;
}
editor.renderer.scrollCursorIntoView();
@ -117,6 +134,7 @@ var MouseHandler = function(editor) {
var mousePageX, mousePageY;
var overwrite = editor.getOverwrite();
var dragCursor = null;
var mousedownTime = (new Date()).getTime();
var onMouseSelection = function(e) {
mousePageX = event.getDocumentX(e);
@ -125,11 +143,17 @@ var MouseHandler = function(editor) {
var onMouseSelectionEnd = function() {
clearInterval(timerId);
self.$clickSelection = null;
if (state == STATE_DRAG)
onMouseDragSelectionEnd();
else
self.$clickSelection = null;
state = STATE_UNKNOWN;
};
var onMouseDragSelectionEnd = function() {
clearInterval(timerId);
dom.removeCssClass(editor.container, "ace_dragging");
if (!self.$clickSelection) {
self.$clickSelection = null;
if (!dragCursor) {
@ -142,22 +166,43 @@ var MouseHandler = function(editor) {
return;
var selection = editor.getSelectionRange();
if (selection.contains(dragCursor.row, dragCursor.column))
if (selection.contains(dragCursor.row, dragCursor.column)) {
dragCursor = null;
return;
}
editor.clearSelection();
var newRange = editor.moveText(selection, dragCursor);
if (!newRange)
if (!newRange) {
dragCursor = null;
return;
}
editor.selection.setSelectionRange(newRange);
dragCursor = null;
};
var onSelectionInterval = function() {
if (mousePageX === undefined || mousePageY === undefined)
return;
if (state == STATE_UNKNOWN) {
var distance = self.$distance(pageX, pageY, mousePageX, mousePageY);
var time = (new Date()).getTime();
if (distance > DRAG_OFFSET)
state = STATE_SELECT;
else if ((time - mousedownTime) > DRAG_TIMER) {
state = STATE_DRAG;
dom.addCssClass(editor.container, "ace_dragging");
}
} else if (state == STATE_DRAG)
onDragSelectionInterval();
else if (state == STATE_SELECT)
onUpdateSelectionInterval();
};
var onUpdateSelectionInterval = function() {
var cursor = editor.renderer.screenToTextCoordinates(mousePageX, mousePageY);
cursor.row = Math.max(0, Math.min(cursor.row, editor.session.getLength()-1));
@ -182,9 +227,6 @@ var MouseHandler = function(editor) {
};
var onDragSelectionInterval = function() {
if (mousePageX === undefined || mousePageY === undefined)
return;
dragCursor = editor.renderer.screenToTextCoordinates(mousePageX, mousePageY);
dragCursor.row = Math.max(0, Math.min(dragCursor.row,
editor.session.getLength() - 1));
@ -193,13 +235,8 @@ var MouseHandler = function(editor) {
editor.renderer.scrollCursorIntoView();
};
if (inSelection) {
event.capture(editor.container, onMouseSelection, onMouseDragSelectionEnd);
var timerId = setInterval(onDragSelectionInterval, 20);
} else {
event.capture(editor.container, onMouseSelection, onMouseSelectionEnd);
var timerId = setInterval(onSelectionInterval, 20);
}
event.capture(editor.container, onMouseSelection, onMouseSelectionEnd);
var timerId = setInterval(onSelectionInterval, 20);
return event.preventDefault(e);
};