@nasser-sw/fabric 7.0.1-beta3 → 7.0.1-beta4

package/debug/konva/src/shapes/Circle.ts

@@ -1,76 +0,0 @@
-import { Factory } from '../Factory.ts';
-import type { ShapeConfig } from '../Shape.ts';
-import { Shape } from '../Shape.ts';
-import type { GetSet } from '../types.ts';
-import { getNumberValidator } from '../Validators.ts';
-import { _registerNode } from '../Global.ts';
-import type { Context } from '../Context.ts';
-
-export interface CircleConfig extends ShapeConfig {
-  radius?: number;
-}
-
-/**
- * Circle constructor
- * @constructor
- * @memberof Konva
- * @augments Konva.Shape
- * @param {Object} config
- * @param {Number} config.radius
- * @@shapeParams
- * @@nodeParams
- * @example
- * // create circle
- * var circle = new Konva.Circle({
- *   radius: 40,
- *   fill: 'red',
- *   stroke: 'black',
- *   strokeWidth: 5
- * });
- */
-export class Circle extends Shape<CircleConfig> {
-  _sceneFunc(context: Context) {
-    context.beginPath();
-    context.arc(0, 0, this.attrs.radius || 0, 0, Math.PI * 2, false);
-    context.closePath();
-    context.fillStrokeShape(this);
-  }
-  getWidth() {
-    return this.radius() * 2;
-  }
-  getHeight() {
-    return this.radius() * 2;
-  }
-  setWidth(width: number) {
-    if (this.radius() !== width / 2) {
-      this.radius(width / 2);
-    }
-  }
-  setHeight(height: number) {
-    if (this.radius() !== height / 2) {
-      this.radius(height / 2);
-    }
-  }
-
-  radius: GetSet<number, this>;
-}
-
-Circle.prototype._centroid = true;
-Circle.prototype.className = 'Circle';
-Circle.prototype._attrsAffectingSize = ['radius'];
-_registerNode(Circle);
-
-/**
- * get/set radius
- * @name Konva.Circle#radius
- * @method
- * @param {Number} radius
- * @returns {Number}
- * @example
- * // get radius
- * var radius = circle.radius();
- *
- * // set radius
- * circle.radius(10);
- */
-Factory.addGetterSetter(Circle, 'radius', 0, getNumberValidator());

package/debug/konva/src/shapes/Ellipse.ts

@@ -1,121 +0,0 @@
-import { Factory } from '../Factory.ts';
-import type { ShapeConfig } from '../Shape.ts';
-import { Shape } from '../Shape.ts';
-import { getNumberValidator } from '../Validators.ts';
-import { _registerNode } from '../Global.ts';
-import type { Context } from '../Context.ts';
-
-import type { GetSet, Vector2d } from '../types.ts';
-
-export interface EllipseConfig extends ShapeConfig {
-  radiusX: number;
-  radiusY: number;
-}
-
-/**
- * Ellipse constructor
- * @constructor
- * @memberof Konva
- * @augments Konva.Shape
- * @param {Object} config
- * @param {Object} config.radius defines x and y radius
- * @@shapeParams
- * @@nodeParams
- * @example
- * var ellipse = new Konva.Ellipse({
- *   radius : {
- *     x : 50,
- *     y : 50
- *   },
- *   fill: 'red'
- * });
- */
-export class Ellipse extends Shape<EllipseConfig> {
-  _sceneFunc(context: Context) {
-    const rx = this.radiusX(),
-      ry = this.radiusY();
-
-    context.beginPath();
-    context.save();
-    if (rx !== ry) {
-      context.scale(1, ry / rx);
-    }
-    context.arc(0, 0, rx, 0, Math.PI * 2, false);
-    context.restore();
-    context.closePath();
-    context.fillStrokeShape(this);
-  }
-  getWidth() {
-    return this.radiusX() * 2;
-  }
-  getHeight() {
-    return this.radiusY() * 2;
-  }
-  setWidth(width: number) {
-    this.radiusX(width / 2);
-  }
-  setHeight(height: number) {
-    this.radiusY(height / 2);
-  }
-
-  radius: GetSet<Vector2d, this>;
-  radiusX: GetSet<number, this>;
-  radiusY: GetSet<number, this>;
-}
-
-Ellipse.prototype.className = 'Ellipse';
-Ellipse.prototype._centroid = true;
-Ellipse.prototype._attrsAffectingSize = ['radiusX', 'radiusY'];
-_registerNode(Ellipse);
-
-// add getters setters
-Factory.addComponentsGetterSetter(Ellipse, 'radius', ['x', 'y']);
-
-/**
- * get/set radius
- * @name Konva.Ellipse#radius
- * @method
- * @param {Object} radius
- * @param {Number} radius.x
- * @param {Number} radius.y
- * @returns {Object}
- * @example
- * // get radius
- * var radius = ellipse.radius();
- *
- * // set radius
- * ellipse.radius({
- *   x: 200,
- *   y: 100
- * });
- */
-
-Factory.addGetterSetter(Ellipse, 'radiusX', 0, getNumberValidator());
-/**
- * get/set radius x
- * @name Konva.Ellipse#radiusX
- * @method
- * @param {Number} x
- * @returns {Number}
- * @example
- * // get radius x
- * var radiusX = ellipse.radiusX();
- *
- * // set radius x
- * ellipse.radiusX(200);
- */
-
-Factory.addGetterSetter(Ellipse, 'radiusY', 0, getNumberValidator());
-/**
- * get/set radius y
- * @name Konva.Ellipse#radiusY
- * @method
- * @param {Number} y
- * @returns {Number}
- * @example
- * // get radius y
- * var radiusY = ellipse.radiusY();
- *
- * // set radius y
- * ellipse.radiusY(200);
- */

