lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-09-18 18:27:58 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

minor refactoring. fixed bug related to click mapping

Browse Source
This commit is contained in:
Eric Rowell
2013-03-23 23:19:24 -07:00
parent ce793a4b25
commit 3a903d6c7c
4 changed files with 75 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/Global.js
View File

@@ -44,7 +44,7 @@ var Kinetic = {};
shapes: {},
isDragging: function() {
var dd = Kinetic.DD;
return (dd && dd.isDragging);
return (!dd || dd.isDragging);
},
warn: function(str) {
/*

3
src/Node.js
View File

@@ -993,8 +993,7 @@
this.drawHit();
},
shouldDrawHit: function() {
var dd = Kinetic.DD;
return this.isVisible() && this.isListening() && (!dd || !dd.isDragging);
return this.isVisible() && this.isListening() && !Kinetic.Global.isDragging();
}
};

23
src/Stage.js
View File

@@ -334,10 +334,10 @@
},
_mouseout: function(evt) {
this._setPointerPosition(evt);
var dd = Kinetic.DD;
var go = Kinetic.Global;
// if there's a current target shape, run mouseout handlers
var targetShape = this.targetShape;
if(targetShape && (!dd || !dd.isDragging)) {
if(targetShape && !go.isDragging()) {
targetShape._handleEvent('mouseout', evt);
targetShape._handleEvent('mouseleave', evt);
this.targetShape = null;
@@ -346,13 +346,14 @@
},
_mousemove: function(evt) {
this._setPointerPosition(evt);
var dd = Kinetic.DD;
var obj = this.getIntersection(this.getPointerPosition());
var go = Kinetic.Global,
dd = Kinetic.DD,
obj = this.getIntersection(this.getPointerPosition());
if(obj) {
var shape = obj.shape;
if(shape) {
if((!dd || !dd.isDragging) && obj.pixel[3] === 255 && (!this.targetShape || this.targetShape._id !== shape._id)) {
if(!go.isDragging() && obj.pixel[3] === 255 && (!this.targetShape || this.targetShape._id !== shape._id)) {
if(this.targetShape) {
this.targetShape._handleEvent('mouseout', evt, shape);
this.targetShape._handleEvent('mouseleave', evt, shape);
@@ -370,7 +371,7 @@
* if no shape was detected, clear target shape and try
* to run mouseout from previous target shape
*/
else if(this.targetShape && (!dd || !dd.isDragging)) {
else if(this.targetShape && !go.isDragging()) {
this.targetShape._handleEvent('mouseout', evt);
this.targetShape._handleEvent('mouseleave', evt);
this.targetShape = null;
@@ -400,7 +401,7 @@
_mouseup: function(evt) {
this._setPointerPosition(evt);
var that = this,
dd = Kinetic.DD,
go = Kinetic.Global,
obj = this.getIntersection(this.getPointerPosition());
if(obj && obj.shape) {
@@ -413,7 +414,7 @@
* if dragging and dropping, or if click doesn't map to
* the correct shape, don't fire click or dbl click event
*/
if(!dd || !dd.isDragging || !dd.node) {
if(!go.isDragging() && shape._id === this.clickStartShape._id) {
shape._handleEvent('click', evt);
if(this.inDoubleClickWindow) {
@@ -429,7 +430,9 @@
this.clickStart = false;
},
_touchstart: function(evt) {
var obj, dd = Kinetic.DD;
var dd = Kinetic.DD,
go = Kinetic.Global,
obj;
this._setPointerPosition(evt);
evt.preventDefault();
@@ -442,7 +445,7 @@
}
// init stage drag and drop
if(dd && this.attrs.draggable && !dd.node) {
if(dd && !go.isDragging() && this.isDraggable()) {
this._startDrag(evt);
}
},

62
tests/js/functionalTests.js
View File

@@ -1,3 +1,8 @@
function trigger(event, x, y) {
}
Test.Modules.DD = {
'remove shape with onclick': function(containerId) {
var stage = new Kinetic.Stage({
@@ -328,16 +333,20 @@ Test.Modules.EVENT = {
x: 400,
y: stage.getHeight() / 2,
radius: 70,
fill: 'green',
draggable: true
fill: 'green'
});
var redClicks = 0;
var greenClicks = 0;
redCircle.on('click', function() {
console.log('clicked redCircle');
redClicks++;
});
greenCircle.on('click', function() {
console.log('clicked greenCircle');
greenClicks++;
});
@@ -345,9 +354,58 @@ Test.Modules.EVENT = {
layer.add(greenCircle);
stage.add(layer);
var top = stage.content.getBoundingClientRect().top;
showHit(layer);
// mousedown and mouseup on red circle
stage._mousedown({
clientX: 284,
clientY: 113 + top
});
Kinetic.DD._endDragBefore();
stage._mouseup({
clientX: 284,
clientY: 113 + top
});
Kinetic.DD._endDragAfter({dragEndNode:redCircle});
test(redClicks === 1, 'red circle should have 1 click');
test(greenClicks === 0, 'green circle should have 0 clicks');
// mousedown and mouseup on green circle
stage._mousedown({
clientX: 397,
clientY: 108 + top
});
Kinetic.DD._endDragBefore();
stage._mouseup({
clientX: 397,
clientY: 108 + top
});
Kinetic.DD._endDragAfter({dragEndNode:redCircle});
test(redClicks === 1, 'red circle should have 1 click');
test(greenClicks === 1, 'green circle should have 1 click');
// mousedown red circle and mouseup on green circle
stage._mousedown({
clientX: 284,
clientY: 113 + top
});
Kinetic.DD._endDragBefore();
stage._mouseup({
clientX: 397,
clientY: 108 + top
});
Kinetic.DD._endDragAfter({dragEndNode:redCircle});
test(redClicks === 1, 'red circle should still have 1 click');
test(greenClicks === 1, 'green circle should still have 1 click');
},
'text events': function(containerId) {
var stage = new Kinetic.Stage({