From d11abefe01075bca1b15cd708b638366a3810ae5 Mon Sep 17 00:00:00 2001
From: Jason Thomas <jason@openc3.com>
Date: Sat, 18 Jan 2025 16:35:38 -0700
Subject: [PATCH] Blur LedWidgets when stale

---
 .../openc3-vue-common/src/widgets/LedWidget.vue     | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/openc3-cosmos-init/plugins/packages/openc3-vue-common/src/widgets/LedWidget.vue b/openc3-cosmos-init/plugins/packages/openc3-vue-common/src/widgets/LedWidget.vue
index 7e89729911..02aeec7bf4 100644
--- a/openc3-cosmos-init/plugins/packages/openc3-vue-common/src/widgets/LedWidget.vue
+++ b/openc3-cosmos-init/plugins/packages/openc3-vue-common/src/widgets/LedWidget.vue
@@ -24,7 +24,7 @@
   <v-tooltip location="top">
     <template v-slot:activator="{ props }">
       <div
-        class="ledwidget mt-1"
+        :class="getClass"
         :style="[cssProps, computedStyle]"
         v-bind="props"
       ></div>
@@ -71,6 +71,13 @@ export default {
         this.parameters[0] + ' ' + this.parameters[1] + ' ' + this.parameters[2]
       )
     },
+    getClass() {
+      let result = 'ledwidget mt-2'
+      if (this.screenValues[this.valueId][1] === 'STALE') {
+        result += ' stale'
+      }
+      return result
+    },
   },
   // Note Vuejs still treats this synchronously, but this allows us to dispatch
   // the store mutation and return the array index.
@@ -105,4 +112,8 @@ export default {
   background-color: var(--color);
   border-radius: 50%;
 }
+.stale {
+  filter: blur(2px);
+  opacity: 0.6;
+}
 </style>