diff --git a/client/components/Chat.vue b/client/components/Chat.vue
index 14df581d..e42cfa0b 100644
--- a/client/components/Chat.vue
+++ b/client/components/Chat.vue
@@ -54,25 +54,7 @@
-
-
-
-
-
-
+
@@ -87,8 +69,6 @@
diff --git a/client/components/ChatInput.vue b/client/components/ChatInput.vue
index fe52bf70..2c5cd524 100644
--- a/client/components/ChatInput.vue
+++ b/client/components/ChatInput.vue
@@ -67,20 +67,18 @@ export default {
channel: Object,
},
watch: {
- "channel.pendingMessage": {
- handler: function() {
- const style = window.getComputedStyle(this.$refs.input);
- const lineHeight = parseFloat(style.lineHeight, 10) || 1;
+ "channel.pendingMessage"() {
+ const style = window.getComputedStyle(this.$refs.input);
+ const lineHeight = parseFloat(style.lineHeight, 10) || 1;
- // Start by resetting height before computing as scrollHeight does not
- // decrease when deleting characters
- resetInputHeight(this);
+ // Start by resetting height before computing as scrollHeight does not
+ // decrease when deleting characters
+ resetInputHeight(this);
- // Use scrollHeight to calculate how many lines there are in input, and ceil the value
- // because some browsers tend to incorrently round the values when using high density
- // displays or using page zoom feature
- this.$refs.input.style.height = Math.ceil(this.$refs.input.scrollHeight / lineHeight) * lineHeight + "px";
- },
+ // Use scrollHeight to calculate how many lines there are in input, and ceil the value
+ // because some browsers tend to incorrently round the values when using high density
+ // displays or using page zoom feature
+ this.$refs.input.style.height = Math.ceil(this.$refs.input.scrollHeight / lineHeight) * lineHeight + "px";
},
},
mounted() {
diff --git a/client/components/LinkPreview.vue b/client/components/LinkPreview.vue
index 058714ee..ad730b46 100644
--- a/client/components/LinkPreview.vue
+++ b/client/components/LinkPreview.vue
@@ -125,6 +125,7 @@ export default {
name: "LinkPreview",
props: {
link: Object,
+ keepScrollPosition: Function,
},
data() {
return {
@@ -137,29 +138,36 @@ export default {
return this.isContentShown ? "Less" : "More";
},
},
+ watch: {
+ "link.type"() {
+ this.onPreviewUpdate();
+ },
+ },
mounted() {
// Don't display previews while they are loading on the server
if (this.link.type === "loading") {
return;
}
- // Error don't have any media to render
- if (this.link.type === "error") {
- this.onPreviewReady();
- }
-
- // If link doesn't have a thumbnail, render it
- if (this.link.type === "link" && !this.link.thumb) {
- this.onPreviewReady();
- }
+ this.onPreviewUpdate();
},
methods: {
+ onPreviewUpdate() {
+ // Error don't have any media to render
+ if (this.link.type === "error") {
+ this.onPreviewReady();
+ }
+
+ // If link doesn't have a thumbnail, render it
+ if (this.link.type === "link" && !this.link.thumb) {
+ this.onPreviewReady();
+ }
+ },
onPreviewReady() {
const options = require("../js/options");
this.$set(this.link, "canDisplay", this.link.type !== "loading" && options.shouldOpenMessagePreview(this.link.type));
- // parent 1 - message - parent 2 - messagelist
- this.$parent.$parent.$emit("keepScrollPosition");
+ this.keepScrollPosition();
if (this.link.type !== "link") {
return;
diff --git a/client/components/Message.vue b/client/components/Message.vue
index e673e373..097bc547 100644
--- a/client/components/Message.vue
+++ b/client/components/Message.vue
@@ -21,6 +21,17 @@
:is="messageComponent"
:message="message"/>
+
+
+
+
+
+
+
@@ -29,9 +40,9 @@
-
@@ -54,6 +65,7 @@ export default {
components: MessageTypes,
props: {
message: Object,
+ keepScrollPosition: Function,
},
computed: {
messageComponent() {
diff --git a/client/components/MessageList.vue b/client/components/MessageList.vue
index b8afe83b..58587114 100644
--- a/client/components/MessageList.vue
+++ b/client/components/MessageList.vue
@@ -1,47 +1,66 @@
diff --git a/client/components/MessageTypes/action.vue b/client/components/MessageTypes/action.vue
deleted file mode 100644
index 1f3e5d1b..00000000
--- a/client/components/MessageTypes/action.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-
-
-
-
-
-
-
-
-
diff --git a/client/js/socket-events/msg_preview.js b/client/js/socket-events/msg_preview.js
index 55d0dd53..8a7ed712 100644
--- a/client/js/socket-events/msg_preview.js
+++ b/client/js/socket-events/msg_preview.js
@@ -1,7 +1,6 @@
"use strict";
const socket = require("../socket");
-const {shouldOpenMessagePreview} = require("../options");
const {vueApp, findChannel} = require("../vue");
socket.on("msg:preview", function(data) {
@@ -15,8 +14,6 @@ socket.on("msg:preview", function(data) {
const previewIndex = message.previews.findIndex((m) => m.link === data.preview.link);
if (previewIndex > -1) {
- data.preview.canDisplay = shouldOpenMessagePreview(data.preview.type);
-
vueApp.$set(message.previews, previewIndex, data.preview);
}
});