plotboilerplate 1.16.0 → 1.17.0

package/src/ts/utils/helpers/BezierPathInteractionHelper.ts

@@ -20,7 +20,8 @@
  * @modified 2021-01-03 Changed property to `autoAdjustPaths` in the HandlerOptions interface (typo).
  * @modified 2021-01-03 Added following new functions: `addPathVertexDragStartListeners`, `removePathVertexDragStartListeners`, `addPathVertexDragEndListeners` and `removePathVertexDragEndListeners`.
  * @modified 2021-03-31 Fixed the issue with the new AlloyFinger (Typescript).
- * @version  1.1.1
+ * @modified 2022-02-03 Changing the element to catch events (eventCatcher instead of canvas).
+ * @version  1.1.2
  *
  * @file BezierPathInteractionHelper
  * @public
@@ -277,8 +278,8 @@ export class BezierPathInteractionHelper {
       // removePathVertexDragStartListeners(this.paths[i], listener);
     }
     this.paths = [];
-    this.pb.canvas.removeEventListener("mouseenter", this._mouseEnterListener);
-    this.pb.canvas.removeEventListener("mouseleave", this._mouseLeaveListener);
+    this.pb.eventCatcher.removeEventListener("mouseenter", this._mouseEnterListener);
+    this.pb.eventCatcher.removeEventListener("mouseleave", this._mouseLeaveListener);
     this._mouseHandler.destroy();
     this._keyHandler.destroy();
   }
@@ -450,11 +451,10 @@ export class BezierPathInteractionHelper {
         _self._clearMoveEvent();
       }
     };
-    // new AlloyFinger(this.pb.canvas, afProps);
     if (window["createAlloyFinger"]) {
-      return window["createAlloyFinger"](this.pb.eventCatcher ? this.pb.eventCatcher : this.pb.canvas, afProps);
+      return window["createAlloyFinger"](this.pb.eventCatcher ? this.pb.eventCatcher : this.pb.eventCatcher, afProps);
     } else {
-      return new AlloyFinger(this.pb.eventCatcher ? this.pb.eventCatcher : this.pb.canvas, afProps);
+      return new AlloyFinger(this.pb.eventCatcher ? this.pb.eventCatcher : this.pb.eventCatcher, afProps);
     }
   }
 
