diff --git a/src/plugins/fixImagesQuality/index.tsx b/src/plugins/fixImagesQuality/index.tsx
index 4c3e6eeb3..fc9859d9b 100644
--- a/src/plugins/fixImagesQuality/index.tsx
+++ b/src/plugins/fixImagesQuality/index.tsx
@@ -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({
— In the image modal, the original image will be loaded.
+ You can also enable original image in chat, but beware of the following caveats:
- You can also enable original image in chat, but this may cause performance issues!
+
+ - — Animated images (GIF, WebP, etc.) in chat will always animate, regardless of if the App is focused.
+ - — May cause lag.
+
);
},
- 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;
}
}
});