mirror of
https://github.com/konvajs/konva.git
synced 2025-11-18 17:21:36 +08:00
merged pull request #65 and updated manual tests. Also removed dragConstraint and dragBounds as they are now redundant. I may introduce a set of dragBounds helper functions, similar to filters, that provide common functions out of the box, such as Horizontal and Vertical
This commit is contained in:
@@ -30,6 +30,7 @@
|
||||
* @param {Number} [config.dragBounds.right]
|
||||
* @param {Number} [config.dragBounds.bottom]
|
||||
* @param {Number} [config.dragBounds.left]
|
||||
* @param {Function} [config.dragBoundFunc] dragBoundFunc(pos, evt) should return new position
|
||||
*/
|
||||
Kinetic.Node = function(config) {
|
||||
this._nodeInit(config);
|
||||
@@ -997,7 +998,7 @@ Kinetic.Node._addGetter = function(constructor, attr) {
|
||||
};
|
||||
};
|
||||
// add getters setters
|
||||
Kinetic.Node.addGettersSetters(Kinetic.Node, ['x', 'y', 'rotation', 'opacity', 'name', 'id', 'draggable', 'dragConstraint', 'dragBounds', 'listening', 'visible']);
|
||||
Kinetic.Node.addGettersSetters(Kinetic.Node, ['x', 'y', 'rotation', 'opacity', 'name', 'id', 'draggable', 'listening', 'visible', 'dragBoundFunc']);
|
||||
Kinetic.Node.addGetters(Kinetic.Node, ['scale', 'offset']);
|
||||
|
||||
// mappings
|
||||
@@ -1162,4 +1163,4 @@ Kinetic.Node.prototype.isDraggable = Kinetic.Node.prototype.getDraggable;
|
||||
* determine if listening to events or not
|
||||
* @name getListening
|
||||
* @methodOf Kinetic.Node.prototype
|
||||
*/
|
||||
*/
|
||||
|
||||
109
src/Stage.js
109
src/Stage.js
@@ -59,7 +59,7 @@ Kinetic.Stage.prototype = {
|
||||
|
||||
},
|
||||
setContainer: function(container) {
|
||||
/*
|
||||
/*
|
||||
* if container is a string, assume it's an id for
|
||||
* a DOM element
|
||||
*/
|
||||
@@ -89,26 +89,25 @@ Kinetic.Stage.prototype = {
|
||||
this.setWidth(size.width);
|
||||
this.setHeight(size.height);
|
||||
},
|
||||
|
||||
/**
|
||||
* set height
|
||||
* @name setHeight
|
||||
* @methodOf Kinetic.Stage.prototype
|
||||
* @param {Number} height
|
||||
*/
|
||||
/**
|
||||
* set height
|
||||
* @name setHeight
|
||||
* @methodOf Kinetic.Stage.prototype
|
||||
* @param {Number} height
|
||||
*/
|
||||
setHeight: function(height) {
|
||||
this.setAttr('height', height);
|
||||
this._resizeDOM();
|
||||
this.setAttr('height', height);
|
||||
this._resizeDOM();
|
||||
},
|
||||
/**
|
||||
* set width
|
||||
* @name setWidth
|
||||
* @methodOf Kinetic.Stage.prototype
|
||||
* @param {Number} width
|
||||
*/
|
||||
/**
|
||||
* set width
|
||||
* @name setWidth
|
||||
* @methodOf Kinetic.Stage.prototype
|
||||
* @param {Number} width
|
||||
*/
|
||||
setWidth: function(width) {
|
||||
this.setAttr('width', width);
|
||||
this._resizeDOM();
|
||||
this.setAttr('width', width);
|
||||
this._resizeDOM();
|
||||
},
|
||||
/**
|
||||
* get stage size
|
||||
@@ -169,6 +168,7 @@ Kinetic.Stage.prototype = {
|
||||
|
||||
return obj;
|
||||
}
|
||||
|
||||
return JSON.stringify(addNode(this));
|
||||
},
|
||||
/**
|
||||
@@ -226,6 +226,7 @@ Kinetic.Stage.prototype = {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var obj = JSON.parse(json);
|
||||
|
||||
// copy over stage properties
|
||||
@@ -329,6 +330,7 @@ Kinetic.Stage.prototype = {
|
||||
};
|
||||
imageObj.src = layerUrl;
|
||||
}
|
||||
|
||||
drawLayer(0);
|
||||
},
|
||||
/**
|
||||
@@ -393,24 +395,24 @@ Kinetic.Stage.prototype = {
|
||||
return null;
|
||||
},
|
||||
_resizeDOM: function() {
|
||||
if (this.content) {
|
||||
var width = this.attrs.width;
|
||||
var height = this.attrs.height;
|
||||
|
||||
// set content dimensions
|
||||
this.content.style.width = width + 'px';
|
||||
this.content.style.height = height + 'px';
|
||||
|
||||
this.bufferCanvas.setSize(width, height);
|
||||
// set user defined layer dimensions
|
||||
var layers = this.children;
|
||||
for(var n = 0; n < layers.length; n++) {
|
||||
var layer = layers[n];
|
||||
layer.getCanvas().setSize(width, height);
|
||||
layer.bufferCanvas.setSize(width, height);
|
||||
layer.draw();
|
||||
}
|
||||
}
|
||||
if(this.content) {
|
||||
var width = this.attrs.width;
|
||||
var height = this.attrs.height;
|
||||
|
||||
// set content dimensions
|
||||
this.content.style.width = width + 'px';
|
||||
this.content.style.height = height + 'px';
|
||||
|
||||
this.bufferCanvas.setSize(width, height);
|
||||
// set user defined layer dimensions
|
||||
var layers = this.children;
|
||||
for(var n = 0; n < layers.length; n++) {
|
||||
var layer = layers[n];
|
||||
layer.getCanvas().setSize(width, height);
|
||||
layer.bufferCanvas.setSize(width, height);
|
||||
layer.draw();
|
||||
}
|
||||
}
|
||||
},
|
||||
/**
|
||||
* add layer to stage
|
||||
@@ -681,43 +683,19 @@ Kinetic.Stage.prototype = {
|
||||
|
||||
if(node) {
|
||||
var pos = that.getUserPosition();
|
||||
var dc = node.attrs.dragConstraint;
|
||||
var db = node.attrs.dragBounds;
|
||||
var lastNodePos = {
|
||||
x: node.attrs.x,
|
||||
y: node.attrs.y
|
||||
};
|
||||
var dbf = node.attrs.dragBoundFunc;
|
||||
|
||||
// default
|
||||
var newNodePos = {
|
||||
x: pos.x - go.drag.offset.x,
|
||||
y: pos.y - go.drag.offset.y
|
||||
};
|
||||
|
||||
// bounds overrides
|
||||
if(db.left !== undefined && newNodePos.x < db.left) {
|
||||
newNodePos.x = db.left;
|
||||
}
|
||||
if(db.right !== undefined && newNodePos.x > db.right) {
|
||||
newNodePos.x = db.right;
|
||||
}
|
||||
if(db.top !== undefined && newNodePos.y < db.top) {
|
||||
newNodePos.y = db.top;
|
||||
}
|
||||
if(db.bottom !== undefined && newNodePos.y > db.bottom) {
|
||||
newNodePos.y = db.bottom;
|
||||
if(dbf !== undefined) {
|
||||
newNodePos = dbf.call(node, newNodePos, evt);
|
||||
}
|
||||
|
||||
node.setAbsolutePosition(newNodePos);
|
||||
|
||||
// constraint overrides
|
||||
if(dc === 'horizontal') {
|
||||
node.attrs.y = lastNodePos.y;
|
||||
}
|
||||
else if(dc === 'vertical') {
|
||||
node.attrs.x = lastNodePos.x;
|
||||
}
|
||||
|
||||
if(!go.drag.moving) {
|
||||
go.drag.moving = true;
|
||||
// execute dragstart events if defined
|
||||
@@ -824,7 +802,7 @@ Kinetic.Node.addGetters(Kinetic.Stage, ['width', 'height', 'container']);
|
||||
* @name getContainer
|
||||
* @methodOf Kinetic.Stage.prototype
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* get width
|
||||
* @name getWidth
|
||||
@@ -835,5 +813,4 @@ Kinetic.Node.addGetters(Kinetic.Stage, ['width', 'height', 'container']);
|
||||
* get height
|
||||
* @name getHeight
|
||||
* @methodOf Kinetic.Stage.prototype
|
||||
*/
|
||||
|
||||
*/
|
||||
Reference in New Issue
Block a user