Hide mobile cards when user scrolls (#7291)

This commit is contained in:
Joe 2019-03-31 17:16:52 +08:00 committed by Régis Hanol
parent 9510f3d737
commit 8b8d528b88
1 changed files with 29 additions and 1 deletions

View File

@ -63,6 +63,11 @@ export default Ember.Mixin.create({
this._showCallback(username, $target); this._showCallback(username, $target);
// We bind scrolling on mobile after cards are shown to hide them if user scrolls
if (this.site.mobileView) {
this._bindMobileScroll();
}
return false; return false;
}, },
@ -75,12 +80,14 @@ export default Ember.Mixin.create({
const clickDataExpand = `click.discourse-${id}`; const clickDataExpand = `click.discourse-${id}`;
const clickMention = `click.discourse-${id}-${triggeringLinkClass}`; const clickMention = `click.discourse-${id}-${triggeringLinkClass}`;
const previewClickEvent = `click.discourse-preview-${id}-${triggeringLinkClass}`; const previewClickEvent = `click.discourse-preview-${id}-${triggeringLinkClass}`;
const mobileScrollEvent = "scroll.mobile-card-cloak";
this.setProperties({ this.setProperties({
clickOutsideEventName, clickOutsideEventName,
clickDataExpand, clickDataExpand,
clickMention, clickMention,
previewClickEvent previewClickEvent,
mobileScrollEvent
}); });
$("html") $("html")
@ -126,6 +133,21 @@ export default Ember.Mixin.create({
}); });
}, },
_bindMobileScroll() {
const mobileScrollEvent = this.get("mobileScrollEvent");
const onScroll = () => {
Ember.run.throttle(this, this._close, 1000);
};
$(window).on(mobileScrollEvent, onScroll);
},
_unbindMobileScroll() {
const mobileScrollEvent = this.get("mobileScrollEvent");
$(window).off(mobileScrollEvent);
},
_previewClick($target) { _previewClick($target) {
this.set("isFixed", true); this.set("isFixed", true);
return this._show($target.text().replace(/^@/, ""), $target); return this._show($target.text().replace(/^@/, ""), $target);
@ -237,6 +259,11 @@ export default Ember.Mixin.create({
isFixed: false, isFixed: false,
isDocked: false isDocked: false
}); });
// Card will be removed, so we unbind mobile scrolling
if (this.site.mobileView) {
this._unbindMobileScroll();
}
}, },
willDestroyElement() { willDestroyElement() {
@ -245,6 +272,7 @@ export default Ember.Mixin.create({
const clickDataExpand = this.get("clickDataExpand"); const clickDataExpand = this.get("clickDataExpand");
const clickMention = this.get("clickMention"); const clickMention = this.get("clickMention");
const previewClickEvent = this.get("previewClickEvent"); const previewClickEvent = this.get("previewClickEvent");
$("html").off(clickOutsideEventName); $("html").off(clickOutsideEventName);
$("#main") $("#main")
.off(clickDataExpand) .off(clickDataExpand)