plotboilerplate 1.15.0 → 1.17.1

package/src/ts/PBImage.ts

@@ -4,20 +4,20 @@
  * @modified 2019-03-23 Added JSDoc tags.
  * @modified 2020-03-25 Ported this class from vanilla-JS to Typescript.
  * @modified 2021-01-20 Added UID.
- * @version 1.1.0
+ * @modified 2022-02-02 Added the `destroy` method.
+ * @modified 2022-02-02 Cleared the `PBImage.toSVGString` function (deprecated). Use `drawutilssvg` instead.
+ * @version 1.2.0
  *
  * @file PBImage
- * @fileoverview As native Image objects have only a position and with 
+ * @fileoverview As native Image objects have only a position and with
  *               and height thei are not suitable for UI dragging interfaces.
  * @public
  **/
 
-
 import { Vertex } from "./Vertex";
 import { UIDGenerator } from "./UIDGenerator";
 import { SVGSerializable, UID } from "./interfaces";
 
-
 /**
  * @classdesc A wrapper for image objects. Has an upper left and a lower right corner point.
  *
@@ -27,76 +27,74 @@ import { SVGSerializable, UID } from "./interfaces";
  * @requires UIDGenerator
  */
 export class PBImage implements SVGSerializable {
+  /**
+   * Required to generate proper CSS classes and other class related IDs.
+   **/
+  readonly className: string = "PBImage";
 
+  /**
+   * The UID of this drawable object.
+   *
+   * @member {UID}
+   * @memberof PBImage
+   * @instance
+   * @readonly
+   */
+  readonly uid: UID;
 
-    /**
-     * Required to generate proper CSS classes and other class related IDs.
-     **/
-    readonly className : string = "PBImage";
-
+  /**
+   * @member {Vertex}
+   * @memberof PBImage
+   * @instance
+   */
+  image: HTMLImageElement;
 
-    /**
-     * The UID of this drawable object.
-     *
-     * @member {UID}
-     * @memberof PBImage
-     * @instance
-     * @readonly 
-     */
-    readonly uid : UID;
-    
+  /**
+   * @member {Vertex}
+   * @memberof PBImage
+   * @instance
+   */
+  upperLeft: Vertex;
 
-    /** 
-     * @member {Vertex} 
-     * @memberof PBImage
-     * @instance
-     */
-    image:HTMLImageElement;
+  /**
+   * @member {Vertex}
+   * @memberof PBImage
+   * @instance
+   */
+  lowerRight: Vertex;
 
-    /** 
-     * @member {Vertex} 
-     * @memberof PBImage
-     * @instance
-     */
-    upperLeft:Vertex;
+  /**
+   * @member isDestroyed
+   * @memberof PBImage
+   * @type {boolean}
+   * @instance
+   */
+  isDestroyed: boolean;
 
-    /** 
-     * @member {Vertex} 
-     * @memberof PBImage
-     * @instance
-     */
-    lowerRight:Vertex;
-    
-    
-    /**
-     * The constructor.
-     * 
-     * @constructor
-     * @name PBImage
-     * @param {Image} image - The actual image.
-     * @param {Vertex} upperLeft - The upper left corner.
-     * @param {Vertex} lowerRight - The lower right corner.
-     **/
-    constructor( image:HTMLImageElement, upperLeft:Vertex, lowerRight:Vertex ) {
-	this.uid = UIDGenerator.next();
-	this.image = image;
-	this.upperLeft = upperLeft;
-	this.lowerRight = lowerRight;
-    };
+  /**
+   * The constructor.
+   *
+   * @constructor
+   * @name PBImage
+   * @param {Image} image - The actual image.
+   * @param {Vertex} upperLeft - The upper left corner.
+   * @param {Vertex} lowerRight - The lower right corner.
+   **/
+  constructor(image: HTMLImageElement, upperLeft: Vertex, lowerRight: Vertex) {
+    this.uid = UIDGenerator.next();
+    this.image = image;
+    this.upperLeft = upperLeft;
+    this.lowerRight = lowerRight;
+  }
 
-    
-    /**
-     * Convert this vertex to SVG code.
-     *
-     * @deprecated DEPRECATION Please use the drawutilssvg library and an XMLSerializer instead.
-     * @method toSVGString
-     * @param {object=} options - An optional set of options, like 'className'.
-     * @return {string} A string representing the SVG code for this vertex.
-     * @instance
-     * @memberof PBImage
-     **/
-    toSVGString( options:{ className?:string } ) : string {
-	console.warn( "PBImage is not yet SVG serializable. Returning empty SVG string." );
-	return "";
-    };
+  /**
+   * This function should invalidate any installed listeners and invalidate this object.
+   * After calling this function the object might not hold valid data any more and
+   * should not be used.
+   */
+  destroy() {
+    this.upperLeft.destroy();
+    this.lowerRight.destroy();
+    this.isDestroyed = true;
+  }
 }

