|
@ -112,7 +112,7 @@ Core.prototype._create = function (container) { |
|
|
} |
|
|
} |
|
|
}.bind(this)); |
|
|
}.bind(this)); |
|
|
this.on('touch', this._onTouch.bind(this)); |
|
|
this.on('touch', this._onTouch.bind(this)); |
|
|
this.on('pan', this._onDrag.bind(this)); |
|
|
|
|
|
|
|
|
this.on('panmove', this._onDrag.bind(this)); |
|
|
|
|
|
|
|
|
var me = this; |
|
|
var me = this; |
|
|
this.on('_change', function (properties) { |
|
|
this.on('_change', function (properties) { |
|
@ -191,8 +191,13 @@ Core.prototype._create = function (container) { |
|
|
|
|
|
|
|
|
var current = this.props.scrollTop; |
|
|
var current = this.props.scrollTop; |
|
|
var adjusted = current + delta * 120; |
|
|
var adjusted = current + delta * 120; |
|
|
|
|
|
|
|
|
if (this.isActive()) { |
|
|
if (this.isActive()) { |
|
|
this._setScrollTop(adjusted); |
|
|
this._setScrollTop(adjusted); |
|
|
|
|
|
if (this.options.verticalScroll) { |
|
|
|
|
|
this.dom.left.parentNode.scrollTop = -adjusted; |
|
|
|
|
|
this.dom.right.parentNode.scrollTop = -adjusted; |
|
|
|
|
|
} |
|
|
this._redraw(); |
|
|
this._redraw(); |
|
|
this.emit('scroll', event); |
|
|
this.emit('scroll', event); |
|
|
} |
|
|
} |
|
@ -202,29 +207,29 @@ Core.prototype._create = function (container) { |
|
|
event.preventDefault(); |
|
|
event.preventDefault(); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
if (this.dom.root.addEventListener) { |
|
|
|
|
|
|
|
|
if (this.dom.center.addEventListener) { |
|
|
// IE9, Chrome, Safari, Opera
|
|
|
// IE9, Chrome, Safari, Opera
|
|
|
this.dom.root.addEventListener("mousewheel", onMouseWheel.bind(this), false); |
|
|
|
|
|
|
|
|
this.dom.center.addEventListener("mousewheel", onMouseWheel.bind(this), false); |
|
|
// Firefox
|
|
|
// Firefox
|
|
|
this.dom.root.addEventListener("DOMMouseScroll", onMouseWheel.bind(this), false); |
|
|
|
|
|
|
|
|
this.dom.center.addEventListener("DOMMouseScroll", onMouseWheel.bind(this), false); |
|
|
} else { |
|
|
} else { |
|
|
// IE 6/7/8
|
|
|
// IE 6/7/8
|
|
|
this.dom.root.attachEvent("onmousewheel", onMouseWheel.bind(this)); |
|
|
|
|
|
|
|
|
this.dom.center.attachEvent("onmousewheel", onMouseWheel.bind(this)); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
function onMouseScrollSide(event) { |
|
|
function onMouseScrollSide(event) { |
|
|
var current = this.scrollTop; |
|
|
|
|
|
var adjusted = -current; |
|
|
|
|
|
|
|
|
if (!me.options.verticalScroll) return; |
|
|
|
|
|
event.preventDefault(); |
|
|
if (me.isActive()) { |
|
|
if (me.isActive()) { |
|
|
|
|
|
var adjusted = -event.target.scrollTop; |
|
|
me._setScrollTop(adjusted); |
|
|
me._setScrollTop(adjusted); |
|
|
|
|
|
|
|
|
me._redraw(); |
|
|
me._redraw(); |
|
|
me.emit('scroll', event); |
|
|
|
|
|
|
|
|
me.emit('scrollSide', event); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
this.dom.left.parentNode.addEventListener('scroll', onMouseScrollSide); |
|
|
|
|
|
this.dom.right.parentNode.addEventListener('scroll', onMouseScrollSide); |
|
|
|
|
|
|
|
|
this.dom.left.parentNode.addEventListener('scroll', onMouseScrollSide.bind(this)); |
|
|
|
|
|
this.dom.right.parentNode.addEventListener('scroll', onMouseScrollSide.bind(this)); |
|
|
|
|
|
|
|
|
this.customTimes = []; |
|
|
this.customTimes = []; |
|
|
|
|
|
|
|
@ -820,10 +825,9 @@ Core.prototype._redraw = function() { |
|
|
|
|
|
|
|
|
// update the scrollTop, feasible range for the offset can be changed
|
|
|
// update the scrollTop, feasible range for the offset can be changed
|
|
|
// when the height of the Core or of the contents of the center changed
|
|
|
// when the height of the Core or of the contents of the center changed
|
|
|
this._updateScrollTop(); |
|
|
|
|
|
|
|
|
var offset = this._updateScrollTop(); |
|
|
|
|
|
|
|
|
// reposition the scrollable contents
|
|
|
// reposition the scrollable contents
|
|
|
var offset = this.props.scrollTop; |
|
|
|
|
|
if (options.orientation.item != 'top') { |
|
|
if (options.orientation.item != 'top') { |
|
|
offset += Math.max(this.props.centerContainer.height - this.props.center.height - |
|
|
offset += Math.max(this.props.centerContainer.height - this.props.center.height - |
|
|
this.props.border.top - this.props.border.bottom, 0); |
|
|
this.props.border.top - this.props.border.bottom, 0); |
|
@ -844,12 +848,10 @@ Core.prototype._redraw = function() { |
|
|
dom.shadowBottomRight.style.visibility = visibilityBottom; |
|
|
dom.shadowBottomRight.style.visibility = visibilityBottom; |
|
|
|
|
|
|
|
|
if (this.options.verticalScroll) { |
|
|
if (this.options.verticalScroll) { |
|
|
this.dom.shadowTopRight.style.visibility = "hidden"; |
|
|
|
|
|
this.dom.shadowBottomRight.style.visibility = "hidden"; |
|
|
|
|
|
this.dom.shadowTopLeft.style.visibility = "hidden"; |
|
|
|
|
|
this.dom.shadowBottomLeft.style.visibility = "hidden"; |
|
|
|
|
|
document.getElementsByClassName('vis-left')[0].scrollTop = -offset; |
|
|
|
|
|
document.getElementsByClassName('vis-right')[0].scrollTop = -offset; |
|
|
|
|
|
|
|
|
dom.shadowTopRight.style.visibility = "hidden"; |
|
|
|
|
|
dom.shadowBottomRight.style.visibility = "hidden"; |
|
|
|
|
|
dom.shadowTopLeft.style.visibility = "hidden"; |
|
|
|
|
|
dom.shadowBottomLeft.style.visibility = "hidden"; |
|
|
} else { |
|
|
} else { |
|
|
dom.left.style.top = offset + 'px'; |
|
|
dom.left.style.top = offset + 'px'; |
|
|
dom.right.style.top = offset + 'px'; |
|
|
dom.right.style.top = offset + 'px'; |
|
@ -1070,6 +1072,7 @@ Core.prototype._onPinch = function (event) { |
|
|
* @private |
|
|
* @private |
|
|
*/ |
|
|
*/ |
|
|
Core.prototype._onDrag = function (event) { |
|
|
Core.prototype._onDrag = function (event) { |
|
|
|
|
|
if (!event) return |
|
|
// refuse to drag when we where pinching to prevent the timeline make a jump
|
|
|
// refuse to drag when we where pinching to prevent the timeline make a jump
|
|
|
// when releasing the fingers in opposite order from the touch screen
|
|
|
// when releasing the fingers in opposite order from the touch screen
|
|
|
if (!this.touch.allowDragging) return; |
|
|
if (!this.touch.allowDragging) return; |
|
@ -1079,6 +1082,10 @@ Core.prototype._onDrag = function (event) { |
|
|
var oldScrollTop = this._getScrollTop(); |
|
|
var oldScrollTop = this._getScrollTop(); |
|
|
var newScrollTop = this._setScrollTop(this.touch.initialScrollTop + delta); |
|
|
var newScrollTop = this._setScrollTop(this.touch.initialScrollTop + delta); |
|
|
|
|
|
|
|
|
|
|
|
if (this.options.verticalScroll) { |
|
|
|
|
|
this.dom.left.parentNode.scrollTop = -this.props.scrollTop; |
|
|
|
|
|
this.dom.right.parentNode.scrollTop = -this.props.scrollTop; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
if (newScrollTop != oldScrollTop) { |
|
|
if (newScrollTop != oldScrollTop) { |
|
|
this.emit("verticalDrag"); |
|
|
this.emit("verticalDrag"); |
|
|