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

DEV: removes jquery usage from discourse-topic (#14964)

This commit is contained in:
Joffrey JAFFEUX 2021-11-16 13:17:44 +01:00 committed by GitHub
parent 0fbeb2e5a2
commit ff7e685a59
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 23 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
app/assets/javascripts/discourse/app/components/discourse-topic.js
View File

@ -7,7 +7,7 @@ import MobileScrollDirection from "discourse/mixins/mobile-scroll-direction";
import Scrolling from "discourse/mixins/scrolling";
import { alias } from "@ember/object/computed";
import { highlightPost } from "discourse/lib/utilities";
import { observes } from "discourse-common/utils/decorators";
import { bind, observes } from "discourse-common/utils/decorators";
const MOBILE_SCROLL_DIRECTION_CHECK_THROTTLE = 300;
@ -40,12 +40,11 @@ export default Component.extend(
_enteredTopic() {
// Ember is supposed to only call observers when values change but something
// in our view set up is firing this observer with the same value. This check
// prevents scrolled from being called twice.
const enteredAt = this.enteredAt;
if (enteredAt && this.lastEnteredAt !== enteredAt) {
// prevents scrolled from being called twice
if (this.enteredAt && this.lastEnteredAt !== this.enteredAt) {
this._lastShowTopic = null;
schedule("afterRender", () => this.scrolled());
this.set("lastEnteredAt", enteredAt);
schedule("afterRender", this.scrolled);
this.set("lastEnteredAt", this.enteredAt);
}
},
@ -83,7 +82,7 @@ export default Component.extend(
return;
}
const offset = window.pageYOffset || $("html").scrollTop();
const offset = window.pageYOffset || document.documentElement.scrollTop;
this._lastShowTopic = this.shouldShowTopicInHeader(topic, offset);
if (this._lastShowTopic) {
@ -95,16 +94,14 @@ export default Component.extend(
didInsertElement() {
this._super(...arguments);
this.bindScrolling({ name: "topic-view" });
$(window).on("resize.discourse-on-scroll", () => this.scrolled());
window.addEventListener("resize", this.scrolled);
$(this.element).on(
"click.discourse-redirect",
".cooked a, a.track-link",
(e) => ClickTrack.trackClick(e, this.siteSettings)
);
this.appEvents.on("discourse:focus-changed", this, "gotFocus");
this.appEvents.on("post:highlight", this, "_highlightPost");
this.appEvents.on("header:update-topic", this, "_updateTopic");
@ -112,8 +109,9 @@ export default Component.extend(
willDestroyElement() {
this._super(...arguments);
this.unbindScrolling("topic-view");
$(window).unbind("resize.discourse-on-scroll");
window.removeEventListener("resize", this.scrolled);
// Unbind link tracking
$(this.element).off(
@ -149,31 +147,36 @@ export default Component.extend(
(!this.site.mobileView || this.mobileScrollDirection === "down")
);
},
// The user has scrolled the window, or it is finished rendering and ready for processing.
@bind
scrolled() {
if (this.isDestroyed || this.isDestroying || this._state !== "inDOM") {
return;
}
const offset = window.pageYOffset || $("html").scrollTop();
const offset = window.pageYOffset || document.documentElement.scrollTop;
if (this.dockAt === 0) {
const title = $("#topic-title");
if (title && title.length === 1) {
this.set("dockAt", title.offset().top);
const title = document.querySelector("#topic-title");
if (title) {
this.set(
"dockAt",
title.getBoundingClientRect().top + window.scrollY
);
}
}
this.set("hasScrolled", offset > 0);
const topic = this.topic;
const showTopic = this.shouldShowTopicInHeader(topic, offset);
const showTopic = this.shouldShowTopicInHeader(this.topic, offset);
if (showTopic !== this._lastShowTopic) {
if (showTopic) {
this._showTopicInHeader(topic);
this._showTopicInHeader(this.topic);
} else {
if (!DiscourseURL.isJumpScheduled()) {
const loadingNear = topic.get("postStream.loadingNearPost") || 1;
const loadingNear =
this.topic.get("postStream.loadingNearPost") || 1;
if (loadingNear === 1) {
this._hideTopicInHeader();
}