Skip to content

I
i20rzslider
Commit 4ebb630c authored by Valentin Hervieu's avatar Valentin Hervieu Committed by Valentin Hervieu
Browse files
Options

Handle switching min/max with mouse when keyboardSupport is on.

parent 7a3b398b
Expand all Show whitespace changes
Inline Side-by-side
Showing with 17 additions and 17 deletions
dist/rzslider.js
View file @ 4ebb630c
...@@ -1159,7 +1159,7 @@ ...@@ -1159,7 +1159,7 @@
this.ticks.on('touchstart', angular.bind(this, this.onMove, this.ticks)); this.ticks.on('touchstart', angular.bind(this, this.onMove, this.ticks));
if (this.options.keyboardSupport) { if (this.options.keyboardSupport) {
this.minH.on('focus', angular.bind(this, this.onPointerFocus, this.minH, 'rzSliderModel')) this.minH.on('focus', angular.bind(this, this.onPointerFocus, this.minH, 'rzSliderModel'));
if (this.range) { if (this.range) {
this.maxH.on('focus', angular.bind(this, this.onPointerFocus, this.maxH, 'rzSliderHigh')); this.maxH.on('focus', angular.bind(this, this.onPointerFocus, this.maxH, 'rzSliderHigh'));
} }
...@@ -1269,14 +1269,14 @@ ...@@ -1269,14 +1269,14 @@
this.callOnEnd(); this.callOnEnd();
}, },
onPointerFocus: function(pointer, ref, event) { onPointerFocus: function(pointer, ref) {
this.tracking = ref; this.tracking = ref;
pointer.one('blur', angular.bind(this, this.onPointerBlur, pointer)); pointer.one('blur', angular.bind(this, this.onPointerBlur, pointer));
pointer.on('keydown', angular.bind(this, this.onKeyboardEvent)); pointer.on('keydown', angular.bind(this, this.onKeyboardEvent));
pointer.addClass('rz-active'); pointer.addClass('rz-active');
}, },
onPointerBlur: function(pointer, event) { onPointerBlur: function(pointer) {
pointer.off('keydown'); pointer.off('keydown');
this.tracking = ''; this.tracking = '';
pointer.removeClass('rz-active'); pointer.removeClass('rz-active');
...@@ -1312,11 +1312,7 @@ ...@@ -1312,11 +1312,7 @@
var newValue = this.roundStep(this.sanitizeValue(action)), var newValue = this.roundStep(this.sanitizeValue(action)),
newOffset = this.valueToOffset(newValue); newOffset = this.valueToOffset(newValue);
var switched = this.positionTrackingHandle(newValue, newOffset); this.positionTrackingHandle(newValue, newOffset);
if (switched) {
var pointer = this.tracking === 'rzSliderModel' ? this.minH : this.maxH;
pointer[0].focus(); //to focus the correct pointer
}
}, },
/** /**
...@@ -1423,6 +1419,8 @@ ...@@ -1423,6 +1419,8 @@
this.tracking = 'rzSliderHigh'; this.tracking = 'rzSliderHigh';
this.minH.removeClass('rz-active'); this.minH.removeClass('rz-active');
this.maxH.addClass('rz-active'); this.maxH.addClass('rz-active');
if (this.options.keyboardSupport)
this.maxH[0].focus();
valueChanged = true; valueChanged = true;
} else if (this.tracking === 'rzSliderHigh' && newValue <= this.scope.rzSliderModel) { } else if (this.tracking === 'rzSliderHigh' && newValue <= this.scope.rzSliderModel) {
switched = true; switched = true;
...@@ -1432,6 +1430,8 @@ ...@@ -1432,6 +1430,8 @@
this.tracking = 'rzSliderModel'; this.tracking = 'rzSliderModel';
this.maxH.removeClass('rz-active'); this.maxH.removeClass('rz-active');
this.minH.addClass('rz-active'); this.minH.addClass('rz-active');
if (this.options.keyboardSupport)
this.minH[0].focus();
valueChanged = true; valueChanged = true;
} }
} }
......
dist/rzslider.min.js
View file @ 4ebb630c
This diff is collapsed.
src/rzslider.js
View file @ 4ebb630c
...@@ -1159,7 +1159,7 @@ ...@@ -1159,7 +1159,7 @@
this.ticks.on('touchstart', angular.bind(this, this.onMove, this.ticks)); this.ticks.on('touchstart', angular.bind(this, this.onMove, this.ticks));
if (this.options.keyboardSupport) { if (this.options.keyboardSupport) {
this.minH.on('focus', angular.bind(this, this.onPointerFocus, this.minH, 'rzSliderModel')) this.minH.on('focus', angular.bind(this, this.onPointerFocus, this.minH, 'rzSliderModel'));
if (this.range) { if (this.range) {
this.maxH.on('focus', angular.bind(this, this.onPointerFocus, this.maxH, 'rzSliderHigh')); this.maxH.on('focus', angular.bind(this, this.onPointerFocus, this.maxH, 'rzSliderHigh'));
} }
...@@ -1269,14 +1269,14 @@ ...@@ -1269,14 +1269,14 @@
this.callOnEnd(); this.callOnEnd();
}, },
onPointerFocus: function(pointer, ref, event) { onPointerFocus: function(pointer, ref) {
this.tracking = ref; this.tracking = ref;
pointer.one('blur', angular.bind(this, this.onPointerBlur, pointer)); pointer.one('blur', angular.bind(this, this.onPointerBlur, pointer));
pointer.on('keydown', angular.bind(this, this.onKeyboardEvent)); pointer.on('keydown', angular.bind(this, this.onKeyboardEvent));
pointer.addClass('rz-active'); pointer.addClass('rz-active');
}, },
onPointerBlur: function(pointer, event) { onPointerBlur: function(pointer) {
pointer.off('keydown'); pointer.off('keydown');
this.tracking = ''; this.tracking = '';
pointer.removeClass('rz-active'); pointer.removeClass('rz-active');
...@@ -1312,11 +1312,7 @@ ...@@ -1312,11 +1312,7 @@
var newValue = this.roundStep(this.sanitizeValue(action)), var newValue = this.roundStep(this.sanitizeValue(action)),
newOffset = this.valueToOffset(newValue); newOffset = this.valueToOffset(newValue);
var switched = this.positionTrackingHandle(newValue, newOffset); this.positionTrackingHandle(newValue, newOffset);
if (switched) {
var pointer = this.tracking === 'rzSliderModel' ? this.minH : this.maxH;
pointer[0].focus(); //to focus the correct pointer
}
}, },
/** /**
...@@ -1423,6 +1419,8 @@ ...@@ -1423,6 +1419,8 @@
this.tracking = 'rzSliderHigh'; this.tracking = 'rzSliderHigh';
this.minH.removeClass('rz-active'); this.minH.removeClass('rz-active');
this.maxH.addClass('rz-active'); this.maxH.addClass('rz-active');
if (this.options.keyboardSupport)
this.maxH[0].focus();
valueChanged = true; valueChanged = true;
} else if (this.tracking === 'rzSliderHigh' && newValue <= this.scope.rzSliderModel) { } else if (this.tracking === 'rzSliderHigh' && newValue <= this.scope.rzSliderModel) {
switched = true; switched = true;
...@@ -1432,6 +1430,8 @@ ...@@ -1432,6 +1430,8 @@
this.tracking = 'rzSliderModel'; this.tracking = 'rzSliderModel';
this.maxH.removeClass('rz-active'); this.maxH.removeClass('rz-active');
this.minH.addClass('rz-active'); this.minH.addClass('rz-active');
if (this.options.keyboardSupport)
this.minH[0].focus();
valueChanged = true; valueChanged = true;
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment