added prototype editor, closes #3

src/App.vue

@@ -157,8 +157,26 @@
             @click="update_anzahl_prototypen(++this.anzahl_prototypen)"
           >
             +</button
-          ><br />
+          >          <br />
           <br />
+
+          <button class="btn btn-primary collapsible" style="background: grey">
+            manuell verändern
+          </button>
+          <div class="content" id="content2" style="text-align: left">
+            In jeder Zeile wird ein Protoyp mit den zugehörigen Werten
+            dargestellt:<br /><br />
+            <b>&nbsp;&nbsp;&nbsp; x; y</b><br />
+            <textarea
+              v-model="txt_prototypensatz"
+              placeholder="add multiple lines"
+              rows="10"
+            ></textarea>
+            <br />
+            <button class="btn btn-primary" @click="textarea_2_prototypensatz">
+              Prototypen verändern
+            </button>
+          </div>
         </div>
       </div>
 
@@ -199,6 +217,7 @@ export default {
     return {
       datenpunkte_zufall: false,
       txt_datensatz: null,
+      txt_prototypensatz: null,
 
       anzahl_datenpunkte: 8,
       anzahl_prototypen: 3,
@@ -328,30 +347,7 @@ export default {
   methods: {
     lade() {
       this.datensatz_2_textarea();
-      /*
+      this.prototypensatz_2_textarea();
-      this.txt_datensatz =
-        "x;y\n\
-2;3\n\
-3;6\n\
-4;7\n\
-5;6\n\
-6;5\n\
-9;8\n\
-2;15\n\
-10;17\n\
-11;16\n\
-12;15\n\
-13;18\n\
-16;3\n\
-21;1\n\
-18;15\n\
-19;12\n\
-20;14\n\
-22;13\n\
-22;15\n\
-23;12\n\
-24;14";
-*/
     },
 
     datensatz_2_textarea() {
@@ -376,16 +372,16 @@ export default {
       let regex_korrekt = text.match("^((\\d)*;(\\d)*(#))*((\\d)*;(\\d)*)?$");
 
       if (!regex_korrekt) {
-        console.log("regex nicht korrekt");
+        console.log("DATENSATZ nicht korrekt!");
       } else {
-        console.log("regex korrekt");
+        console.log("DATENSATZ korrekt!");
         let zeilen = text.split("#");
         let neuer_ds = [];
 
         for (let i = 0; i < zeilen.length; i++) {
           if (zeilen[i].includes(";")) {
             let zeile = zeilen[i].split(";");
-            let ds = { x: zeile[0], y: zeile[1], color: "blue" };
+            let ds = { x: parseInt(zeile[0]), y: parseInt(zeile[1]), color: "black" };
 
             neuer_ds.push(ds);
           }
@@ -396,6 +392,49 @@ export default {
       }
     },
 
+    prototypensatz_2_textarea() {
+      let text_ausgabe = "";
+
+      for (let i = 0; i < this.prototypen.length; i++) {
+        text_ausgabe +=
+          this.prototypen[i].x + "; " + this.prototypen[i].y + "\n";
+      }
+
+      this.txt_prototypensatz = text_ausgabe;
+    },
+
+    textarea_2_prototypensatz() {
+      let text = this.txt_prototypensatz.replaceAll(" ", "");
+      text = text.replaceAll("\n", "#");
+      while (text.includes("##")) {
+        text = text.replaceAll("##", "#");
+      }
+
+      console.log(text);
+      let regex_korrekt = text.match("^((\\d)*;(\\d)*(#))*((\\d)*;(\\d)*)?$");
+
+      if (!regex_korrekt) {
+        console.log("PROTOTYPENSATZ nicht korrekt!");
+      } else {
+        console.log("PROTOTYPENSATZ korrekt!");
+        let zeilen = text.split("#");
+        let neuer_ps = [];
+
+        for (let i = 0; i < zeilen.length; i++) {
+          if (zeilen[i].includes(";")) {
+            let zeile = zeilen[i].split(";");
+            let ps = { x: parseInt(zeile[0]), y: parseInt(zeile[1]), color: "blue" };
+
+            neuer_ps.push(ps);
+          }
+        }
+        this.prototypen = neuer_ps;
+        this.prototypen_original = neuer_ps;
+        this.anzahl_prototypen = this.prototypen.length;
+        this.update_anzahl_prototypen(this.anzahl_prototypen);
+      }
+    },
+
     szenario_aendern() {
       this.loesche_zeichenflaeche();
       this.refresh();
@@ -411,8 +450,8 @@ export default {
         }
 
         while (this.datenpunkte.length < this.anzahl_datenpunkte) {
-          let neues_datenpunkt = this.generiere_datenpunkt_zufaellig();
+          let neuer_datenpunkt = this.generiere_datenpunkt_zufaellig();
-          this.datenpunkte.push(neues_datenpunkt);
+          this.datenpunkte.push(neuer_datenpunkt);
         }
         //this.update_zeichnung_child_component();
         this.datensatz_2_textarea();
@@ -423,6 +462,8 @@ export default {
     },
     update_anzahl_prototypen(new_value) {
       // Original Prototypen laden
+      console.log(this.prototypen_original);
+      console.log(this.prototypen);
       this.prototypen = JSON.parse(JSON.stringify(this.prototypen_original))
       if (new_value >= 0) {
         console.log("angekommen." + new_value);
@@ -437,7 +478,7 @@ export default {
           this.prototypen.push(neuer_prototyp);
         }
         //this.update_zeichnung_child_component();
-        //        this.datensatz_2_textarea();
+        this.prototypensatz_2_textarea();
         this.refresh();
       } else {
         this.anzahl_prototypen = 0;