mirror of
https://github.com/konvajs/konva.git
synced 2026-03-03 16:58:33 +08:00
added throttling to mousemove and touchmove. Added logic to prevent Android from detecting both touch and mouse events
This commit is contained in:
18
src/Stage.js
18
src/Stage.js
@@ -344,9 +344,12 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
_mouseover: function(evt) {
|
_mouseover: function(evt) {
|
||||||
|
if (!Kinetic.UA.mobile) {
|
||||||
this._fire(CONTENT_MOUSEOVER, evt);
|
this._fire(CONTENT_MOUSEOVER, evt);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
_mouseout: function(evt) {
|
_mouseout: function(evt) {
|
||||||
|
if (!Kinetic.UA.mobile) {
|
||||||
this._setPointerPosition(evt);
|
this._setPointerPosition(evt);
|
||||||
var targetShape = this.targetShape;
|
var targetShape = this.targetShape;
|
||||||
|
|
||||||
@@ -358,8 +361,10 @@
|
|||||||
this.pointerPos = undefined;
|
this.pointerPos = undefined;
|
||||||
|
|
||||||
this._fire(CONTENT_MOUSEOUT, evt);
|
this._fire(CONTENT_MOUSEOUT, evt);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
_mousemove: function(evt) {
|
_mousemove: Kinetic.Util._throttle(function(evt) {
|
||||||
|
if (!Kinetic.UA.mobile) {
|
||||||
this._setPointerPosition(evt);
|
this._setPointerPosition(evt);
|
||||||
var dd = Kinetic.DD,
|
var dd = Kinetic.DD,
|
||||||
shape = this.getIntersection(this.getPointerPosition());
|
shape = this.getIntersection(this.getPointerPosition());
|
||||||
@@ -397,14 +402,16 @@
|
|||||||
if(dd) {
|
if(dd) {
|
||||||
dd._drag(evt);
|
dd._drag(evt);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// always call preventDefault for desktop events because some browsers
|
// always call preventDefault for desktop events because some browsers
|
||||||
// try to drag and drop the canvas element
|
// try to drag and drop the canvas element
|
||||||
if (evt.preventDefault) {
|
if (evt.preventDefault) {
|
||||||
evt.preventDefault();
|
evt.preventDefault();
|
||||||
}
|
}
|
||||||
},
|
}, 17),
|
||||||
_mousedown: function(evt) {
|
_mousedown: function(evt) {
|
||||||
|
if (!Kinetic.UA.mobile) {
|
||||||
this._setPointerPosition(evt);
|
this._setPointerPosition(evt);
|
||||||
var shape = this.getIntersection(this.getPointerPosition());
|
var shape = this.getIntersection(this.getPointerPosition());
|
||||||
|
|
||||||
@@ -417,6 +424,7 @@
|
|||||||
|
|
||||||
// content event
|
// content event
|
||||||
this._fire(CONTENT_MOUSEDOWN, evt);
|
this._fire(CONTENT_MOUSEDOWN, evt);
|
||||||
|
}
|
||||||
|
|
||||||
// always call preventDefault for desktop events because some browsers
|
// always call preventDefault for desktop events because some browsers
|
||||||
// try to drag and drop the canvas element
|
// try to drag and drop the canvas element
|
||||||
@@ -425,6 +433,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
_mouseup: function(evt) {
|
_mouseup: function(evt) {
|
||||||
|
if (!Kinetic.UA.mobile) {
|
||||||
this._setPointerPosition(evt);
|
this._setPointerPosition(evt);
|
||||||
var that = this,
|
var that = this,
|
||||||
shape = this.getIntersection(this.getPointerPosition()),
|
shape = this.getIntersection(this.getPointerPosition()),
|
||||||
@@ -465,6 +474,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
Kinetic.listenClickTap = false;
|
Kinetic.listenClickTap = false;
|
||||||
|
}
|
||||||
|
|
||||||
// always call preventDefault for desktop events because some browsers
|
// always call preventDefault for desktop events because some browsers
|
||||||
// try to drag and drop the canvas element
|
// try to drag and drop the canvas element
|
||||||
@@ -534,7 +544,7 @@
|
|||||||
|
|
||||||
Kinetic.listenClickTap = false;
|
Kinetic.listenClickTap = false;
|
||||||
},
|
},
|
||||||
_touchmove: function(evt) {
|
_touchmove: Kinetic.Util._throttle(function(evt) {
|
||||||
this._setPointerPosition(evt);
|
this._setPointerPosition(evt);
|
||||||
var dd = Kinetic.DD,
|
var dd = Kinetic.DD,
|
||||||
shape = this.getIntersection(this.getPointerPosition());
|
shape = this.getIntersection(this.getPointerPosition());
|
||||||
@@ -553,7 +563,7 @@
|
|||||||
if(dd) {
|
if(dd) {
|
||||||
dd._drag(evt);
|
dd._drag(evt);
|
||||||
}
|
}
|
||||||
},
|
}, 17),
|
||||||
_setPointerPosition: function(evt) {
|
_setPointerPosition: function(evt) {
|
||||||
var evt = evt ? evt : window.event,
|
var evt = evt ? evt : window.event,
|
||||||
contentPosition = this._getContentPosition(),
|
contentPosition = this._getContentPosition(),
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
suite('DragAndDrop', function() {
|
suite('DragAndDrop', function() {
|
||||||
|
|
||||||
// ======================================================
|
// ======================================================
|
||||||
test('test drag and drop properties and methods', function() {
|
test('test drag and drop properties and methods', function(done) {
|
||||||
var stage = addStage();
|
var stage = addStage();
|
||||||
var layer = new Kinetic.Layer();
|
var layer = new Kinetic.Layer();
|
||||||
var circle = new Kinetic.Circle({
|
var circle = new Kinetic.Circle({
|
||||||
@@ -18,10 +18,11 @@ suite('DragAndDrop', function() {
|
|||||||
layer.add(circle);
|
layer.add(circle);
|
||||||
|
|
||||||
setTimeout(function() {
|
setTimeout(function() {
|
||||||
|
|
||||||
layer.draw();
|
layer.draw();
|
||||||
|
|
||||||
// test defaults
|
// test defaults
|
||||||
//assert.equal(circle.draggable(), false);
|
assert.equal(circle.draggable(), false);
|
||||||
|
|
||||||
//change properties
|
//change properties
|
||||||
circle.setDraggable(true);
|
circle.setDraggable(true);
|
||||||
@@ -34,7 +35,9 @@ suite('DragAndDrop', function() {
|
|||||||
showHit(layer);
|
showHit(layer);
|
||||||
|
|
||||||
// test new properties
|
// test new properties
|
||||||
//assert.equal(circle.getDraggable(), true);
|
assert.equal(circle.getDraggable(), true);
|
||||||
|
|
||||||
|
done();
|
||||||
|
|
||||||
}, 50);
|
}, 50);
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user