/*
 How to use:

 <input type="text" data-bind="bsSlider: { value: distance, min: 1, max: 100, step: 5 }"/>

 Options can be removed or overriden.
*/
ko.bindingHandlers.bsSlider = {
    init: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
        var options = ko.unwrap(valueAccessor());
        options = $.extend(ko.bindingHandlers.bsSlider.options, options);

        var valueObservable = options.value;
        options.value = valueObservable();

        $(element).slider(options).on('slide', function (e) {
             valueObservable(e.value);
        });

        ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
            $(element).slider("destroy");
        });
    },
    update: function (element, valueAccessor, allBindings, data, context) {
        var options = ko.unwrap(valueAccessor());
        var value = options.value();
        $(element).slider('setValue', value);
    },
    options: {
        tooltip: 'always'
    }
};