Update ImageUtilities.plugin.js

This commit is contained in:
Mirco Wittrien 2024-06-22 12:27:56 +02:00
parent 27f0240cdd
commit e9d69b7a12
1 changed files with 95 additions and 76 deletions

View File

@ -2,7 +2,7 @@
* @name ImageUtilities * @name ImageUtilities
* @author DevilBro * @author DevilBro
* @authorId 278543574059057154 * @authorId 278543574059057154
* @version 5.4.4 * @version 5.4.5
* @description Adds several Utilities for Images/Videos (Gallery, Download, Reverse Search, Zoom, Copy, etc.) * @description Adds several Utilities for Images/Videos (Gallery, Download, Reverse Search, Zoom, Copy, etc.)
* @invite Jx3TjNS * @invite Jx3TjNS
* @donate https://www.paypal.me/MircoWittrien * @donate https://www.paypal.me/MircoWittrien
@ -438,11 +438,16 @@ module.exports = (_ => {
position: absolute; position: absolute;
display: flex; display: flex;
} }
${BDFDB.dotCNS._imageutilitiesoperations + BDFDB.dotCN.downloadlink} { ${BDFDB.dotCNS._imageutilitiesoperations + BDFDB.dotCN.imagemodalimageoptionscontainer} {
position: static !important;
display: flex !important;
flex-wrap: unset !important;
}
${BDFDB.dotCNS._imageutilitiesoperations + BDFDB.dotCN.imagemodalimagedownloadlink} {
position: relative !important; position: relative !important;
white-space: nowrap !important; white-space: nowrap !important;
} }
${BDFDB.dotCNS._imageutilitiesoperations + BDFDB.dotCN.anchor + BDFDB.dotCN.downloadlink} { ${BDFDB.dotCNS._imageutilitiesoperations + BDFDB.dotCN.anchor + BDFDB.dotCN.imagemodalimagedownloadlink} {
margin: 0 !important; margin: 0 !important;
} }
`; `;
@ -900,6 +905,7 @@ module.exports = (_ => {
naturalWidth: this.videoWidth, naturalWidth: this.videoWidth,
height: this.videoHeight, height: this.videoHeight,
naturalHeight: this.videoHeight, naturalHeight: this.videoHeight,
renderForwardComponent: _ => {},
renderLinkComponent: props => BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, props) renderLinkComponent: props => BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, props)
}) : BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.ImageModal, { }) : BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.ImageModal, {
src: imageThrowaway.src, src: imageThrowaway.src,
@ -907,6 +913,7 @@ module.exports = (_ => {
width: this.width, width: this.width,
height: this.height, height: this.height,
className: BDFDB.disCN.imagemodalimage, className: BDFDB.disCN.imagemodalimage,
renderForwardComponent: _ => {},
renderLinkComponent: props => BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, props) renderLinkComponent: props => BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, props)
}) })
}), true); }), true);
@ -987,8 +994,8 @@ module.exports = (_ => {
} }
else { else {
let url = this.getImageSrc(viewedImage && viewedImage.proxy_url || typeof e.instance.props.children == "function" && e.instance.props.children(Object.assign({}, e.instance.props, {size: e.instance.props})).props.src || e.instance.props.src); let url = this.getImageSrc(viewedImage && viewedImage.proxy_url || typeof e.instance.props.children == "function" && e.instance.props.children(Object.assign({}, e.instance.props, {size: e.instance.props})).props.src || e.instance.props.src);
let [children, index] = BDFDB.ReactUtils.findParent(e.returnvalue, {props: [["className", BDFDB.disCN.downloadlink]]}); let [children, index] = BDFDB.ReactUtils.findParent(e.returnvalue, {props: ["renderForwardComponent"]});
if (index > -1) { if (index > -1) {
let type = filterForVideos ? BDFDB.LanguageUtils.LanguageStrings.VIDEO : BDFDB.LanguageUtils.LanguageStrings.IMAGE; let type = filterForVideos ? BDFDB.LanguageUtils.LanguageStrings.VIDEO : BDFDB.LanguageUtils.LanguageStrings.IMAGE;
let openContext = event => BDFDB.ContextMenuUtils.open(this, event, BDFDB.ContextMenuUtils.createItem(BDFDB.LibraryComponents.MenuItems.MenuGroup, { let openContext = event => BDFDB.ContextMenuUtils.open(this, event, BDFDB.ContextMenuUtils.createItem(BDFDB.LibraryComponents.MenuItems.MenuGroup, {
@ -1037,77 +1044,89 @@ module.exports = (_ => {
className: BDFDB.disCN._imageutilitiesoperations, className: BDFDB.disCN._imageutilitiesoperations,
children: [ children: [
children[index], children[index],
this.settings.viewerSettings.saveImage && [ this.settings.viewerSettings.saveImage && BDFDB.ReactUtils.createElement("div", {
BDFDB.ReactUtils.createElement("span", { className: BDFDB.disCN.imagemodalimageoptionscontainer,
className: BDFDB.disCN.downloadlink, children: [
children: "|", BDFDB.ReactUtils.createElement("span", {
style: {margin: "0 5px"} className: BDFDB.disCN.imagemodalimagedownloadlink,
}), children: "|",
BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, { style: {margin: "0 5px"}
className: BDFDB.disCN.downloadlink, }),
children: this.labels.context_saveas.replace("{{var0}}", type), BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, {
onClick: event => { className: BDFDB.disCN.imagemodalimagedownloadlink,
BDFDB.ListenerUtils.stopEvent(event); children: this.labels.context_saveas.replace("{{var0}}", type),
this.downloadFile({url: e.instance.props.original, fallbackUrl: url}); onClick: event => {
}, BDFDB.ListenerUtils.stopEvent(event);
onContextMenu: event => { this.downloadFile({url: e.instance.props.original, fallbackUrl: url});
let locations = Object.keys(ownLocations).filter(n => ownLocations[n].enabled); },
if (locations.length) BDFDB.ContextMenuUtils.open(this, event, BDFDB.ContextMenuUtils.createItem(BDFDB.LibraryComponents.MenuItems.MenuGroup, { onContextMenu: event => {
children: locations.map((name, i) => BDFDB.ContextMenuUtils.createItem(BDFDB.LibraryComponents.MenuItems.MenuItem, { let locations = Object.keys(ownLocations).filter(n => ownLocations[n].enabled);
id: BDFDB.ContextMenuUtils.createItemId(this.name, "download", name, i), if (locations.length) BDFDB.ContextMenuUtils.open(this, event, BDFDB.ContextMenuUtils.createItem(BDFDB.LibraryComponents.MenuItems.MenuGroup, {
label: name, children: locations.map((name, i) => BDFDB.ContextMenuUtils.createItem(BDFDB.LibraryComponents.MenuItems.MenuItem, {
action: _ => this.downloadFile({url: e.instance.props.original, fallbackUrl: url}, ownLocations[name].location) id: BDFDB.ContextMenuUtils.createItemId(this.name, "download", name, i),
})) label: name,
})); action: _ => this.downloadFile({url: e.instance.props.original, fallbackUrl: url}, ownLocations[name].location)
} }))
}) }));
], }
this.settings.viewerSettings.copyImage && this.isValid(url, "copyable") && [ })
BDFDB.ReactUtils.createElement("span", { ]
className: BDFDB.disCN.downloadlink, }),
children: "|", this.settings.viewerSettings.copyImage && this.isValid(url, "copyable") && BDFDB.ReactUtils.createElement("div", {
style: {margin: "0 5px"} className: BDFDB.disCN.imagemodalimageoptionscontainer,
}), children: [
BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, { BDFDB.ReactUtils.createElement("span", {
className: BDFDB.disCN.downloadlink, className: BDFDB.disCN.imagemodalimagedownloadlink,
children: this.labels.context_copy.replace("{{var0}}", type), children: "|",
onClick: event => { style: {margin: "0 5px"}
BDFDB.ListenerUtils.stopEvent(event); }),
this.copyFile({url: e.instance.props.original, fallbackUrl: url}); BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, {
} className: BDFDB.disCN.imagemodalimagedownloadlink,
}) children: this.labels.context_copy.replace("{{var0}}", type),
], onClick: event => {
this.settings.viewerSettings.galleryMode && viewedImage && this.settings.viewerSettings.jumpTo && [ BDFDB.ListenerUtils.stopEvent(event);
BDFDB.ReactUtils.createElement("span", { this.copyFile({url: e.instance.props.original, fallbackUrl: url});
className: BDFDB.disCN.downloadlink, }
children: "|", })
style: {margin: "0 5px"} ]
}), }),
BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, { this.settings.viewerSettings.galleryMode && viewedImage && this.settings.viewerSettings.jumpTo && BDFDB.ReactUtils.createElement("div", {
className: BDFDB.disCN.downloadlink, className: BDFDB.disCN.imagemodalimageoptionscontainer,
children: BDFDB.LanguageUtils.LanguageStrings.JUMP, children: [
onClick: event => { BDFDB.ReactUtils.createElement("span", {
let layerContainer = !event.shiftKey && BDFDB.DOMUtils.getParent(BDFDB.dotCN.itemlayercontainer, event.currentTarget) className: BDFDB.disCN.imagemodalimagedownloadlink,
let backdrop = layerContainer && layerContainer.querySelector(BDFDB.dotCN.backdrop); children: "|",
if (backdrop) backdrop.click(); style: {margin: "0 5px"}
let channel = BDFDB.LibraryStores.ChannelStore.getChannel(viewedImage.channelId); }),
if (channel) BDFDB.LibraryModules.HistoryUtils.transitionTo(BDFDB.DiscordConstants.Routes.CHANNEL(channel.guild_id, channel.id, viewedImage.messageId)); BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, {
} className: BDFDB.disCN.imagemodalimagedownloadlink,
}) children: BDFDB.LanguageUtils.LanguageStrings.JUMP,
], onClick: event => {
this.settings.viewerSettings.zoomMode && !filterForVideos && !this.isValid(e.instance.props.src, "gif") && [ let layerContainer = !event.shiftKey && BDFDB.DOMUtils.getParent(BDFDB.dotCN.itemlayercontainer, event.currentTarget)
BDFDB.ReactUtils.createElement("span", { let backdrop = layerContainer && layerContainer.querySelector(BDFDB.dotCN.backdrop);
className: BDFDB.disCN.downloadlink, if (backdrop) backdrop.click();
children: "|", let channel = BDFDB.LibraryStores.ChannelStore.getChannel(viewedImage.channelId);
style: {margin: "0 5px"} if (channel) BDFDB.LibraryModules.HistoryUtils.transitionTo(BDFDB.DiscordConstants.Routes.CHANNEL(channel.guild_id, channel.id, viewedImage.messageId));
}), }
BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, { })
className: BDFDB.disCN.downloadlink, ]
children: `Zoom ${BDFDB.LanguageUtils.LanguageStrings.SETTINGS}`, }),
onClick: openContext, this.settings.viewerSettings.zoomMode && !filterForVideos && !this.isValid(e.instance.props.src, "gif") && BDFDB.ReactUtils.createElement("div", {
onContextMenu: openContext className: BDFDB.disCN.imagemodalimageoptionscontainer,
}) children: [
] BDFDB.ReactUtils.createElement("span", {
className: BDFDB.disCN.imagemodalimagedownloadlink,
children: "|",
style: {margin: "0 5px"}
}),
BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Anchor, {
className: BDFDB.disCN.imagemodalimagedownloadlink,
children: `Zoom ${BDFDB.LanguageUtils.LanguageStrings.SETTINGS}`,
onClick: openContext,
onContextMenu: openContext
})
]
})
].flat(10).filter(n => n) ].flat(10).filter(n => n)
}); });