diff --git a/package.json b/package.json index 372155df..8dbf2503 100644 --- a/package.json +++ b/package.json @@ -34,7 +34,6 @@ "punycode.js": "^2.1.0", "v-click-outside": "^2.1.1", "vue": "^2.6.11", - "vue-chat-scroll": "^1.2.1", "vue-i18n": "^7.3.2", "vue-router": "^3.0.1", "vue-template-compiler": "^2.6.11", diff --git a/src/App.vue b/src/App.vue index 1a166778..e09ce4c8 100644 --- a/src/App.vue +++ b/src/App.vue @@ -50,7 +50,7 @@ diff --git a/src/components/chat_panel/chat_panel.js b/src/components/chat_panel/chat_panel.js index c3887098..556694ae 100644 --- a/src/components/chat_panel/chat_panel.js +++ b/src/components/chat_panel/chat_panel.js @@ -35,6 +35,18 @@ const chatPanel = { userProfileLink (user) { return generateProfileLink(user.id, user.username, this.$store.state.instance.restrictedNicknames) } + }, + watch: { + messages (newVal) { + const scrollEl = this.$el.querySelector('.chat-window') + if (!scrollEl) return + if (scrollEl.scrollTop + scrollEl.offsetHeight + 20 > scrollEl.scrollHeight) { + this.$nextTick(() => { + if (!scrollEl) return + scrollEl.scrollTop = scrollEl.scrollHeight - scrollEl.offsetHeight + }) + } + } } } diff --git a/src/components/chat_panel/chat_panel.vue b/src/components/chat_panel/chat_panel.vue index 7993c94d..8a829115 100644 --- a/src/components/chat_panel/chat_panel.vue +++ b/src/components/chat_panel/chat_panel.vue @@ -10,17 +10,15 @@ @click.stop.prevent="togglePanel" >
- {{ $t('shoutbox.title') }} + {{ $t('shoutbox.title') }}
-
+
{ + id += 1 + return { + text: 'test' + id, + author: { + username: 'test', + avatar: '', + id + } + } + } + + const loop = () => { + store.commit('addMessage', createmsg()) + setTimeout(loop, 3000) + } + loop() + channel.on('new_msg', (msg) => { store.commit('addMessage', msg) }) diff --git a/yarn.lock b/yarn.lock index 6d0095db..80c09312 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8923,10 +8923,6 @@ void-elements@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/void-elements/-/void-elements-2.0.1.tgz#c066afb582bb1cb4128d60ea92392e94d5e9dbec" -vue-chat-scroll@^1.2.1: - version "1.3.5" - resolved "https://registry.yarnpkg.com/vue-chat-scroll/-/vue-chat-scroll-1.3.5.tgz#a5ee5bae5058f614818a96eac5ee3be4394a2f68" - vue-eslint-parser@^5.0.0: version "5.0.0" resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-5.0.0.tgz#00f4e4da94ec974b821a26ff0ed0f7a78402b8a1"