Autoformat modalComponents

webapp/src/components/modalComponents/calibrationWizard.vue

@@ -14,7 +14,6 @@
         @next="nextTask"
         @back="previousTask"
       />
-      
     </div>
   </div>
 </template>
@@ -61,10 +60,10 @@ export default {
       camera_stage_mapping: cameraStageMappingTask
     };
     this.availableCalibrationTasks = Object.fromEntries(
-      Object.entries(allCalibrationTasks)
+      Object.entries(allCalibrationTasks).filter(([thing]) =>
-        .filter(([thing]) => this.thingAvailable(thing))
+        this.thingAvailable(thing)
+      )
     );
- 
   },
 
   methods: {
@@ -73,7 +72,7 @@ export default {
      *
      * Iterates over `this.availableCalibrationTasks` (set during mounted()) and reads the
      * `calibration_required` property.
-     * 
+     *
      * Returns a list of thing names that report calibration is required.
      */
     async check_things_needing_calibration() {
@@ -82,7 +81,10 @@ export default {
 
       for (const name of calibrateableThings) {
         try {
-          const thingNeedsCal = await this.readThingProperty(name, "calibration_required");
+          const thingNeedsCal = await this.readThingProperty(
+            name,
+            "calibration_required"
+          );
           if (thingNeedsCal) {
             needsCalibration.push(name);
           }
@@ -100,14 +102,17 @@ export default {
     },
 
     /**
-    * Create the calibration wizard task list dynamically.
+     * Create the calibration wizard task list dynamically.
-    */
+     */
-    create_task_list: function(thingsToCal, includeWelcome=true) {
+    create_task_list: function(thingsToCal, includeWelcome = true) {
       const tasks = [];
 
       // Optionally include the welcome screen
       if (includeWelcome) {
-        tasks.push({ component: singleStepTask, props: { stepComponent: welcomeStep } });
+        tasks.push({
+          component: singleStepTask,
+          props: { stepComponent: welcomeStep }
+        });
       }
 
       // Add calibration task for each thing
@@ -117,14 +122,17 @@ export default {
       }
 
       // Always include the final step
-      tasks.push({ component: singleStepTask, props: { stepComponent: finalStep } });
+      tasks.push({
+        component: singleStepTask,
+        props: { stepComponent: finalStep }
+      });
 
       this.tasks = tasks;
     },
 
     show_if_needed: async function() {
       // Check if the calibration modal is needed, and only show it if it is.
-      let thingsToCal = await this. check_things_needing_calibration()
+      let thingsToCal = await this.check_things_needing_calibration();
       const needed = thingsToCal.length > 0;
 
       // Check if this calibration wizard can actually do anything useful
@@ -141,7 +149,7 @@ export default {
     // Forces modal to show on button press
     force_show: function() {
       const allThings = Object.keys(this.availableCalibrationTasks);
-  
+
       this.resetData();
       this.create_task_list(allThings, false);
       this.show();
@@ -181,8 +189,7 @@ export default {
       if (this.taskIndex < this.tasks.length - 1) {
         this.taskIndex = this.taskIndex + 1;
         return true;
-      }
+      } else {
-      else {
         this.hide();
       }
     }

webapp/src/components/modalComponents/calibrationWizardComponents/calibrationWizardTask.vue

@@ -39,7 +39,6 @@ Tasks can be divided into multiple steps.
 </template>
 
 <script>
-
 export default {
   name: "calibrationWizardTask",
 
@@ -62,7 +61,7 @@ export default {
 
   data() {
     return {
-      stepIndex: this.startOnLast ? this.steps.length-1 : 0
+      stepIndex: this.startOnLast ? this.steps.length - 1 : 0
     };
   },
 
@@ -74,7 +73,9 @@ export default {
       return !this.first || this.stepIndex > 0;
     },
     nextButtonText() {
-      return this.final && this.stepIndex === this.steps.length - 1 ? "Finish" : "Next";
+      return this.final && this.stepIndex === this.steps.length - 1
+        ? "Finish"
+        : "Next";
     }
   },
 
@@ -102,5 +103,5 @@ export default {
       }
     }
   }
-}
+};
 </script>

webapp/src/components/modalComponents/calibrationWizardComponents/cameraCalibrationSteps/camCalibrationExplanation.vue

@@ -13,8 +13,7 @@
 </template>
 
 <script>
-
 export default {
   name: "camCalibrationExplanation"
-}
+};
 </script>

webapp/src/components/modalComponents/calibrationWizardComponents/cameraCalibrationSteps/cameraMainCalibrationStep.vue

@@ -16,7 +16,7 @@
 </template>
 
 <script>
-import stepTemplateWithStream from "../stepTemplateWithStream.vue"
+import stepTemplateWithStream from "../stepTemplateWithStream.vue";
 import cameraCalibrationSettings from "../../../tabContentComponents/settingsComponents/cameraSettingsComponents/cameraCalibrationSettings.vue";
 
 export default {
@@ -32,11 +32,10 @@ export default {
       return `${this.$store.getters.baseUri}/camera/`;
     }
   }
-}
+};
 </script>
 
 <style scoped>
-
 .action-button-container {
   padding: 4px;
 }

webapp/src/components/modalComponents/calibrationWizardComponents/cameraCalibrationTask.vue

@@ -17,7 +17,7 @@ import cameraMainCalibrationStep from "./cameraCalibrationSteps/cameraMainCalibr
 
 export default {
   name: "cameraCalibrationTask",
-  components: {calibrationWizardTask},
+  components: { calibrationWizardTask },
   props: {
     // Standard calibrationWizardTask props below:
     first: Boolean,
@@ -31,11 +31,10 @@ export default {
   data: function() {
     return {
       steps: [
-        {component: camCalibrationExplanation},
+        { component: camCalibrationExplanation },
-        {component: cameraMainCalibrationStep},
+        { component: cameraMainCalibrationStep }
       ]
     };
   }
-
+};
-}
 </script>

webapp/src/components/modalComponents/calibrationWizardComponents/cameraStageMappingTask.vue

@@ -18,7 +18,7 @@ import runCsmStep from "./csmSteps/runCsmStep.vue";
 
 export default {
   name: "cameraCalibrationTask",
-  components: {calibrationWizardTask},
+  components: { calibrationWizardTask },
   props: {
     // Standard calibrationWizardTask props below:
     first: Boolean,
@@ -32,12 +32,11 @@ export default {
   data: function() {
     return {
       steps: [
-        {component: csmExplanation},
+        { component: csmExplanation },
-        {component: focusStep},
+        { component: focusStep },
-        {component: runCsmStep}
+        { component: runCsmStep }
       ]
     };
   }
-
+};
-}
 </script>

webapp/src/components/modalComponents/calibrationWizardComponents/csmSteps/csmExplanation.vue

@@ -18,5 +18,5 @@
 <script>
 export default {
   name: "csmExplanation"
-}
+};
 </script>

webapp/src/components/modalComponents/calibrationWizardComponents/csmSteps/focusStep.vue

@@ -4,29 +4,30 @@
       Use the buttons below to bring the sample into focus.
     </p>
     <p>
-      You may also adjust the z position with <b>page up</b> and <b>page down</b>.
+      You may also adjust the z position with <b>page up</b> and
+      <b>page down</b>.
     </p>
     <template #below-stream>
       <div class="action-button-container">
         <action-button
-        class="moveZ"
+          class="moveZ"
-        thing="stage"
+          thing="stage"
-        action="move_relative"
+          action="move_relative"
-        :button-primary="false"
+          :button-primary="false"
-        :submit-data="{ x: 0, y: 0, z: -100}"
+          :submit-data="{ x: 0, y: 0, z: -100 }"
-        :submit-label="' - '"
+          :submit-label="' - '"
-        :hideOnRun="false"
+          :hideOnRun="false"
-        :can-terminate="false"
+          :can-terminate="false"
         />
         <action-button
-        class="moveZ"
+          class="moveZ"
-        thing="stage"
+          thing="stage"
-        action="move_relative"
+          action="move_relative"
-        :button-primary="false"
+          :button-primary="false"
-        :submit-data="{ x: 0, y: 0, z: 100}"
+          :submit-data="{ x: 0, y: 0, z: 100 }"
-        :submit-label="'+'"
+          :submit-label="'+'"
-        :can-terminate="false"
+          :can-terminate="false"
-        :hideOnRun="false"
+          :hideOnRun="false"
         />
       </div>
     </template>
@@ -34,7 +35,7 @@
 </template>
 
 <script>
-import stepTemplateWithStream from "../stepTemplateWithStream.vue"
+import stepTemplateWithStream from "../stepTemplateWithStream.vue";
 import ActionButton from "../../../labThingsComponents/actionButton.vue";
 export default {
   name: "cameraMainCalibrationStep",
@@ -43,24 +44,23 @@ export default {
     stepTemplateWithStream,
     ActionButton
   }
-}
+};
 </script>
 <style scoped>
-
 .action-button-container {
   display: flex;
-  flex-direction: row;       /* Stack vertically */
+  flex-direction: row; /* Stack vertically */
-  justify-content: center;   /* Left align */
+  justify-content: center; /* Left align */
-  gap: 8px;                  /* Small space between buttons */
+  gap: 8px; /* Small space between buttons */
-  margin-top: 4px;           /* Gap from image */
+  margin-top: 4px; /* Gap from image */
 }
 .moveZ >>> .uk-button.uk-width-1-1 {
   line-height: 50px;
   font-size: 50px !important;
-  height: 60px; 
+  height: 60px;
   padding-bottom: 46px;
-  margin: 0;                 /* Remove default margin */
+  margin: 0; /* Remove default margin */
   width: 120px;
   min-width: 80px;
 }
-</style>
+</style>

webapp/src/components/modalComponents/calibrationWizardComponents/csmSteps/runCsmStep.vue

@@ -12,7 +12,7 @@
 </template>
 
 <script>
-import stepTemplateWithStream from "../stepTemplateWithStream.vue"
+import stepTemplateWithStream from "../stepTemplateWithStream.vue";
 import CSMCalibrationSettings from "../../../tabContentComponents/settingsComponents/CSMSettingsComponents/CSMCalibrationSettings.vue";
 
 export default {
@@ -28,11 +28,10 @@ export default {
       return `${this.$store.getters.baseUri}/camera/`;
     }
   }
-}
+};
 </script>
 
 <style scoped>
-
 .action-button-container {
   padding: 4px;
 }

webapp/src/components/modalComponents/calibrationWizardComponents/finalStep.vue

@@ -1,17 +1,16 @@
 <template>
   <div>
     <p>
-        <b>Calibration complete</b>
+      <b>Calibration complete</b>
     </p>
     <p>
-        Click Finish to return to your microscope.
+      Click Finish to return to your microscope.
     </p>
   </div>
 </template>
 
 <script>
-
 export default {
   name: "finalStep"
-}
+};
 </script>

webapp/src/components/modalComponents/calibrationWizardComponents/singleStepTask.vue

@@ -15,10 +15,13 @@ import calibrationWizardTask from "./calibrationWizardTask.vue";
 
 export default {
   name: "singleStepTask",
-  components: {calibrationWizardTask},
+  components: { calibrationWizardTask },
   props: {
     // This must be sent
-    stepComponent: Object,
+    stepComponent: {
+      type: Object,
+      required: true
+    },
     // This is optional.
     stepProps: {
       type: Object,
@@ -34,15 +37,13 @@ export default {
     startOnLast: {
       type: Boolean,
       default: false
-    },
+    }
   },
 
   data: function() {
     return {
-      steps: [
+      steps: [{ component: this.stepComponent, props: this.stepProps }]
-        {component: this.stepComponent, props: this.stepProps}
-      ]
     };
-  },
+  }
-}
+};
 </script>

webapp/src/components/modalComponents/calibrationWizardComponents/stepTemplateWithStream.vue

@@ -7,7 +7,6 @@
 </template>
 
 <script>
-
 import miniStreamDisplay from "../../genericComponents/miniStreamDisplay.vue";
 
 export default {
@@ -16,7 +15,7 @@ export default {
   components: {
     miniStreamDisplay
   }
-}
+};
 </script>
 
 <style scoped>

webapp/src/components/modalComponents/calibrationWizardComponents/welcomeStep.vue

@@ -6,8 +6,8 @@
       </b>
     </p>
     <p>
-        Your microscope will still function, however some functionality will
+      Your microscope will still function, however some functionality will be
-        be limited, and image quality will likely suffer.
+      limited, and image quality will likely suffer.
     </p>
     <p>
       <b>Click Next to begin microscope calibration.</b>
@@ -16,8 +16,7 @@
 </template>
 
 <script>
-
 export default {
   name: "welcomeStep"
-}
+};
 </script>