+
+
-
+
+
+ ![]()
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ formatBytes(newMessageImage.size) }}
+
+
@@ -281,7 +307,7 @@
@@ -331,6 +366,8 @@
autoReconnectWebsocket: true,
newMessageText: "",
+ newMessageImage: null,
+ newMessageImageUrl: null,
newMessageFiles: [],
isSendingMessage: false,
autoScrollOnNewMessage: true,
@@ -593,6 +630,14 @@
fields["file_attachments"] = fileAttachments;
}
+ // add image attachment
+ if(this.newMessageImage){
+ fields["image"] = {
+ "image_type": this.newMessageImage.type,
+ "image_bytes": this.arrayBufferToBase64(await this.newMessageImage.arrayBuffer()),
+ };
+ }
+
// send message to reticulum via websocket
this.ws.send(JSON.stringify({
"type": "lxmf.delivery",
@@ -605,7 +650,10 @@
// clear message inputs
this.newMessageText = "";
+ this.newMessageImage = null;
+ this.newMessageImageUrl = null;
this.newMessageFiles = [];
+ this.clearImageInput();
this.clearFileInput();
} catch(e) {
@@ -854,6 +902,36 @@
return newMessageFile !== file;
});
},
+ addImageToMessage: function() {
+ this.$refs["image-input"].click();
+ },
+ onImageInputChange: function(event) {
+ if(event.target.files.length > 0){
+
+ // update selected file
+ this.newMessageImage = event.target.files[0];
+
+ // update image url when file is read
+ const fileReader = new FileReader();
+ fileReader.onload = (event) => {
+ this.newMessageImageUrl = event.target.result
+ }
+
+ // convert image to data url
+ fileReader.readAsDataURL(this.newMessageImage);
+
+ // clear image input to allow selecting the same file after user removed it
+ this.clearImageInput();
+
+ }
+ },
+ clearImageInput: function() {
+ this.$refs["image-input"].value = null;
+ },
+ removeImageAttachment: function() {
+ this.newMessageImage = null;
+ this.newMessageImageUrl = null;
+ },
formatBytes: function(bytes) {
if(bytes === 0){
-
+