Browse Source

Fixed vertical scroll not working in Timeline and Graph2d

flowchartTest
jos 9 years ago
parent
commit
08b6f7b75a
2 changed files with 57 additions and 12 deletions
  1. +57
    -1
      lib/timeline/Core.js
  2. +0
    -11
      lib/timeline/Range.js

+ 57
- 1
lib/timeline/Core.js View File

@ -92,6 +92,9 @@ Core.prototype._create = function (container) {
this.dom.rightContainer.appendChild(this.dom.shadowBottomRight);
this.on('rangechange', this.redraw.bind(this));
this.on('touch', this._onTouch.bind(this));
this.on('panstart', this._onDragStart.bind(this));
this.on('pan', this._onDrag.bind(this));
var me = this;
this.on('change', function (properties) {
@ -112,7 +115,7 @@ Core.prototype._create = function (container) {
// create event listeners for all interesting events, these events will be
// emitted via emitter
this.hammer = new Hammer(this.dom.root, {touchAction: 'pan-y'});
this.hammer = new Hammer(this.dom.root);
this.hammer.get('pinch').set({enable: true});
this.listeners = {};
@ -138,6 +141,7 @@ Core.prototype._create = function (container) {
// emulate a touch event (emitted before the start of a pan, pinch, tap, or press)
hammerUtil.onTouch(this.hammer, function (event) {
console.log('touch', event)
me.emit('touch', event);
}.bind(this));
@ -171,6 +175,9 @@ Core.prototype._create = function (container) {
scrollTopMin: 0
};
// store state information needed for touch events
this.touch = {};
this.redrawCount = 0;
// attach the root panel to the provided container
@ -922,6 +929,55 @@ Core.prototype._stopAutoResize = function () {
this._onResize = null;
};
/**
* Start moving the timeline vertically
* @param {Event} event
* @private
*/
Core.prototype._onTouch = function (event) {
this.touch.allowDragging = true;
};
/**
* Start moving the timeline vertically
* @param {Event} event
* @private
*/
Core.prototype._onPinch = function (event) {
this.touch.allowDragging = false;
};
/**
* Start moving the timeline vertically
* @param {Event} event
* @private
*/
Core.prototype._onDragStart = function (event) {
this.touch.initialScrollTop = this.props.scrollTop;
};
/**
* Move the timeline vertically
* @param {Event} event
* @private
*/
Core.prototype._onDrag = function (event) {
// 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
if (!this.touch.allowDragging) return;
var delta = event.deltaY;
var oldScrollTop = this._getScrollTop();
var newScrollTop = this._setScrollTop(this.touch.initialScrollTop + delta);
if (newScrollTop != oldScrollTop) {
this._redraw(); // TODO: this causes two redraws when dragging, the other is triggered by rangechange already
this.emit("verticalDrag");
}
};
/**
* Apply a scrollTop
* @param {Number} scrollTop

+ 0
- 11
lib/timeline/Range.js View File

@ -47,9 +47,6 @@ function Range(body, options) {
this.body.emitter.on('panmove', this._onDrag.bind(this));
this.body.emitter.on('panend', this._onDragEnd.bind(this));
// ignore dragging when holding
this.body.emitter.on('press', this._onHold.bind(this));
// mouse wheel for zooming
this.body.emitter.on('mousewheel', this._onMouseWheel.bind(this));
@ -509,14 +506,6 @@ Range.prototype._onTouch = function (event) {
this.deltaDifference = 0;
};
/**
* On start of a hold gesture
* @private
*/
Range.prototype._onHold = function () {
this.props.touch.allowDragging = false;
};
/**
* Handle pinch event
* @param {Event} event

Loading…
Cancel
Save