refactored the mouse_handler to support custom event hooks for all mouse events
This commit is contained in:
parent
f2728b04b9
commit
a4c2304476
5 changed files with 234 additions and 109 deletions
|
|
@ -47,7 +47,7 @@ var event = require("pilot/event");
|
|||
var lang = require("pilot/lang");
|
||||
var useragent = require("pilot/useragent");
|
||||
var TextInput = require("ace/keyboard/textinput").TextInput;
|
||||
var MouseHandler = require("ace/mouse_handler").MouseHandler;
|
||||
var MouseHandler = require("ace/mouse/mouse_handler").MouseHandler;
|
||||
//var TouchHandler = require("ace/touch_handler").TouchHandler;
|
||||
var KeyBinding = require("ace/keyboard/keybinding").KeyBinding;
|
||||
var EditSession = require("ace/edit_session").EditSession;
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
*
|
||||
* Contributor(s):
|
||||
* Fabian Jakobs <fabian AT ajax DOT org>
|
||||
* Mihai Sucan <mihai DOT sucan AT gmail DOT com>
|
||||
* Mike de Boer <mike AT ajax DOT org>
|
||||
*
|
||||
* Alternatively, the contents of this file may be used under the terms of
|
||||
* either the GNU General Public License Version 2 or later (the "GPL"), or
|
||||
|
|
@ -41,7 +41,7 @@ define(function(require, exports, module) {
|
|||
|
||||
var event = require("pilot/event");
|
||||
var dom = require("pilot/dom");
|
||||
var BrowserFocus = require("pilot/browser_focus").BrowserFocus;
|
||||
var EventEmitter = require("pilot/event_emitter").EventEmitter;
|
||||
|
||||
var STATE_UNKNOWN = 0;
|
||||
var STATE_SELECT = 1;
|
||||
|
|
@ -50,75 +50,33 @@ var STATE_DRAG = 2;
|
|||
var DRAG_TIMER = 250; // milliseconds
|
||||
var DRAG_OFFSET = 5; // pixels
|
||||
|
||||
var MouseHandler = function(editor) {
|
||||
this.editor = editor;
|
||||
|
||||
this.browserFocus = new BrowserFocus();
|
||||
event.addListener(editor.container, "mousedown", function(e) {
|
||||
editor.focus();
|
||||
return event.preventDefault(e);
|
||||
});
|
||||
event.addListener(editor.container, "selectstart", function(e) {
|
||||
return event.preventDefault(e);
|
||||
});
|
||||
function calcDistance(ax, ay, bx, by) {
|
||||
return Math.sqrt(Math.pow(bx - ax, 2) + Math.pow(by - ay, 2));
|
||||
}
|
||||
|
||||
var mouseTarget = editor.renderer.getMouseEventTarget();
|
||||
event.addListener(mouseTarget, "mousedown", this.onMouseDown.bind(this));
|
||||
event.addMultiMouseDownListener(mouseTarget, 0, 2, 500, this.onMouseDoubleClick.bind(this));
|
||||
event.addMultiMouseDownListener(mouseTarget, 0, 3, 600, this.onMouseTripleClick.bind(this));
|
||||
event.addMultiMouseDownListener(mouseTarget, 0, 4, 600, this.onMouseQuadClick.bind(this));
|
||||
event.addMouseWheelListener(editor.container, this.onMouseWheel.bind(this));
|
||||
};
|
||||
|
||||
(function() {
|
||||
|
||||
this.$scrollSpeed = 1;
|
||||
this.setScrollSpeed = function(speed) {
|
||||
this.$scrollSpeed = speed;
|
||||
};
|
||||
|
||||
this.getScrollSpeed = function() {
|
||||
return this.$scrollSpeed;
|
||||
};
|
||||
|
||||
this.$getEventPosition = function(e) {
|
||||
var pageX = event.getDocumentX(e);
|
||||
var pageY = event.getDocumentY(e);
|
||||
var pos = this.editor.renderer.screenToTextCoordinates(pageX, pageY);
|
||||
pos.row = Math.max(0, Math.min(pos.row, this.editor.session.getLength()-1));
|
||||
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);
|
||||
var handlers = exports.DefaultHandlers = {
|
||||
onMouseDown: function(ev) {
|
||||
var e = ev.DOMEvent;
|
||||
var editor = ev.editor;
|
||||
var inSelection = ev.inSelection;
|
||||
var pageX = ev.pageX;
|
||||
var pageY = ev.pageY
|
||||
var pos = ev.pos;
|
||||
|
||||
var pos = this.$getEventPosition(e);
|
||||
|
||||
var editor = this.editor;
|
||||
var self = this;
|
||||
var selectionRange = editor.getSelectionRange();
|
||||
var selectionEmpty = selectionRange.isEmpty();
|
||||
var inSelection = !editor.getReadOnly()
|
||||
&& !selectionEmpty
|
||||
&& selectionRange.contains(pos.row, pos.column);
|
||||
|
||||
var state = STATE_UNKNOWN;
|
||||
|
||||
// if this click caused the editor to be focused should not clear the
|
||||
// selection
|
||||
if (
|
||||
inSelection && (
|
||||
!this.browserFocus.isFocused()
|
||||
|| new Date().getTime() - this.browserFocus.lastFocus < 20
|
||||
|| !this.editor.isFocused()
|
||||
!editor.$mouseHandler.browserFocus.isFocused()
|
||||
|| new Date().getTime() - editor.$mouseHandler.browserFocus.lastFocus < 20
|
||||
|| !editor.isFocused()
|
||||
)
|
||||
) {
|
||||
this.editor.focus();
|
||||
editor.focus();
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -132,7 +90,8 @@ var MouseHandler = function(editor) {
|
|||
event.capture(editor.container, function(){}, editor.textInput.onContextMenuClose);
|
||||
}
|
||||
return;
|
||||
} else {
|
||||
}
|
||||
else {
|
||||
// Select the fold as the user clicks it.
|
||||
var fold = editor.session.getFoldAt(pos.row, pos.column, 1);
|
||||
if (fold) {
|
||||
|
|
@ -164,7 +123,7 @@ var MouseHandler = function(editor) {
|
|||
else if (state == STATE_DRAG)
|
||||
onMouseDragSelectionEnd();
|
||||
|
||||
self.$clickSelection = null;
|
||||
editor.$mouseHandler.$clickSelection = null;
|
||||
state = STATE_UNKNOWN;
|
||||
};
|
||||
|
||||
|
|
@ -172,7 +131,7 @@ var MouseHandler = function(editor) {
|
|||
dom.removeCssClass(editor.container, "ace_dragging");
|
||||
editor.session.removeMarker(dragSelectionMarker);
|
||||
|
||||
if (!self.$clickSelection) {
|
||||
if (!editor.$mouseHandler.$clickSelection) {
|
||||
if (!dragCursor) {
|
||||
editor.moveCursorToPosition(pos);
|
||||
editor.selection.clearSelection(pos.row, pos.column);
|
||||
|
|
@ -202,16 +161,16 @@ var MouseHandler = function(editor) {
|
|||
return;
|
||||
|
||||
if (state == STATE_UNKNOWN) {
|
||||
var distance = self.$distance(pageX, pageY, mousePageX, mousePageY);
|
||||
var distance = calcDistance(pageX, pageY, mousePageX, mousePageY);
|
||||
var time = (new Date()).getTime();
|
||||
|
||||
|
||||
if (distance > DRAG_OFFSET) {
|
||||
state = STATE_SELECT;
|
||||
var cursor = editor.renderer.screenToTextCoordinates(mousePageX, mousePageY);
|
||||
cursor.row = Math.max(0, Math.min(cursor.row, editor.session.getLength()-1));
|
||||
onStartSelect(cursor);
|
||||
} else if ((time - mousedownTime) > DRAG_TIMER) {
|
||||
}
|
||||
else if ((time - mousedownTime) > DRAG_TIMER) {
|
||||
state = STATE_DRAG;
|
||||
dragRange = editor.getSelectionRange();
|
||||
var style = editor.getSelectionStyle();
|
||||
|
|
@ -229,10 +188,11 @@ var MouseHandler = function(editor) {
|
|||
};
|
||||
|
||||
function onStartSelect(pos) {
|
||||
if (e.shiftKey)
|
||||
editor.selection.selectToPosition(pos)
|
||||
if (e.shiftKey) {
|
||||
editor.selection.selectToPosition(pos);
|
||||
}
|
||||
else {
|
||||
if (!self.$clickSelection) {
|
||||
if (!editor.$mouseHandler.$clickSelection) {
|
||||
editor.moveCursorToPosition(pos);
|
||||
editor.selection.clearSelection(pos.row, pos.column);
|
||||
}
|
||||
|
|
@ -241,17 +201,20 @@ var MouseHandler = function(editor) {
|
|||
}
|
||||
|
||||
var onUpdateSelectionInterval = function() {
|
||||
var anchor;
|
||||
var cursor = editor.renderer.screenToTextCoordinates(mousePageX, mousePageY);
|
||||
cursor.row = Math.max(0, Math.min(cursor.row, editor.session.getLength()-1));
|
||||
|
||||
if (self.$clickSelection) {
|
||||
if (self.$clickSelection.contains(cursor.row, cursor.column)) {
|
||||
editor.selection.setSelectionRange(self.$clickSelection);
|
||||
} else {
|
||||
if (self.$clickSelection.compare(cursor.row, cursor.column) == -1) {
|
||||
var anchor = self.$clickSelection.end;
|
||||
} else {
|
||||
var anchor = self.$clickSelection.start;
|
||||
if (editor.$mouseHandler.$clickSelection) {
|
||||
if (editor.$mouseHandler.$clickSelection.contains(cursor.row, cursor.column)) {
|
||||
editor.selection.setSelectionRange(editor.$mouseHandler.$clickSelection);
|
||||
}
|
||||
else {
|
||||
if (editor.$mouseHandler.$clickSelection.compare(cursor.row, cursor.column) == -1) {
|
||||
anchor = editor.$mouseHandler.$clickSelection.end;
|
||||
}
|
||||
else {
|
||||
anchor = editor.$mouseHandler.$clickSelection.start;
|
||||
}
|
||||
editor.selection.setSelectionAnchor(anchor.row, anchor.column);
|
||||
editor.selection.selectToPosition(cursor);
|
||||
|
|
@ -275,45 +238,58 @@ var MouseHandler = function(editor) {
|
|||
var timerId = setInterval(onSelectionInterval, 20);
|
||||
|
||||
return event.preventDefault(e);
|
||||
};
|
||||
|
||||
this.onMouseDoubleClick = function(e) {
|
||||
var editor = this.editor;
|
||||
var pos = this.$getEventPosition(e);
|
||||
|
||||
},
|
||||
|
||||
onDoubleClick: function(ev) {
|
||||
var e = ev.DOMEvent;
|
||||
var editor = ev.editor;
|
||||
var pos = ev.pos;
|
||||
|
||||
// If the user dclicked on a fold, then expand it.
|
||||
var fold = editor.session.getFoldAt(pos.row, pos.column, 1);
|
||||
if (fold) {
|
||||
editor.session.expandFold(fold);
|
||||
} else {
|
||||
}
|
||||
else {
|
||||
editor.moveCursorToPosition(pos);
|
||||
editor.selection.selectWord();
|
||||
this.$clickSelection = editor.getSelectionRange();
|
||||
editor.$mouseHandler.$clickSelection = editor.getSelectionRange();
|
||||
}
|
||||
};
|
||||
|
||||
this.onMouseTripleClick = function(e) {
|
||||
var pos = this.$getEventPosition(e);
|
||||
this.editor.moveCursorToPosition(pos);
|
||||
this.editor.selection.selectLine();
|
||||
this.$clickSelection = this.editor.getSelectionRange();
|
||||
};
|
||||
|
||||
this.onMouseQuadClick = function(e) {
|
||||
this.editor.selectAll();
|
||||
this.$clickSelection = this.editor.getSelectionRange();
|
||||
};
|
||||
|
||||
this.onMouseWheel = function(e) {
|
||||
var speed = this.$scrollSpeed * 2;
|
||||
|
||||
this.editor.renderer.scrollBy(e.wheelX * speed, e.wheelY * speed);
|
||||
if (this.editor.renderer.isScrollableBy(e.wheelX, e.wheelY))
|
||||
},
|
||||
|
||||
onTripleClick: function(ev) {
|
||||
var e = ev.DOMEvent;
|
||||
var editor = ev.editor;
|
||||
var pos = ev.pos;
|
||||
|
||||
editor.moveCursorToPosition(pos);
|
||||
editor.selection.selectLine();
|
||||
editor.$mouseHandler.$clickSelection = editor.getSelectionRange();
|
||||
},
|
||||
|
||||
onQuadClick: function(ev) {
|
||||
var e = ev.DOMEvent;
|
||||
var editor = ev.editor;
|
||||
|
||||
editor.selectAll();
|
||||
editor.$mouseHandler.$clickSelection = editor.getSelectionRange();
|
||||
},
|
||||
|
||||
onScroll: function(ev) {
|
||||
var e = ev.DOMEvent;
|
||||
var editor = ev.editor;
|
||||
var speed = ev.speed;
|
||||
|
||||
editor.renderer.scrollBy(e.wheelX * speed, e.wheelY * speed);
|
||||
if (editor.renderer.isScrollableBy(e.wheelX, e.wheelY))
|
||||
return event.preventDefault(e);
|
||||
};
|
||||
}
|
||||
};
|
||||
|
||||
EventEmitter.setDefaultHandler("mousedown", handlers.onMouseDown);
|
||||
EventEmitter.setDefaultHandler("dblclick", handlers.onDoubleClick);
|
||||
EventEmitter.setDefaultHandler("tripleclick", handlers.onTripleClick);
|
||||
EventEmitter.setDefaultHandler("quadclick", handlers.onQuadClick);
|
||||
EventEmitter.setDefaultHandler("scroll", handlers.onScroll);
|
||||
|
||||
}).call(MouseHandler.prototype);
|
||||
|
||||
exports.MouseHandler = MouseHandler;
|
||||
});
|
||||
0
lib/ace/mouse/dragdrop.js
vendored
Normal file
0
lib/ace/mouse/dragdrop.js
vendored
Normal file
146
lib/ace/mouse/mouse_handler.js
Normal file
146
lib/ace/mouse/mouse_handler.js
Normal file
|
|
@ -0,0 +1,146 @@
|
|||
/* vim:ts=4:sts=4:sw=4:
|
||||
* ***** BEGIN LICENSE BLOCK *****
|
||||
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
|
||||
*
|
||||
* The contents of this file are subject to the Mozilla Public License Version
|
||||
* 1.1 (the "License"); you may not use this file except in compliance with
|
||||
* the License. You may obtain a copy of the License at
|
||||
* http://www.mozilla.org/MPL/
|
||||
*
|
||||
* Software distributed under the License is distributed on an "AS IS" basis,
|
||||
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
|
||||
* for the specific language governing rights and limitations under the
|
||||
* License.
|
||||
*
|
||||
* The Original Code is Ajax.org Code Editor (ACE).
|
||||
*
|
||||
* The Initial Developer of the Original Code is
|
||||
* Ajax.org B.V.
|
||||
* Portions created by the Initial Developer are Copyright (C) 2010
|
||||
* the Initial Developer. All Rights Reserved.
|
||||
*
|
||||
* Contributor(s):
|
||||
* Fabian Jakobs <fabian AT ajax DOT org>
|
||||
* Mihai Sucan <mihai DOT sucan AT gmail DOT com>
|
||||
*
|
||||
* Alternatively, the contents of this file may be used under the terms of
|
||||
* either the GNU General Public License Version 2 or later (the "GPL"), or
|
||||
* the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
|
||||
* in which case the provisions of the GPL or the LGPL are applicable instead
|
||||
* of those above. If you wish to allow use of your version of this file only
|
||||
* under the terms of either the GPL or the LGPL, and not to allow others to
|
||||
* use your version of this file under the terms of the MPL, indicate your
|
||||
* decision by deleting the provisions above and replace them with the notice
|
||||
* and other provisions required by the GPL or the LGPL. If you do not delete
|
||||
* the provisions above, a recipient may use your version of this file under
|
||||
* the terms of any one of the MPL, the GPL or the LGPL.
|
||||
*
|
||||
* ***** END LICENSE BLOCK ***** */
|
||||
|
||||
define(function(require, exports, module) {
|
||||
|
||||
var event = require("pilot/event");
|
||||
var BrowserFocus = require("pilot/browser_focus").BrowserFocus;
|
||||
var DefaultHandlers = require("ace/mouse/default_handlers").DefaultHandlers;
|
||||
|
||||
var MouseHandler = function(editor) {
|
||||
this.editor = editor;
|
||||
|
||||
this.browserFocus = new BrowserFocus();
|
||||
event.addListener(editor.container, "mousedown", function(e) {
|
||||
editor.focus();
|
||||
return event.preventDefault(e);
|
||||
});
|
||||
event.addListener(editor.container, "selectstart", function(e) {
|
||||
return event.preventDefault(e);
|
||||
});
|
||||
|
||||
var mouseTarget = editor.renderer.getMouseEventTarget();
|
||||
event.addListener(mouseTarget, "mousedown", this.onMouseDown.bind(this));
|
||||
event.addMultiMouseDownListener(mouseTarget, 0, 2, 500, this.onMouseDoubleClick.bind(this));
|
||||
event.addMultiMouseDownListener(mouseTarget, 0, 3, 600, this.onMouseTripleClick.bind(this));
|
||||
event.addMultiMouseDownListener(mouseTarget, 0, 4, 600, this.onMouseQuadClick.bind(this));
|
||||
event.addMouseWheelListener(editor.container, this.onMouseWheel.bind(this));
|
||||
};
|
||||
|
||||
(function() {
|
||||
|
||||
this.$scrollSpeed = 1;
|
||||
this.setScrollSpeed = function(speed) {
|
||||
this.$scrollSpeed = speed;
|
||||
};
|
||||
|
||||
this.getScrollSpeed = function() {
|
||||
return this.$scrollSpeed;
|
||||
};
|
||||
|
||||
this.$getEventPosition = function(e) {
|
||||
var pageX = event.getDocumentX(e);
|
||||
var pageY = event.getDocumentY(e);
|
||||
var pos = this.editor.renderer.screenToTextCoordinates(pageX, pageY);
|
||||
pos.row = Math.max(0, Math.min(pos.row, this.editor.session.getLength()-1));
|
||||
return pos;
|
||||
};
|
||||
|
||||
this.onMouseDown = function(e) {
|
||||
var pageX = event.getDocumentX(e);
|
||||
var pageY = event.getDocumentY(e);
|
||||
|
||||
var pos = this.$getEventPosition(e);
|
||||
|
||||
var editor = this.editor;
|
||||
var self = this;
|
||||
var selectionRange = editor.getSelectionRange();
|
||||
var selectionEmpty = selectionRange.isEmpty();
|
||||
var inSelection = !editor.getReadOnly()
|
||||
&& !selectionEmpty
|
||||
&& selectionRange.contains(pos.row, pos.column);
|
||||
|
||||
this.editor._dispatchEvent("mousedown", {
|
||||
DOMEvent: e,
|
||||
editor: editor,
|
||||
pageX: pageX,
|
||||
pageY: pageY,
|
||||
pos: pos,
|
||||
inSelection: inSelection
|
||||
});
|
||||
};
|
||||
|
||||
this.onMouseDoubleClick = function(e) {
|
||||
this.editor._dispatchEvent("dblclick", {
|
||||
DOMEvent: e,
|
||||
editor: this.editor,
|
||||
pos: this.$getEventPosition(e)
|
||||
});
|
||||
};
|
||||
|
||||
this.onMouseTripleClick = function(e) {
|
||||
this.editor._dispatchEvent("tripleclick", {
|
||||
DOMEvent: e,
|
||||
editor: this.editor,
|
||||
pos: this.$getEventPosition(e)
|
||||
});
|
||||
};
|
||||
|
||||
this.onMouseQuadClick = function(e) {
|
||||
this.editor._dispatchEvent("quadclick", {
|
||||
DOMEvent: e,
|
||||
editor: this.editor,
|
||||
pos: this.$getEventPosition(e)
|
||||
});
|
||||
};
|
||||
|
||||
this.onMouseWheel = function(e) {
|
||||
var speed = this.$scrollSpeed * 2;
|
||||
|
||||
this.editor._dispatchEvent("scroll", {
|
||||
DOMEvent: e,
|
||||
editor: this.editor,
|
||||
speed: speed
|
||||
});
|
||||
};
|
||||
|
||||
}).call(MouseHandler.prototype);
|
||||
|
||||
exports.MouseHandler = MouseHandler;
|
||||
});
|
||||
|
|
@ -154,7 +154,10 @@ var WorkerClient = function(topLevelNamespaces, packagedJs, module, classname) {
|
|||
};
|
||||
|
||||
this.emit = function(event, data) {
|
||||
this.$worker.postMessage({event: event, data: data});
|
||||
try {
|
||||
this.$worker.postMessage({event: event, data: data});
|
||||
}
|
||||
catch(ex) {}
|
||||
};
|
||||
|
||||
}).call(WorkerClient.prototype);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue