update docs. close #702

src/Animation.ts

@@ -20,10 +20,9 @@ var now = (function(): () => number {
  * @memberof Konva
  * @param {AnimationFn} func function executed on each animation frame.  The function is passed a frame object, which contains
  *  timeDiff, lastTime, time, and frameRate properties.  The timeDiff property is the number of milliseconds that have passed
- *  since the last animation frame.  The lastTime property is time in milliseconds that elapsed from the moment the animation started
- *  to the last animation frame.  The time property is the time in milliseconds that elapsed from the moment the animation started
- *  to the current animation frame.  The frameRate property is the current frame rate in frames / second. Return false from function,
- *  if you don't need to redraw layer/layers on some frames.
+ *  since the last animation frame. The time property is the time in milliseconds that elapsed from the moment the animation started
+ *  to the current animation frame. The lastTime property is a `time` value from the previous frame.  The frameRate property is the current frame rate in frames / second.
+ *  Return false from function, if you don't need to redraw layer/layers on some frames.
  * @param {Konva.Layer|Array} [layers] layer(s) to be redrawn on each animation frame. Can be a layer, an array of layers, or null.
  *  Not specifying a node will result in no redraw.
  * @example

test/unit/shapes/Transformer-test.js

@@ -1828,6 +1828,78 @@ suite('Transformer', function() {
     });
   });
 
+  test.skip('centered scaling on flip', function() {
+    var stage = addStage();
+    var layer = new Konva.Layer();
+    stage.add(layer);
+
+    var rect = new Konva.Rect({
+      draggable: true,
+      fill: 'yellow',
+      
+    });
+    layer.add(rect);
+
+    var tr = new Konva.Transformer({
+      node: rect,
+      centeredScaling: true,
+      keepRatio: false
+    });
+    layer.add(tr);
+
+    rect.setAttrs({
+      x: 0,
+      y: 0,
+      width: 100,
+      height: 100,
+      scaleX: 1,
+      scaleY: 1
+    });
+    tr.update();
+
+    layer.draw();
+
+    // stage.simulateMouseDown({x: 0, y: 0});
+
+    var target = stage.getIntersection({ x: 0, y: 0});
+    var top = stage.content.getBoundingClientRect().top;
+    throw 11;
+    debugger;
+    tr._handleMouseMove({
+      target: target,
+      clientX: 100,
+      clientY: 0 + top
+    });
+    console.log(rect.width() * rect.scaleX());
+    tr._handleMouseMove({
+      target: target,
+      clientX: 100,
+      clientY: 0 + top
+    });
+    console.log(rect.width() * rect.scaleX());
+    // here is duplicate, because transformer is listening window events
+    tr._handleMouseUp({
+      clientX: 100,
+      clientY: 0 + top
+    });
+    stage.simulateMouseUp({
+      x: 100,
+      y: 0
+    });
+    layer.draw();
+
+    assert.equal(
+      rect.width() * rect.scaleX(),
+      -100
+    );
+    assert.equal(
+      rect.height() * rect.scaleY(),
+      -100,
+    );
+
+    throw 1;
+  });
+
   test('transform scaled (in one direction) node', function() {
     var stage = addStage();
     var layer = new Konva.Layer();