fixed bug related to multiple drag and drop initializations

This commit is contained in:
Eric Rowell 2012-04-01 09:32:20 -07:00
parent 6889cd742c
commit 3a8afc747c
4 changed files with 88 additions and 48 deletions

12
dist/kinetic-core.js vendored
View File

@ -628,7 +628,7 @@ Kinetic.Node.prototype = {
*/ */
draggable: function(isDraggable) { draggable: function(isDraggable) {
if(this.draggable !== isDraggable) { if(this.draggable !== isDraggable) {
if(isDraggable) { if(isDraggable && this.isDragging()) {
this._initDrag(); this._initDrag();
} }
else { else {
@ -1187,7 +1187,15 @@ Kinetic.Stage.prototype = {
addLayer(n); addLayer(n);
} }
else { else {
callback(bufferLayer.getCanvas().toDataURL(mimeType, quality)); try {
// If this call fails (due to browser bug, like in Firefox 3.6),
// then revert to previous no-parameter image/png behavior
callback(bufferLayer.getCanvas().toDataURL(mimeType, quality));
}
catch(exception)
{
callback(bufferLayer.getCanvas().toDataURL());
}
} }
}; };
imageObj.src = dataURL; imageObj.src = dataURL;

File diff suppressed because one or more lines are too long

View File

@ -381,7 +381,7 @@ Kinetic.Node.prototype = {
*/ */
draggable: function(isDraggable) { draggable: function(isDraggable) {
if(this.draggable !== isDraggable) { if(this.draggable !== isDraggable) {
if(isDraggable) { if(isDraggable && this.isDragging()) {
this._initDrag(); this._initDrag();
} }
else { else {

View File

@ -561,9 +561,9 @@ Test.prototype.tests = {
width: 578, width: 578,
height: 200 height: 200
}); });
var layer = new Kinetic.Layer({ var layer = new Kinetic.Layer({
rotationDeg: 20 rotationDeg: 20
}); });
var star = new Kinetic.Star({ var star = new Kinetic.Star({
x: 200, x: 200,
@ -628,48 +628,6 @@ Test.prototype.tests = {
layer.add(circle); layer.add(circle);
stage.add(layer); stage.add(layer);
}, },
'EVENTS - isDragging': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: 380,
y: stage.height / 2,
radius: 70,
strokeWidth: 4,
fill: 'red',
stroke: 'black'
});
//log('not dragging yet before draggable, isDragging: ' + circle.isDragging());
test(circle.isDragging() === false, 'isDragging() should be false');
circle.draggable(true);
//log('not dragging yet after draggable, isDragging: ' + circle.isDragging());
test(circle.isDragging() === false, 'isDragging() should be false');
circle.on('dragstart', function() {
log('dragstart, isDragging: ' + this.isDragging());
test(circle.isDragging() === true, 'isDragging() should be true');
});
circle.on('dragmove', function() {
log('dragmove, isDragging: ' + this.isDragging());
test(circle.isDragging() === true, 'isDragging() should be true');
});
circle.on('dragend', function() {
log('dragend, isDragging: ' + this.isDragging());
test(circle.isDragging() === false, 'isDragging() should be false');
});
layer.add(circle);
stage.add(layer);
},
'EVENTS - move mouse from shape to another shape in same layer': function(containerId) { 'EVENTS - move mouse from shape to another shape in same layer': function(containerId) {
var stage = new Kinetic.Stage({ var stage = new Kinetic.Stage({
container: containerId, container: containerId,
@ -1034,6 +992,80 @@ Test.prototype.tests = {
layer.add(group); layer.add(group);
stage.add(layer); stage.add(layer);
}, },
'DRAG AND DROP - isDragging': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: 380,
y: stage.height / 2,
radius: 70,
strokeWidth: 4,
fill: 'red',
stroke: 'black'
});
//log('not dragging yet before draggable, isDragging: ' + circle.isDragging());
test(circle.isDragging() === false, 'isDragging() should be false');
circle.draggable(true);
//log('not dragging yet after draggable, isDragging: ' + circle.isDragging());
test(circle.isDragging() === false, 'isDragging() should be false');
circle.on('dragstart', function() {
log('dragstart, isDragging: ' + this.isDragging());
test(circle.isDragging() === true, 'isDragging() should be true');
});
circle.on('dragmove', function() {
log('dragmove, isDragging: ' + this.isDragging());
test(circle.isDragging() === true, 'isDragging() should be true');
});
circle.on('dragend', function() {
log('dragend, isDragging: ' + this.isDragging());
test(circle.isDragging() === false, 'isDragging() should be false');
});
layer.add(circle);
stage.add(layer);
},
'DRAG AND DROP - multiple drag and drop sets with draggable() (circle should not be draggable)': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: 380,
y: stage.height / 2,
radius: 70,
strokeWidth: 4,
fill: 'red',
stroke: 'black'
});
circle.draggable(true);
circle.draggable(true);
circle.draggable(true);
circle.draggable(false);
circle.draggable(true);
circle.draggable(true);
circle.draggable(true);
// circle should not be draggable
circle.draggable(false);
layer.add(circle);
stage.add(layer);
},
'DRAG AND DROP - draggable true': function(containerId) { 'DRAG AND DROP - draggable true': function(containerId) {
var stage = new Kinetic.Stage({ var stage = new Kinetic.Stage({
container: containerId, container: containerId,