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

Fix export

Browse source
This commit is contained in:
N-Pex 2025-05-14 10:47:21 +02:00
parent b1d47748c8
commit ac4af0a53d
9 changed files with 41 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/AuthedImage.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<img v-if="imageSrc" :src="imageSrc" style="width:100%;height:100%" /> <img :src="imageSrc" style="width:100%;height:100%" />
</template> </template>
<script> <script>
@ -11,7 +11,7 @@ export default {
src: { src: {
type: String, type: String,
default: function () { default: function () {
return null; return undefined;
}, },
}, },
}, },

3
src/components/Chat.vue
View file

@ -692,9 +692,6 @@ export default {
canRecordAudio() { canRecordAudio() {
return util.browserCanRecordAudio(); return util.browserCanRecordAudio();
}, },
debugging() {
return false; //(window.location.host || "").startsWith("localhost");
},
canCreatePoll() { canCreatePoll() {
// We say that if you can redact events, you are allowed to create polls. // We say that if you can redact events, you are allowed to create polls.
const me = this.room && this.room.getMember(this.$matrix.currentUserId); const me = this.room && this.room.getMember(this.$matrix.currentUserId);

24
src/components/RoomExport.vue
View file

@ -307,7 +307,7 @@ export default {
for (const comp of childComponents) { for (const comp of childComponents) {
// Avatars need downloading? // Avatars need downloading?
if (comp.$el) { if (comp.$el && comp.$el.nodeType == 1) {
const avatars = comp.$el.getElementsByClassName("v-avatar"); const avatars = comp.$el.getElementsByClassName("v-avatar");
if (avatars && avatars.length > 0) { if (avatars && avatars.length > 0) {
const member = this.room.getMember(comp.event.getSender()); const member = this.room.getMember(comp.event.getSender());
@ -353,7 +353,7 @@ export default {
} }
} }
let componentClass = comp.$vnode.tag.split("-").reverse()[0]; let componentClass = comp.$options ? comp.$options.__file.split("/").reverse()[0].split(".")[0] : "invalid_component";
switch (componentClass) { switch (componentClass) {
case "MessageIncomingImageExport": case "MessageIncomingImageExport":
case "MessageOutgoingImageExport": case "MessageOutgoingImageExport":
@ -386,21 +386,15 @@ export default {
let fileName = comp.event.getId() + extension; let fileName = comp.event.getId() + extension;
imageFolder.file(fileName, blob); // TODO calc bytes imageFolder.file(fileName, blob); // TODO calc bytes
let blobUrl = URL.createObjectURL(blob);
comp.src = blobUrl;
this.$nextTick(() => {
// Update source // Update source
let elements = comp.$el.getElementsByClassName("v-image__image"); const images = comp.$el.getElementsByTagName("img");
let element = elements && elements[0]; for (let imageIndex = 0; imageIndex < images.length; imageIndex++) {
if (element) { const img = images[imageIndex];
element.style.backgroundImage = 'url("./images/' + fileName + '")'; img.removeAttribute("src");
element.classList.remove("v-image__image--preload"); img.setAttribute("data-exported-src", './images/' + fileName);
} }
URL.revokeObjectURL(blobUrl); // Give the blob back
this.processedEvents += 1; this.processedEvents += 1;
resolve(true); resolve(true);
});
} }
}); });
}) })
@ -419,10 +413,9 @@ export default {
currentMediaSize += blob.size; currentMediaSize += blob.size;
return new Promise((resolve, ignoredReject) => { return new Promise((resolve, ignoredReject) => {
//let mime = blob.type; //let mime = blob.type;
var extension = ".mp3"; var extension = ".webm";
let fileName = comp.event.getId() + extension; let fileName = comp.event.getId() + extension;
audioFolder.file(fileName, blob); // TODO calc bytes audioFolder.file(fileName, blob); // TODO calc bytes
//this.$nextTick(() => {
let elements = comp.$el.getElementsByTagName("audio"); let elements = comp.$el.getElementsByTagName("audio");
let element = elements && elements[0]; let element = elements && elements[0];
if (element) { if (element) {
@ -430,7 +423,6 @@ export default {
} }
this.processedEvents += 1; this.processedEvents += 1;
resolve(true); resolve(true);
//});
}); });
} }
}) })

