Skip to content

I
i20rzslider
Commit 9bca8ac9 authored by daniela.mateescu's avatar daniela.mateescu Committed by Valentin Hervieu
Browse files
Options

fix: Fix for wrong slider drag when having many touches simultaneous 

#534
parent 5bf3f228
Expand all Show whitespace changes
Inline Side-by-side
Showing with 398 additions and 38 deletions
dist/rzslider.css
View file @ 9bca8ac9
This diff is collapsed.
dist/rzslider.js
View file @ 9bca8ac9
/*! angularjs-slider - v6.1.2 -
(c) Rafal Zajac <rzajac@gmail.com>, Valentin Hervieu <valentin@hervieu.me>, Jussi Saarivirta <jusasi@gmail.com>, Angelin Sirbu <angelin.sirbu@gmail.com> -
https://github.com/angular-slider/angularjs-slider -
2017-05-15 */
2017-05-25 */
/*jslint unparam: true */
/*global angular: false, console: false, define, module */
(function(root, factory) {
......@@ -1560,9 +1560,10 @@
* Get the X-coordinate or Y-coordinate of an event
*
* @param {Object} event The event
* @param targetTouchId The identifier of the touch for that we will get the x and y coordinates
* @returns {number}
*/
getEventXY: function(event) {
getEventXY: function(event, targetTouchId) {
/* http://stackoverflow.com/a/12336075/282882 */
//noinspection JSLint
var clientXY = this.options.vertical ? 'clientY' : 'clientX';
......@@ -1570,22 +1571,35 @@
return event[clientXY];
}
return event.originalEvent === undefined ?
event.touches[0][clientXY] : event.originalEvent.touches[0][clientXY];
var eventXY;
var touches = event.originalEvent === undefined ? event.touches : event.originalEvent.touches;
if (targetTouchId !== undefined) {
for (var i = 0; i < touches.length; i++) {
if (touches[i].identifier == targetTouchId) {
return touches[i][clientXY];
}
}
}
// If the target touch was not found in the event
// returns the coordinates of the first touch
return touches[0][clientXY];
},
/**
* Compute the event position depending on whether the slider is horizontal or vertical
* @param event
* @param targetTouchId If targetTouchId is provided it will be considered the position of that
* @returns {number}
*/
getEventPosition: function(event) {
getEventPosition: function(event, targetTouchId) {
var sliderPos = this.sliderElem.rzsp,
eventPos = 0;
if (this.options.vertical)
eventPos = -this.getEventXY(event) + sliderPos;
eventPos = -this.getEventXY(event, targetTouchId) + sliderPos;
else
eventPos = this.getEventXY(event) - sliderPos;
eventPos = this.getEventXY(event, targetTouchId) - sliderPos;
return eventPos * this.options.scale - this.handleHalfDim; // #346 handleHalfDim is already scaled
},
......@@ -1763,8 +1777,19 @@
ehEnd = angular.bind(this, this.onEnd, ehMove);
$document.on(eventNames.moveEvent, ehMove);
$document.one(eventNames.endEvent, ehEnd);
$document.on(eventNames.endEvent, ehEnd);
this.ehEndToBeRemovedOnEnd = ehEnd;
this.callOnStart();
var changedTouches = event.originalEvent === undefined ? event.changedTouches : event.originalEvent.changedTouches;
if (changedTouches) {
// Store the touch identifier
if (!this.touchId) {
this.isDragging = true;
this.touchId = changedTouches[0].identifier;
}
}
},
/**
......@@ -1776,7 +1801,22 @@
* @returns {undefined}
*/
onMove: function(pointer, event, fromTick) {
var newPos = this.getEventPosition(event),
var changedTouches = event.originalEvent === undefined ? event.changedTouches : event.originalEvent.changedTouches;
var touchForThisSlider;
if (changedTouches) {
for (var i = 0; i < changedTouches.length; i++) {
if (changedTouches[i].identifier == this.touchId) {
touchForThisSlider = changedTouches[i];
break;
}
}
}
if (changedTouches && !touchForThisSlider) {
return;
}
var newPos = this.getEventPosition(event, touchForThisSlider ? touchForThisSlider.identifier : undefined),
newValue,
ceilValue = this.options.rightToLeft ? this.minValue : this.maxValue,
flrValue = this.options.rightToLeft ? this.maxValue : this.minValue;
......@@ -1803,6 +1843,16 @@
* @returns {undefined}
*/
onEnd: function(ehMove, event) {
var changedTouches = event.originalEvent === undefined ? event.changedTouches : event.originalEvent.changedTouches;
if (changedTouches && changedTouches[0].identifier != this.touchId) {
return;
}
this.isDragging = false;
this.touchId = null;
// Touch event, the listener was added by us so we need to remove it
$document.off("touchend", this.ehEndToBeRemovedOnEnd);
var moveEventName = this.getEventNames(event).moveEvent;
if (!this.options.keyboardSupport) {
......@@ -1842,9 +1892,11 @@
onPointerBlur: function(pointer) {
pointer.off('keydown');
pointer.off('keyup');
this.tracking = '';
pointer.removeClass('rz-active');
if (!this.isDragging) {
this.tracking = '';
this.currentFocusElement = null
}
},
/**
......
dist/rzslider.min.css
View file @ 9bca8ac9
/*! angularjs-slider - v6.1.2 - (c) Rafal Zajac <rzajac@gmail.com>, Valentin Hervieu <valentin@hervieu.me>, Jussi Saarivirta <jusasi@gmail.com>, Angelin Sirbu <angelin.sirbu@gmail.com> - https://github.com/angular-slider/angularjs-slider - 2017-05-15 */
/*! angularjs-slider - v6.1.2 - (c) Rafal Zajac <rzajac@gmail.com>, Valentin Hervieu <valentin@hervieu.me>, Jussi Saarivirta <jusasi@gmail.com>, Angelin Sirbu <angelin.sirbu@gmail.com> - https://github.com/angular-slider/angularjs-slider - 2017-05-25 */
.rzslider{position:relative;display:inline-block;width:100%;height:4px;margin:35px 0 15px 0;vertical-align:middle;user-select:none}.rzslider.with-legend{margin-bottom:40px}.rzslider[disabled]{cursor:not-allowed}.rzslider[disabled] .rz-pointer{cursor:not-allowed;background-color:#d8e0f3}.rzslider[disabled] .rz-draggable{cursor:not-allowed}.rzslider[disabled] .rz-selection{background:#8b91a2}.rzslider[disabled] .rz-tick{cursor:not-allowed}.rzslider[disabled] .rz-tick.rz-selected{background:#8b91a2}.rzslider span{position:absolute;display:inline-block;white-space:nowrap}.rzslider .rz-base{width:100%;height:100%;padding:0}.rzslider .rz-bar-wrapper{left:0;z-index:1;width:100%;height:32px;padding-top:16px;margin-top:-16px;box-sizing:border-box}.rzslider .rz-draggable{cursor:move}.rzslider .rz-bar{left:0;z-index:1;width:100%;height:4px;background:#d8e0f3;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.rzslider .rz-selection{z-index:2;background:#0db9f0;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.rzslider .rz-pointer{top:-14px;z-index:3;width:32px;height:32px;cursor:pointer;background-color:#0db9f0;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px}.rzslider .rz-pointer:after{position:absolute;top:12px;left:12px;width:8px;height:8px;background:#fff;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;content:''}.rzslider .rz-pointer:hover:after{background-color:#fff}.rzslider .rz-pointer.rz-active{z-index:4}.rzslider .rz-pointer.rz-active:after{background-color:#451aff}.rzslider .rz-bubble{bottom:16px;padding:1px 3px;color:#55637d;cursor:default}.rzslider .rz-bubble.rz-limit{color:#55637d}.rzslider .rz-ticks{position:absolute;top:-3px;left:0;z-index:1;width:100%;height:0;margin:0;list-style:none;box-sizing:border-box}.rzslider .rz-ticks-values-under .rz-tick-value{top:auto;bottom:-32px}.rzslider .rz-tick{position:absolute;top:0;left:0;width:10px;height:10px;margin-left:11px;text-align:center;cursor:pointer;background:#d8e0f3;border-radius:50%}.rzslider .rz-tick.rz-selected{background:#0db9f0}.rzslider .rz-tick-value{position:absolute;top:-30px;transform:translate(-50%,0)}.rzslider .rz-tick-legend{position:absolute;top:24px;max-width:50px;white-space:normal;transform:translate(-50%,0)}.rzslider.rz-vertical{position:relative;width:4px;height:100%;padding:0;margin:0 20px;vertical-align:baseline}.rzslider.rz-vertical .rz-base{width:100%;height:100%;padding:0}.rzslider.rz-vertical .rz-bar-wrapper{top:auto;left:0;width:32px;height:100%;padding:0 0 0 16px;margin:0 0 0 -16px}.rzslider.rz-vertical .rz-bar{bottom:0;left:auto;width:4px;height:100%}.rzslider.rz-vertical .rz-pointer{top:auto;bottom:0;left:-14px!important}.rzslider.rz-vertical .rz-bubble{bottom:0;left:16px!important;margin-left:3px}.rzslider.rz-vertical .rz-ticks{top:0;left:-3px;z-index:1;width:0;height:100%}.rzslider.rz-vertical .rz-tick{margin-top:11px;margin-left:auto;vertical-align:middle}.rzslider.rz-vertical .rz-tick-value{top:auto;left:24px;transform:translate(0,-28%)}.rzslider.rz-vertical .rz-tick-legend{top:auto;right:24px;max-width:none;white-space:nowrap;transform:translate(0,-28%)}.rzslider.rz-vertical .rz-ticks-values-under .rz-tick-value{right:24px;bottom:auto;left:auto}
\ No newline at end of file
dist/rzslider.min.js
View file @ 9bca8ac9
This diff is collapsed.
dist/rzslider.scss
View file @ 9bca8ac9
This diff is collapsed.
src/rzslider.js
View file @ 9bca8ac9
......@@ -1564,9 +1564,10 @@
* Get the X-coordinate or Y-coordinate of an event
*
* @param {Object} event The event
* @param targetTouchId The identifier of the touch with the X/Y coordinates
* @returns {number}
*/
getEventXY: function(event) {
getEventXY: function(event, targetTouchId) {
/* http://stackoverflow.com/a/12336075/282882 */
//noinspection JSLint
var clientXY = this.options.vertical ? 'clientY' : 'clientX';
......@@ -1574,22 +1575,35 @@
return event[clientXY];
}
return event.originalEvent === undefined ?
event.touches[0][clientXY] : event.originalEvent.touches[0][clientXY];
var eventXY;
var touches = event.originalEvent === undefined ? event.touches : event.originalEvent.touches;
if (targetTouchId !== undefined) {
for (var i = 0; i < touches.length; i++) {
if (touches[i].identifier == targetTouchId) {
return touches[i][clientXY];
}
}
}
// If no target touch or the target touch was not found in the event
// returns the coordinates of the first touch
return touches[0][clientXY];
},
/**
* Compute the event position depending on whether the slider is horizontal or vertical
* @param event
* @param targetTouchId If targetTouchId is provided it will be considered the position of that
* @returns {number}
*/
getEventPosition: function(event) {
getEventPosition: function(event, targetTouchId) {
var sliderPos = this.sliderElem.rzsp,
eventPos = 0;
if (this.options.vertical)
eventPos = -this.getEventXY(event) + sliderPos;
eventPos = -this.getEventXY(event, targetTouchId) + sliderPos;
else
eventPos = this.getEventXY(event) - sliderPos;
eventPos = this.getEventXY(event, targetTouchId) - sliderPos;
return eventPos * this.options.scale - this.handleHalfDim; // #346 handleHalfDim is already scaled
},
......@@ -1767,8 +1781,19 @@
ehEnd = angular.bind(this, this.onEnd, ehMove);
$document.on(eventNames.moveEvent, ehMove);
$document.one(eventNames.endEvent, ehEnd);
$document.on(eventNames.endEvent, ehEnd);
this.ehEndToBeRemovedOnEnd = ehEnd;
this.callOnStart();
var changedTouches = event.originalEvent === undefined ? event.changedTouches : event.originalEvent.changedTouches;
if (changedTouches) {
// Store the touch identifier
if (!this.touchId) {
this.isDragging = true;
this.touchId = changedTouches[0].identifier;
}
}
},
/**
......@@ -1780,7 +1805,22 @@
* @returns {undefined}
*/
onMove: function(pointer, event, fromTick) {
var newPos = this.getEventPosition(event),
var changedTouches = event.originalEvent === undefined ? event.changedTouches : event.originalEvent.changedTouches;
var touchForThisSlider;
if (changedTouches) {
for (var i = 0; i < changedTouches.length; i++) {
if (changedTouches[i].identifier == this.touchId) {
touchForThisSlider = changedTouches[i];
break;
}
}
}
if (changedTouches && !touchForThisSlider) {
return;
}
var newPos = this.getEventPosition(event, touchForThisSlider ? touchForThisSlider.identifier : undefined),
newValue,
ceilValue = this.options.rightToLeft ? this.minValue : this.maxValue,
flrValue = this.options.rightToLeft ? this.maxValue : this.minValue;
......@@ -1807,6 +1847,16 @@
* @returns {undefined}
*/
onEnd: function(ehMove, event) {
var changedTouches = event.originalEvent === undefined ? event.changedTouches : event.originalEvent.changedTouches;
if (changedTouches && changedTouches[0].identifier != this.touchId) {
return;
}
this.isDragging = false;
this.touchId = null;
// Touch event, the listener was added by us so we need to remove it
$document.off("touchend", this.ehEndToBeRemovedOnEnd);
var moveEventName = this.getEventNames(event).moveEvent;
if (!this.options.keyboardSupport) {
......@@ -1846,9 +1896,11 @@
onPointerBlur: function(pointer) {
pointer.off('keydown');
pointer.off('keyup');
this.tracking = '';
pointer.removeClass('rz-active');
if (!this.isDragging) {
this.tracking = '';
this.currentFocusElement = null
}
},
/**
......
tests/specs/helper.js
View file @ 9bca8ac9
......@@ -96,6 +96,73 @@
$document.triggerHandler(event);
};
h.fireTouchstartWithOriginalEvent = function(element, position, touchIdentifier, touchesIds, vertical) {
var event = {type:'touchstart', originalEvent: this.getTouchEvent('touchstart', position, vertical, touchIdentifier, touchesIds, sinon.stub())};
element.triggerHandler(event);
return event;
};
h.fireTouchstartWithoutOriginalEvent = function(element, position, touchIdentifier, touchesIds, vertical) {
var event = this.getTouchEvent('touchstart', position, vertical, touchIdentifier, touchesIds, sinon.stub());
element.triggerHandler(event);
return event;
};
h.fireTouchmoveWithOriginalEvent = function(position, touchIdentifier, touchesIds, vertical) {
var event = {type:'touchmove', originalEvent: this.getTouchEvent('touchmove', position, vertical, touchIdentifier, touchesIds)};
$document.triggerHandler(event);
return event;
};
h.fireTouchmoveWithoutOriginalEvent = function(position, touchIdentifier, touchesIds, vertical) {
var event = this.getTouchEvent('touchmove', position, vertical, touchIdentifier, touchesIds);
$document.triggerHandler(event);
return event;
};
h.fireTouchendWithOriginalEvent = function(touchIdentifier, touchesIds, vertical) {
var event = {type:'touchend', originalEvent: this.getTouchEvent('touchend', 0, vertical, touchIdentifier, touchesIds)};
$document.triggerHandler(event);
return event;
};
h.fireTouchendWithoutOriginalEvent = function(touchIdentifier, touchesIds, vertical) {
var event = this.getTouchEvent('touchend', 0, vertical, touchIdentifier, touchesIds);
$document.triggerHandler(event);
return event;
};
h.getTouchEvent = function(type, position, vertical, changedTouchId, touchesIds, preventDefaultAndStopPropagation) {
var positionProp = vertical ? 'clientY' : 'clientX';
var changedTouches = [{identifier:changedTouchId}];
changedTouches[0][positionProp] = position;
var touches = [];
for (var i = 0; i < touchesIds.length; i++) {
var touch = {identifier: touchesIds[i]};
if (touch.identifier == changedTouchId) {
touch[positionProp] = position;
}
touches.push(touch);
}
var originalEvent = {
type: type,
preventDefault: preventDefaultAndStopPropagation,
stopPropagation: preventDefaultAndStopPropagation,
changedTouches: changedTouches,
touches: touches
};
return originalEvent;
}
h.pressKeydown = function(element, key, options) {
options = options || {};
key = key.toUpperCase();
......
tests/specs/mouse-controls/single-slider-horizontal-test.js
View file @ 9bca8ac9
......@@ -407,5 +407,99 @@
expect(helper.slider.callOnStart.callCount).to.equal(1);
expect(helper.slider.callOnChange.callCount).to.equal(1);
});
it('should handle touch start, touch move and touch end correctly when multitouch with originalEvent', function() {
sinon.spy(helper.slider, 'positionTrackingHandle');
sinon.spy(helper.slider, 'callOnChange');
// Touch start for the slider
helper.fireTouchstartWithOriginalEvent(helper.slider.minH, 0, 0, [0]);
var expectedValue = 50;
var touchPositionForSlider = helper.getMousePosition(expectedValue);
// Touch move for the slider
helper.fireTouchmoveWithOriginalEvent(touchPositionForSlider, 0, [0, 1]);
// Simultaneous touch move but not on slider
var otherTouchPosition = touchPositionForSlider + 100;
helper.fireTouchmoveWithOriginalEvent(otherTouchPosition, 1, [0, 1]);
// The slider does not react
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(1);
expect(helper.slider.callOnChange.callCount).to.equal(1);
// The other simultaneous touch ends
helper.fireTouchendWithOriginalEvent(1, [0,1]);
var expectedValue = 60;
var touchPositionForSlider = helper.getMousePosition(expectedValue);
// Touch move for the slider
helper.fireTouchmoveWithOriginalEvent(touchPositionForSlider, 0, [0, 1]);
// Can still drag the slider
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(2);
expect(helper.slider.callOnChange.callCount).to.equal(2);
// Slider touch ends
helper.fireTouchendWithOriginalEvent(0, [0,1]);
// Touch move for the slider
var touchPositionForSlider = helper.getMousePosition(70);
helper.fireTouchmoveWithOriginalEvent(touchPositionForSlider, 0, [0, 1]);
// Can not drag the slider anymore
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(2);
expect(helper.slider.callOnChange.callCount).to.equal(2);
});
it('should handle touch start, touch move and touch end correctly when multitouch without originalEvent', function() {
sinon.spy(helper.slider, 'positionTrackingHandle');
sinon.spy(helper.slider, 'callOnChange');
// Touch start for the slider
var eventOnSlider = helper.fireTouchstartWithoutOriginalEvent(helper.slider.minH, 0, 0, [0]);
var expectedValue = 50;
var touchPositionForSlider = helper.getMousePosition(expectedValue);
// Touch move for the slider
helper.fireTouchmoveWithoutOriginalEvent(touchPositionForSlider, 0, [0, 1]);
// Simultaneous touch move but not on slider
var otherTouchPosition = touchPositionForSlider + 100;
helper.fireTouchmoveWithoutOriginalEvent(otherTouchPosition, 1, [0, 1]);
// The slider does not react
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(1);
expect(helper.slider.callOnChange.callCount).to.equal(1);
// The other simultaneous touch ends
helper.fireTouchendWithoutOriginalEvent(1, [0,1]);
var expectedValue = 60;
var touchPositionForSlider = helper.getMousePosition(expectedValue);
// Touch move for slider
helper.fireTouchmoveWithoutOriginalEvent(touchPositionForSlider, 0, [0, 1]);
// Can still drag the slider
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(2);
expect(helper.slider.callOnChange.callCount).to.equal(2);
// Slider touch ends
helper.fireTouchendWithoutOriginalEvent(0, [0,1]);
// Touch move for the slider
var touchPositionForSlider = helper.getMousePosition(70);
helper.fireTouchmoveWithoutOriginalEvent(touchPositionForSlider, 0, [0, 1]);
// Can not drag the slider anymore
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(2);
expect(helper.slider.callOnChange.callCount).to.equal(2);
});
});
}());
tests/specs/mouse-controls/single-slider-vertical-test.js
View file @ 9bca8ac9
......@@ -414,6 +414,101 @@
expect(helper.slider.callOnStart.callCount).to.equal(1);
expect(helper.slider.callOnChange.callCount).to.equal(1);
});
it('should handle touch start, touch move and touch end correctly when multitouch with originalEvent', function() {
sinon.spy(helper.slider, 'positionTrackingHandle');
sinon.spy(helper.slider, 'callOnChange');
// Touch start for the slider
var eventOnSlider = helper.fireTouchstartWithOriginalEvent(helper.slider.minH, 0, 0, [0], true);
var expectedValue = 50;
var touchPositionForSlider = helper.slider.sliderElem.rzsp - helper.slider.valueToPosition(expectedValue) - helper.slider.handleHalfDim;
// Touch move for the slider
helper.fireTouchmoveWithOriginalEvent(touchPositionForSlider, 0, [0, 1], true);
// Simultaneous touch move but not on slider
var otherTouchPosition = touchPositionForSlider + 100;
helper.fireTouchmoveWithOriginalEvent(otherTouchPosition, 1, [0, 1], true);
// The slider does not react
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(1);
expect(helper.slider.callOnChange.callCount).to.equal(1);
// The other simultaneous touch ends
helper.fireTouchendWithOriginalEvent(1, [0,1], true);
var expectedValue = 60;
var touchPositionForSlider = helper.slider.sliderElem.rzsp - helper.slider.valueToPosition(expectedValue) - helper.slider.handleHalfDim;
// Touch move for the slider
helper.fireTouchmoveWithOriginalEvent(touchPositionForSlider, 0, [0, 1], true);
// Can still drag the slider
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(2);
expect(helper.slider.callOnChange.callCount).to.equal(2);
// Slider touch ends
helper.fireTouchendWithOriginalEvent(0, [0,1], true);
// Touch move for the slider
var touchPositionForSlider = helper.slider.sliderElem.rzsp - helper.slider.valueToPosition(70) - helper.slider.handleHalfDim;
helper.fireTouchmoveWithOriginalEvent(touchPositionForSlider, 0, [0, 1], true);
//Can not drag the slider anymore
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(2);
expect(helper.slider.callOnChange.callCount).to.equal(2);
});
it('should handle touch start, touch move and touch end correctly when multitouch without originalEvent', function() {
sinon.spy(helper.slider, 'positionTrackingHandle');
sinon.spy(helper.slider, 'callOnChange');
// Touch start for the slider
var eventOnSlider = helper.fireTouchstartWithoutOriginalEvent(helper.slider.minH, 0, 0, [0], true);
var expectedValue = 50;
var touchPositionForSlider = helper.slider.sliderElem.rzsp - helper.slider.valueToPosition(expectedValue) - helper.slider.handleHalfDim;
// Touch move for slider
helper.fireTouchmoveWithoutOriginalEvent(touchPositionForSlider, 0, [0, 1], true);
// Simultaneous touch move but not on slider
var otherTouchPosition = touchPositionForSlider + 100;
helper.fireTouchmoveWithoutOriginalEvent(otherTouchPosition, 1, [0, 1], true);
// The slider does not react
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(1);
expect(helper.slider.callOnChange.callCount).to.equal(1);
// The other simultaneous touch ends
helper.fireTouchendWithoutOriginalEvent(1, [0,1], true);
var expectedValue = 60;
var touchPositionForSlider = helper.slider.sliderElem.rzsp - helper.slider.valueToPosition(expectedValue) - helper.slider.handleHalfDim;
// Touch move for slider
helper.fireTouchmoveWithoutOriginalEvent(touchPositionForSlider, 0, [0, 1], true);
// Can still drag the slider
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(2);
expect(helper.slider.callOnChange.callCount).to.equal(2);
// Slider touch ends
helper.fireTouchendWithoutOriginalEvent(0, [0,1], true);
// Touch move for the slider
var touchPositionForSlider = helper.slider.sliderElem.rzsp - helper.slider.valueToPosition(70) - helper.slider.handleHalfDim;
// Can not drag the slider anymore
helper.fireTouchmoveWithoutOriginalEvent(touchPositionForSlider, 0, [0, 1], true);
expect(helper.scope.slider.value).to.equal(expectedValue);
expect(helper.slider.positionTrackingHandle.callCount).to.equal(2);
expect(helper.slider.callOnChange.callCount).to.equal(2);
});
});
}());
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