lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-06-28 06:31:15 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

update docs, update version

Browse Source
This commit is contained in:
Anton Lavrenov 2018-11-27 09:02:28 -05:00
parent 352f493d0a
commit d76b09e026
10 changed files with 127 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
konva-node/package.json
View File

@ -1,6 +1,6 @@
{
"name": "konva-node",
"version": "0.5.5",
"version": "0.9.0",
"description": "Konva framework for NodeJS env",
"main": "index.js",
"files": [
@ -26,6 +26,6 @@
"license": "MIT",
"dependencies": {
"canvas": "^1.6.7",
"konva": "^1.7.3"
"konva": "^2.5.1"
}
}

65
konva.js
View File

@ -2,7 +2,7 @@
* Konva JavaScript Framework v2.5.1
* http://konvajs.github.io/
* Licensed under the MIT
* Date: Sat Nov 17 2018
* Date: Thu Nov 22 2018
*
* Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
* Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva)
@ -2627,9 +2627,9 @@
return this._cache[attr];
},
/*
* when the logic for a cached result depends on ancestor propagation, use this
* method to clear self and children cache
*/
* when the logic for a cached result depends on ancestor propagation, use this
* method to clear self and children cache
*/
_clearSelfAndDescendantCache: function(attr) {
this._clearCache(attr);
@ -2798,6 +2798,7 @@
/**
* Return client rectangle {x, y, width, height} of node. This rectangle also include all styling (strokes, shadows, etc).
* The rectangle position is relative to parent container.
* The purpose of the method is similar to getBoundingClientRect API of the DOM.
* @method
* @memberof Konva.Node.prototype
* @param {Object} config
@ -3023,10 +3024,10 @@
name;
/*
* loop through types and attach event listeners to
* each one. eg. 'click mouseover.namespace mouseout'
* will create three event bindings
*/
* loop through types and attach event listeners to
* each one. eg. 'click mouseover.namespace mouseout'
* will create three event bindings
*/
for (n = 0; n < len; n++) {
event = events[n];
parts = event.split(DOT);
@ -3162,7 +3163,7 @@
return this;
},
/**
* remove and destroy a node. Kill it forever! You should not reuse node after destroy().
* remove and destroy a node. Kill it and delete forever! You should not reuse node after destroy().
* @method
* @memberof Konva.Node.prototype
* @example
@ -4109,9 +4110,9 @@
for (n = 0; n < len; n++) {
listener = allListeners[n];
/*
* don't include konva namespaced listeners because
* these are generated by the constructors
*/
* don't include konva namespaced listeners because
* these are generated by the constructors
*/
if (listener.name.indexOf(KONVA) < 0) {
// if listeners array doesn't exist, then create it
if (!node.eventListeners[key]) {
@ -4169,7 +4170,7 @@
return this._toKonvaCanvas(config)._canvas;
},
/**
* Creates a composite data URL. If MIME type is not
* Creates a composite data URL (base64 string). If MIME type is not
* specified, then "image/png" will result. For "image/jpeg", specify a quality
* level as quality (range 0.0 - 1.0)
* @method
@ -12144,8 +12145,8 @@
};
};
/*
* Animation methods
*/
* Animation methods
*/
Konva.Animation.prototype = {
/**
* set layers to be redrawn on each animation frame
@ -12288,16 +12289,16 @@
key,
needRedraw;
/*
* loop through all animations and execute animation
* function. if the animation object has specified node,
* we can add the node to the nodes hash to eliminate
* drawing the same node multiple times. The node property
* can be the stage itself or a layer
*/
* loop through all animations and execute animation
* function. if the animation object has specified node,
* we can add the node to the nodes hash to eliminate
* drawing the same node multiple times. The node property
* can be the stage itself or a layer
*/
/*
* WARNING: don't cache animations.length because it could change while
* the for loop is running, causing a JS error
*/
* WARNING: don't cache animations.length because it could change while
* the for loop is running, causing a JS error
*/
for (n = 0; n < animations.length; n++) {
anim = animations[n];
@ -12353,8 +12354,9 @@
* batch draw. this function will not do immediate draw
* but it will schedule drawing to next tick (requestAnimFrame)
* @method
* @name batchDraw
* @return {Konva.Layer} this
* @memberof Konva.Base.prototype
* @memberof Konva.BaseLayer.prototype
*/
Konva.BaseLayer.prototype.batchDraw = function() {
var that = this,
@ -12376,6 +12378,7 @@
/**
* batch draw
* @method
* @name batchDraw
* @return {Konva.Stage} this
* @memberof Konva.Stage.prototype
*/
@ -16443,11 +16446,11 @@
var layer = this.getLayer();
/*
* animation object has no executable function because
* the updates are done with a fixed FPS with the setInterval
* below. The anim object only needs the layer reference for
* redraw
*/
* animation object has no executable function because
* the updates are done with a fixed FPS with the setInterval
* below. The anim object only needs the layer reference for
* redraw
*/
this.anim.setLayers(layer);
this._setInterval();
this.anim.start();
@ -16464,7 +16467,7 @@
/**
* determine if animation of sprite is running or not. returns true or false
* @method
* @memberof Konva.Animation.prototype
* @memberof Konva.Sprite.prototype
* @returns {Boolean}
*/
isRunning: function() {

2
konva.min.js vendored
View File

@ -2,7 +2,7 @@
* Konva JavaScript Framework v2.5.1
* http://konvajs.github.io/
* Licensed under the MIT
* Date: Sat Nov 17 2018
* Date: Thu Nov 22 2018
*
* Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
* Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva)

26
src/Animation.js
View File

@ -66,8 +66,8 @@
};
};
/*
* Animation methods
*/
* Animation methods
*/
Konva.Animation.prototype = {
/**
* set layers to be redrawn on each animation frame
@ -210,16 +210,16 @@
key,
needRedraw;
/*
* loop through all animations and execute animation
* function. if the animation object has specified node,
* we can add the node to the nodes hash to eliminate
* drawing the same node multiple times. The node property
* can be the stage itself or a layer
*/
* loop through all animations and execute animation
* function. if the animation object has specified node,
* we can add the node to the nodes hash to eliminate
* drawing the same node multiple times. The node property
* can be the stage itself or a layer
*/
/*
* WARNING: don't cache animations.length because it could change while
* the for loop is running, causing a JS error
*/
* WARNING: don't cache animations.length because it could change while
* the for loop is running, causing a JS error
*/
for (n = 0; n < animations.length; n++) {
anim = animations[n];
@ -275,8 +275,9 @@
* batch draw. this function will not do immediate draw
* but it will schedule drawing to next tick (requestAnimFrame)
* @method
* @name batchDraw
* @return {Konva.Layer} this
* @memberof Konva.Base.prototype
* @memberof Konva.BaseLayer.prototype
*/
Konva.BaseLayer.prototype.batchDraw = function() {
var that = this,
@ -298,6 +299,7 @@
/**
* batch draw
* @method
* @name batchDraw
* @return {Konva.Stage} this
* @memberof Konva.Stage.prototype
*/

3
src/Context.js
View File

@ -623,7 +623,8 @@
if (shape.hasStroke()) {
if (!strokeScaleEnabled) {
this.save();
this.setTransform(1, 0, 0, 1, 0, 0);
// set 2, because otherwise stroke will be 1/2 of its size
this.setTransform(2, 0, 0, 2, 0, 0);
}
this._applyLineCap(shape);

25
src/Node.js
View File

@ -98,9 +98,9 @@
return this._cache[attr];
},
/*
* when the logic for a cached result depends on ancestor propagation, use this
* method to clear self and children cache
*/
* when the logic for a cached result depends on ancestor propagation, use this
* method to clear self and children cache
*/
_clearSelfAndDescendantCache: function(attr) {
this._clearCache(attr);
@ -269,6 +269,7 @@
/**
* Return client rectangle {x, y, width, height} of node. This rectangle also include all styling (strokes, shadows, etc).
* The rectangle position is relative to parent container.
* The purpose of the method is similar to getBoundingClientRect API of the DOM.
* @method
* @memberof Konva.Node.prototype
* @param {Object} config
@ -494,10 +495,10 @@
name;
/*
* loop through types and attach event listeners to
* each one. eg. 'click mouseover.namespace mouseout'
* will create three event bindings
*/
* loop through types and attach event listeners to
* each one. eg. 'click mouseover.namespace mouseout'
* will create three event bindings
*/
for (n = 0; n < len; n++) {
event = events[n];
parts = event.split(DOT);
@ -633,7 +634,7 @@
return this;
},
/**
* remove and destroy a node. Kill it forever! You should not reuse node after destroy().
* remove and destroy a node. Kill it and delete forever! You should not reuse node after destroy().
* @method
* @memberof Konva.Node.prototype
* @example
@ -1580,9 +1581,9 @@
for (n = 0; n < len; n++) {
listener = allListeners[n];
/*
* don't include konva namespaced listeners because
* these are generated by the constructors
*/
* don't include konva namespaced listeners because
* these are generated by the constructors
*/
if (listener.name.indexOf(KONVA) < 0) {
// if listeners array doesn't exist, then create it
if (!node.eventListeners[key]) {
@ -1640,7 +1641,7 @@
return this._toKonvaCanvas(config)._canvas;
},
/**
* Creates a composite data URL. If MIME type is not
* Creates a composite data URL (base64 string). If MIME type is not
* specified, then "image/png" will result. For "image/jpeg", specify a quality
* level as quality (range 0.0 - 1.0)
* @method

12
src/Shape.js
View File

@ -260,6 +260,18 @@
var fillRect = this.getSelfRect();
var strokeWidth = (this.hasStroke() && this.strokeWidth()) || 0;
// var scale = {
// x: 1,
// y: 1
// };
// if (!this.strokeScaleEnabled()) {
// var scale = this.getAbsoluteScale();
// // scale = {
// // x: Math.abs(scale.x)
// // }
// }
var fillAndStrokeWidth = fillRect.width + strokeWidth;
var fillAndStrokeHeight = fillRect.height + strokeWidth;

12
src/shapes/Sprite.js
View File

@ -167,11 +167,11 @@
var layer = this.getLayer();
/*
* animation object has no executable function because
* the updates are done with a fixed FPS with the setInterval
* below. The anim object only needs the layer reference for
* redraw
*/
* animation object has no executable function because
* the updates are done with a fixed FPS with the setInterval
* below. The anim object only needs the layer reference for
* redraw
*/
this.anim.setLayers(layer);
this._setInterval();
this.anim.start();
@ -188,7 +188,7 @@
/**
* determine if animation of sprite is running or not. returns true or false
* @method
* @memberof Konva.Animation.prototype
* @memberof Konva.Sprite.prototype
* @returns {Boolean}
*/
isRunning: function() {

3
src/shapes/Transformer.js
View File

@ -67,7 +67,7 @@
if (isMirrored) {
rad *= -1;
}
var angle = (Konva.Util._radToDeg(rad) % 360 + 360) % 360;
var angle = ((Konva.Util._radToDeg(rad) % 360) + 360) % 360;
if (
Konva.Util._inRange(angle, 315 + 22.5, 360) ||
@ -657,6 +657,7 @@
this.getNode().rotation(newAttrs.rotation);
}
var pure = node.getClientRect({ skipTransform: true, skipShadow: true });
var padding = this.getPadding();
var scaleX = (newAttrs.width - padding * 2) / pure.width;
var scaleY = (newAttrs.height - padding * 2) / pure.height;

41
test/unit/shapes/Transformer-test.js
View File

@ -71,6 +71,47 @@ suite('Transformer', function() {
assert.equal(tr.rotation(), rect.rotation());
});
test.skip('try to fit rectangle with strokeScaleEnabled = false', function() {
var stage = addStage();
var layer = new Konva.Layer();
stage.add(layer);
var rect = new Konva.Rect({
x: 20,
y: 20,
width: 100,
height: 100,
fill: 'green',
stroke: 'rgba(0,0,0,0.5)',
strokeWidth: 40,
name: 'myCircle',
draggable: true,
strokeScaleEnabled: false
});
layer.add(rect);
var tr = new Konva.Transformer();
layer.add(tr);
tr.attachTo(rect);
layer.draw();
tr._fitNodeInto({
x: 0,
y: 0,
width: 200,
height: 200
});
var scale = 200 / 140;
assert.equal(rect.x(), 0);
assert.equal(rect.y(), 0);
assert.equal(rect.width(), 100);
assert.equal(rect.height(), 100);
assert.equal(rect.scaleX(), scale);
});
test('listen shape changes', function() {
var stage = addStage();
var layer = new Konva.Layer();