Climate slider fix, no more scrollbars and more.

- [x] A climate slider now shows correctly the target temp value on the slider - [x] Vertical scrollbars on bubble-card on Safari Browser Mac (v2.1.0) [Reopen #644] #670 - [x] Fix media_player.volume_set bug #671 (PR from @ADHDSquir, fix for #586)
Clooos · Jul 28, 2024 · a8aed72 · a8aed72
1 parent d3ce73e
commit a8aed72
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 51 deletions.
diff --git a/dist/bubble-card.js b/dist/bubble-card.js
diff --git a/src/cards/button/changes.ts b/src/cards/button/changes.ts
@@ -87,7 +87,7 @@ export function changeSlider(context) {
   if (buttonType === 'slider') {
     context.elements.rangeFill.style.backgroundColor = getIconColor(context);
 
-    if (context.dragging) return;
+    //if (context.dragging) return;
 
     let percentage = 0;
 
@@ -107,7 +107,7 @@ export function changeSlider(context) {
     } else if (isEntityType(context, "climate")) {
       const minValue = getAttribute(context, "min_temp");
       const maxValue = getAttribute(context, "max_temp");
-      const value = getState(context);
+      const value = getAttribute(context, "temperature");
       percentage = 100 * (value - minValue) / (maxValue - minValue);
     } else if (isEntityType(context, "number")) {
       const minValue = getAttribute(context, "min");

diff --git a/src/cards/button/helpers.ts b/src/cards/button/helpers.ts
@@ -53,7 +53,7 @@ export function updateEntity(context, value) {
       const maxValue = getAttribute(context, "max_temp");
       context._hass.callService('climate', 'set_temperature', {
           entity_id: context.config.entity,
-          temperature: Math.round((maxValue - minValue) * value / 100 + minValue)
+          temperature: (maxValue - minValue) * value / 100 + minValue
       });
   } else if (isEntityType(context, "number")) {
       const minValue = getAttribute(context, "min") ?? 0;
@@ -67,7 +67,7 @@ export function updateEntity(context, value) {
       });
   }
 };
-export const throttledUpdateEntity = throttle(updateEntity);
+export const throttledUpdateEntity = throttle(updateEntity, 100);
 
 export function onSliderChange(context, leftDistance, throttle = false) {
   const rect = context.elements.rangeSlider.getBoundingClientRect();
@@ -76,9 +76,9 @@ export function onSliderChange(context, leftDistance, throttle = false) {
 
   context.elements.rangeFill.style.transform =`translateX(${rangedPercentage}%)`;
   if (throttle) {
-    if (context.dragging) return;
-    //throttledUpdateEntity(context, rangedPercentage);
-    updateEntity(context, rangedPercentage);
+    //if (context.dragging) return;
+    throttledUpdateEntity(context, rangedPercentage);
+    //updateEntity(context, rangedPercentage);
   } else {
     updateEntity(context, rangedPercentage);
   }

diff --git a/src/cards/button/styles.ts b/src/cards/button/styles.ts
@@ -1,6 +1,11 @@
 export default `
     * {
         -webkit-tap-highlight-color: transparent !important;
+        -ms-overflow-style: none; /* for Internet Explorer, Edge */
+        scrollbar-width: none; /* for Firefox */
+    }
+    *::-webkit-scrollbar {
+        display: none; /* for Chrome, Safari, and Opera */
     }
     ha-card {
         margin-top: 0;
@@ -18,9 +23,6 @@ export default `
         background-color: var(--background-color-2,var(--secondary-background-color));
         border-radius: 32px;
         overflow: scroll;
-        /*mask-image: radial-gradient(white, black);*/
-        -ms-overflow-style: none; /* for Internet Explorer, Edge */
-        scrollbar-width: none; /* for Firefox */
         touch-action: pan-y;
     }
 
@@ -55,14 +57,6 @@ export default `
     .is-light .bubble-range-fill {
         opacity: 0.5;
     }
-
-    .bubble-button-card {
-        -ms-overflow-style: none; /* for Internet Explorer, Edge */
-        scrollbar-width: none; /* for Firefox */
-    }
-    .bubble-button-card::-webkit-scrollbar {
-        display: none; /* for Chrome, Safari, and Opera */
-    }
     .is-unavailable .bubble-button-card,
     .is-unavailable .bubble-range-slider {
         cursor: not-allowed;

diff --git a/src/var/version.ts b/src/var/version.ts
@@ -1 +1 @@
-export let version = 'v2.1.0';
+export let version = 'v2.1.1';