update docs, update version

konva-node/package.json

@@ -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"
   }
 }

konva.js

@@ -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)
@@ -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
@@ -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
@@ -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
@@ -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
    */
@@ -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() {

konva.min.js

@@ -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)

src/Animation.js

@@ -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
    */

src/Context.js

@@ -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);

src/Node.js

@@ -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
@@ -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
@@ -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

src/Shape.js

@@ -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;
 

src/shapes/Sprite.js

@@ -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() {

src/shapes/Transformer.js

@@ -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;

test/unit/shapes/Transformer-test.js

@@ -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();