From 4df5330bfd22974a205d6f304886cd3c71ea7b03 Mon Sep 17 00:00:00 2001 From: Mirco Wittrien Date: Thu, 20 May 2021 18:11:51 +0200 Subject: [PATCH] stuff --- Library/_res/BDFDB.data.json | 2 ++ Library/_res/BDFDB.raw.css | 3 ++ Plugins/PluginRepo/PluginRepo.plugin.js | 38 +++++++++++++++--------- Plugins/ThemeRepo/ThemeRepo.plugin.js | 39 ++++++++++++++++--------- 4 files changed, 56 insertions(+), 26 deletions(-) diff --git a/Library/_res/BDFDB.data.json b/Library/_res/BDFDB.data.json index 61b12bebac..cb2310c884 100644 --- a/Library/_res/BDFDB.data.json +++ b/Library/_res/BDFDB.data.json @@ -632,6 +632,7 @@ "discoveryCardFooter": "footer-C1KpS6", "discoveryCardHeader": "header-4hHJgv", "discoveryCardIcon": "icon-0jmVrJ", + "discoveryCardIconLoading": "loading-f8Gs22", "discoveryCardIconWrapper": "iconWrapper-eK7GO6", "discoveryCardInfo": "info-xw-o76", "discoveryCardName": "name-OSUjF9", @@ -1981,6 +1982,7 @@ "discoverycardfooter": ["BDFDB", "discoveryCardFooter"], "discoverycardheader": ["BDFDB", "discoveryCardHeader"], "discoverycardicon": ["BDFDB", "discoveryCardIcon"], + "discoverycardiconloading": ["BDFDB", "discoveryCardIconLoading"], "discoverycardiconwrapper": ["BDFDB", "discoveryCardIconWrapper"], "discoverycardinfo": ["BDFDB", "discoveryCardInfo"], "discoverycardname": ["BDFDB", "discoveryCardName"], diff --git a/Library/_res/BDFDB.raw.css b/Library/_res/BDFDB.raw.css index 4a5a943d7d..2e3cec1b20 100644 --- a/Library/_res/BDFDB.raw.css +++ b/Library/_res/BDFDB.raw.css @@ -353,6 +353,9 @@ img:not([src]), img[src=""], img[src="null"] { width: 32px; height: 32px; } +[REPLACE_CLASS_discoverycardiconloading] { + visibility: hidden; +} [REPLACE_CLASS_discoverycardinfo] { display: flex; flex: 1 1 auto; diff --git a/Plugins/PluginRepo/PluginRepo.plugin.js b/Plugins/PluginRepo/PluginRepo.plugin.js index 516b0e18ef..33001a0517 100644 --- a/Plugins/PluginRepo/PluginRepo.plugin.js +++ b/Plugins/PluginRepo/PluginRepo.plugin.js @@ -320,19 +320,31 @@ module.exports = (_ => { }) ] }), - BDFDB.ReactUtils.createElement("div", { - className: BDFDB.disCN.discoverycardiconwrapper, - children: this.props.data.author && this.props.data.author.discord_avatar_hash && this.props.data.author.discord_snowflake ? BDFDB.ReactUtils.createElement("img", { - className: BDFDB.disCN.discoverycardicon, - src: `https://cdn.discordapp.com/avatars/${this.props.data.author.discord_snowflake}/${this.props.data.author.discord_avatar_hash}.webp?size=128` - }) : BDFDB.ReactUtils.createElement("div", { - className: BDFDB.disCN.discoverycardicon, - children: BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.SvgIcon, { - nativeClass: true, - iconSVG: `` - }) - }) - }) + BDFDB.ReactUtils.createElement(class extends BDFDB.ReactUtils.Component { + render() { + return BDFDB.ReactUtils.createElement("div", { + className: BDFDB.disCN.discoverycardiconwrapper, + children: this.props.data.author && this.props.data.author.discord_avatar_hash && this.props.data.author.discord_snowflake && !this.props.data.author.discord_avatar_failed ? BDFDB.ReactUtils.createElement("img", { + className: BDFDB.DOMUtils.formatClassName(BDFDB.disCN.discoverycardicon, !this.props.data.author.discord_avatar_loaded && BDFDB.disCN.discoverycardiconloading), + src: `https://cdn.discordapp.com/avatars/${this.props.data.author.discord_snowflake}/${this.props.data.author.discord_avatar_hash}.webp?size=128`, + onLoad: _ => { + this.props.data.author.discord_avatar_loaded = true; + BDFDB.ReactUtils.forceUpdate(this); + }, + onError: _ => { + this.props.data.author.discord_avatar_failed = true; + BDFDB.ReactUtils.forceUpdate(this); + } + }) : BDFDB.ReactUtils.createElement("div", { + className: BDFDB.disCN.discoverycardicon, + children: BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.SvgIcon, { + nativeClass: true, + iconSVG: `` + }) + }) + }); + } + }, this.props) ] }), BDFDB.ReactUtils.createElement("div", { diff --git a/Plugins/ThemeRepo/ThemeRepo.plugin.js b/Plugins/ThemeRepo/ThemeRepo.plugin.js index cc793342d8..218432f01f 100644 --- a/Plugins/ThemeRepo/ThemeRepo.plugin.js +++ b/Plugins/ThemeRepo/ThemeRepo.plugin.js @@ -725,19 +725,31 @@ module.exports = (_ => { }) ] }), - BDFDB.ReactUtils.createElement("div", { - className: BDFDB.disCN.discoverycardiconwrapper, - children: this.props.data.author && this.props.data.author.discord_avatar_hash && this.props.data.author.discord_snowflake ? BDFDB.ReactUtils.createElement("img", { - className: BDFDB.disCN.discoverycardicon, - src: `https://cdn.discordapp.com/avatars/${this.props.data.author.discord_snowflake}/${this.props.data.author.discord_avatar_hash}.webp?size=128` - }) : BDFDB.ReactUtils.createElement("div", { - className: BDFDB.disCN.discoverycardicon, - children: BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.SvgIcon, { - nativeClass: true, - iconSVG: `` - }) - }) - }) + BDFDB.ReactUtils.createElement(class extends BDFDB.ReactUtils.Component { + render() { + return BDFDB.ReactUtils.createElement("div", { + className: BDFDB.disCN.discoverycardiconwrapper, + children: this.props.data.author && this.props.data.author.discord_avatar_hash && this.props.data.author.discord_snowflake && !this.props.data.author.discord_avatar_failed ? BDFDB.ReactUtils.createElement("img", { + className: BDFDB.DOMUtils.formatClassName(BDFDB.disCN.discoverycardicon, !this.props.data.author.discord_avatar_loaded && BDFDB.disCN.discoverycardiconloading), + src: `https://cdn.discordapp.com/avatars/${this.props.data.author.discord_snowflake}/${this.props.data.author.discord_avatar_hash}.webp?size=128`, + onLoad: _ => { + this.props.data.author.discord_avatar_loaded = true; + BDFDB.ReactUtils.forceUpdate(this); + }, + onError: _ => { + this.props.data.author.discord_avatar_failed = true; + BDFDB.ReactUtils.forceUpdate(this); + } + }) : BDFDB.ReactUtils.createElement("div", { + className: BDFDB.disCN.discoverycardicon, + children: BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.SvgIcon, { + nativeClass: true, + iconSVG: `` + }) + }) + }); + } + }, this.props) ] }), BDFDB.ReactUtils.createElement("div", { @@ -1370,6 +1382,7 @@ module.exports = (_ => { BDFDB.LibraryRequires.request("https://api.betterdiscord.app/v1/store/themes", (error, response, body) => { if (!error && body) try { grabbedThemes = BDFDB.ArrayUtils.keySort(JSON.parse(body).filter(n => n), "name"); + console.log(grabbedThemes); BDFDB.DataUtils.save(BDFDB.ArrayUtils.numSort(grabbedThemes.map(n => n.id)).join(" "), this, "cached"); loading = {is: true, timeout: BDFDB.TimeUtils.timeout(_ => {