SheWhoReignsSupreme/Equicord
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

FixImageQuality: fix videos & don't animate gifs if app unfocused

Browse source
This commit is contained in:
Vendicated 2025-12-17 22:56:07 +01:00
parent e8fd3dc3ef
commit 16f343be52
No known key found for this signature in database
GPG key ID: D66986BAF75ECF18
1 changed files with 27 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
src/plugins/fixImagesQuality/index.tsx
View file

@ -7,6 +7,7 @@
import { definePluginSettings } from "@api/Settings";
import { Card } from "@components/Card";
import { Flex } from "@components/Flex";
import { Margins } from "@components/margins";
import { Paragraph } from "@components/Paragraph";
import { Devs } from "@utils/constants";
import { Logger } from "@utils/Logger";
@ -15,7 +16,7 @@ import definePlugin, { OptionType } from "@utils/types";
const settings = definePluginSettings({
originalImagesInChat: {
type: OptionType.BOOLEAN,
description: "Also load the original image in Chat",
description: "Also load the original image in Chat. WARNING: Read the caveats above",
default: false,
}
});
@ -31,7 +32,7 @@ export default definePlugin({
find: ".handleImageLoad)",
replacement: {
match: /getSrc\(\i\)\{/,
replace: "$&var _vcSrc=$self.getSrc(this.props);if(_vcSrc)return _vcSrc;"
replace: "$&var _vcSrc=$self.getSrc(this.props,arguments[1]);if(_vcSrc)return _vcSrc;"
}
}
],
@ -47,36 +48,49 @@ export default definePlugin({
<li>&mdash; In the image modal, the original image will be loaded.</li>
</ul>
</Paragraph>
<Paragraph size="md" weight="semibold" className={Margins.top8}>You can also enable original image in chat, but beware of the following caveats:</Paragraph>
<Paragraph>
You can also enable original image in chat, but this may cause performance issues!
<ul>
<li>&mdash; Animated images (GIF, WebP, etc.) in chat will always animate, regardless of if the App is focused.</li>
<li>&mdash; May cause lag.</li>
</ul>
</Paragraph>
</Flex>
</Card>
);
},
getSrc(props: { src: string; mediaLayoutType: string; width: number; height: number; }) {
if (!props) return;
getSrc(props: { src: string; mediaLayoutType: string; width: number; height: number; contentType: string; }, freeze?: boolean) {
if (!props?.src) return;
try {
if (!settings.store.originalImagesInChat && props.mediaLayoutType === "MOSAIC") {
const { contentType, height, mediaLayoutType, src, width } = props;
if (!contentType?.startsWith("image/") || src.startsWith("data:")) return;
console.log({ src, freeze });
const url = new URL(src);
url.searchParams.set("animated", String(!freeze));
if (!settings.store.originalImagesInChat && mediaLayoutType === "MOSAIC") {
// make sure the image is not too large
const pixels = props.width * props.height;
const pixels = width * height;
const limit = 2000 * 1200;
if (pixels <= limit) return props.src;
if (pixels <= limit)
return url.toString();
const scale = Math.sqrt(pixels / limit);
const url = new URL(props.src);
url.searchParams.set("width", Math.round(props.width / scale).toString());
url.searchParams.set("height", Math.round(props.height / scale).toString());
url.searchParams.set("width", Math.round(width / scale).toString());
url.searchParams.set("height", Math.round(height / scale).toString());
return url.toString();
}
return props.src?.replace("https://media.discordapp.net/attachments/", "https://cdn.discordapp.com/attachments/");
url.hostname = "cdn.discordapp.com";
return url.toString();
} catch (e) {
new Logger("FixImagesQuality").error("Failed to make image src", e);
return props.src;
return;
}
}
});