LoadingIcon improvement
• the loading progress bar. • title attr now shows the status
This commit is contained in:
parent
e63695e17f
commit
a4dcebba7c
|
@ -6,15 +6,30 @@ const css = `/* BEGIN V2 LOADER */
|
|||
}
|
||||
#bd-loading-icon {
|
||||
position: fixed;
|
||||
bottom:5px;
|
||||
right:5px;
|
||||
z-index: 2147483647;
|
||||
bottom: 10px;
|
||||
right: 5px;
|
||||
z-index: 2147483646;
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-size: 100% 100%;
|
||||
animation: bd-loading-animation 1.5s ease-in-out infinite;
|
||||
}
|
||||
#bd-loading-progress {
|
||||
position: fixed;
|
||||
bottom: 5px;
|
||||
right:5px;
|
||||
z-index: 2147483647;
|
||||
width: 20px;
|
||||
height: 3px;
|
||||
background-color: var(--header-primary);
|
||||
overflow: hidden;
|
||||
}
|
||||
#bd-loading-progress-bar {
|
||||
background-color: #3E82E5;
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@keyframes bd-loading-animation {
|
||||
0% { opacity: 0.05; }
|
||||
|
@ -32,14 +47,36 @@ loadingIcon.id = "bd-loading-icon";
|
|||
loadingIcon.className = "bd-loaderv2";
|
||||
loadingIcon.title = "BetterDiscord is loading...";
|
||||
|
||||
const loadingProgressBar = document.createElement('div');
|
||||
loadingProgressBar.id = "bd-loading-progress-bar";
|
||||
const loadingProgress = document.createElement('div');
|
||||
loadingProgress.appendChild(loadingProgressBar);
|
||||
loadingProgress.id = "bd-loading-progress";
|
||||
|
||||
export default class {
|
||||
|
||||
static setInitStatus(percent, status = "") {
|
||||
return new Promise(
|
||||
rs => {
|
||||
if (percent > 100) percent = 100;
|
||||
if (percent < 0) percent = 0;
|
||||
loadingProgressBar.style.width = percent + "%";
|
||||
if (status) loadingIcon.title = status;
|
||||
// 60 fps, rendering wait
|
||||
setTimeout(rs, 1000/60)
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
static show() {
|
||||
document.body.appendChild(iconStyle);
|
||||
document.body.appendChild(loadingIcon);
|
||||
document.body.appendChild(loadingProgress);
|
||||
}
|
||||
|
||||
static hide() {
|
||||
if (iconStyle) iconStyle.remove();
|
||||
if (loadingIcon) loadingIcon.remove();
|
||||
if (loadingProgress) loadingProgress.remove();
|
||||
}
|
||||
}
|
|
@ -27,54 +27,68 @@ export default new class Core {
|
|||
Config.userData = process.env.DISCORD_USER_DATA;
|
||||
Config.dataPath = process.env.BETTERDISCORD_DATA_PATH;
|
||||
|
||||
/**loading steps count*/
|
||||
|
||||
// Load css early
|
||||
Logger.log("Startup", "Injecting BD Styles");
|
||||
DOMManager.injectStyle("bd-stylesheet", Styles.toString());
|
||||
|
||||
await LoadingIcon.setInitStatus(1/15*100, "Injecting BD Styles");
|
||||
|
||||
Logger.log("Startup", "Initializing DataStore");
|
||||
DataStore.initialize();
|
||||
|
||||
await LoadingIcon.setInitStatus(2/15*100, "Initializing DataStore");
|
||||
|
||||
Logger.log("Startup", "Initializing LocaleManager");
|
||||
LocaleManager.initialize();
|
||||
|
||||
await LoadingIcon.setInitStatus(3/15*100, "Initializing LocaleManager");
|
||||
|
||||
Logger.log("Startup", "Getting update information");
|
||||
this.checkForUpdate();
|
||||
|
||||
await LoadingIcon.setInitStatus(4/15*100, "Getting update information");
|
||||
|
||||
Logger.log("Startup", "Initializing Settings");
|
||||
Settings.initialize();
|
||||
|
||||
await LoadingIcon.setInitStatus(5/15*100, "Initializing Settings");
|
||||
|
||||
Logger.log("Startup", "Initializing DOMManager");
|
||||
DOMManager.initialize();
|
||||
|
||||
await LoadingIcon.setInitStatus(6/15*100, "Initializing DOMManager");
|
||||
|
||||
Logger.log("Startup", "Waiting for connection...");
|
||||
await this.waitForConnection();
|
||||
|
||||
await LoadingIcon.setInitStatus(7/15*100, "Waiting for connection...");
|
||||
|
||||
Logger.log("Startup", "Initializing Editor");
|
||||
await Editor.initialize();
|
||||
|
||||
await LoadingIcon.setInitStatus(8/15*100, "Initializing Editor");
|
||||
|
||||
Logger.log("Startup", "Initializing Builtins");
|
||||
for (const module in Builtins) {
|
||||
Builtins[module].initialize();
|
||||
}
|
||||
|
||||
await LoadingIcon.setInitStatus(9/15*100, "Initializing Builtins");
|
||||
|
||||
Logger.log("Startup", "Loading Plugins");
|
||||
// const pluginErrors = [];
|
||||
const pluginErrors = PluginManager.initialize();
|
||||
|
||||
await LoadingIcon.setInitStatus(10/15*100);
|
||||
|
||||
Logger.log("Startup", "Loading Themes");
|
||||
// const themeErrors = [];
|
||||
const themeErrors = ThemeManager.initialize();
|
||||
|
||||
await LoadingIcon.setInitStatus(11/15*100);
|
||||
|
||||
Logger.log("Startup", "Initializing AddonUpdater");
|
||||
AddonUpdater.initialize();
|
||||
|
||||
await LoadingIcon.setInitStatus(12/15*100);
|
||||
|
||||
Logger.log("Startup", "Removing Loading Icon");
|
||||
LoadingIcon.hide();
|
||||
|
||||
|
||||
// Show loading errors
|
||||
Logger.log("Startup", "Collecting Startup Errors");
|
||||
Modals.showAddonErrors({plugins: pluginErrors, themes: themeErrors});
|
||||
|
||||
|
||||
const previousVersion = DataStore.getBDData("version");
|
||||
if (Config.version > previousVersion) {
|
||||
const md = [Changelog.description];
|
||||
|
|
Loading…
Reference in New Issue