@@ -463,7 +463,7 @@ export class BezierPathInteractionHelper {
   // +-------------------------------
   private _installMouseListener(): MouseHandler {
     var _self: BezierPathInteractionHelper = this;
-    var mouseHandler = new MouseHandler(this.pb.canvas)
+    var mouseHandler = new MouseHandler(this.pb.eventCatcher)
       .up(function (e: XMouseEvent) {
         if (e.params.wasDragged) return;
         if (_self._keyHandler.isDown("shift")) return;
@@ -502,21 +502,12 @@ export class BezierPathInteractionHelper {
         _self.onVertexInserted(_self.currentPathIndex, leftPath.bezierCurves.length, newPath, oldPath);
       })
       .move(function (e: XMouseEvent) {
-        // console.log('moved');
-        // if( _self.pb.getDraggedElementCount() == 0 )
         _self.mouseIsOver = true;
         _self._handleMoveEvent(e.params.pos.x, e.params.pos.y);
       });
 
-    // _self.pb.canvas.addEventListener("mouseenter", function () {
-    //   _self.mouseIsOver = true;
-    // });
-    // _self.pb.canvas.addEventListener("mouseleave", function () {
-    //   _self.mouseIsOver = false;
-    //   _self._clearMoveEvent();
-    // });
-    this.pb.canvas.addEventListener("mouseenter", this._mouseEnterListener);
-    this.pb.canvas.addEventListener("mouseleave", this._mouseLeaveListener);
+    this.pb.eventCatcher.addEventListener("mouseenter", this._mouseEnterListener);
+    this.pb.eventCatcher.addEventListener("mouseleave", this._mouseLeaveListener);
     return mouseHandler;
   }
 

package/src/ts/SVGBuilder.ts

@@ -1,109 +0,0 @@
-/**
- * Todos:
- *  + use a Drawable interface
- *  + use a SVGSerializable interface
- *
- * @require Vertex
- *
- * @deprecated THIS CLASS IS DEPRECATED. Please use the new `drawutilssvg` instead.
- *
- * @author   Ikaros Kappler
- * @date     2018-12-04
- * @modified 2019-11-07 Added the 'Triangle' style class.
- * @modified 2019-11-13 Added the <?xml ...?> tag.
- * @modified 2020-03-25 Ported this class from vanilla-JS to Typescript.
- * @modified 2020-12-17 Added Circle and CircleSection style classes.
- * @modified 2021-01-26 DEPRECATION
- * @version  1.0.5
- **/
-
-
-import { Vertex } from "./Vertex";
-import { SVGSerializable } from "./interfaces";
-
-
-/**
- * @classdesc A default SVG builder.
- *
- * @requires SVGSerializable
- * @requires Vertex
- */ 
-export class SVGBuilder {
-
-    /**
-     * @constructor
-     **/
-    constructor() {
-	console.warn("THIS CLASS IS DEPRECATED. Please use the new 'drawutilssvg' instead.")
-    };
-
-
-    /**
-     *  Builds the SVG code from the given list of drawables.
-     *
-     * @param {object[]} drawables - The drawable elements (should implement Drawable) to be converted (each must have a toSVGString-function).
-     * @param {object}   options  - { canvasSize, zoom, offset }
-     * @return {string}
-     **/
-    build( drawables:Array<SVGSerializable>,
-	   options:{canvasSize:{width:number,height:number},zoom:Vertex,offset:Vertex}
-	 ) : string {
-	
-	var nl : string = '\n';
-	var indent : string = '  ';
-	var buffer : Array<string> = [];
-	
-	buffer.push( '<?xml version="1.0" encoding="UTF-8"?>' + nl );
-	buffer.push( '<svg width="'+options.canvasSize.width+'" height="'+options.canvasSize.height+'"' );
-	buffer.push( ' viewBox="' );
-	buffer.push( '0' );
-	buffer.push( ' ' );
-	buffer.push( '0' );
-	buffer.push( ' ' );
-	buffer.push( options.canvasSize.width.toString() );
-	buffer.push( ' ' );
-	buffer.push( options.canvasSize.height.toString() );
-	buffer.push( '"' );
-	
-	buffer.push( ' xmlns="http://www.w3.org/2000/svg">' + nl );
-
-	buffer.push( indent + '<defs>' + nl );
-	buffer.push( indent + '<style>' + nl);
-
-	buffer.push( indent + indent + ' .Vertex { fill : blue; stroke : none; } ' + nl );
-	buffer.push( indent + indent + ' .Triangle { fill : none; stroke : turquoise; stroke-width : 1px; } ' + nl );
-	buffer.push( indent + indent + ' .Polygon { fill : none; stroke : green; stroke-width : 2px; } ' + nl );
-	buffer.push( indent + indent + ' .BezierPath { fill : none; stroke : blue; stroke-width : 2px; } ' + nl );
-	buffer.push( indent + indent + ' .VEllipse { fill : none; stroke : black; stroke-width : 1px; } ' + nl );
-	buffer.push( indent + indent + ' .Line { fill : none; stroke : purple; stroke-width : 1px; } ' + nl );
-	buffer.push( indent + indent + ' .Circle { fill : none; stroke : purple; stroke-width : 1px; } ' + nl );
-	buffer.push( indent + indent + ' .CircleSector { fill : none; stroke : purple; stroke-width : 1px; } ' + nl );
-	buffer.push( indent + '</style>' + nl );
-	buffer.push( indent + '</defs>' + nl );
-
-	buffer.push( indent + '<g class="main-g"' );
-	if( options.zoom || options.offset ) {
-	    buffer.push( ' transform="' );
-	    if( options.zoom )
-		buffer.push( 'scale(' + options.zoom.x + ',' + options.zoom.y + ')' );
-	    if( options.offset )
-		buffer.push( ' translate(' + options.offset.x + ',' + options.offset.y + ')' );
-	    buffer.push( '"' ); 
-	}
-	buffer.push( '>' + nl );
-	
-	for( var i in drawables ) {
-	    var d : SVGSerializable = drawables[i];
-	    if( typeof d.toSVGString == 'function' ) {
-		buffer.push( indent + indent );
-		buffer.push( d.toSVGString( { 'className' : d.className } ) );
-		buffer.push( nl );
-	    } else {
-		console.warn( 'Unrecognized drawable type has no toSVGString()-function. Ignoring: ' + d.className );
-	    }
-	}
-	buffer.push( indent + '</g>' + nl );
-	buffer.push( '</svg>' + nl );
-	return buffer.join('');
-    };
-}