Snap a webOS Slider widget to integers

Question

In a webOS app, I have a Mojo.Widget.Slider that I use to set an integer to 0, 1, or 2. I take care of rounding the Slider value myself already (though there is a feature to do this for you, but I stopped using it in case that was the source of my problem, but it wasn't), but I would like the Slider to snap to the rounded integer position after the user is done sliding. There's nothing built in to do this as far as I can tell, so I have to do it myself. I thought something like the following would work.

In my scene assistant's setup function:

this.mySliderModel = {value: 1};
this.controller.setupWidget('mySlider', {minValue: 0, maxValue: 2}, this.mySliderModel

And to listen for changes to the slider:

this.mySliderChangedEventListener = this.mySliderChanged.bindAsEventListener(this);
Mojo.Event.listen(this.controller.get("mySlider"), Mojo.Event.propertyChange, this.mySliderChangedEventListener);

And then the listener:

MainAssistant.prototype.mySliderChanged = function(event) {
    var sliderValue = Math.round(event.value);
    switch (sliderValue) {
        case 0:
        case 1:
        case 2:
            //it's a good value
            //do some stuff

            this.mySliderModel.value = sliderValue;
            this.controller.modelChanged(this.mySliderModel);
            break;
        default:
            Mojo.Log.info("mySlider error value: ", event.value);
            break;
    }
};

But changing the model and calling modelChanged doesn't seem to do anything, although the documentation and example code shows that this can work. Any ideas why my code doesn't work and what I can do to achieve the desired effect?

Note: I'm aware I could achieve this sort of thing using different widgets, but I'd like to do it with a Slider. Using something else is my backup if I can't find a way to get this working.

Answer 1

The issue appears to be a check in the widget's handleModelUpdate. There's a flag (this.seeking) that prevents the widget from handling model changes while dragging is in progress. That flag is cleared when the "drop" happens on the widget but the propertyChange event is triggered 2 lines before the flag is cleared.

The solution could be as simple as adding a very brief timeout so the current script execution can finish before you update the model again.

MainAssistant.prototype.mySliderChanged = function(event) {
    var sliderValue = Math.round(event.value);
    switch (sliderValue) {
        case 0:
        case 1:
        case 2:
            //it's a good value
            //do some stuff
            setTimeout(function() {
                this.mySliderModel.value = sliderValue;
                this.controller.modelChanged(this.mySliderModel);
            }.bind(this), 100);
            break;
        default:
            Mojo.Log.info("mySlider error value: ", event.value);
            break;
    }
};