DEV: removes unused components (#22497)
Removes the following components which are not used anymore: - d-progress-bar - on-visibility-action
This commit is contained in:
Joffrey JAFFEUX
GitHub
parent
03e495186f
commit
af22f77d38
|
|
@ -1,3 +0,0 @@
|
|||
<div id={{this.key}} class="d-progress-bar-container">
|
||||
<div class="d-progress-bar"></div>
|
||||
</div>
|
||||
|
|
@ -1,111 +0,0 @@
|
|||
// temporary stuff to be moved in core with discourse-loading-slider
|
||||
|
||||
import Component from "@ember/component";
|
||||
import { cancel, schedule } from "@ember/runloop";
|
||||
import discourseLater from "discourse-common/lib/later";
|
||||
|
||||
const STORE_LOADING_TIMES = 5;
|
||||
const DEFAULT_LOADING_TIME = 0.3;
|
||||
const MIN_LOADING_TIME = 0.1;
|
||||
const STILL_LOADING_DURATION = 2;
|
||||
|
||||
export default Component.extend({
|
||||
tagName: "",
|
||||
isLoading: false,
|
||||
key: null,
|
||||
|
||||
init() {
|
||||
this._super(...arguments);
|
||||
|
||||
this.loadingTimes = [DEFAULT_LOADING_TIME];
|
||||
this.set("averageTime", DEFAULT_LOADING_TIME);
|
||||
this.i = 0;
|
||||
this.scheduled = [];
|
||||
},
|
||||
|
||||
resetState() {
|
||||
this.container?.classList?.remove("done", "loading", "still-loading");
|
||||
},
|
||||
|
||||
cancelScheduled() {
|
||||
this.scheduled.forEach((s) => cancel(s));
|
||||
this.scheduled = [];
|
||||
},
|
||||
|
||||
didReceiveAttrs() {
|
||||
this._super(...arguments);
|
||||
|
||||
if (!this.key) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.cancelScheduled();
|
||||
this.resetState();
|
||||
|
||||
if (this.isLoading) {
|
||||
this.start();
|
||||
} else {
|
||||
this.end();
|
||||
}
|
||||
},
|
||||
|
||||
get container() {
|
||||
return document.getElementById(this.key);
|
||||
},
|
||||
|
||||
start() {
|
||||
this.set("startedAt", Date.now());
|
||||
|
||||
this.scheduled.push(discourseLater(this, "startLoading"));
|
||||
this.scheduled.push(
|
||||
discourseLater(this, "stillLoading", STILL_LOADING_DURATION * 1000)
|
||||
);
|
||||
},
|
||||
|
||||
startLoading() {
|
||||
this.scheduled.push(
|
||||
schedule("afterRender", () => {
|
||||
this.container?.classList?.add("loading");
|
||||
document.documentElement.style.setProperty(
|
||||
"--loading-duration",
|
||||
`${this.averageTime.toFixed(2)}s`
|
||||
);
|
||||
})
|
||||
);
|
||||
},
|
||||
|
||||
stillLoading() {
|
||||
this.scheduled.push(
|
||||
schedule("afterRender", () => {
|
||||
this.container?.classList?.add("still-loading");
|
||||
})
|
||||
);
|
||||
},
|
||||
|
||||
end() {
|
||||
this.updateAverage((Date.now() - this.startedAt) / 1000);
|
||||
|
||||
this.cancelScheduled();
|
||||
|
||||
this.scheduled.push(
|
||||
schedule("afterRender", () => {
|
||||
this.container?.classList?.remove("loading", "still-loading");
|
||||
this.container?.classList?.add("done");
|
||||
})
|
||||
);
|
||||
},
|
||||
|
||||
updateAverage(durationSeconds) {
|
||||
if (durationSeconds < MIN_LOADING_TIME) {
|
||||
durationSeconds = MIN_LOADING_TIME;
|
||||
}
|
||||
|
||||
this.loadingTimes[this.i] = durationSeconds;
|
||||
|
||||
this.i = (this.i + 1) % STORE_LOADING_TIMES;
|
||||
this.set(
|
||||
"averageTime",
|
||||
this.loadingTimes.reduce((p, c) => p + c, 0) / this.loadingTimes.length
|
||||
);
|
||||
},
|
||||
});
|
||||
|
|
@ -1 +0,0 @@
|
|||
<div id={{this.onVisibilityActionId}}></div>
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import Component from "@ember/component";
|
||||
import { computed } from "@ember/object";
|
||||
import { bind } from "discourse-common/utils/decorators";
|
||||
import { guidFor } from "@ember/object/internals";
|
||||
|
||||
export default class OnVisibilityAction extends Component {
|
||||
action = null;
|
||||
|
||||
root = document.body;
|
||||
|
||||
@computed
|
||||
get onVisibilityActionId() {
|
||||
return "on-visibility-action-" + guidFor(this);
|
||||
}
|
||||
|
||||
_element() {
|
||||
return document.getElementById(this.onVisibilityActionId);
|
||||
}
|
||||
|
||||
didInsertElement() {
|
||||
this._super(...arguments);
|
||||
|
||||
let options = {
|
||||
root: this.root,
|
||||
rootMargin: "0px",
|
||||
threshold: 1.0,
|
||||
};
|
||||
|
||||
this._observer = new IntersectionObserver(this._handleIntersect, options);
|
||||
this._observer.observe(this._element());
|
||||
}
|
||||
|
||||
willDestroyElement() {
|
||||
this._super(...arguments);
|
||||
|
||||
this._observer?.disconnect();
|
||||
this.root = null;
|
||||
}
|
||||
|
||||
@bind
|
||||
_handleIntersect(entries) {
|
||||
entries.forEach((entry) => {
|
||||
if (entry.isIntersecting) {
|
||||
this.action?.();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
// temporary stuff to be moved in core with discourse-loading-slider
|
||||
|
||||
.d-progress-bar-container {
|
||||
--loading-width: 80%;
|
||||
--still-loading-width: 90%;
|
||||
|
||||
--still-loading-duration: 10s;
|
||||
--done-duration: 0.4s;
|
||||
--fade-out-duration: 0.4s;
|
||||
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: z("header") + 2000;
|
||||
height: 3px;
|
||||
width: 100%;
|
||||
opacity: 0;
|
||||
transition: opacity var(--fade-out-duration) ease var(--done-duration);
|
||||
background-color: var(--primary-low);
|
||||
|
||||
.d-progress-bar {
|
||||
height: 100%;
|
||||
width: 0%;
|
||||
background-color: var(--tertiary);
|
||||
}
|
||||
|
||||
&.loading,
|
||||
&.still-loading {
|
||||
opacity: 1;
|
||||
transition: opacity 0s;
|
||||
}
|
||||
|
||||
&.loading .d-progress-bar {
|
||||
transition: width var(--loading-duration) ease-in;
|
||||
width: var(--loading-width);
|
||||
}
|
||||
|
||||
&.still-loading .d-progress-bar {
|
||||
transition: width var(--still-loading-duration) linear;
|
||||
width: var(--still-loading-width);
|
||||
}
|
||||
|
||||
&.done .d-progress-bar {
|
||||
transition: width var(--done-duration) ease-out;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
body.footer-nav-ipad & {
|
||||
top: 49px; // TODO: Share $footer-nav-height from footer-nav.scss
|
||||
}
|
||||
}
|
||||
|
|
@ -42,7 +42,6 @@
|
|||
@import "chat-transcript";
|
||||
@import "core-extensions";
|
||||
@import "create-channel-modal";
|
||||
@import "d-progress-bar";
|
||||
@import "dc-filter-input";
|
||||
@import "full-page-chat-header";
|
||||
@import "incoming-chat-webhooks";
|
||||
|
|
|
|||
|
|
@ -1,31 +0,0 @@
|
|||
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
|
||||
import hbs from "htmlbars-inline-precompile";
|
||||
import { render, waitUntil } from "@ember/test-helpers";
|
||||
import { module, test } from "qunit";
|
||||
|
||||
module("Discourse Chat | Component | on-visibility-action", function (hooks) {
|
||||
setupRenderingTest(hooks);
|
||||
|
||||
test("Calling an action on visibility gained", async function (assert) {
|
||||
this.set("value", null);
|
||||
this.set("display", false);
|
||||
this.set("action", () => {
|
||||
this.set("value", "foo");
|
||||
});
|
||||
|
||||
this.set("root", document.querySelector("#ember-testing"));
|
||||
|
||||
await render(hbs`
|
||||
{{#if display}}
|
||||
<OnVisibilityAction @action={{this.action}} @root={{this.root}} />
|
||||
{{/if}}
|
||||
`);
|
||||
|
||||
assert.strictEqual(this.value, null);
|
||||
|
||||
this.set("display", true);
|
||||
await waitUntil(() => this.value !== null);
|
||||
|
||||
assert.strictEqual(this.value, "foo");
|
||||
});
|
||||
});
|
||||
Loading…
Reference in New Issue