Skip to content

Commit 64e8a94

Browse files
ValentinHValentinH
authored
Fix for #377 (#378)
* Add unit test showing the issue * Fix the issue
1 parent c7b1169 commit 64e8a94

File tree

4 files changed

+102
-65
lines changed

4 files changed

+102
-65
lines changed

‎dist/rzslider.js

Lines changed: 31 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/*! angularjs-slider - v5.4.1 -
22
(c) Rafal Zajac <[email protected]>, Valentin Hervieu <[email protected]>, Jussi Saarivirta <[email protected]>, Angelin Sirbu <[email protected]> -
33
https://github.com/angular-slider/angularjs-slider -
4-
2016-07-17 */
4+
2016-08-01 */
55
/*jslint unparam: true */
66
/*global angular: false, console: false, define, module */
77
(function(root, factory) {
@@ -792,7 +792,10 @@
792792
label.rzsv = valStr;
793793
}
794794

795-
if(!noLabelInjection){ label.html(valStr); };
795+
if (!noLabelInjection) {
796+
label.html(valStr);
797+
}
798+
;
796799

797800
this.scope[which + 'Label'] = valStr;
798801

@@ -933,7 +936,7 @@
933936
'background-color': this.getSelectionBarColor()
934937
};
935938
}
936-
if(!tick.selected && this.options.getTickColor){
939+
if (!tick.selected && this.options.getTickColor) {
937940
tick.style = {
938941
'background-color': this.getTickColor(value)
939942
}
@@ -1098,7 +1101,7 @@
10981101
shFloorCeil: function() {
10991102
// Show based only on hideLimitLabels if pointer labels are hidden
11001103
if (this.options.hidePointerLabels) {
1101-
return;
1104+
return;
11021105
}
11031106
var flHidden = false,
11041107
clHidden = false,
@@ -1937,40 +1940,36 @@
19371940
valueChanged = true;
19381941
}
19391942
else {
1943+
if (this.options.noSwitching) {
1944+
if (this.tracking === 'lowValue' && newValue > this.highValue)
1945+
newValue = this.applyMinMaxRange(this.highValue);
1946+
else if (this.tracking === 'highValue' && newValue < this.lowValue)
1947+
newValue = this.applyMinMaxRange(this.lowValue);
1948+
}
19401949
newValue = this.applyMinMaxRange(newValue);
19411950
/* This is to check if we need to switch the min and max handles */
19421951
if (this.tracking === 'lowValue' && newValue > this.highValue) {
1943-
if (this.options.noSwitching && this.highValue !== this.minValue) {
1944-
newValue = this.applyMinMaxRange(this.highValue);
1945-
}
1946-
else {
1947-
this.lowValue = this.highValue;
1948-
this.applyLowValue();
1949-
this.updateHandles(this.tracking, this.maxH.rzsp);
1950-
this.updateAriaAttributes();
1951-
this.tracking = 'highValue';
1952-
this.minH.removeClass('rz-active');
1953-
this.maxH.addClass('rz-active');
1954-
if (this.options.keyboardSupport)
1955-
this.focusElement(this.maxH);
1956-
}
1952+
this.lowValue = this.highValue;
1953+
this.applyLowValue();
1954+
this.updateHandles(this.tracking, this.maxH.rzsp);
1955+
this.updateAriaAttributes();
1956+
this.tracking = 'highValue';
1957+
this.minH.removeClass('rz-active');
1958+
this.maxH.addClass('rz-active');
1959+
if (this.options.keyboardSupport)
1960+
this.focusElement(this.maxH);
19571961
valueChanged = true;
19581962
}
19591963
else if (this.tracking === 'highValue' && newValue < this.lowValue) {
1960-
if (this.options.noSwitching && this.lowValue !== this.maxValue) {
1961-
newValue = this.applyMinMaxRange(this.lowValue);
1962-
}
1963-
else {
1964-
this.highValue = this.lowValue;
1965-
this.applyHighValue();
1966-
this.updateHandles(this.tracking, this.minH.rzsp);
1967-
this.updateAriaAttributes();
1968-
this.tracking = 'lowValue';
1969-
this.maxH.removeClass('rz-active');
1970-
this.minH.addClass('rz-active');
1971-
if (this.options.keyboardSupport)
1972-
this.focusElement(this.minH);
1973-
}
1964+
this.highValue = this.lowValue;
1965+
this.applyHighValue();
1966+
this.updateHandles(this.tracking, this.minH.rzsp);
1967+
this.updateAriaAttributes();
1968+
this.tracking = 'lowValue';
1969+
this.maxH.removeClass('rz-active');
1970+
this.minH.addClass('rz-active');
1971+
if (this.options.keyboardSupport)
1972+
this.focusElement(this.minH);
19741973
valueChanged = true;
19751974
}
19761975
}

‎dist/rzslider.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/rzslider.js

Lines changed: 30 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -796,7 +796,10 @@
796796
label.rzsv = valStr;
797797
}
798798

799-
if(!noLabelInjection){ label.html(valStr); };
799+
if (!noLabelInjection) {
800+
label.html(valStr);
801+
}
802+
;
800803

801804
this.scope[which + 'Label'] = valStr;
802805

@@ -937,7 +940,7 @@
937940
'background-color': this.getSelectionBarColor()
938941
};
939942
}
940-
if(!tick.selected && this.options.getTickColor){
943+
if (!tick.selected && this.options.getTickColor) {
941944
tick.style = {
942945
'background-color': this.getTickColor(value)
943946
}
@@ -1102,7 +1105,7 @@
11021105
shFloorCeil: function() {
11031106
// Show based only on hideLimitLabels if pointer labels are hidden
11041107
if (this.options.hidePointerLabels) {
1105-
return;
1108+
return;
11061109
}
11071110
var flHidden = false,
11081111
clHidden = false,
@@ -1941,40 +1944,36 @@
19411944
valueChanged = true;
19421945
}
19431946
else {
1947+
if (this.options.noSwitching) {
1948+
if (this.tracking === 'lowValue' && newValue > this.highValue)
1949+
newValue = this.applyMinMaxRange(this.highValue);
1950+
else if (this.tracking === 'highValue' && newValue < this.lowValue)
1951+
newValue = this.applyMinMaxRange(this.lowValue);
1952+
}
19441953
newValue = this.applyMinMaxRange(newValue);
19451954
/* This is to check if we need to switch the min and max handles */
19461955
if (this.tracking === 'lowValue' && newValue > this.highValue) {
1947-
if (this.options.noSwitching && this.highValue !== this.minValue) {
1948-
newValue = this.applyMinMaxRange(this.highValue);
1949-
}
1950-
else {
1951-
this.lowValue = this.highValue;
1952-
this.applyLowValue();
1953-
this.updateHandles(this.tracking, this.maxH.rzsp);
1954-
this.updateAriaAttributes();
1955-
this.tracking = 'highValue';
1956-
this.minH.removeClass('rz-active');
1957-
this.maxH.addClass('rz-active');
1958-
if (this.options.keyboardSupport)
1959-
this.focusElement(this.maxH);
1960-
}
1956+
this.lowValue = this.highValue;
1957+
this.applyLowValue();
1958+
this.updateHandles(this.tracking, this.maxH.rzsp);
1959+
this.updateAriaAttributes();
1960+
this.tracking = 'highValue';
1961+
this.minH.removeClass('rz-active');
1962+
this.maxH.addClass('rz-active');
1963+
if (this.options.keyboardSupport)
1964+
this.focusElement(this.maxH);
19611965
valueChanged = true;
19621966
}
19631967
else if (this.tracking === 'highValue' && newValue < this.lowValue) {
1964-
if (this.options.noSwitching && this.lowValue !== this.maxValue) {
1965-
newValue = this.applyMinMaxRange(this.lowValue);
1966-
}
1967-
else {
1968-
this.highValue = this.lowValue;
1969-
this.applyHighValue();
1970-
this.updateHandles(this.tracking, this.minH.rzsp);
1971-
this.updateAriaAttributes();
1972-
this.tracking = 'lowValue';
1973-
this.maxH.removeClass('rz-active');
1974-
this.minH.addClass('rz-active');
1975-
if (this.options.keyboardSupport)
1976-
this.focusElement(this.minH);
1977-
}
1968+
this.highValue = this.lowValue;
1969+
this.applyHighValue();
1970+
this.updateHandles(this.tracking, this.minH.rzsp);
1971+
this.updateAriaAttributes();
1972+
this.tracking = 'lowValue';
1973+
this.maxH.removeClass('rz-active');
1974+
this.minH.addClass('rz-active');
1975+
if (this.options.keyboardSupport)
1976+
this.focusElement(this.minH);
19781977
valueChanged = true;
19791978
}
19801979
}

‎tests/specs/mouse-controls/minMaxRange-noSwitching-range-slider-horizontal-test.js

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@
2828
floor: 0,
2929
ceil: 100,
3030
minRange: 10,
31+
maxRange: 50,
3132
noSwitching: true
3233
}
3334
};
@@ -81,6 +82,44 @@
8182
expect(helper.scope.slider.min).to.equal(45);
8283
expect(helper.scope.slider.max).to.equal(55);
8384
});
85+
86+
it('should not modify any value if new range would be larger than maxRange when moving minH', function() {
87+
helper.fireMousedown(helper.slider.minH, 0);
88+
var expectedValue = 0;
89+
helper.moveMouseToValue(expectedValue);
90+
expect(helper.scope.slider.min).to.equal(5);
91+
});
92+
93+
it('should not modify any value if new range would be larger than maxRange when moving maxH', function() {
94+
helper.fireMousedown(helper.slider.maxH, 0);
95+
var expectedValue = 100;
96+
helper.moveMouseToValue(expectedValue);
97+
expect(helper.scope.slider.max).to.equal(95);
98+
});
99+
100+
it('should not switch min/max when moving minH far higher than maxH (issue #377)', function() {
101+
helper.scope.slider.min = 0;
102+
helper.scope.slider.max = 10;
103+
helper.scope.$digest();
104+
105+
helper.fireMousedown(helper.slider.minH, 0);
106+
var expectedValue = 100;
107+
helper.moveMouseToValue(expectedValue);
108+
expect(helper.scope.slider.min).to.equal(0);
109+
expect(helper.scope.slider.max).to.equal(10);
110+
});
111+
112+
it('should not switch min/max when moving maxH far lower than minH (issue #377)', function() {
113+
helper.scope.slider.min = 90;
114+
helper.scope.slider.max = 100;
115+
helper.scope.$digest();
116+
117+
helper.fireMousedown(helper.slider.maxH, 0);
118+
var expectedValue = 0;
119+
helper.moveMouseToValue(expectedValue);
120+
expect(helper.scope.slider.min).to.equal(90);
121+
expect(helper.scope.slider.max).to.equal(100);
122+
});
84123
});
85124

86125
describe('Right to left Mouse controls - minRange and noSwitching Range Horizontal', function() {

0 commit comments

Comments
 (0)