Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

FIX: RIP swipe-in menus on Android (#7997) 

In later versions of android, swipe-in from the sides on android triggers
forward/back functionality. We can no longer trigger menu swipes on android

https://www.androidcentral.com/android-q-getting-rid-back-button-side-swipe-gesture
This commit is contained in:
Jeff Wong 2019-08-12 17:30:18 -07:00 committed by GitHub
parent 7632fe0b58
commit 7877383e62
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 0 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
app/assets/javascripts/discourse/components/site-header.js.es6
View File

@ -9,10 +9,6 @@ import PanEvents, {
const PANEL_BODY_MARGIN = 30; const PANEL_BODY_MARGIN = 30;
//android supports pulling in from the screen edges
const SCREEN_EDGE_MARGIN = 20;
const SCREEN_OFFSET = 300;
const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, { const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
widget: "header", widget: "header",
docAt: null, docAt: null,
@ -113,7 +109,6 @@ const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
const center = e.center; const center = e.center;
const $centeredElement = $(document.elementFromPoint(center.x, center.y)); const $centeredElement = $(document.elementFromPoint(center.x, center.y));
const $window = $(window); const $window = $(window);
const windowWidth = parseInt($window.width());
if ( if (
($centeredElement.hasClass("panel-body") || ($centeredElement.hasClass("panel-body") ||
$centeredElement.hasClass("header-cloak") || $centeredElement.hasClass("header-cloak") ||
@ -122,30 +117,6 @@ const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
) { ) {
e.originalEvent.preventDefault(); e.originalEvent.preventDefault();
this._isPanning = true; this._isPanning = true;
} else if (
center.x < SCREEN_EDGE_MARGIN &&
!this.element.querySelector(".menu-panel") &&
e.direction === "right"
) {
this._animate = false;
this._panMenuOrigin = "left";
this._panMenuOffset = -SCREEN_OFFSET;
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.element.querySelector(".menu-panel") &&
e.direction === "left"
) {
this._animate = false;
this._panMenuOrigin = "right";
this._panMenuOffset = -SCREEN_OFFSET;
this._isPanning = true;
$("header.d-header").removeClass("scroll-down scroll-up");
this.eventDispatched(this._rightMenuAction(), "header");
window.requestAnimationFrame(() => this.panMove(e));
} else { } else {
this._isPanning = false; this._isPanning = false;
} }
@ -224,7 +195,6 @@ const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
didInsertElement() { didInsertElement() {
this._super(...arguments); this._super(...arguments);
const { isAndroid } = this.capabilities;
$(window).on("resize.discourse-menu-panel", () => this.afterRender()); $(window).on("resize.discourse-menu-panel", () => this.afterRender());
this.appEvents.on("header:show-topic", this, "setTopic"); this.appEvents.on("header:show-topic", this, "setTopic");
@ -235,12 +205,6 @@ const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
this.dispatch("search-autocomplete:after-complete", "search-term"); this.dispatch("search-autocomplete:after-complete", "search-term");
this.appEvents.on("dom:clean", this, "_cleanDom"); this.appEvents.on("dom:clean", this, "_cleanDom");
// Only add listeners for opening menus by swiping them in on Android devices
// iOS will respond to these events, but also does swiping for back/forward
if (isAndroid) {
this.addTouchListeners($("body"));
}
}, },
_cleanDom() { _cleanDom() {
@ -252,7 +216,6 @@ const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
willDestroyElement() { willDestroyElement() {
this._super(...arguments); this._super(...arguments);
const { isAndroid } = this.capabilities;
$("body").off("keydown.header"); $("body").off("keydown.header");
$(window).off("resize.discourse-menu-panel"); $(window).off("resize.discourse-menu-panel");
@ -260,10 +223,6 @@ const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
this.appEvents.off("header:hide-topic", this, "setTopic"); this.appEvents.off("header:hide-topic", this, "setTopic");
this.appEvents.off("dom:clean", this, "_cleanDom"); this.appEvents.off("dom:clean", this, "_cleanDom");
if (isAndroid) {
this.removeTouchListeners($("body"));
}
Ember.run.cancel(this._scheduledRemoveAnimate); Ember.run.cancel(this._scheduledRemoveAnimate);
window.cancelAnimationFrame(this._scheduledMovingAnimation); window.cancelAnimationFrame(this._scheduledMovingAnimation);
}, },