feat: single white channel led control (#901)

Signed-off-by: Pedro Lamas <[email protected]>
fluidd-core · Oct 9, 2022 · 69fc533 · 69fc533
1 parent aec0056
commit 69fc533
Showing 1 changed file with 20 additions and 8 deletions.
diff --git a/src/components/ui/AppColorPicker.vue b/src/components/ui/AppColorPicker.vue
@@ -10,7 +10,7 @@
       <v-btn
         v-show="!dot"
         v-bind="attrs"
-        :color="primaryColor.hexString"
+        :color="controlColor.hexString"
         outlined
         small
         v-on="on"
@@ -21,7 +21,7 @@
       <v-icon
         v-show="dot"
         v-bind="attrs"
-        :color="primaryColor.hexString"
+        :color="controlColor.hexString"
         v-on="on"
       >
         $circle
@@ -40,6 +40,7 @@
       </v-card-title>
       <v-card-text>
         <v-icon
+          v-if="supportedChannels !== 'W'"
           :color="primaryColor.hexString"
           large
         >
@@ -58,9 +59,9 @@
           align-center
           column
         >
-          <!-- <pre>{{primaryColor.hexString}}</pre> -->
           <!-- standard full color picker -->
           <app-iro-color-picker
+            v-if="supportedChannels !== 'W'"
             :color="primaryColor.hexString"
             :options="primaryOptions"
             @color:change="handleColorChange('primary', $event)"
@@ -76,13 +77,14 @@
           />
         </v-layout>
 
-        <!-- <pre>{{ primaryColor }}</pre>
-          <pre v-if="this.white">{{ whiteColor }}</pre> -->
         <v-layout
           class="mt-4"
           justify-space-between
         >
-          <div class="color-input">
+          <div
+            v-if="supportedChannels !== 'W'"
+            class="color-input"
+          >
             <v-text-field
               v-model.number="primaryColor.rgb.r"
               dense
@@ -91,7 +93,10 @@
             />
             <div>R</div>
           </div>
-          <div class="color-input">
+          <div
+            v-if="supportedChannels !== 'W'"
+            class="color-input"
+          >
             <v-text-field
               v-model.number="primaryColor.rgb.g"
               dense
@@ -100,7 +105,10 @@
             />
             <div>G</div>
           </div>
-          <div class="color-input">
+          <div
+            v-if="supportedChannels !== 'W'"
+            class="color-input"
+          >
             <v-text-field
               v-model.number="primaryColor.rgb.b"
               dense
@@ -220,6 +228,10 @@ export default class AppColorPicker extends Vue {
     ]
   }
 
+  get controlColor () {
+    return this.supportedChannels === 'W' ? this.whiteColor : this.primaryColor
+  }
+
   @Watch('primaryColor', { deep: true })
   onPrimaryColorChange (value: AppColor) {
     // Update the hex to reflect changes. This covers off users adjusting