lightcordwarez
/
BetterDiscordAddons
mirror of https://github.com/mwittrien/BetterDiscordAddons.git
1
0
Fork 0
Code Issues 24 Releases Wiki Activity

added loading icon to Plugin/ThemeRepo

This commit is contained in:
Mirco Wittrien 2018-11-25 19:54:05 +01:00
parent e8f3f41d88
commit 67396458af
2 changed files with 94 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
Plugins/PluginRepo/PluginRepo.plugin.js
View File

@ -1,6 +1,6 @@
//META{"name":"PluginRepo"}*// //META{"name":"PluginRepo"}*//
class PluginRepo { class PluginRepo {
initConstructor () { initConstructor () {
this.sortings = { this.sortings = {
sort: { sort: {
@ -33,6 +33,12 @@ class PluginRepo {
<span>Plugin Repo</span> <span>Plugin Repo</span>
<div class="${BDFDB.disCN.contextmenuhint}"></div> <div class="${BDFDB.disCN.contextmenuhint}"></div>
</div>`; </div>`;
this.pluginRepoLoadingIconMarkup =
`<svg class="pluginrepo-loadingicon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="40" height="30" viewBox="0 0 483 382">
<path d="M0.000 183.023 L 0.000 366.046 46.377 366.046 L 92.754 366.046 92.754 312.629 L 92.754 259.213 127.223 259.213 C 174.433 259.213,187.432 257.146,210.766 245.926 C 311.105 197.681,301.344 41.358,195.859 7.193 C 173.603 -0.015,173.838 0.000,80.846 0.000 L 0.000 0.000 0.000 183.023 M157.615 88.195 C 193.007 97.413,198.827 152.678,166.407 171.674 C 158.993 176.019,155.494 176.398,122.807 176.398 L 92.754 176.398 92.754 131.677 L 92.754 86.957 122.807 86.957 C 146.807 86.957,153.819 87.206,157.615 88.195" stroke="none" fill="#7289da" fill-rule="evenodd"></path>
<path d="M226.647 3.824 C 258.085 21.580,282.721 54.248,291.095 89.281 C 292.183 93.834,293.041 95.659,294.560 96.655 C 310.880 107.348,312.400 140.701,297.286 156.464 C 293.685 160.221,293.134 161.348,291.162 169.006 C 282.026 204.468,259.916 235.185,230.701 253.002 C 229.548 253.705,235.510 262.261,270.237 309.731 L 311.131 365.631 355.565 365.846 L 400.000 366.060 400.000 348.309 L 400.000 330.557 364.338 285.630 L 328.676 240.703 333.494 238.892 C 373.356 223.907,395.248 189.691,399.313 136.020 C 404.504 67.495,372.510 19.710,311.375 4.675 C 294.592 0.548,287.694 -0.000,252.482 0.000 L 219.876 0.000 226.647 3.824 M202.899 265.964 C 183.869 272.635,168.536 274.960,139.752 275.540 L 116.770 276.003 116.770 321.024 L 116.770 366.046 163.975 366.046 L 211.180 366.046 211.180 314.700 C 211.180 286.460,210.901 263.386,210.559 263.425 C 210.217 263.464,206.770 264.607,202.899 265.964" stroke="none" fill="#7f8186" fill-rule="evenodd"></path>
</svg>`;
this.pluginEntryMarkup = this.pluginEntryMarkup =
`<li class="pluginEntry settings-closed ui-switch-item"> `<li class="pluginEntry settings-closed ui-switch-item">
@ -158,6 +164,18 @@ class PluginRepo {
</div>`; </div>`;
this.css = ` this.css = `
${BDFDB.dotCN.app} > .repo-loadingwrapper {
position: absolute;
bottom: 0;
right: 0;
z-index: 1000;
animation: repo-loadingwrapper-fade 3s infinite ease;
}
@keyframes repo-loadingwrapper-fade {
from {opacity: 0.1;}
50% {opacity: 0.9;}
to {opacity: 0.1;}
}
.pluginrepo-modal ${BDFDB.dotCN.modalinner} { .pluginrepo-modal ${BDFDB.dotCN.modalinner} {
min-height: 100%; min-height: 100%;
} }
@ -221,7 +239,7 @@ class PluginRepo {
getDescription () {return "Allows you to look at all plugins from the plugin repo and download them on the fly. Repo button is in the plugins settings.";} getDescription () {return "Allows you to look at all plugins from the plugin repo and download them on the fly. Repo button is in the plugins settings.";}
getVersion () {return "1.5.7";} getVersion () {return "1.5.8";}
getAuthor () {return "DevilBro";} getAuthor () {return "DevilBro";}
@ -295,7 +313,7 @@ class PluginRepo {
if (change.addedNodes) { if (change.addedNodes) {
change.addedNodes.forEach((node) => { change.addedNodes.forEach((node) => {
setImmediate(() => { setImmediate(() => {
if (node && node.tagName && node.getAttribute("layer-id") == "user-settings") { if (node.tagName && node.getAttribute("layer-id") == "user-settings") {
BDFDB.addObserver(this, node, {name:"innerSettingsWindowObserver"}, {childList:true,subtree:true}); BDFDB.addObserver(this, node, {name:"innerSettingsWindowObserver"}, {childList:true,subtree:true});
this.checkIfPluginsPage(node); this.checkIfPluginsPage(node);
} }
@ -339,7 +357,8 @@ class PluginRepo {
if (typeof BDFDB === "object") { if (typeof BDFDB === "object") {
clearInterval(this.updateInterval); clearInterval(this.updateInterval);
$(".pluginrepo-modal, .bd-pluginrepobutton, webview[webview-PluginRepo]").remove(); $(".pluginrepo-modal, .bd-pluginrepobutton, .pluginrepo-loadingicon").remove();
$(BDFDB.dotCN.app + " > .repo-loadingwrapper:empty").remove();
BDFDB.unloadMessage(this); BDFDB.unloadMessage(this);
} }
@ -663,12 +682,28 @@ class PluginRepo {
this.grabbedPlugins = result.split("\n"); this.grabbedPlugins = result.split("\n");
this.foundPlugins = this.grabbedPlugins.concat(BDFDB.loadData("ownlist", this, "ownlist") || []); this.foundPlugins = this.grabbedPlugins.concat(BDFDB.loadData("ownlist", this, "ownlist") || []);
this.loading = true; this.loading = true;
var loadingiconwrapper = document.querySelector(BDFDB.dotCN.app + "> .repo-loadingwrapper");
if (!loadingiconwrapper) {
loadingiconwrapper = document.createElement("div");
loadingiconwrapper.className = "repo-loadingwrapper";
document.querySelector(BDFDB.dotCN.app).appendChild(loadingiconwrapper);
}
$(this.pluginRepoLoadingIconMarkup)
.on("mouseenter." + this.getName(), (e) => {BDFDB.createTooltip("Loading PluginRepo",e.currentTarget,{type:"left",delay:500});})
.appendTo(loadingiconwrapper);
createWebview().then(() => { createWebview().then(() => {
getPluginInfo(() => { getPluginInfo(() => {
var finishCounter = 0, finishInterval = setInterval(() => { if (!this.started) {
if (typeof webview != "undefined") webview.remove();
return;
}
var finishCounter = 0, finishInterval = setInterval(() => {
if ((webviewqueue.length == 0 && !webviewrunning) || finishCounter > 300) { if ((webviewqueue.length == 0 && !webviewrunning) || finishCounter > 300) {
clearInterval(finishInterval); clearInterval(finishInterval);
if (typeof webview != "undefined") webview.remove(); if (typeof webview != "undefined") webview.remove();
$(".pluginrepo-loadingicon").remove();
if (!loadingiconwrapper.firstChild) loadingiconwrapper.remove();
this.loading = false; this.loading = false;
console.log("PluginRepo: Finished fetching Plugins."); console.log("PluginRepo: Finished fetching Plugins.");
if (document.querySelector(".bd-pluginrepobutton")) BDFDB.showToast(`Finished fetching Plugins.`, {type:"success"}); if (document.querySelector(".bd-pluginrepobutton")) BDFDB.showToast(`Finished fetching Plugins.`, {type:"success"});
@ -701,7 +736,7 @@ class PluginRepo {
}); });
getPluginInfo = (callback) => { getPluginInfo = (callback) => {
if (i >= this.foundPlugins.length) { if (i >= this.foundPlugins.length || !this.started) {
callback(); callback();
return; return;
} }
@ -718,14 +753,23 @@ class PluginRepo {
/* code is minified -> add newlines */ /* code is minified -> add newlines */
bodycopy = body.replace(new RegExp("}", "g"), "}\n"); bodycopy = body.replace(new RegExp("}", "g"), "}\n");
} }
for (let tag of tags) { if (body.indexOf('const config = {"info":{"name":"') > -1 && body.indexOf('"authors":[{"name":"Zerebos","discord_id":"249746236008169473",') > -1) {
let result = new RegExp(tag + "[\\s|\\t|\\n|\\r|=|>|_|:|function|\(|\)|\{|return]*([\"|\'|\`]).*\\1","gi").exec(bodycopy); let configstring = body.split('const config = {"info":{')[1].split(',"github":"http')[0];
if (result) { for (let tag of tags) {
let separator = result[1]; if (tag != "getAuthor") plugin[tag] = configstring.split('"' + tag.replace("get","").toLowerCase() + '":"')[1].split('"')[0];
result = result[0].replace(new RegExp("\\\\" + separator, "g"), separator).split(separator); else plugin[tag] = configstring.split('"authors":[{"name":"')[1].split('"')[0];
if (result.length > 2) { }
result = result.slice(1, -1).join(separator).replace(new RegExp("\\\\n", "g"), "<br>").replace(new RegExp("\\\\", "g"), ""); }
plugin[tag] = tag != "getVersion" ? result.charAt(0).toUpperCase() + result.slice(1) : result; else {
for (let tag of tags) {
let result = new RegExp(tag + "[\\s|\\t|\\n|\\r|=|>|_|:|function|\(|\)|\{|return]*([\"|\'|\`]).*\\1","gi").exec(bodycopy);
if (result) {
let separator = result[1];
result = result[0].replace(new RegExp("\\\\" + separator, "g"), separator).split(separator);
if (result.length > 2) {
result = result.slice(1, -1).join(separator).replace(new RegExp("\\\\n", "g"), "<br>").replace(new RegExp("\\\\", "g"), "");
plugin[tag] = tag != "getVersion" ? result.charAt(0).toUpperCase() + result.slice(1) : result;
}
} }
} }
} }

40
Plugins/ThemeRepo/ThemeRepo.plugin.js
View File

@ -35,6 +35,12 @@ class ThemeRepo {
<span>Theme Repo</span> <span>Theme Repo</span>
<div class="${BDFDB.disCN.contextmenuhint}"></div> <div class="${BDFDB.disCN.contextmenuhint}"></div>
</div>`; </div>`;
this.themeRepoLoadingIconMarkup =
`<svg class="themerepo-loadingicon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="40" height="30" viewBox="0 0 483 352">
<path d="M0.000 39.479 L 0.000 78.957 43.575 78.957 L 87.151 78.957 87.151 204.097 L 87.151 329.236 129.609 329.236 L 172.067 329.236 172.067 204.097 L 172.067 78.957 215.642 78.957 L 259.218 78.957 259.218 39.479 L 259.218 0.000 129.609 0.000 L 0.000 0.000 0.000 39.479" stroke="none" fill="#7289da" fill-rule="evenodd"></path>
<path d="M274.115 38.624 L 274.115 77.248 280.261 77.734 C 309.962 80.083,325.986 106.575,313.378 132.486 C 305.279 149.131,295.114 152.700,255.800 152.700 L 230.168 152.700 230.168 123.277 L 230.168 93.855 208.566 93.855 L 186.965 93.855 186.965 211.546 L 186.965 329.236 208.566 329.236 L 230.168 329.236 230.168 277.068 L 230.168 224.899 237.268 225.113 L 244.368 225.326 282.215 277.095 L 320.062 328.864 360.031 329.057 L 400.000 329.249 400.000 313.283 L 400.000 297.317 367.924 256.908 L 335.848 216.499 340.182 214.869 C 376.035 201.391,395.726 170.616,399.382 122.342 C 405.008 48.071,360.214 0.000,285.379 0.000 L 274.115 0.000 274.115 38.624" stroke="none" fill="#7f8186" fill-rule="evenodd"></path>
</svg>`;
this.frameMarkup = this.frameMarkup =
`<iframe class="discordPreview" src="https://mwittrien.github.io/BetterDiscordAddons/Plugins/ThemeRepo/res/DiscordPreview.html"></iframe>`; `<iframe class="discordPreview" src="https://mwittrien.github.io/BetterDiscordAddons/Plugins/ThemeRepo/res/DiscordPreview.html"></iframe>`;
@ -190,6 +196,18 @@ class ThemeRepo {
</div>`; </div>`;
this.css = ` this.css = `
${BDFDB.dotCN.app} > .repo-loadingwrapper {
position: absolute;
bottom: 0;
right: 0;
z-index: 1000;
animation: repo-loadingwrapper-fade 3s infinite ease;
}
@keyframes repo-loadingwrapper-fade {
from {opacity: 0.1;}
50% {opacity: 0.9;}
to {opacity: 0.1;}
}
.discordPreview { .discordPreview {
width: 100vw !important; width: 100vw !important;
height: 100vh !important; height: 100vh !important;
@ -273,7 +291,7 @@ class ThemeRepo {
getDescription () {return "Allows you to preview all themes from the theme repo and download them on the fly. Repo button is in the theme settings.";} getDescription () {return "Allows you to preview all themes from the theme repo and download them on the fly. Repo button is in the theme settings.";}
getVersion () {return "1.5.5";} getVersion () {return "1.5.8";}
getAuthor () {return "DevilBro";} getAuthor () {return "DevilBro";}
@ -350,7 +368,7 @@ class ThemeRepo {
if (change.addedNodes) { if (change.addedNodes) {
change.addedNodes.forEach((node) => { change.addedNodes.forEach((node) => {
setImmediate(() => { setImmediate(() => {
if (node && node.tagName && node.getAttribute("layer-id") == "user-settings") { if (node.tagName && node.getAttribute("layer-id") == "user-settings") {
BDFDB.addObserver(this, node, {name:"innerSettingsWindowObserver"}, {childList:true,subtree:true}); BDFDB.addObserver(this, node, {name:"innerSettingsWindowObserver"}, {childList:true,subtree:true});
this.checkIfThemesPage(node); this.checkIfThemesPage(node);
} }
@ -394,7 +412,8 @@ class ThemeRepo {
if (typeof BDFDB === "object") { if (typeof BDFDB === "object") {
clearInterval(this.updateInterval); clearInterval(this.updateInterval);
$(".discordPreview, .themerepo-modal, .bd-themerepobutton").remove(); $(".discordPreview, .themerepo-modal, .bd-themerepobutton, .themerepo-loadingicon").remove();
$(BDFDB.dotCN.app + " > .repo-loadingwrapper:empty").remove();
BDFDB.unloadMessage(this); BDFDB.unloadMessage(this);
} }
@ -782,8 +801,21 @@ class ThemeRepo {
this.grabbedThemes = result.split("\n"); this.grabbedThemes = result.split("\n");
this.foundThemes = this.grabbedThemes.concat(BDFDB.loadData("ownlist", this, "ownlist") || []); this.foundThemes = this.grabbedThemes.concat(BDFDB.loadData("ownlist", this, "ownlist") || []);
this.loading = true; this.loading = true;
var loadingiconwrapper = document.querySelector(BDFDB.dotCN.app + "> .repo-loadingwrapper");
if (!loadingiconwrapper) {
loadingiconwrapper = document.createElement("div");
loadingiconwrapper.className = "repo-loadingwrapper";
document.querySelector(BDFDB.dotCN.app).appendChild(loadingiconwrapper);
}
$(this.themeRepoLoadingIconMarkup)
.on("mouseenter." + this.getName(), (e) => {BDFDB.createTooltip("Loading ThemeRepo",e.currentTarget,{type:"left",delay:500});})
.appendTo(loadingiconwrapper);
getThemeInfo(() => { getThemeInfo(() => {
if (!this.started) return;
this.loading = false; this.loading = false;
$(".themerepo-loadingicon").remove();
if (!loadingiconwrapper.firstChild) loadingiconwrapper.remove();
console.log("ThemeRepo: Finished fetching Themes."); console.log("ThemeRepo: Finished fetching Themes.");
if (document.querySelector(".bd-themerepobutton")) BDFDB.showToast(`Finished fetching Themes.`, {type:"success"}); if (document.querySelector(".bd-themerepobutton")) BDFDB.showToast(`Finished fetching Themes.`, {type:"success"});
if (outdated > 0) { if (outdated > 0) {
@ -811,7 +843,7 @@ class ThemeRepo {
}); });
getThemeInfo = (callback) => { getThemeInfo = (callback) => {
if (i >= this.foundThemes.length) { if (i >= this.foundThemes.length || !this.started) {
callback(); callback();
return; return;
} }