package/src/ts/PBText.ts

@@ -1,7 +1,8 @@
 /**
  * @author   Ikaros Kappler
  * @date     2021-11-16
- * @version  1.0.0
+ * @modified 2022-02-02 Added the `destroy` method.
+ * @version  1.1.0
  **/
 
 import { UIDGenerator } from "./UIDGenerator";
@@ -106,6 +107,14 @@ export class PBText implements SVGSerializable, FontOptions {
    */
   color: string | undefined;
 
+  /**
+   * @member isDestroyed
+   * @memberof PBText
+   * @type {boolean}
+   * @instance
+   */
+  isDestroyed: boolean;
+
   /**
    * Create a new circle with given center point and radius.
    *
@@ -129,19 +138,12 @@ export class PBText implements SVGSerializable, FontOptions {
   }
 
   /**
-   * Create an SVG representation of this circle.
-   *
-   * @deprecated DEPRECATION Please use the drawutilssvg library and an XMLSerializer instead.
-   * @method toSVGString
-   * @param {object=} options - An optional set of options, like 'className'.
-   * @return {string} A string representing the SVG code for this vertex.
-   * @instance
-   * @memberof Circle
+   * This function should invalidate any installed listeners and invalidate this object.
+   * After calling this function the object might not hold valid data any more and
+   * should not be used.
    */
-  toSVGString(options: { className?: string }) {
-    console.warn(
-      "[PBText.toSVGString()] This function is not implemented as it defines a deprecated method. Use the 'drawutilssvg.text()' method instead."
-    );
-    return "";
+  destroy() {
+    this.anchor.destroy();
+    this.isDestroyed = true;
   }
 } // END class

package/src/ts/PlotBoilerplate.ts

@@ -74,7 +74,8 @@
  * @modified 2021-03-29 Clearing `currentClassName` and `currentId` after drawing each drawable.
  * @modified 2021-04-25 Extending `remove` to accept arrays of drawables.
  * @modified 2021-11-16 Adding the `PBText` drawable.
- * @version  1.15.0
+ * @modified 2022-08-01 Added `title` to the params.
+ * @version  1.15.1
  *
  * @file PlotBoilerplate
  * @fileoverview The main class.
@@ -376,6 +377,7 @@ export class PlotBoilerplate {
    * @param {boolean=} [config.enableGL=false] - Indicates if the application should use the experimental WebGL features (not recommended).
    * @param {boolean=} [config.enableSVGExport=true] - Indicates if the SVG export should be enabled (default is true).
    *                                                   Note that changes from the postDraw hook might not be visible in the export.
+   * @param {string=} [config.title=null] - Specify any hover tile here. It will be attached as a `title` attribute to the most elevated element.
    */
   constructor(config: PBParams) {
     // This should be in some static block ...
@@ -592,6 +594,11 @@ export class PlotBoilerplate {
     } else {
       throw "Element is neither a canvas nor an svg element.";
     }
+    // At this point the event cacher element is deinfed and located at highest elevation.
+    // Set `title` attribut?
+    if (config.title) {
+      this.eventCatcher.setAttribute("title", config.title);
+    }
     this.draw.scale.set(this.config.scaleX, this.config.scaleY);
     this.fill.scale.set(this.config.scaleX, this.config.scaleY);
     this.vertices = [];
@@ -897,7 +904,7 @@ export class PlotBoilerplate {
       }
     }
     for (var i = 0; i < this.drawables.length; i++) {
-      if (this.drawables[i] === drawable) {
+      if (this.drawables[i] === drawable || this.drawables[i].uid === drawable.uid) {
         this.drawables.splice(i, 1);
 
         if (removeWithVertices) {

package/src/ts/Polygon.ts

@@ -21,7 +21,10 @@
  * @modified 2021-01-29 Changed the param type for `containsVert` from Vertex to XYCoords.
  * @modified 2021-12-14 Added the `perimeter()` function.
  * @modified 2021-12-16 Added the `getEvenDistributionPolygon()` function.
- * @version 1.8.0
+ * @modified 2022-02-02 Added the `destroy` method.
+ * @modified 2022-02-02 Cleared the `Polygon.toSVGString` function (deprecated). Use `drawutilssvg` instead.
+ * @modified 2022-03-08 Added the `Polygon.clone()` function.
+ * @version 1.10.0
  *
  * @file Polygon
  * @public
@@ -76,6 +79,14 @@ export class Polygon implements SVGSerializable {
    */
   isOpen: boolean;
 
+  /**
+   * @member isDestroyed
+   * @memberof Polygon
+   * @type {boolean}
+   * @instance
+   */
+  isDestroyed: boolean;
+
   /**
    * The constructor.
    *
@@ -133,9 +144,9 @@ export class Polygon implements SVGSerializable {
    * @memberof Polygon
    * @return {Polygon} this for chaining
    **/
-  move(vert: XYCoords): Polygon {
+  move(amount: XYCoords): Polygon {
     for (var i in this.vertices) {
-      this.vertices[i].add(vert);
+      this.vertices[i].add(amount);
     }
     return this;
   }
@@ -326,6 +337,18 @@ export class Polygon implements SVGSerializable {
     return Bounds.computeFromVertices(this.vertices);
   }
 
+  /**
+   * Create a deep copy of this polygon.
+   *
+   * @return {Polygon} The cloned polygon.
+   */
+  clone(): Polygon {
+    return new Polygon(
+      this.vertices.map(vert => vert.clone()),
+      this.isOpen
+    );
+  }
+
   /**
    * Convert this polygon to a sequence of quadratic Bézier curves.<br>
    * <br>
@@ -470,38 +493,15 @@ export class Polygon implements SVGSerializable {
   }
 
   /**
-   * Create an SVG representation of this polygon.
-   *
-   * @deprecated DEPRECATION Please use the drawutilssvg library and an XMLSerializer instead.
-   * @method toSVGString
-   * @param {object=} options - An optional set of options, like 'className'.
-   * @return {string} The SVG string.
-   * @instance
-   * @memberof Polygon
-   **/
-  toSVGString(options: { className?: string } | undefined): string {
-    options = options || {};
-    var buffer: Array<string> = [];
-    buffer.push("<path");
-    if (options.className) buffer.push(' class="' + options.className + '"');
-    buffer.push(' d="');
-    if (this.vertices.length > 0) {
-      buffer.push("M ");
-      buffer.push(this.vertices[0].x.toString());
-      buffer.push(" ");
-      buffer.push(this.vertices[0].y.toString());
-      for (var i = 1; i < this.vertices.length; i++) {
-        buffer.push(" L ");
-        buffer.push(this.vertices[i].x.toString());
-        buffer.push(" ");
-        buffer.push(this.vertices[i].y.toString());
-      }
-      if (!this.isOpen) {
-        buffer.push(" Z");
-      }
+   * This function should invalidate any installed listeners and invalidate this object.
+   * After calling this function the object might not hold valid data any more and
+   * should not be used.
+   */
+  destroy() {
+    for (var i = 0; i < this.vertices.length; i++) {
+      this.vertices[i].destroy();
     }
-    buffer.push('" />');
-    return buffer.join("");
+    this.isDestroyed = true;
   }
 
   static utils = {