FIX: Register pan events for touch only

* touch events - only register touch, not pointer events
* immediately request redraw frame, do not wait for after render to fire.
This commit is contained in:
Jeff Wong 2019-02-04 08:27:40 -08:00 committed by GitHub
parent e0e91fad87
commit 9de906ddab
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 39 deletions

View File

@ -137,6 +137,7 @@ const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
this._isPanning = true;
$("header.d-header").removeClass("scroll-down scroll-up");
this.eventDispatched(this._leftMenuAction(), "header");
window.requestAnimationFrame(() => this.panMove(e));
} else if (
windowWidth - center.x < SCREEN_EDGE_MARGIN &&
!this.$(".menu-panel").length &&
@ -148,6 +149,7 @@ const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
this._isPanning = true;
$("header.d-header").removeClass("scroll-down scroll-up");
this.eventDispatched(this._rightMenuAction(), "header");
window.requestAnimationFrame(() => this.panMove(e));
} else {
this._isPanning = false;
}
@ -242,13 +244,7 @@ const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
}
});
if (this.site.mobileView) {
$("body")
.on("pointerdown", e => this._panStart(e))
.on("pointermove", e => this._panMove(e))
.on("pointerup", e => this._panMove(e))
.on("pointercancel", e => this._panMove(e));
}
this.addTouchListeners($("body"));
},
willDestroyElement() {
@ -260,13 +256,8 @@ const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
this.appEvents.off("header:hide-topic");
this.appEvents.off("dom:clean");
if (this.site.mobileView) {
$("body")
.off("pointerdown")
.off("pointerup")
.off("pointermove")
.off("pointercancel");
}
this.removeTouchListeners($("body"));
Ember.run.cancel(this._scheduledRemoveAnimate);
window.cancelAnimationFrame(this._scheduledMovingAnimation);
},

View File

@ -12,37 +12,31 @@ export default Ember.Mixin.create({
didInsertElement() {
this._super(...arguments);
if (this.site.mobileView) {
if ("onpointerdown" in document.documentElement) {
this.$()
.on("pointerdown", e => this._panStart(e))
.on("pointermove", e => this._panMove(e, e))
.on("pointerup", e => this._panMove(e, e))
.on("pointercancel", e => this._panMove(e, e));
} else if ("ontouchstart" in document.documentElement) {
this.$()
.on("touchstart", e => this._panStart(e.touches[0]))
.on("touchmove", e => {
const touchEvent = e.touches[0];
touchEvent.type = "pointermove";
this._panMove(touchEvent, e);
})
.on("touchend", e => this._panMove({ type: "pointerup" }, e))
.on("touchcancel", e => this._panMove({ type: "pointercancel" }, e));
}
}
this.addTouchListeners(this.$());
},
willDestroyElement() {
this._super(...arguments);
this.removeTouchListeners(this.$());
},
addTouchListeners($element) {
if (this.site.mobileView) {
this.$()
.off("pointerdown")
.off("pointerup")
.off("pointermove")
.off("pointercancel")
$element
.on("touchstart", e => this._panStart(e.touches[0]))
.on("touchmove", e => {
const touchEvent = e.touches[0];
touchEvent.type = "pointermove";
this._panMove(touchEvent, e);
})
.on("touchend", e => this._panMove({ type: "pointerup" }, e))
.on("touchcancel", e => this._panMove({ type: "pointercancel" }, e));
}
},
removeTouchListeners($element) {
if (this.site.mobileView) {
$element
.off("touchstart")
.off("touchmove")
.off("touchend")