openhab / openhab-webui

Web UIs of openHAB
Eclipse Public License 2.0
214 stars 235 forks source link

Add 'inverted logic' to oh-slider widget #1059

Open shutterfreak opened 3 years ago

shutterfreak commented 3 years ago

The problem

When using a oh-slider widget in Main UI, there is an implicit assumption that the slider moves from low to high from left to right. This makes sense most of the time, but in some cases a binding provides inverted logic.

Take for instance the white spectrum light bulbs from IKEA. The item state moves from 0% (cool white ~ 4000 K) over 50% (warm white ~ 2700 K) to 100% (warm glow ~ 2200 K). So the color temperature decreases as the item state increases.

In a widget, you would see the color temperature decrease from 4000 K to 2200 K as you move the slider from the left (item.state = 0) to the right (item.state = 100).

In an attempt to explore the possibilities I tried setting min to 100 and max to 0 but this effectively blocks the slider at the 100 mark.

For some bindings I know there's a binding/channel-level inverted property (e.g., for Z-Wave blinds), but sometimes you may want both slider directions supported on the same channel, albeit in different widgets.

Your suggestion

I would suggest either one of the following options:

  1. add an inverted property (type: BOOLEAN) to invert the slider logic when set to true (default: false);
  2. invert the slider logic if max < min
  3. add new 'sliderStartState' and 'sliderEndState' properties that would replace min and max (the slider direction would then be inferred from both parameter values)

Your environment

Currently running openHAB3.0.2 on RPi3B+ (openHABian)

runtimeInfo:
  version: 3.0.2
  buildString: Release Build
locale: en-BE
systemInfo:
  configFolder: /etc/openhab
  userdataFolder: /var/lib/openhab
  logFolder: /var/log/openhab
  javaVersion: 11.0.11
  javaVendor: Azul Systems, Inc.
  javaVendorVersion: Zulu11.48+21-CA
  osName: Linux
  osVersion: 5.10.17-v7+
  osArchitecture: arm
  availableProcessors: 4
  freeMemory: 63744240
  totalMemory: 247332864
bindings:
  - astro
  - buienradar
  - exec
  - gpstracker
  - openweathermap
  - sonos
  - telegram
  - tradfri
  - zwave
clientInfo:
  device:
    ios: false
    android: false
    androidChrome: false
    desktop: true
    iphone: false
    ipod: false
    ipad: false
    edge: false
    ie: false
    firefox: false
    macos: true
    windows: false
    cordova: false
    phonegap: false
    electron: false
    nwjs: false
    webView: false
    webview: false
    standalone: false
    os: macos
    pixelRatio: 2
    prefersColorScheme: dark
  isSecureContext: false
  locationbarVisible: true
  menubarVisible: true
  navigator:
    cookieEnabled: true
    deviceMemory: N/A
    hardwareConcurrency: N/A
    language: en-gb
    languages:
      - en-gb
    onLine: true
    platform: MacIntel
  screen:
    width: 3360
    height: 1890
    colorDepth: 24
  support:
    touch: false
    pointerEvents: true
    observer: true
    passiveListener: true
    gestures: false
    intersectionObserver: true
  themeOptions:
    dark: dark
    filled: true
    pageTransitionAnimation: default
    bars: light
    homeNavbar: default
    homeBackground: default
    expandableCardAnimation: default
  userAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.1 Safari/605.1.15
timestamp: 2021-05-20T07:17:54.709Z

Additional information

hubsif commented 3 years ago

Hi! Sliders support the parameter vertical-reversed, though that only works for vertical sliders. Not sure why it's not available for horizontal sliders - guessing there's a reason.