Make sure CC icon/badge is shown

Also, always compress images, even if smaller than 640 pixels. For issue #680.
This commit is contained in:
N-Pex 2025-09-04 12:20:54 +02:00
parent 6fd59aa4c9
commit a318934376
3 changed files with 59 additions and 29 deletions

View file

@ -107,6 +107,16 @@ $hiliteColor: #4642f1;
align-items: end;
justify-content: end;
}
.send-attachments__selecting__current-item__cc {
position: absolute;
right: 12px;
bottom: 12px;
display: flex;
flex-direction: column;
align-items: end;
justify-content: end;
}
}
.file-drop-thumbnail-container,

View file

@ -28,6 +28,10 @@
<v-progress-circular indeterminate class="mb-0"></v-progress-circular>
</div>
</div>
<div v-else-if="showCCIcon" class="send-attachments__selecting__current-item__cc">
<v-icon style="width:24px;height:24px">$vuetify.icons.ic_cr</v-icon>
</div>
</div>
<div class="file-drop-thumbnail-container">
<v-tooltip location="top" v-for="(attachment, index) in batch.attachments" :key="index">
@ -85,15 +89,17 @@
:disabled="sendButtonDisabled"
></v-btn>
</div>
<v-btn
class="info-button clickable"
icon="$vuetify.icons.ic_share_settings"
size="44"
elevation="0"
color="black"
@click.stop="showInformation"
:disabled="currentAttachment?.status !== 'loaded'"
></v-btn>
<v-badge location="top right" color="#ff3300" dot class="cc-badge" :model-value="anyContainsCC">
<v-btn
class="info-button clickable"
icon="$vuetify.icons.ic_share_settings"
size="44"
elevation="0"
color="black"
@click.stop="showInformation"
:disabled="currentAttachment?.status !== 'loaded'"
></v-btn>
</v-badge>
</div>
</template>
@ -283,6 +289,12 @@ export default defineComponent({
}
return undefined;
},
anyContainsCC(): boolean {
return this.batch.attachments.some((a: Attachment) => a.proof?.integrity?.c2pa !== undefined);
},
showCCIcon(): boolean {
return this.currentAttachment && this.currentAttachment.proof?.integrity?.c2pa !== undefined && !this.currentAttachment.useScaled;
}
},
watch: {
"batch.attachments": {
@ -360,4 +372,10 @@ export default defineComponent({
<style lang="scss">
@use "@/assets/css/chat.scss" as *;
@use "@/assets/css/sendattachments.scss" as *;
.cc-badge.v-badge--dot .v-badge__badge {
width: 8px;
height: 8px;
border-radius: 4px;
}
</style>

View file

@ -94,25 +94,24 @@ export class AttachmentManager {
// Need to resize?
const w = attachment.dimensions?.width ?? 0;
const h = attachment.dimensions?.height ?? 0;
if (w > 640 || h > 640) {
var aspect = w / h;
var newWidth = parseInt((w > h ? 640 : 640 * aspect).toFixed());
var newHeight = parseInt((w > h ? 640 / aspect : 640).toFixed());
const img = await imageResize(file, {
format: "webp",
width: newWidth,
height: newHeight,
outputType: "blob",
});
attachment.scaledFile = new File([img as BlobPart], file.name, {
type: "image/webp",
lastModified: Date.now(),
});
attachment.scaledDimensions = {
width: newWidth,
height: newHeight,
};
}
const sizeDown = (w > 640 || h > 640);
var aspect = w / h;
var newWidth = sizeDown ? parseInt((w > h ? 640 : 640 * aspect).toFixed()) : w;
var newHeight = sizeDown ? parseInt((w > h ? 640 / aspect : 640).toFixed()) : h;
const compressedImg = await imageResize(file, {
format: "webp",
width: newWidth,
height: newHeight,
outputType: "blob",
});
attachment.scaledFile = new File([compressedImg as BlobPart], file.name, {
type: "image/webp",
lastModified: Date.now(),
});
attachment.scaledDimensions = {
width: newWidth,
height: newHeight,
};
} catch (error) {
console.error("Failed to get image dimensions: " + error);
}
@ -478,7 +477,10 @@ export const createUploadBatch = (manager: AttachmentManager | null, room: Room
const removeAttachment = (attachment: Attachment) => {
if (sendingStatus.value == "initial") {
attachments.value = attachments.value.filter((a) => a !== attachment);
const index = attachments.value.indexOf(attachment);
if (index > -1) {
attachments.value.splice(index, 1);
}
}
};