Tweaks

amd/src/simpleline.js

@@ -1,8 +1,12 @@
 /*eslint no-console: "off"*/
 /*eslint no-trailing-spaces: "off"*/
+
+
+
+
 /**
  * Copies defined properties in to, over from the from object. Does so recursively
- * Ysed to copy user defined parameters onto a pre-existing object with defaults preset.
+ * Used to copy user defined parameters onto a pre-existing object with defaults preset.
  * @param {Object} to The object to copy to
  * @param {Object} from The object tp copy from (but only the properties already named in "to")
  */
@@ -70,30 +74,19 @@ const getElementPosition = (el, reference) => {
 export class SimpleLine {
     static idCounter = 0;
 
-    constructor(start, end, specs){
+    /**
+     * Create a new line object
+     * 
+     * @param {HTMLElement|string} start The element the line starts from
+     * @param {HTMLElement|string} end The element the line ends at
+     * @param {object} config Configuration for the 
+     * @returns {SimpleLine} object
+     */
+    constructor(start, end, config){
         this.svg = null;
         this.id = SimpleLine.idCounter++;
 
-        // setup defaults
-        this.specs = {
-            autorefresh: 10,
-            class: "",
-            anchors: {
-                // top, middle, bottom
-                // left, center, right
-                start: ["middle","right"],
-                end: ["middle", "left"],
-            },
-            gravity: {
-                start: 1,
-                end: 1,
-            },
-            stroke: "4px",
-        };
-
-        if(specs && typeof specs == "object"){
-            specsCopy(this.specs,specs);
-        }
+        this.setConfig(config);
         // Validate start element
         if(start instanceof HTMLElement) {
             this.start = start;
@@ -138,6 +131,60 @@ export class SimpleLine {
         this.update(); // fist draw
     }
 
+    /**
+     * Change the simpleline config
+     * @param {object} config The object containing the specs 
+     */
+    setConfig(config){
+        // setup defaults
+        if(!(this.specs)){
+            this.specs = {
+                autorefresh: 10,
+                class: "",
+                anchors: {
+                    // top, middle, bottom
+                    // left, center, right
+                    start: ["middle","right"],
+                    end: ["middle", "left"],
+                },
+                gravity: {
+                    start: 1,
+                    end: 1,
+                },
+                stroke: "4px",
+            };
+        }
+
+        if(config && typeof config == "object"){
+            specsCopy(this.specs,config);
+        }
+        if(this.svg){
+            // Re-initialize the refresh timer
+            clearInterval(this.refreshTimer);
+            if(this.specs.autorefresh > 0){
+                this.refreshTimer = setInterval(()=>{this.positionCheck();},this.specs.autorefresh);
+            }
+            // Update the svg image
+            this.update();
+        }
+    }
+
+    /**
+     * Get the css class of the line
+     */
+    get cssClass(){
+        return this.specs.class;
+    }
+
+    /**
+     * Set the css class of the line
+     */
+    set cssClass(cssClass)
+    {
+        this.specs.class = cssClass;
+        this.update();
+    }
+
     positionCheck(){
         const startPos = {x: this.start.offsetLeft, y: this.start.offsetTop};
         const endPos = {x: this.end.offsetLeft, y: this.end.offsetTop};