package/debug/konva/src/shapes/Image.ts

@@ -1,319 +0,0 @@
-import { Util } from '../Util.ts';
-import { Factory } from '../Factory.ts';
-import type { ShapeConfig } from '../Shape.ts';
-import { Shape } from '../Shape.ts';
-import { _registerNode } from '../Global.ts';
-import {
-  getNumberOrArrayOfNumbersValidator,
-  getNumberValidator,
-} from '../Validators.ts';
-
-import type { GetSet, IRect } from '../types.ts';
-import type { Context } from '../Context.ts';
-
-export interface ImageConfig extends ShapeConfig {
-  image: CanvasImageSource | undefined;
-  crop?: IRect;
-  cornerRadius?: number | number[];
-}
-
-/**
- * Image constructor
- * @constructor
- * @memberof Konva
- * @augments Konva.Shape
- * @param {Object} config
- * @param {Image} config.image
- * @param {Object} [config.crop]
- * @@shapeParams
- * @@nodeParams
- * @example
- * var imageObj = new Image();
- * imageObj.onload = function() {
- *   var image = new Konva.Image({
- *     x: 200,
- *     y: 50,
- *     image: imageObj,
- *     width: 100,
- *     height: 100
- *   });
- * };
- * imageObj.src = '/path/to/image.jpg'
- */
-export class Image extends Shape<ImageConfig> {
-  private _loadListener: () => void;
-
-  constructor(attrs: ImageConfig) {
-    super(attrs);
-    this._loadListener = () => {
-      this._requestDraw();
-    };
-
-    this.on('imageChange.konva', (props: any) => {
-      this._removeImageLoad(props.oldVal);
-      this._setImageLoad();
-    });
-
-    this._setImageLoad();
-  }
-  _setImageLoad() {
-    const image = this.image() as any;
-    // check is image is already loaded
-    if (image && image.complete) {
-      return;
-    }
-    // check is video is already loaded
-    if (image && image.readyState === 4) {
-      return;
-    }
-    if (image && image['addEventListener']) {
-      image['addEventListener']('load', this._loadListener);
-    }
-  }
-  _removeImageLoad(image: any) {
-    if (image && image['removeEventListener']) {
-      image['removeEventListener']('load', this._loadListener);
-    }
-  }
-  destroy() {
-    this._removeImageLoad(this.image());
-    super.destroy();
-    return this;
-  }
-  _useBufferCanvas() {
-    const hasCornerRadius = !!this.cornerRadius();
-    const hasShadow = this.hasShadow();
-    if (hasCornerRadius && hasShadow) {
-      return true;
-    }
-    return super._useBufferCanvas(true);
-  }
-  _sceneFunc(context: Context) {
-    const width = this.getWidth();
-    const height = this.getHeight();
-    const cornerRadius = this.cornerRadius();
-    const image = this.attrs.image;
-    let params;
-
-    if (image) {
-      const cropWidth = this.attrs.cropWidth;
-      const cropHeight = this.attrs.cropHeight;
-      if (cropWidth && cropHeight) {
-        params = [
-          image,
-          this.cropX(),
-          this.cropY(),
-          cropWidth,
-          cropHeight,
-          0,
-          0,
-          width,
-          height,
-        ];
-      } else {
-        params = [image, 0, 0, width, height];
-      }
-    }
-
-    if (this.hasFill() || this.hasStroke() || cornerRadius) {
-      context.beginPath();
-      cornerRadius
-        ? Util.drawRoundedRectPath(context, width, height, cornerRadius)
-        : context.rect(0, 0, width, height);
-      context.closePath();
-      context.fillStrokeShape(this);
-    }
-
-    if (image) {
-      if (cornerRadius) {
-        context.clip();
-      }
-      context.drawImage.apply(context, params);
-    }
-    // If you need to draw later, you need to execute save/restore
-  }
-  _hitFunc(context: Context) {
-    const width = this.width(),
-      height = this.height(),
-      cornerRadius = this.cornerRadius();
-
-    context.beginPath();
-    if (!cornerRadius) {
-      context.rect(0, 0, width, height);
-    } else {
-      Util.drawRoundedRectPath(context, width, height, cornerRadius);
-    }
-    context.closePath();
-    context.fillStrokeShape(this);
-  }
-  getWidth() {
-    return this.attrs.width ?? (this.image() as any)?.width;
-  }
-  getHeight() {
-    return this.attrs.height ?? (this.image() as any)?.height;
-  }
-
-  /**
-   * load image from given url and create `Konva.Image` instance
-   * @method
-   * @memberof Konva.Image
-   * @param {String} url image source
-   * @param {Function} callback with Konva.Image instance as first argument
-   * @param {Function} onError optional error handler
-   * @example
-   *  Konva.Image.fromURL(imageURL, function(image){
-   *    // image is Konva.Image instance
-   *    layer.add(image);
-   *  });
-   */
-  static fromURL(
-    url: string,
-    callback: (img: Image) => void,
-    onError: OnErrorEventHandler = null
-  ) {
-    const img = Util.createImageElement();
-    img.onload = function () {
-      const image = new Image({
-        image: img,
-      });
-      callback(image);
-    };
-    img.onerror = onError;
-    img.crossOrigin = 'Anonymous';
-    img.src = url;
-  }
-
-  image: GetSet<CanvasImageSource | undefined, this>;
-  crop: GetSet<IRect, this>;
-  cropX: GetSet<number, this>;
-  cropY: GetSet<number, this>;
-  cropWidth: GetSet<number, this>;
-  cropHeight: GetSet<number, this>;
-  cornerRadius: GetSet<number | number[], this>;
-}
-
-Image.prototype.className = 'Image';
-_registerNode(Image);
-
-/**
- * get/set corner radius
- * @method
- * @name Konva.Image#cornerRadius
- * @param {Number} cornerRadius
- * @returns {Number}
- * @example
- * // get corner radius
- * var cornerRadius = image.cornerRadius();
- *
- * // set corner radius
- * image.cornerRadius(10);
- *
- * // set different corner radius values
- * // top-left, top-right, bottom-right, bottom-left
- * image.cornerRadius([0, 10, 20, 30]);
- */
-Factory.addGetterSetter(
-  Image,
-  'cornerRadius',
-  0,
-  getNumberOrArrayOfNumbersValidator(4)
-);
-
-/**
- * get/set image source. It can be image, canvas or video element
- * @name Konva.Image#image
- * @method
- * @param {Object} image source
- * @returns {Object}
- * @example
- * // get value
- * var image = shape.image();
- *
- * // set value
- * shape.image(img);
- */
-Factory.addGetterSetter(Image, 'image');
-
-Factory.addComponentsGetterSetter(Image, 'crop', ['x', 'y', 'width', 'height']);
-/**
- * get/set crop
- * @method
- * @name Konva.Image#crop
- * @param {Object} crop
- * @param {Number} crop.x
- * @param {Number} crop.y
- * @param {Number} crop.width
- * @param {Number} crop.height
- * @returns {Object}
- * @example
- * // get crop
- * var crop = image.crop();
- *
- * // set crop
- * image.crop({
- *   x: 20,
- *   y: 20,
- *   width: 20,
- *   height: 20
- * });
- */
-
-Factory.addGetterSetter(Image, 'cropX', 0, getNumberValidator());
-/**
- * get/set crop x
- * @method
- * @name Konva.Image#cropX
- * @param {Number} x
- * @returns {Number}
- * @example
- * // get crop x
- * var cropX = image.cropX();
- *
- * // set crop x
- * image.cropX(20);
- */
-
-Factory.addGetterSetter(Image, 'cropY', 0, getNumberValidator());
-/**
- * get/set crop y
- * @name Konva.Image#cropY
- * @method
- * @param {Number} y
- * @returns {Number}
- * @example
- * // get crop y
- * var cropY = image.cropY();
- *
- * // set crop y
- * image.cropY(20);
- */
-
-Factory.addGetterSetter(Image, 'cropWidth', 0, getNumberValidator());
-/**
- * get/set crop width
- * @name Konva.Image#cropWidth
- * @method
- * @param {Number} width
- * @returns {Number}
- * @example
- * // get crop width
- * var cropWidth = image.cropWidth();
- *
- * // set crop width
- * image.cropWidth(20);
- */
-
-Factory.addGetterSetter(Image, 'cropHeight', 0, getNumberValidator());
-/**
- * get/set crop height
- * @name Konva.Image#cropHeight
- * @method
- * @param {Number} height
- * @returns {Number}
- * @example
- * // get crop height
- * var cropHeight = image.cropHeight();
- *
- * // set crop height
- * image.cropHeight(20);
- */