butter/keanu-weblite
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Rename "scaled" to "compressed" when it comes to media attachments

Browse source
This commit is contained in:
N-Pex 2025-10-23 10:19:37 +02:00
parent 1aff02c7d4
commit 90d5f3b2f8
4 changed files with 21 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

0
src/assets/icons/ic_scaled.vue → src/assets/icons/ic_compressed.vue
View file

16
src/components/file_mode/AttachmentInfo.vue
View file

@ -1,19 +1,19 @@
<template> <template>
<div class="attachment-info"> <div class="attachment-info">
<div v-if="attachment.scaledFile" class="attachment-info__quality"> <div v-if="attachment.compressedFile" class="attachment-info__quality">
<div class="attachment-info__quality__title"> <div class="attachment-info__quality__title">
{{ t("file_mode.quality") }} {{ t("file_mode.quality") }}
</div> </div>
<div class="d-flex justify-center"> <div class="d-flex justify-center">
<div @click="attachment.useScaled = true" :class="{ 'attachment-info__quality__class': true, selected: attachment.useScaled, clickable: true }"> <div @click="attachment.useCompressed = true" :class="{ 'attachment-info__quality__class': true, selected: attachment.useCompressed, clickable: true }">
<v-icon>$vuetify.icons.ic_scaled</v-icon> <v-icon>$vuetify.icons.ic_compressed</v-icon>
<div class="attachment-info__quality__class-name">{{ t("file_mode.compressed") }}</div> <div class="attachment-info__quality__class-name">{{ t("file_mode.compressed") }}</div>
<div class="attachment-info__quality__class-size"> <div class="attachment-info__quality__class-size">
<span>{{ attachment.scaledDimensions?.width }} x {{ attachment.scaledDimensions?.height }}</span> <span>{{ attachment.compressedDimensions?.width }} x {{ attachment.compressedDimensions?.height }}</span>
<span> ({{ formatBytes(attachment.scaledFile.size) }})</span> <span> ({{ formatBytes(attachment.compressedFile.size) }})</span>
</div> </div>
</div> </div>
<div @click="attachment.useScaled = false" :class="{ 'attachment-info__quality__class': true, selected: !attachment.useScaled, clickable: true }"> <div @click="attachment.useCompressed = false" :class="{ 'attachment-info__quality__class': true, selected: !attachment.useCompressed, clickable: true }">
<v-icon>$vuetify.icons.ic_original</v-icon> <v-icon>$vuetify.icons.ic_original</v-icon>
<div class="attachment-info__quality__class-name">{{ t("file_mode.original") }}</div> <div class="attachment-info__quality__class-name">{{ t("file_mode.original") }}</div>
<div class="attachment-info__quality__class-size"> <div class="attachment-info__quality__class-size">
@ -24,11 +24,11 @@
</div> </div>
<div class="attachment-info__quality__info"> <div class="attachment-info__quality__info">
{{ t(attachment.useScaled ? "file_mode.metadata_info_compressed" : "file_mode.metadata_info_original") }} {{ t(attachment.useCompressed ? "file_mode.metadata_info_compressed" : "file_mode.metadata_info_original") }}
</div> </div>
</div> </div>
<C2PAInfo class="attachment-info__detail-box" v-if="showC2PAInfo || hasExif" :proof="attachment.proof" :metadata="attachment.mediaMetadata" :showFlagsOnly="attachment.useScaled" /> <C2PAInfo class="attachment-info__detail-box" v-if="showC2PAInfo || hasExif" :proof="attachment.proof" :metadata="attachment.mediaMetadata" :showFlagsOnly="attachment.useCompressed" />
</div> </div>
</template> </template>

6
src/models/attachment.ts
View file

@ -53,9 +53,9 @@ export type Attachment = {
status: "loading" | "loaded"; status: "loading" | "loaded";
file: File; file: File;
dimensions?: { width: number; height: number }; dimensions?: { width: number; height: number };
scaledFile?: File; compressedFile?: File;
scaledDimensions?: { width: number; height: number }; compressedDimensions?: { width: number; height: number };
useScaled: boolean; useCompressed: boolean;
src?: string; src?: string;
proof?: Proof; proof?: Proof;
mediaMetadata?: MediaMetadata; mediaMetadata?: MediaMetadata;

20
src/models/attachmentManager.ts
View file

@ -56,7 +56,7 @@ export class AttachmentManager {
let a: Attachment = { let a: Attachment = {
status: "loading", status: "loading",
file: file, file: file,
useScaled: false, useCompressed: false,
sendInfo: { sendInfo: {
status: "initial", status: "initial",
statusDate: 0, statusDate: 0,
@ -104,11 +104,11 @@ export class AttachmentManager {
height: newHeight, height: newHeight,
outputType: "blob", outputType: "blob",
}); });
attachment.scaledFile = new File([compressedImg as BlobPart], file.name, { attachment.compressedFile = new File([compressedImg as BlobPart], file.name, {
type: "image/webp", type: "image/webp",
lastModified: Date.now(), lastModified: Date.now(),
}); });
attachment.scaledDimensions = { attachment.compressedDimensions = {
width: newWidth, width: newWidth,
height: newHeight, height: newHeight,
}; };
@ -130,8 +130,8 @@ export class AttachmentManager {
} }
return false; return false;
}; };
attachment.useScaled = attachment.useCompressed =
attachment.scaledFile !== undefined && attachment.compressedFile !== undefined &&
(attachment.proof === undefined || (attachment.proof === undefined ||
!isDirectRoom(room) || !isDirectRoom(room) ||
attachment.proof.integrity === undefined || attachment.proof.integrity === undefined ||
@ -490,7 +490,7 @@ export const createUploadBatch = (manager: AttachmentManager | null, room: Room
}; };
const isTooLarge = (attachment: Attachment) => { const isTooLarge = (attachment: Attachment) => {
const file = attachment.scaledFile && attachment.useScaled ? attachment.scaledFile : attachment.file; const file = attachment.compressedFile && attachment.useCompressed ? attachment.compressedFile : attachment.file;
return file.size > maxSizeUploads; return file.size > maxSizeUploads;
}; };
@ -608,11 +608,11 @@ export const createUploadBatch = (manager: AttachmentManager | null, room: Room
item.sendInfo.status = "sending"; item.sendInfo.status = "sending";
let file = (() => { let file = (() => {
if (attachment.scaledFile && attachment.useScaled) { if (attachment.compressedFile && attachment.useCompressed) {
// Send scaled version of image instead! // Send compressed!
return attachment.scaledFile; return attachment.compressedFile;
} else { } else {
// Send actual file image when not scaled! // Send original
return attachment.file; return attachment.file;
} }
})(); })();