IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-02-25 18:55:32 -06:00
Code Issues Packages Projects Releases Wiki Activity

Fix: Add pan direction data, do not activate pan when event is not vertical

Browse Source
This commit is contained in:
Jeff Wong 2018-07-02 15:26:01 -07:00
parent b4cb31d999
commit 42b11fc2c5
2 changed files with 23 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/assets/javascripts/discourse/components/topic-navigation.js.es6
View File

@ -138,7 +138,7 @@ export default Ember.Component.extend(PanEvents, {
const $centeredElement = $(document.elementFromPoint(center.x, center.y)); const $centeredElement = $(document.elementFromPoint(center.x, center.y));
if ($centeredElement.parents(".timeline-scrollarea-wrapper").length) { if ($centeredElement.parents(".timeline-scrollarea-wrapper").length) {
this.set("isPanning", false); this.set("isPanning", false);
} else { } else if (e.direction === "up" || e.direction === "down") {
this.set("isPanning", true); this.set("isPanning", true);
} }
}, },

27
app/assets/javascripts/discourse/mixins/pan-events.js.es6
View File

@ -27,6 +27,17 @@ export default Ember.Mixin.create({
} }
}, },
_calculateDirection(oldState, deltaX, deltaY) {
if (oldState.start || !oldState.direction) {
if (Math.abs(deltaX) > Math.abs(deltaY)) {
return deltaX > 0 ? "right" : "left";
} else {
return deltaY > 0 ? "down" : "up";
}
}
return oldState.direction;
},
_calculateNewPanState(oldState, e) { _calculateNewPanState(oldState, e) {
if (e.type === "pointerup" || e.type === "pointercancel") { if (e.type === "pointerup" || e.type === "pointercancel") {
return oldState; return oldState;
@ -34,8 +45,8 @@ export default Ember.Mixin.create({
const newTimestamp = new Date().getTime(); const newTimestamp = new Date().getTime();
const timeDiffSeconds = newTimestamp - oldState.timestamp; const timeDiffSeconds = newTimestamp - oldState.timestamp;
//calculate delta x, y, distance from START location //calculate delta x, y, distance from START location
const deltaX = Math.round(e.clientX) - oldState.startLocation.x; const deltaX = e.clientX - oldState.startLocation.x;
const deltaY = Math.round(e.clientY) - oldState.startLocation.y; const deltaY = e.clientY - oldState.startLocation.y;
const distance = Math.round( const distance = Math.round(
Math.sqrt(Math.pow(deltaX, 2) + Math.pow(deltaY, 2)) Math.sqrt(Math.pow(deltaX, 2) + Math.pow(deltaY, 2))
); );
@ -60,14 +71,15 @@ export default Ember.Mixin.create({
deltaY, deltaY,
distance, distance,
start: false, start: false,
timestamp: newTimestamp timestamp: newTimestamp,
direction: this._calculateDirection(oldState, deltaX, deltaY)
}; };
}, },
_panStart(e) { _panStart(e) {
const newState = { const newState = {
center: { x: Math.round(e.clientX), y: Math.round(e.clientY) }, center: { x: Math.round(e.clientX), y: Math.round(e.clientY) },
startLocation: { x: Math.round(e.clientX), y: Math.round(e.clientY) }, startLocation: { x: e.clientX, y: e.clientY },
velocity: 0, velocity: 0,
velocityX: 0, velocityX: 0,
velocityY: 0, velocityY: 0,
@ -75,12 +87,17 @@ export default Ember.Mixin.create({
deltaY: 0, deltaY: 0,
distance: 0, distance: 0,
start: true, start: true,
timestamp: new Date().getTime() timestamp: new Date().getTime(),
direction: null
}; };
this.set("_panState", newState); this.set("_panState", newState);
}, },
_panMove(e) { _panMove(e) {
if (!this.get("_panState")) {
_panStart(e);
return;
}
const previousState = this.get("_panState"); const previousState = this.get("_panState");
const newState = this._calculateNewPanState(previousState, e); const newState = this._calculateNewPanState(previousState, e);
this.set("_panState", newState); this.set("_panState", newState);