diff --git a/Plugins/ShowImageDetails/ShowImageDetails.plugin.js b/Plugins/ShowImageDetails/ShowImageDetails.plugin.js index 34b7902e4d..2e85baea72 100644 --- a/Plugins/ShowImageDetails/ShowImageDetails.plugin.js +++ b/Plugins/ShowImageDetails/ShowImageDetails.plugin.js @@ -2,6 +2,11 @@ class ShowImageDetails { initConstructor () { + this.patchModules = { + "LazyImageZoomable":"componentDidMount", + "StandardSidebarView":"componentWillUnmount" + }; + this.css = ` .image-details .image-details-size { margin: 0 10px; @@ -30,7 +35,7 @@ class ShowImageDetails { getDescription () {return "Display the name, size and dimensions of uploaded images (does not include embed images) in the chat as an header or as a tooltip.";} - getVersion () {return "1.0.9";} + getVersion () {return "1.1.0";} getAuthor () {return "DevilBro";} @@ -83,41 +88,7 @@ class ShowImageDetails { if (typeof BDFDB === "object") { BDFDB.loadMessage(this); - var observer = null; - - observer = new MutationObserver((changes, _) => { - changes.forEach( - (change, i) => { - if (change.addedNodes) { - change.addedNodes.forEach((node) => { - if (node.tagName && (node.querySelector(BDFDB.dotCN.message) || node.classList.contains(BDFDB.disCN.message))) { - this.addDetails(node); - } - }); - } - } - ); - }); - BDFDB.addObserver(this, BDFDB.dotCN.messages, {name:"chatWindowObserver",instance:observer}, {childList:true, subtree:true}); - - observer = new MutationObserver((changes, _) => { - changes.forEach( - (change, i) => { - if (change.removedNodes) { - change.removedNodes.forEach((node) => { - if (node && $(node).attr("layer-id") == "user-settings" && this.updateDetails) { - document.querySelectorAll(".image-details-added").forEach(image => {this.resetImage(image);}); - this.addDetails(document); - this.updateDetails = false; - } - }); - } - } - ); - }); - BDFDB.addObserver(this, BDFDB.dotCN.layers, {name:"settingsWindowObserver",instance:observer}, {childList:true}); - - this.addDetails(document); + BDFDB.WebModules.forceAllUpdates(this); } else { console.error(this.getName() + ": Fatal Error: Could not load BD functions!"); @@ -126,19 +97,12 @@ class ShowImageDetails { stop () { if (typeof BDFDB === "object") { - document.querySelectorAll(".image-details-added").forEach(image => {this.resetImage(image);}); + document.querySelectorAll(".image-details-added").forEach(wrapper => {this.resetImage(wrapper);}); BDFDB.unloadMessage(this); } } - onSwitch () { - if (typeof BDFDB === "object") { - this.addDetails(document); - BDFDB.addObserver(this, BDFDB.dotCN.messages, {name:"chatWindowObserver"}, {childList:true, subtree:true}); - } - } - // begin of own functions @@ -151,51 +115,41 @@ class ShowImageDetails { this.updateDetails = true; } - addDetails (container) { - let scroller = document.querySelector(BDFDB.dotCNS.chat + BDFDB.dotCN.messages); - if (!container || typeof container.querySelectorAll != "function" || !scroller) return; - var settings = BDFDB.getAllData(this, "settings"); - container.querySelectorAll(BDFDB.dotCN.messageaccessory + " > " + BDFDB.dotCN.imagewrapper).forEach(image => { - var data = this.getImageData(image); - if (data) { - image.classList.add("image-details-added"); - if (!settings.showOnHover) { - $(`
`).insertBefore(image).append(image); - scroller.scrollTop += image.parentElement.getBoundingClientRect().height - image.getBoundingClientRect().height; - } - else { - $(image).on("mouseenter." + this.getName(), () => { - BDFDB.createTooltip(`