[3.1.0-SNAPSHOT] Slider triggering multiple ItemCommandEvents during sliding

[WaldemarLehner]

The problem

Instead of sending one ItemCommandEvent when dragging a Slider connected with a Dimmer-Item,
with version 3.1.0-SNAPSHOT, multiple ItemCommandEvents are generated.

You can see the wrong Behaviour here:
https://youtu.be/ebjau8ZRULI

Expected behavior

One ItemCommandEvent should be sent out once user has stopped dragging the Slider.

You can see the behaviour as it was back in version 3.0.1-Release here:
https://youtu.be/eEW9369IZME

Steps to reproduce

1. Run version 3.1.0-SNAPSHOT
2. Create a new Item of Type "Dimmer" (I called mine TestDimmer)
3. Create a new Layout and place either a Dimmer-Card, or a List-Card with a Dimmer-Item. In either case, link it up to the Item that was created in Step 2.
   3.a Alternatively, use this Layout Definition:

   config:
       label: UI Command Bug
       sidebar: true
       layoutType: responsive
   blocks:
       - component: oh-block
       config: {}
       slots:
           default:
           - component: oh-grid-row
               config: {}
               slots:
               default:
                   - component: oh-grid-col
                   config: {}
                   slots:
                       default:
                       - component: oh-list-card
                           config: {}
                           slots:
                           default:
                               - component: oh-slider-item
                               config:
                                   title: Test Dimmer
                                   min: 0
                                   max: 100.02
                                   item: TestDimmer
                   - component: oh-grid-col
                   config: {}
                   slots:
                       default: []
       - component: oh-block
       config: {}
       slots:
           default:
           - component: oh-grid-row
               config: {}
               slots:
               default:
                   - component: oh-grid-col
                   config: {}
                   slots:
                       default:
                       - component: oh-slider-card
                           config:
                           item: TestDimmer
                           min: 0
                           max: 100
                           title: Test Dimmer
   masonry: null

4. Drag the Sliders. You should see that the other Slider updates aswell.

Your environment

runtimeInfo:
  version: 3.1.0
  buildString: "Build #2404"
locale: de-DE
systemInfo:
  configFolder: _redacted_/openhab/conf
  userdataFolder: _redacted_/openhab/userdata
  logFolder: _redacted_/openhab/userdata/logs
  javaVersion: 11.0.11
  javaVendor: Oracle Corporation
  osName: Linux
  osVersion: 5.11.22-2-MANJARO
  osArchitecture: amd64
  availableProcessors: 12
  freeMemory: 242711784
  totalMemory: 381681664
bindings:
  - stellwerk
clientInfo:
  device:
    ios: false
    android: false
    androidChrome: false
    desktop: true
    iphone: false
    ipod: false
    ipad: false
    edge: false
    ie: false
    firefox: true
    macos: false
    windows: false
    cordova: false
    phonegap: false
    electron: false
    nwjs: false
    webView: false
    webview: false
    standalone: false
    pixelRatio: 1
    prefersColorScheme: light
  isSecureContext: true
  locationbarVisible: true
  menubarVisible: true
  navigator:
    cookieEnabled: true
    deviceMemory: N/A
    hardwareConcurrency: 12
    language: de
    languages:
      - de
      - en-US
      - en
    onLine: true
    platform: Linux x86_64
  screen:
    width: 1920
    height: 1080
    colorDepth: 24
  support:
    touch: false
    pointerEvents: true
    observer: true
    passiveListener: true
    gestures: false
    intersectionObserver: true
  themeOptions:
    dark: light
    filled: true
    pageTransitionAnimation: default
    bars: filled
    homeNavbar: default
    homeBackground: default
    expandableCardAnimation: default
  userAgent: Mozilla/5.0 (X11; Linux x86_64; rv:89.0) Gecko/20100101 Firefox/89.0
timestamp: 2021-06-23T10:25:06.322Z

Browser console

Browser network traffic

Seems regular. POST-Requests with the new state in the POST-Body.

[hubsif]

Hi Waldemar,

I'm responding, since I'm probably responsible for this "issue". I reworked the sliders in #1012.

Sending out multiple commands while sliding is actually the desired result. It allows e.g. to smoothly dim a lamp, instead of just jumping to a certain brightness.
This has been the case with only oh-knob before, the pull request adds this behaviour to sliders, as well.

There is, however, a parameter to adjust this behaviour:
In the widget's configuration select "Show advanced" and scroll to the bottom. There you'll see a parameter called "Update Interval". If you set this interval to a relatively high amount (e.g. 2000 (=2 seconds)), you should be able to get your old behaviour back, i.e. the slider will only send the command when you release it (or you scroll it for more than 2 seconds).
Alternatively, you can set the config parameter updateInterval: 2000 in code.

While just testing this, I found a small disadvantage with high intervals: if you set it to very large intervals like 20 seconds and reset (click-move) the slider again after 10 seconds, it will take 10 more seconds until the second command gets sent. This is actually by design, as the update interval has been introduced to give slow things some time to reflect the command and never send two command in less time than the given interval. So, you should set it to an interval less than the time until you change the slider again.

May I ask what actually your use case is, i.e. why you only want to have the commands to be send when you release the slider?

[WaldemarLehner]

Hello hubsif,

I'm using the sliders to control the position of a Rollershutter.
I have a Script running that triggers for Commands on a Rollershutter Item (of type Rollershutter), and a Slats Item (of type Dimmer). (both link to the same Physical Rollershutter, controlling the Position of the Rollershutter and the Angle of the Slats)
The script then relays these Commands to some Java-Code via OSGi to calculate the actions to take.

It would be more desirable to just send one Command to reduce the amount of unnecessary movements.
When a new Position lies "ahead" in the Rollershutter's current movement direction, the Rollershutter does not have to stop. In such a case the current position is estimated based on the time passed.
While better than stopping and starting again, this might lead to a deviation between the stored position and the "true" position of the Rollershutter, which means that it needs to be synchronized more often.

Here is a video showing the Rollershutter being accessed through the UI.
The two switch-Items at the top represent the Outputs that lead to the Rollershutter.

https://www.youtube.com/watch?v=783bv7xO8Zw
At 0:25 I start dragging the Slider which generates many command events. When one starts dragging "behind" the current position the Rollershutters have to stop and turn around.

[hubsif]

Thank you, Waldemar. I know understand your situation.

While I think your Rollershutter setup is somewhat special with that stopping and starting and such, a rollershutter is actually generally a good example where "smooth" sliding is not required - or maybe even undesired.

I'm going to create a pull request that adds an additional parameter to sliders and knobs that can be used to disable the interim commands (like "Do not send commands while sliding" or "Only send command on release" - true/false).