plotboilerplate 1.23.0 → 1.23.2

package/README.md

@@ -304,7 +304,7 @@ var pb = new PlotBoilerplate({
 
   // string
   //   A background color (CSS string) for the canvas.
-  backgroundColor: "#ffffff",
+  backgroundColor: isDarkmode ? "#000000" : "#ffffff",
 
   // boolean
   //   Switch auto-redrawing on resize on/off (some applications

package/dist/index.esm.js

@@ -4711,7 +4711,8 @@ CircleSector.circleSectorUtils = {
  * @modified 2023-10-04 Adding `strokeOptions` param to these draw function: line, arrow, cubicBezierArrow, cubicBezier, cubicBezierPath, circle, circleArc, ellipse, square, rect, polygon, polyline.
  * @modified 2024-01-30 Fixing an issue with immutable style sets; changes to the global draw config did not reflect here (do now).
  * @modified 2024-03-10 Fixing some types for Typescript 5 compatibility.
- * @version  1.6.9
+ * @modified 2024-07-24 Caching custom style defs in a private buffer variable.
+ * @version  1.6.10
  **/
 const RAD_TO_DEG = 180 / Math.PI;
 /**
@@ -4819,6 +4820,13 @@ class drawutilssvg {
                 console.warn(`Warning: your draw config is missing the key '${k}' which is required.`);
             }
         }
+        if (this.customStyleDefs) {
+            rules.push("\n/* Custom styles */\n");
+            this.customStyleDefs.forEach((value, key) => {
+                rules.push(key + " { " + value + " }");
+            });
+            // this.nodeStyle.innerHTML += "\n/* Custom styles */\n" + rules.join("\n");
+        }
         this.nodeStyle.innerHTML = rules.join("\n");
     }
     /**
@@ -4842,11 +4850,7 @@ class drawutilssvg {
      * @param {Map<string,string>} defs
      */
     addCustomStyleDefs(defs) {
-        const buffer = [];
-        defs.forEach((value, key) => {
-            buffer.push(key + " { " + value + " }");
-        });
-        this.nodeStyle.innerHTML += "\n/* Custom styles */\n" + buffer.join("\n");
+        this.customStyleDefs = defs;
     }
     /**
      * Retieve an old (cached) element.
@@ -10892,7 +10896,10 @@ VEllipseSector.ellipseSectorUtils = {
  * @modified 2023-02-10 Cleaning up most type errors in the main class (mostly null checks).
  * @modified 2023-02-10 Adding `enableZoom` and `enablePan` (both default true) to have the option to disable these functions.
  * @modified 2023-09-29 Adding proper dicionary key and value types to the params of `PlotBoilerplate.utils.safeMergeByKeys` (was `object` before).
- * @version  1.17.3
+ * @modified 2024-07-08 Adding `PlotBoilerplate.getGUI()` to retrieve the GUI instance.
+ * @modified 2024-08-25 Extending main class `PlotBoilerplate` optional param `isBackdropFiltersEnabled`.
+ *
+ * @version  1.19.0
  *
  * @file PlotBoilerplate
  * @fileoverview The main class.
@@ -11005,6 +11012,10 @@ class PlotBoilerplate {
          * @private
          */
         this.renderTime = 0;
+        /**
+         * A storage variable for retrieving the GUI instance once it was created.
+         */
+        this._gui = null;
         // This should be in some static block ...
         VertexAttr.model = {
             bezierAutoAdjust: false,
@@ -11071,7 +11082,8 @@ class PlotBoilerplate {
             enableZoom: f.bool(config, "enableZoom", true), // default=true
             enablePan: f.bool(config, "enablePan", true), // default=true
             // Experimental (and unfinished)
-            enableGL: f.bool(config, "enableGL", false)
+            enableGL: f.bool(config, "enableGL", false),
+            isBackdropFiltersEnabled: f.bool(config, "isBackdropFiltersEnabled", true)
         }; // END confog
         /**
          * Configuration for drawing things.
@@ -12547,7 +12559,8 @@ class PlotBoilerplate {
                 return { x: pos.x - bounds.left, y: pos.y - bounds.top };
             };
             // Make PB work together with both, AlloyFinger as a esm module or a commonjs function.
-            if (typeof globalThis["AlloyFinger"] === "function" || typeof globalThis["createAlloyFinger"] === "function") {
+            if (typeof globalThis["AlloyFinger"] === "function" ||
+                typeof globalThis["createAlloyFinger"] === "function") {
                 try {
                     var touchMovePos = null;
                     var touchDownPos = null;
@@ -12746,12 +12759,20 @@ class PlotBoilerplate {
         // if (globalThis["utils"] && typeof globalThis["utils"].createGUI == "function") {
         //   return (globalThis["utils" as keyof Object] as any as ({createGUI : (pb:PlotBoilerplate,props:DatGuiProps|undefined)=>GUI })).createGUI(this, props);
         if (utils && typeof utils.createGUI === "function") {
-            return utils.createGUI(this, props);
+            return (this._gui = utils.createGUI(this, props));
         }
         else {
-            throw "Cannot create dat.GUI instance; did you load the ./utils/creategui helper function an the dat.GUI library?";
+            throw "Cannot create dat.GUI or lil-gui instance; did you load the ./utils/creategui helper function an the dat.GUI/lil-gui library?";
         }
     }
+    /**
+     * Retriebe the GUI once it was created. If the `createGUI` method was not called or failed to create any
+     * GUI then null is returned.
+     * @returns {GUI | null}
+     */
+    getGUI() {
+        return this._gui;
+    }
 } // END class PlotBoilerplate
 /** @constant {number} */
 PlotBoilerplate.DEFAULT_CANVAS_WIDTH = 1024;