plotboilerplate 1.20.0 → 1.20.2

package/src/ts/drawutilssvg.ts

@@ -35,7 +35,9 @@
  * @modified 2022-03-26 Added the `texturedPoly` function to draw textures polygons.
  * @modified 2022-07-26 Adding `alpha` to the `image(...)` function.
  * @modified 2022-11-10 Tweaking some type issues.
- * @version  1.6.2
+ * @modified 2023-02-04 Fixed a typo in the CSS classname for cubic Bézier paths: cubicBezier (was cubierBezier).
+ * @modified 2023-02-10 The methods `setCurrentClassName` and `setCurrentId` also accept `null` now.
+ * @version  1.6.4
  **/
 
 import { CircleSector } from "./CircleSector";
@@ -163,16 +165,16 @@ export class drawutilssvg implements DrawLib<void | SVGElement> {
   /**
    * The current drawable-ID. This can be any unique ID identifying the following drawn element.
    *
-   * @member {UID|undefined}
+   * @member {UID|null}
    * @memberof drawutilssvg
    * @instance
    */
-  private curId: UID | undefined;
+  private curId: UID | null;
 
   /**
    * The current drawable-classname.
    */
-  private curClassName: string | undefined;
+  private curClassName: string | null;
 
   /**
    * The SVG element cache. On clear() all elements are kept for possible re-use on next draw cycle.
@@ -215,7 +217,7 @@ export class drawutilssvg implements DrawLib<void | SVGElement> {
     this.offset = new Vertex(0, 0).set(offset);
     this.scale = new Vertex(1, 1).set(scale);
     this.fillShapes = fillShapes;
-    this.isSecondary = isSecondary;
+    this.isSecondary = Boolean(isSecondary);
 
     this.drawlibConfiguration = {} as DrawLibConfiguration;
     this.cache = new Map<UID, SVGElement>();
@@ -247,6 +249,8 @@ export class drawutilssvg implements DrawLib<void | SVGElement> {
     // Which default styles to add? -> All from the DrawConfig.
     // Compare with DrawConfig interface
     const keys = {
+      // "bezier": "CubicBezierCurve", // TODO: is this correct?
+      "bezierPath": "BezierPath",
       "polygon": "Polygon",
       "triangle": "Triangle",
       "ellipse": "Ellipse",
@@ -313,8 +317,11 @@ export class drawutilssvg implements DrawLib<void | SVGElement> {
    * @param {UID} key - The key of the desired element (used when re-drawing).
    * @param {string} nodeName - The expected node name.
    */
-  private findElement(key: UID, nodeName: string): SVGElement | undefined {
-    var node: SVGElement = this.cache.get(key);
+  private findElement(key: UID | null, nodeName: string): SVGElement | null {
+    if (!key) {
+      return null;
+    }
+    var node: SVGElement | undefined = this.cache.get(key);
     if (node && node.nodeName.toUpperCase() === nodeName.toUpperCase()) {
       this.cache.delete(key);
       return node;
@@ -353,7 +360,7 @@ export class drawutilssvg implements DrawLib<void | SVGElement> {
     // Unique node keys are strictly necessary.
 
     // Try to recycle an old element from cache.
-    var node: SVGElement | undefined = this.findElement(this.curId, nodeName);
+    var node: SVGElement | null = this.findElement(this.curId, nodeName);
     if (!node) {
       // If no such old elements exists (key not found, tag name not matching),
       // then create a new one.
@@ -391,8 +398,8 @@ export class drawutilssvg implements DrawLib<void | SVGElement> {
     } else {
       node.setAttribute("class", className);
     }
-    node.setAttribute("fill", this.fillShapes ? color : "none");
-    node.setAttribute("stroke", this.fillShapes ? "none" : color);
+    node.setAttribute("fill", this.fillShapes && color ? color : "none");
+    node.setAttribute("stroke", this.fillShapes ? "none" : color || "none");
     node.setAttribute("stroke-width", `${lineWidth || 1}`);
     if (this.curId) {
       node.setAttribute("id", `${this.curId}`); // Maybe React-style 'key' would be better?
@@ -457,11 +464,11 @@ export class drawutilssvg implements DrawLib<void | SVGElement> {
    *
    * @name setCurrentId
    * @method
-   * @param {UID} uid - A UID identifying the currently drawn element(s).
+   * @param {UID|null} uid - A UID identifying the currently drawn element(s).
    * @instance
    * @memberof drawutilssvg
    **/
-  setCurrentId(uid: UID | undefined): void {
+  setCurrentId(uid: UID | null): void {
     this.curId = uid;
   }
 
@@ -471,11 +478,11 @@ export class drawutilssvg implements DrawLib<void | SVGElement> {
    *
    * @name setCurrentClassName
    * @method
-   * @param {string} className - A class name for further custom use cases.
+   * @param {string|null} className - A class name for further custom use cases.
    * @instance
    * @memberof drawutilssvg
    **/
-  setCurrentClassName(className: string | undefined): void {
+  setCurrentClassName(className: string | null): void {
     this.curClassName = className;
   }
 
@@ -498,7 +505,7 @@ export class drawutilssvg implements DrawLib<void | SVGElement> {
       // Hide all nodes here. Don't throw them away.
       // We can probably re-use them in the next draw cycle.
       var child: SVGElement = this.bufferGNode.childNodes[i] as SVGElement;
-      this.cache.set(child.getAttribute("id"), child);
+      this.cache.set(child.getAttribute("id") as string, child);
     }
     this.removeAllChildNodes();
   }
@@ -763,7 +770,7 @@ export class drawutilssvg implements DrawLib<void | SVGElement> {
       this._y(endPoint.y)
     ];
     node.setAttribute("d", d.join(" "));
-    return this._bindFillDraw(node, "cubierBezier", color, lineWidth);
+    return this._bindFillDraw(node, "cubicBezier", color, lineWidth);
   }
 
   /**

package/src/ts/interfaces/DrawLib.ts

@@ -18,6 +18,7 @@
  * @modified 2022-02-03 Added the `lineWidth` param to the `crosshair` function.
  * @modified 2022-02-03 Added the `cross(...)` function.
  * @modified 2022-07-26 Adding `alpha` to the `image(...)` function.
+ * @modified 2023-02-10 The methods `setCurrentClassName` and `setCurrentId` also accept `null` now.
  **/
 
 import { Bounds } from "../Bounds";
@@ -79,7 +80,7 @@ export interface DrawLib<R> {
    * @method
    * @param {UID|null} uid - A UID identifying the currently drawn element(s), or null to clear.
    **/
-  setCurrentId: (uid: UID | undefined) => void;
+  setCurrentId: (uid: UID | null) => void;
 
   /**
    * This method shouled be called each time the currently drawn `Drawable` changes.
@@ -87,9 +88,9 @@ export interface DrawLib<R> {
    *
    * @name setCurrentClassName
    * @method
-   * @param {string} className - A class name for further custom use cases.
+   * @param {string|null} className - A class name for further custom use cases.
    **/
-  setCurrentClassName: (className: string | undefined) => void;
+  setCurrentClassName: (className: string | null) => void;
 
   /**
    * Called before each draw cycle.

package/src/ts/interfaces/core.ts

@@ -17,6 +17,7 @@
  * @modified 2022-08-01 Added `title` param to the `PBParams` interface.
  * @modified 2022-10-25 Added `origin` param to the `DrawConfig` interface.
  * @modified 2022-11-23 Added `drawRaster` to the `Config` interface.
+ * @modified 2023-02-10 All non-function attributes of the `Config` interface are now mandatory.
  **/
 
 import { Vertex } from "../Vertex";
@@ -102,40 +103,40 @@ export interface CanvasWrapper {
  */
 export interface Config {
   canvas: HTMLCanvasElement | string; //  Your canvas element in the DOM (required).
-  fullSize?: boolean; // If set to true the canvas will gain full window size.
-  fitToParent?: boolean; // If set to true the canvas will gain the size of its parent container (overrides fullSize).
-  scaleX?: number; // The initial x-zoom. Default is 1.0.
-  scaleY?: number; // The initial y-zoom. Default is 1.0.
-  offsetX?: number; // The initial x-offset. Default is 0.0. Note that autoAdjustOffset=true overrides these values.
-  offsetY?: number; // The initial y-offset. Default is 0.0. Note that autoAdjustOffset=true overrides these values.
-  rasterGrid?: boolean; // If set to true the background grid will be drawn rastered.
-  drawRaster?: boolean; // If set to false, no raster or grid will be drawn at all.
-  rasterScaleX?: number; // Define the default horizontal raster scale (default=1.0).
-  rasterScaleY?: number; // Define the default vertical raster scale (default=1.0).
-  rasterAdjustFactor?: number; // The exponential limit for wrapping down the grid. (2.0 means: halve the grid each 2.0*n zoom step).
-  drawOrigin?: boolean; // Draw a crosshair at (0,0).
-  autoAdjustOffset?: boolean; //  When set to true then the origin of the XY plane will
+  fullSize: boolean; // If set to true the canvas will gain full window size.
+  fitToParent: boolean; // If set to true the canvas will gain the size of its parent container (overrides fullSize).
+  scaleX: number; // The initial x-zoom. Default is 1.0.
+  scaleY: number; // The initial y-zoom. Default is 1.0.
+  offsetX: number; // The initial x-offset. Default is 0.0. Note that autoAdjustOffset=true overrides these values.
+  offsetY: number; // The initial y-offset. Default is 0.0. Note that autoAdjustOffset=true overrides these values.
+  rasterGrid: boolean; // If set to true the background grid will be drawn rastered.
+  drawRaster: boolean; // If set to false, no raster or grid will be drawn at all.
+  rasterScaleX: number; // Define the default horizontal raster scale (default=1.0).
+  rasterScaleY: number; // Define the default vertical raster scale (default=1.0).
+  rasterAdjustFactor: number; // The exponential limit for wrapping down the grid. (2.0 means: halve the grid each 2.0*n zoom step).
+  drawOrigin: boolean; // Draw a crosshair at (0,0).
+  autoAdjustOffset: boolean; //  When set to true then the origin of the XY plane will
   // be re-adjusted automatically (see the params
   // offsetAdjust{X,Y}Percent for more).
-  offsetAdjustXPercent?: number; // The x-fallback position for the origin after
+  offsetAdjustXPercent: number; // The x-fallback position for the origin after
   // resizing the canvas.
-  offsetAdjustYPercent?: number; // The y-fallback position for the origin after
+  offsetAdjustYPercent: number; // The y-fallback position for the origin after
   // resizing the canvas.
-  defaultCanvasWidth?: number; //  The canvas size fallback (width) if no automatic resizing
+  defaultCanvasWidth: number; //  The canvas size fallback (width) if no automatic resizing
   // is switched on.
-  defaultCanvasHeight?: number; //  The canvas size fallback (height) if no automatic resizing
+  defaultCanvasHeight: number; //  The canvas size fallback (height) if no automatic resizing
   // is switched on.
-  canvasWidthFactor?: number; // Scaling factor (width) upon the canvas size.
+  canvasWidthFactor: number; // Scaling factor (width) upon the canvas size.
   // In combination with cssScale{X,Y} this can be used to obtain
   // sub pixel resolutions for retina displays.
-  canvasHeightFactor?: number; // Scaling factor (height) upon the canvas size.
+  canvasHeightFactor: number; // Scaling factor (height) upon the canvas size.
   // In combination with cssScale{X,Y} this can be used to obtain
   // sub pixel resolutions for retina displays.
-  cssScaleX?: number; // Visually resize the canvas (horizontally) using CSS transforms (scale).
-  cssScaleY?: number; // Visually resize the canvas (vertically) using CSS transforms (scale).
-  cssUniformScale?: boolean; // CSS scale x and y obtaining aspect ratio.
-  backgroundColor?: string; // The backround color.
-  redrawOnResize?: boolean; //  Switch auto-redrawing on resize on/off (some applications
+  cssScaleX: number; // Visually resize the canvas (horizontally) using CSS transforms (scale).
+  cssScaleY: number; // Visually resize the canvas (vertically) using CSS transforms (scale).
+  cssUniformScale: boolean; // CSS scale x and y obtaining aspect ratio.
+  backgroundColor: string; // The backround color.
+  redrawOnResize: boolean; //  Switch auto-redrawing on resize on/off (some applications
   // might want to prevent automatic redrawing to avoid data loss from the draw buffer).
   preClear?: () => void; // A callback function that will be triggered just before the
   //    draw function clears the canvas (before anything else was drawn).
@@ -143,17 +144,19 @@ export interface Config {
   //    function starts.
   postDraw?: (draw: DrawLib<any>, fill: DrawLib<any>) => void; // A callback function that will be triggered right after the drawing
   //   process finished.
-  enableMouse?: boolean; // Indicates if the application should handle mouse events for you.
-  enableTouch?: boolean; // Indicates if the application should handle touch events for you.
-  enableKeys?: boolean; // Indicates if the application should handle key events for you.
-  enableMouseWheel?: boolean; // Indicates if the application should handle mouse wheel events for you.
+  enableMouse: boolean; // Indicates if the application should handle mouse events for you.
+  enableTouch: boolean; // Indicates if the application should handle touch events for you.
+  enableKeys: boolean; // Indicates if the application should handle key events for you.
+  enableMouseWheel: boolean; // Indicates if the application should handle mouse wheel events for you.
+  enableZoom: boolean; // default=true
+  enablePan: boolean; // default=true
   enableGL?: boolean; // Indicates if the application should use the experimental WebGL features (not recommended).
-  enableSVGExport?: boolean; // Indicates if the SVG export should be enabled (default is true).
+  enableSVGExport: boolean; // 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.
   saveFile?: () => void; // When called the save-file dialog will be triggered.
   setToRetina?: () => void; // When called the resolution will be set to retina.
 
-  autoDetectRetina?: boolean; // When set to true (default) the canvas will try to use the display's pixel ratio.
+  autoDetectRetina: boolean; // When set to true (default) the canvas will try to use the display's pixel ratio.
 }
 
 /**

package/src/ts/utils/datastructures/Color.ts

@@ -16,7 +16,8 @@
  * @modified 2021-11-07 Added setRed, setGreen, setBlue, setHue, setSaturation, setLiminance functions.
  * @modified 2022-05-11 Modified the `clone` function by just copying the numeric calues, not re-calculating the whole color.
  * @modified 2022-05-11 Fixed the `interpolate` function.
- * @version 0.0.11
+ * @modified 2023-01-23 Added `Color.set(Color)` function to set all values (r,g,b,h,s,l,a) simultanoeusly.
+ * @version 0.0.12
  **/
 
 /**
@@ -155,6 +156,17 @@ export class Color {
     return this.b;
   }
 
+  set(color: Color): Color {
+    this.r = color.r;
+    this.g = color.g;
+    this.b = color.b;
+    this.a = color.a;
+    this.h = color.h;
+    this.s = color.s;
+    this.l = color.l;
+    return this;
+  }
+
   setRed(r: number) {
     this.r = r;
     return this;