diff --git a/documentation/behaviour-option/combined.js b/documentation/behaviour-option/combined.js
index 3654b366..f5e59fa4 100644
--- a/documentation/behaviour-option/combined.js
+++ b/documentation/behaviour-option/combined.js
@@ -2,7 +2,8 @@ var dragTapSlider = document.getElementById('combined');
noUiSlider.create(dragTapSlider, {
start: [40, 60],
- behaviour: 'drag-tap',
+ behaviour: 'drag-smooth-steps-tap',
+ step: 10,
connect: true,
range: {
'min': 20,
diff --git a/documentation/behaviour-option/smooth-steps.js b/documentation/behaviour-option/smooth-steps.js
new file mode 100644
index 00000000..87cc83c6
--- /dev/null
+++ b/documentation/behaviour-option/smooth-steps.js
@@ -0,0 +1,17 @@
+var smoothStepsSlider = document.getElementById('smooth-steps');
+var smoothStepsValues = document.getElementById('smooth-steps-values');
+
+noUiSlider.create(smoothStepsSlider, {
+ start: [0, 100],
+ behaviour: 'smooth-steps',
+ step: 15,
+ connect: true,
+ range: {
+ 'min': 0,
+ 'max': 100
+ }
+});
+
+smoothStepsSlider.noUiSlider.on('update', function (values) {
+ smoothStepsValues.innerHTML = values.join(' :: ');
+});
diff --git a/src/nouislider.ts b/src/nouislider.ts
index ea504300..727b0efc 100644
--- a/src/nouislider.ts
+++ b/src/nouislider.ts
@@ -152,6 +152,7 @@ interface Behaviour {
tap: boolean;
drag: boolean;
dragAll: boolean;
+ smoothSteps: boolean;
fixed: boolean;
snap: boolean;
hover: boolean;
@@ -1126,6 +1127,7 @@ function testBehaviour(parsed: ParsedOptions, entry: unknown): void {
const hover = entry.indexOf("hover") >= 0;
const unconstrained = entry.indexOf("unconstrained") >= 0;
const dragAll = entry.indexOf("drag-all") >= 0;
+ const smoothSteps = entry.indexOf("smooth-steps") >= 0;
if (fixed) {
if (parsed.handles !== 2) {
@@ -1144,6 +1146,7 @@ function testBehaviour(parsed: ParsedOptions, entry: unknown): void {
tap: tap || snap,
drag: drag,
dragAll: dragAll,
+ smoothSteps: smoothSteps,
fixed: fixed,
snap: snap,
hover: hover,
@@ -2081,6 +2084,16 @@ function scope(target: TargetElement, options: ParsedOptions, originalOptions: O
}
}
+ if (options.events.smoothSteps) {
+ data.handleNumbers.forEach(function (handleNumber) {
+ setHandle(handleNumber, scope_Locations[handleNumber], true, true, false, false);
+ });
+
+ data.handleNumbers.forEach(function (handleNumber: number) {
+ fireEvent("update", handleNumber);
+ });
+ }
+
data.handleNumbers.forEach(function (handleNumber: number) {
fireEvent("change", handleNumber);
fireEvent("set", handleNumber);
@@ -2448,7 +2461,8 @@ function scope(target: TargetElement, options: ParsedOptions, originalOptions: O
to: number,
lookBackward: boolean,
lookForward: boolean,
- getValue: boolean
+ getValue: boolean,
+ smoothSteps?: boolean
): number | false {
let distance;
@@ -2495,7 +2509,9 @@ function scope(target: TargetElement, options: ParsedOptions, originalOptions: O
}
}
- to = scope_Spectrum.getStep(to);
+ if (!smoothSteps) {
+ to = scope_Spectrum.getStep(to);
+ }
// Limit percentage to the 0 - 100 range
to = limit(to);
@@ -2528,6 +2544,8 @@ function scope(target: TargetElement, options: ParsedOptions, originalOptions: O
// Store first handle now, so we still have it in case handleNumbers is reversed
const firstHandle = handleNumbers[0];
+ const smoothSteps = options.events.smoothSteps;
+
let b = [!upward, upward];
let f = [upward, !upward];
@@ -2549,7 +2567,8 @@ function scope(target: TargetElement, options: ParsedOptions, originalOptions: O
proposals[handleNumber] + proposal,
b[o],
f[o],
- false
+ false,
+ smoothSteps
);
// Stop if one of the handles can't move.
@@ -2571,7 +2590,8 @@ function scope(target: TargetElement, options: ParsedOptions, originalOptions: O
// Step 2: Try to set the handles with the found percentage
handleNumbers.forEach(function (handleNumber, o) {
- state = setHandle(handleNumber, locations[handleNumber] + proposal, b[o], f[o]) || state;
+ state =
+ setHandle(handleNumber, locations[handleNumber] + proposal, b[o], f[o], false, smoothSteps) || state;
});
// Step 3: If a handle moved, fire events
@@ -2631,10 +2651,19 @@ function scope(target: TargetElement, options: ParsedOptions, originalOptions: O
to: number | false,
lookBackward: boolean,
lookForward: boolean,
- exactInput?: boolean
+ exactInput?: boolean,
+ smoothSteps?: boolean
): boolean {
if (!exactInput) {
- to = checkHandlePosition(scope_Locations, handleNumber,
to, lookBackward, lookForward, false);
+ to = checkHandlePosition(
+ scope_Locations,
+ handleNumber,
+ to,
+ lookBackward,
+ lookForward,
+ false,
+ smoothSteps
+ );
}
if (to === false) {