Choices now properly cleanup after themselves if they are deselected

GUI/src/components/wizard/choices/wizardChoice.vue

@@ -16,12 +16,22 @@ export default {
     hooks: Array,
     allowed: Boolean,
   },
+  data() {
+    return {
+      oldSelected: undefined,
+    }
+  },
   watch: {
     selected(newVal) {
       if (newVal == true) {
         // emit choice event
         this.$emit('choice', {choice: this.title, configStub: this.data.configStub, hooks: this.hooks});
       }
+      if (this.oldSelected == true && newVal == false){
+        console.log("emitting undo-choice");
+        this.$emit('undo-choice', {choice: this.title, configStub: this.data.configStub, hooks: this.hooks})
+      }
+      this.oldSelected = newVal;
     }
   }
 };

GUI/src/components/wizard/wizardPage.vue

@@ -28,6 +28,7 @@
           :key="choice.title"
           v-on:click.native="choiceHandler(choice)"
           v-on:choice="handleCustomChoice"
+          v-on:undo-choice="undoChoice"
         />
       </template>
     </div>
@@ -96,6 +97,9 @@ export default {
       console.log(e);
       this.$emit("choice", e);
     },
+    undoChoice(e) {
+      this.$emit("undo-choice",e);
+    },
     pageCompEvent(e) {
       this.$emit("page-comp-event", e);
     },
@@ -107,7 +111,12 @@ export default {
       return reqsMet;
     },
     choiceHandler(choice) {
-      if (this.requirementsMet(choice.requirements, this.config)){
+      console.log(choice.title);
+      if (this.selectedChoice == choice.title) {
+        // undo selection
+        this.selectedChoice = undefined;
+      }
+      else if (this.requirementsMet(choice.requirements, this.config)){
         this.selectedChoice = choice.title;
       }
     }
@@ -151,7 +160,7 @@ export default {
 }
 
 .vue-tooltip.tooltip-custom {
-  background-color:  lightyellow;/* var(--fg-color); */
+  background-color: lightyellow; /* var(--fg-color); */
   border-radius: 0px;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4);
   font-family: "Roboto", sans-serif;
@@ -169,7 +178,11 @@ export default {
 }
 
 @keyframes fadeIn {
-  from {opacity: 0}
-  to {opacity: 1}
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
 }
 </style>

GUI/src/views/Wizard.vue

@@ -20,6 +20,7 @@
           :config="wizardConfig"
           :calibrating="calibrating"
           v-on:choice="choiceHandler"
+          v-on:undo-choice="undoChoice"
           v-on:page-comp-event="pageEventHandler"
         />
         <div class="wizard-controls">
@@ -202,6 +203,11 @@ export default {
       }
       console.log(JSON.parse(JSON.stringify(this.wizardConfig)));
     },
+    undoChoice(e){
+      this.choiceMade = false;
+      this.nullConfig(this.wizardConfig, e.configStub);
+      console.log(JSON.parse(JSON.stringify(this.wizardConfig)));
+    },
     updateConfig(config, configStub) {
       // iterate over keys in configStub
       if (configStub != null) {
@@ -214,6 +220,20 @@ export default {
         });
       }
     },
+    nullConfig(config, configStub){
+      // iterate over keys in configStub
+      if (configStub != null) {
+        console.log("NullConfig");
+        Object.keys(configStub).forEach((key) => {
+          console.log(key);
+          if (typeof configStub[key] == "object") {
+            this.nullConfig(config[key], configStub[key]);
+          } else {
+            config[key] = null;
+          }
+        });
+      }
+    },
     next() {
       console.log("next");
       if (this.choiceMade == true) {