Performance improvements:

- SVG symbolen worden nu enkel in de defs-sectie opgenomen als ze ook effectief worden gebruikt - De undoredo class vermijdt externe images telkens opnieuw op te slaan door gebruikt van een externe stringstore. Verbeteringen aan de user experience: - Aanpassingen aan de manier waarop switches tussen eendraadschema en situatieschema worden geregistreerd voor undo/redo alsook wijzigingen van actieve pagina in het situatieschema - Bij printen wordt de z-Index correct toegepast Refactoring: - Handige functie in Hierarchical_List om een Electro_Item te zoeken op basis van id. - Aanzienlijke refactoring in SituationPlanElement - Beperkte refactoring in SituationPlan Documentatie - introductie typedoc en eerste testen op SituationPlanElement en SituationPlan - typedoc output zal niet aan de repository worden toegevoegd maar kan wel gegenereerd worden met het bash-script makedoc
igoethal · Jan 5, 2025 · f3349b6 · f3349b6
1 parent 0e28091
commit f3349b6
Show file tree

Hide file tree

Showing 50 changed files with 1,929 additions and 847 deletions.
diff --git a/builddate.js b/builddate.js
@@ -1 +1 @@
-var CONF_builddate="20250101-192145"
+var CONF_builddate="20250105-150906"
diff --git a/eendraadschema.js b/eendraadschema.js
diff --git a/makedoc b/makedoc
@@ -0,0 +1,3 @@
+#!/usr/bin/bash
+
+npx typedoc --options typedoc.json
diff --git a/package.json b/package.json
@@ -1,5 +1,6 @@
 {
   "devDependencies": {
+    "typedoc": "^0.27.6",
     "typescript": "^5.6.2"
   },
   "dependencies": {

diff --git a/src/Hierarchical_List.ts b/src/Hierarchical_List.ts
@@ -16,6 +16,8 @@
       remove inactive members from the array.
     getOrdinalById(my_id: number) : number
       Returns the element in the array for a given ID
+    getElectroItemById(my_id: number) : Electro_Item
+        Returns the Electro_Item in the array for a given ID
     getNumChilds(parent_id: number) : number
       Returns the number of childs for a given parent ID
     getMaxNumChilds(parent_id: number) : number
@@ -164,13 +166,19 @@ class Hierarchical_List {
 
     // -- Plaats in de array zoeken op basis van de id --
 
-    getOrdinalById(my_id: number) : number {
+    getOrdinalById(my_id: number) : number | null {
         for (let i = 0; i<this.length; i++) {
             if (this.id[i]==my_id) return(i);
         }
         return null;
     }
 
+    getElectroItemById(my_id: number) : Electro_Item | null {
+        let ordinal = this.getOrdinalById(my_id);
+        if (ordinal !== null) return(this.data[ordinal] as Electro_Item);
+        return null;
+    }
+
     // -- Aantal actieve kinderen van id = parent_id --
 
     getNumChilds(parent_id: number) : number {

diff --git a/src/List_Item/Aansluiting.ts b/src/List_Item/Aansluiting.ts
@@ -114,6 +114,12 @@ class Aansluiting extends Electro_Item {
     toSVG() {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('zekering_automatisch');
+        SVGSymbols.addSymbol('zekering_empty');
+        SVGSymbols.addSymbol('arrow');
+        SVGSymbols.addSymbol('zekering_smelt');
+        SVGSymbols.addSymbol('elekriciteitsmeter');
+
         // Indien er een kabeltype vóór de teller is schuiven we alles op
         let extrashift = 0;
         if (this.props.type_kabel_voor_teller != "") extrashift += 50;

diff --git a/src/List_Item/Aansluitpunt.ts b/src/List_Item/Aansluitpunt.ts
@@ -24,6 +24,8 @@ class Aansluitpunt extends Electro_Item {
     toSVG(sitplan: boolean = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('aansluitpunt');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 29;
         mySVG.yup = 25;

diff --git a/src/List_Item/Aftakdoos.ts b/src/List_Item/Aftakdoos.ts
@@ -24,6 +24,8 @@ class Aftakdoos extends Electro_Item {
     toSVG(sitplan: boolean = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('aftakdoos');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 49;
         mySVG.yup = 25;

diff --git a/src/List_Item/Batterij.ts b/src/List_Item/Batterij.ts
@@ -25,6 +25,8 @@ class Batterij extends Electro_Item {
         let mySVG:SVGelement = new SVGelement();
         let outputstr:string = "";
 
+        SVGSymbols.addSymbol('batterij');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 59;
         mySVG.yup = 25;

diff --git a/src/List_Item/Bel.ts b/src/List_Item/Bel.ts
@@ -25,6 +25,8 @@ class Bel extends Electro_Item {
         let mySVG:SVGelement = new SVGelement();
         let outputstr:string = "";
 
+        SVGSymbols.addSymbol('bel');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 40;
         mySVG.yup = 25;

diff --git a/src/List_Item/Boiler.ts b/src/List_Item/Boiler.ts
@@ -36,9 +36,13 @@ class Boiler extends Electro_Item {
         mySVG.data = (sitplan? "" : '<line x1="1" y1="25" x2="21" y2="25" stroke="black"></line>');
         switch (this.props.heeft_accumulatie) { //accumulatie
             case false:
+                SVGSymbols.addSymbol('VerticalStripe');
+                SVGSymbols.addSymbol('boiler');
                 mySVG.data += '<use xlink:href="#boiler" x="21" y="25"></use>';
                 break;
             case true:
+                SVGSymbols.addSymbol('VerticalStripe');
+                SVGSymbols.addSymbol('boiler_accu');
                 mySVG.data += '<use xlink:href="#boiler_accu" x="21" y="25"></use>';
                 break;
           }

diff --git a/src/List_Item/Contactdoos.ts b/src/List_Item/Contactdoos.ts
@@ -55,6 +55,10 @@ class Contactdoos extends Electro_Item {
     toSVG(sitplan: boolean = false, mirrortext: boolean = false): SVGelement {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('contactdoos');
+        SVGSymbols.addSymbol('contactdoos_aarding');
+        SVGSymbols.addSymbol('contactdoos_kinderveilig');
+
         mySVG.xleft = 1; // Links voldoende ruimte voor een eventuele kring voorzien
         mySVG.xright = 20; // We starten met breedte 20 (leidings links) en vullen later aan in functie van wat moet getekend worden
         mySVG.yup = 25;

diff --git a/src/List_Item/Diepvriezer.ts b/src/List_Item/Diepvriezer.ts
@@ -24,6 +24,9 @@ class Diepvriezer extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('ster');
+        SVGSymbols.addSymbol('diepvriezer');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 60;
         mySVG.yup = 25;

diff --git a/src/List_Item/Domotica_gestuurde_verbruiker.ts b/src/List_Item/Domotica_gestuurde_verbruiker.ts
@@ -52,6 +52,12 @@ class Domotica_gestuurde_verbruiker extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('draadloos_klein');
+        SVGSymbols.addSymbol('drukknop_klein');
+        SVGSymbols.addSymbol('tijdschakelaar_klein');
+        SVGSymbols.addSymbol('detectie_klein');
+        SVGSymbols.addSymbol('schakelaar_klein');
+
         // Eerst de tekening van de aangestuurde verbruiker maken
 
         let childcounter = 0; // Variabele voor het aantal kinderen, op dit moment ondersteunt de tool slechts 1 kind

diff --git a/src/List_Item/Droogkast.ts b/src/List_Item/Droogkast.ts
@@ -24,6 +24,8 @@ class Droogkast extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('droogkast');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 59;
         mySVG.yup = 25;

diff --git a/src/List_Item/Drukknop.ts b/src/List_Item/Drukknop.ts
@@ -41,6 +41,8 @@ class Drukknop extends Electro_Item {
 
     toSVG(sitplan: boolean = false, mirrortext: boolean = false) {
         let mySVG:SVGelement = new SVGelement();
+
+        SVGSymbols.addSymbol('drukknop');
 
         mySVG.xleft = 1; // Links voldoende ruimte voor een eventuele kring voorzien
         mySVG.xright = 43; 

diff --git a/src/List_Item/EV_lader.ts b/src/List_Item/EV_lader.ts
@@ -24,6 +24,8 @@ class EV_lader extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('EVlader');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 60;
         mySVG.yup = 25;

diff --git a/src/List_Item/Electro_Item.ts b/src/List_Item/Electro_Item.ts
@@ -245,8 +245,8 @@ class Electro_Item extends List_Item {
    */
 
   toSituationPlanElement() {
-    let myElement = new SituationPlanElement(1,0,0,0,0,11,0,1,randomId("SP_"),"");
-    this.updateSituationPlanElement(myElement);
+    let myElement = new SituationPlanElement();
+    //this.updateSituationPlanElement(myElement); //Lijkt niet nodig aangezien dit zoiezo gebeurt in getScaledSVG bij iedere update
     return(myElement);
   }
 
@@ -256,6 +256,8 @@ class Electro_Item extends List_Item {
     let rotate = myElement.rotate % 360;
     if ( (rotate >= 90) && (rotate < 270) ) spiegeltext = true;
 
+    SVGSymbols.clearSymbols(); // We gaan enkel de symbolen gebruiken die nodig zijn voor dit element
+
     let mySVGElement:SVGelement = this.toSVG(true, spiegeltext);
     let sizex = mySVGElement.xright + mySVGElement.xleft + 10;
     let sizey = mySVGElement.yup + mySVGElement.ydown;
@@ -269,13 +271,14 @@ class Electro_Item extends List_Item {
 
     let addright = 0;
 
-    myElement.setSVG(`<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
-                       transform="scale(1,1)" viewBox="${clipleft} 0 ${sizex-clipleft} ${sizey}" width="${sizex-clipleft+addright}" height="${sizey}">` 
-                    + SVGSymbols.outputSVGSymbols()
-                  + mySVGElement.data 
-                  + '</svg>'); 
+    let width = sizex-clipleft+addright;
+    let height = sizey;
 
-    myElement.getSizeFromString();
+    myElement.updateElectroItemSVG( '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" transform="scale(1,1)" ' +
+                                    `viewBox="${clipleft} 0 ${sizex-clipleft} ${sizey}" width="${width}" height="${height}">` +
+                                        SVGSymbols.getNeededSymbols() + // enkel de symbolen die nodig zijn voor dit element
+                                        mySVGElement.data +
+                                    '</svg>',width,height); 
   }
 
 }
diff --git a/src/List_Item/Elektriciteitsmeter.ts b/src/List_Item/Elektriciteitsmeter.ts
@@ -24,6 +24,8 @@ class Elektriciteitsmeter extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('elektriciteitsmeter');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 59;
         mySVG.yup = 25;

diff --git a/src/List_Item/Elektrische_oven.ts b/src/List_Item/Elektrische_oven.ts
@@ -24,6 +24,8 @@ class Elektrische_oven extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('oven');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 59;
         mySVG.yup = 25;

diff --git a/src/List_Item/Ketel.ts b/src/List_Item/Ketel.ts
@@ -36,6 +36,11 @@ class Ketel extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('verbruiker');
+        SVGSymbols.addSymbol('gas_ventilator');
+        SVGSymbols.addSymbol('gas_atmosferisch');
+        SVGSymbols.addSymbol('bliksem');
+
         // Alles naar beneden schuiven als we het aantal laders boven het symbool willen plaatsen
         var shifty = 0;
         if (this.props.aantal>1) {

diff --git a/src/List_Item/Koelkast.ts b/src/List_Item/Koelkast.ts
@@ -24,6 +24,9 @@ class Koelkast extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('ster');
+        SVGSymbols.addSymbol('koelkast');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 59;
         mySVG.yup = 25;

diff --git a/src/List_Item/Kookfornuis.ts b/src/List_Item/Kookfornuis.ts
@@ -23,7 +23,8 @@ class Kookfornuis extends Electro_Item {
 
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
-        let outputstr:string = "";
+
+        SVGSymbols.addSymbol('kookfornuis');
 
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 59;

diff --git a/src/List_Item/Kring.ts b/src/List_Item/Kring.ts
@@ -155,6 +155,13 @@ class Kring extends Electro_Item {
     toSVG() {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('zekering_automatisch');
+        SVGSymbols.addSymbol('zekering_empty');
+        SVGSymbols.addSymbol('zekering_smelt');
+        SVGSymbols.addSymbol('overspanningsbeveiliging_inline');
+        SVGSymbols.addSymbol('arrow');
+        SVGSymbols.addSymbol('relais_kring');
+
         // Bepalen of we de hele kring naar rechts moeten opschuiven om rekening te houden met symbooltjes qua kabel-locatie
 
         let cable_location_available: number = 0;

diff --git a/src/List_Item/Lichtpunt.ts b/src/List_Item/Lichtpunt.ts
@@ -69,6 +69,8 @@ class Lichtpunt extends Electro_Item {
         switch (this.props.type_lamp) {
 
             case "led":
+                SVGSymbols.addSymbol('led');
+
                 // Teken led
                 mySVG.data += '<use xlink:href="#led" x="' + 30 + '" y="25" />';
 
@@ -122,6 +124,8 @@ class Lichtpunt extends Electro_Item {
                 break;
 
             case "spot":
+                SVGSymbols.addSymbol('spot');
+
                 // teken spot
                 mySVG.data += '<use xlink:href="#spot" x="' + 30 + '" y="25" />';
 
@@ -231,18 +235,21 @@ class Lichtpunt extends Electro_Item {
                 break;
 
             default: //Normaal lichtpunt (kruisje)
-
+                
                 switch (this.props.type_noodverlichting) {
                     case "Centraal":
+                        SVGSymbols.addSymbol('lamp');
                         mySVG.data += '<use xlink:href="#lamp" x="' + 30 + '" y="25" />'
                                    +  '<circle cx="30" cy="25" r="5" style="stroke:black;fill:black" />';
                         if ( (this.heeftVerbruikerAlsKind()) && (!sitplan) ) mySVG.data += '<line x1="'+30+'" y1="25" x2="'+(30+11)+'" y2="25" stroke="black" />';
                         break;
                     case "Decentraal":
+                        SVGSymbols.addSymbol('noodlamp_decentraal');
                         mySVG.data += '<use xlink:href="#noodlamp_decentraal" x="' + 30 + '" y="25" />';
                         if (this.props.heeft_ingebouwde_schakelaar) mySVG.data += '<line x1="37" y1="18" x2="40" y2="15" stroke="black" stroke-width="2" />'; //Ingebouwde schakelaar
                         break;
                     default:
+                        SVGSymbols.addSymbol('lamp');
                         mySVG.data += '<use xlink:href="#lamp" x="' + 30 + '" y="25" />';
                         if ( (this.heeftVerbruikerAlsKind()) && (!sitplan) ) mySVG.data += '<line x1="'+30+'" y1="25" x2="'+(30+11)+'" y2="25" stroke="black" />';
                         break;

diff --git a/src/List_Item/Media.ts b/src/List_Item/Media.ts
@@ -40,6 +40,8 @@ class Media extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('luidspreker');
+
         // Alles naar beneden schuiven als we het aantal laders boven het symbool willen plaatsen
         var shifty = 0;
         if (this.props.aantal>1) {

diff --git a/src/List_Item/Microgolfoven.ts b/src/List_Item/Microgolfoven.ts
@@ -24,6 +24,9 @@ class Microgolfoven extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('sinus');
+        SVGSymbols.addSymbol('microgolf');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 59;
         mySVG.yup = 25;

diff --git a/src/List_Item/Motor.ts b/src/List_Item/Motor.ts
@@ -24,6 +24,8 @@ class Motor extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('motor');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 59;
         mySVG.yup = 25;

diff --git a/src/List_Item/Omvormer.ts b/src/List_Item/Omvormer.ts
@@ -24,6 +24,9 @@ class Omvormer extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('sinus');
+        SVGSymbols.addSymbol('omvormer');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 59;
         mySVG.yup = 25;

diff --git a/src/List_Item/Overspanningsbeveiliging.ts b/src/List_Item/Overspanningsbeveiliging.ts
@@ -24,6 +24,8 @@ class Overspanningsbeveiliging extends Electro_Item {
     toSVG(sitplan = false) {
         let mySVG:SVGelement = new SVGelement();
 
+        SVGSymbols.addSymbol('overspanningsbeveiliging');
+
         mySVG.xleft = 1; // foresee at least some space for the conductor
         mySVG.xright = 34;
         mySVG.yup = 25;
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		var CONF_builddate="20250101-192145"
		var CONF_builddate="20250105-150906"
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		#!/usr/bin/bash

		npx typedoc --options typedoc.json