bootstrap-slider
bootstrap-slider copied to clipboard
Unselectable ticks when using ticks_positions
Hi, I think that this is possibly similar to issue #528.
When using the ticks_positions option, and a set of non-linear positions, there can be scenarios where certain values can't be selected. Here an example: http://jsfiddle.net/JonKnight/7n3xzmwn/
I worked around this by changing the _getPercentage function so that it would find the closest percentage if ticks_positions was populated:
_getPercentage: function (ev) {
if (this.touchCapable && (ev.type === 'touchstart' || ev.type === 'touchmove')) {
ev = ev.touches[0];
}
var eventPosition = ev[this.mousePos];
var sliderOffset = this._state.offset[this.stylePos];
var distanceToSlide = eventPosition - sliderOffset;
// Calculate what percent of the length the slider handle has slid
var percentage = (distanceToSlide / this._state.size) * 100;
// If there are tick positions spcified, make sure the percentage hits one of the values
if (this.options.ticks_positions.length === 0)
percentage = Math.round(percentage / this._state.percentage[2]) * this._state.percentage[2];
else
percentage = this._getClosestTickPercentage(percentage);
if (this.options.reversed) {
percentage = 100 - percentage;
}
// Make sure the percent is within the bounds of the slider.
// 0% corresponds to the 'min' value of the slide
// 100% corresponds to the 'max' value of the slide
return Math.max(0, Math.min(100, percentage));
},
_getClosestTickPercentage: function (percentage) {
var closestPercentage = null;
$.each(this.options.ticks_positions, function () {
if (closestPercentage == null || Math.abs(this - percentage) < Math.abs(closestPercentage - percentage))
closestPercentage = this;
})
if (closestPercentage == null)
return percentage;
else
return closestPercentage;
},
This works for me, but I don't know whether there are some other scenarios or edge cases that wouldn't.
Thanks for the great component, by the way.
I wonder if this is at all related to: https://github.com/seiyria/bootstrap-slider/issues/528
I hit the same problem. In my case, the best fix is simple: do not round the percentage.