fix: disable dashboard controls if Klipper is not ready (#811)

Signed-off-by: Pedro Lamas <[email protected]>
fluidd-core · Aug 4, 2022 · 7028b15 · 7028b15
1 parent 041dc0f
commit 7028b15
Show file tree

Hide file tree

Showing 8 changed files with 25 additions and 8 deletions.
diff --git a/src/components/ui/AppMacroBtn.vue b/src/components/ui/AppMacroBtn.vue
@@ -1,7 +1,7 @@
 <template>
   <app-btn
     v-if="paramList.length === 0 || !enableParams"
-    :disabled="macro.disabledWhilePrinting && printerPrinting"
+    :disabled="(macro.disabledWhilePrinting && printerPrinting) || !klippyReady"
     :style="borderStyle"
     @click="$emit('click', macro.name)"
   >
@@ -12,7 +12,7 @@
     :elevation="6"
   >
     <app-btn
-      :disabled="macro.disabledWhilePrinting && printerPrinting"
+      :disabled="(macro.disabledWhilePrinting && printerPrinting) || !klippyReady"
       :style="borderStyle"
       @click="$emit('click', macro.name)"
     >
@@ -30,6 +30,7 @@
           v-bind="attrs"
           :min-width="24"
           class="px-0"
+          :disabled="(macro.disabledWhilePrinting && printerPrinting) || !klippyReady"
           v-on="on"
         >
           <v-icon

diff --git a/src/components/ui/AppNamedInput.vue b/src/components/ui/AppNamedInput.vue
@@ -7,7 +7,7 @@
       align-self="center"
       cols="5"
       class="text-body-1 py-0"
-      :class="{ 'disabled--text': disabled }"
+      :class="{ 'text--disabled': disabled }"
     >
       {{ label }}
     </v-col>

diff --git a/src/components/ui/AppSlider.vue b/src/components/ui/AppSlider.vue
@@ -12,8 +12,10 @@
         sm="5"
         align-self="center"
         class="text-body-1 py-0"
-        v-html="label"
-      />
+        :class="{ 'text--disabled': disabled }"
+      >
+        {{ label }}
+      </v-col>
 
       <!-- Current value -->
       <v-col

diff --git a/src/components/ui/AppSwitch.vue b/src/components/ui/AppSwitch.vue
@@ -5,6 +5,7 @@
   >
     <div
       class="text-body-1"
+      :class="{ 'text--disabled': disabled }"
     >
       {{ label }}
     </div>

diff --git a/src/components/widgets/console/Console.vue b/src/components/widgets/console/Console.vue
@@ -5,6 +5,7 @@
     <console-command
       v-if="!readonly && flipLayout"
       v-model="consoleCommand"
+      :disabled="!klippyReady"
       @send="sendCommand"
     />
     <v-card
@@ -43,6 +44,7 @@
     <console-command
       v-if="!readonly && !flipLayout"
       v-model="consoleCommand"
+      :disabled="!klippyReady"
       @send="sendCommand"
     />
   </div>

diff --git a/src/components/widgets/console/ConsoleCommand.vue b/src/components/widgets/console/ConsoleCommand.vue
@@ -7,6 +7,7 @@
           :rows="1"
           :value="newValue"
           :items="history"
+          :disabled="disabled"
           auto-grow
           clearable
           outlined
@@ -22,7 +23,10 @@
         />
       </v-col>
       <v-col cols="auto">
-        <app-btn @click="emitSend(newValue)">
+        <app-btn
+          :disabled="disabled"
+          @click="emitSend(newValue)"
+        >
           {{ $t('app.general.btn.send') }}
         </app-btn>
       </v-col>
@@ -46,6 +50,9 @@ export default class ConsoleCommand extends Vue {
   @Ref('input')
   readonly input!: VInput
 
+  @Prop({ type: Boolean, default: false })
+  public disabled!: boolean
+
   @Watch('value')
   onValueChange (val: string) {
     if (val) {

diff --git a/src/components/widgets/outputs/OutputFan.vue b/src/components/widgets/outputs/OutputFan.vue
@@ -14,9 +14,10 @@
     />
 
     <v-layout
-      v-if="!fan.controllable"
+      v-else
       align-center
       justify-space-between
+      :class="{ 'text--disabled': !klippyReady }"
     >
       <div class="text-body-1">
         {{ fan.prettyName }}

diff --git a/src/components/widgets/toolhead/ZHeightAdjust.vue b/src/components/widgets/toolhead/ZHeightAdjust.vue
@@ -25,7 +25,10 @@
           {{ value }}
         </app-btn>
       </v-btn-toggle>
-      <div class="mt-1">
+      <div
+        class="mt-1"
+        :class="{ 'text--disabled': !klippyReady }"
+      >
         <span class="secondary--text">{{ $t('app.general.label.z_offset') }}&nbsp;</span>
         <span>{{ ZHomingOrigin }}mm</span>
       </div>