5
src/components/chatMixin.js
View file

@ -107,6 +107,11 @@ export default {
CreatePollDialog, CreatePollDialog,
ReadMarker ReadMarker
}, },
computed: {
debugging() {
return false; //(window.location.host || "").startsWith("localhost");
},
},
methods: { methods: {
showDayMarkerBeforeEvent(event) { showDayMarkerBeforeEvent(event) {
const idx = this.events.indexOf(event); const idx = this.events.indexOf(event);

7
src/components/messages/export/MessageIncomingImageExport.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<message-incoming v-bind="{ ...$props, ...$attrs }"> <message-incoming v-bind="{ ...$props, ...$attrs }">
<div class="bubble image-bubble"> <div class="bubble image-bubble">
<v-img :aspect-ratio="16 / 9" ref="image" :src="src" :cover="cover" :contain="contain" /> <img :src="src" :style="imageStyle" />
</div> </div>
</message-incoming> </message-incoming>
</template> </template>
@ -39,6 +39,11 @@ export default {
URL.revokeObjectURL(objectUrl); URL.revokeObjectURL(objectUrl);
} }
}, },
computed: {
imageStyle() {
return "width:100%;aspect-ratio:16/9;object-fit:" + (this.cover ? "cover" : "contain");
}
}
}; };
</script> </script>

4
src/components/messages/export/MessageIncomingThreadExport.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<message-incoming class="messageIn-thread" v-bind="{ ...$props, ...$attrs }"> <message-incoming class="messageIn-thread" v-bind="{ ...$props, ...$attrs }">
<component v-for="item in items" :is="componentFn(item.event)" :originalEvent="item.event" :key="item.event.getId()" <component v-for="item in items" :is="componentFn(item.event)" v-bind="{ ...$props, ...$attrs }" :originalEvent="item.event" :key="item.event.getId()"
v-bind="{ ...$props, ...$attrs }" ref="exportedEvent" /> ref="exportedEvent" />
</message-incoming> </message-incoming>
</template> </template>

7
src/components/messages/export/MessageOutgoingImageExport.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<message-outgoing v-bind="{ ...$props, ...$attrs }"> <message-outgoing v-bind="{ ...$props, ...$attrs }">
<div class="bubble image-bubble"> <div class="bubble image-bubble">
<v-img :aspect-ratio="16 / 9" ref="image" :src="src" :cover="cover" :contain="contain" /> <img :src="src" :style="imageStyle" />
</div> </div>
</message-outgoing> </message-outgoing>
</template> </template>
@ -39,6 +39,11 @@ export default {
URL.revokeObjectURL(objectUrl); URL.revokeObjectURL(objectUrl);
} }
}, },
computed: {
imageStyle() {
return "width:100%;aspect-ratio:16/9;object-fit:" + (this.cover ? "cover" : "contain");
}
}
}; };
</script> </script>

3
src/components/messages/export/MessageOutgoingThreadExport.vue
View file

@ -1,7 +1,6 @@
<template> <template>
<message-outgoing class="messageOut-thread" v-bind="{ ...$props, ...$attrs }"> <message-outgoing class="messageOut-thread" v-bind="{ ...$props, ...$attrs }">
<component v-for="item in items" :is="componentFn(item.event)" :originalEvent="item.event" :key="item.event.getId()" <component v-for="item in items" :is="componentFn(item.event)" v-bind="{ ...$props, ...$attrs }" :originalEvent="item.event" :key="item.event.getId()" ref="exportedEvent" />
v-bind="{ ...$props, ...$attrs }" ref="exportedEvent" />
</message-outgoing> </message-outgoing>
</template> </template>

8
vite.config.mjs
View file

@ -30,7 +30,13 @@ export default defineConfig(({mode}) => ({
// commonjs({ // commonjs({
// exclude: ["*vuex-persist*", "*deepmerge*"] // exclude: ["*vuex-persist*", "*deepmerge*"]
// }), // }),
vue(), vue({
template: {
compilerOptions: {
comments: false
}
}
}),
vueJsx(), vueJsx(),
vitePluginVuetify(), vitePluginVuetify(),
// Components({ // Components({