From 92289e545a62bd28ea336c5d712a05445e0e20ab Mon Sep 17 00:00:00 2001
From: Roger Braun <roger@rogerbraun.net>
Date: Fri, 26 Jan 2018 15:11:34 +0100
Subject: Move chat to sidebar.

---
 src/components/chat/chat.js              | 21 ------------
 src/components/chat/chat.vue             | 59 --------------------------------
 src/components/chat_panel/chat_panel.js  | 21 ++++++++++++
 src/components/chat_panel/chat_panel.vue | 58 +++++++++++++++++++++++++++++++
 src/components/nav_panel/nav_panel.vue   |  5 ---
 5 files changed, 79 insertions(+), 85 deletions(-)
 delete mode 100644 src/components/chat/chat.js
 delete mode 100644 src/components/chat/chat.vue
 create mode 100644 src/components/chat_panel/chat_panel.js
 create mode 100644 src/components/chat_panel/chat_panel.vue

(limited to 'src/components')

diff --git a/src/components/chat/chat.js b/src/components/chat/chat.js
deleted file mode 100644
index ef326d4a..00000000
--- a/src/components/chat/chat.js
+++ /dev/null
@@ -1,21 +0,0 @@
-const chat = {
-  data () {
-    return {
-      currentMessage: '',
-      channel: null
-    }
-  },
-  computed: {
-    messages () {
-      return this.$store.state.chat.messages
-    }
-  },
-  methods: {
-    submit (message) {
-      this.$store.state.chat.channel.push('new_msg', {text: message}, 10000)
-      this.currentMessage = ''
-    }
-  }
-}
-
-export default chat
diff --git a/src/components/chat/chat.vue b/src/components/chat/chat.vue
deleted file mode 100644
index 6c1e2c38..00000000
--- a/src/components/chat/chat.vue
+++ /dev/null
@@ -1,59 +0,0 @@
-<template>
-  <div class="chat-panel panel panel-default">
-    <div class="panel-heading timeline-heading base02-background base04">
-      <div class="title">
-        {{$t('chat.title')}}
-      </div>
-    </div>
-    <div class="panel-body base01-background">
-      <div class="chat-window">
-        <div class="chat-message" v-for="message in messages" :key="message.id">
-          <span class="chat-avatar">
-            <img :src="message.author.avatar" />
-            {{message.author.username}}:
-          </span>
-          <span class="chat-text">
-            {{message.text}}
-          </span>
-        </div>
-      </div>
-      <div class="chat-input">
-        <form @submit.prevent="submit(currentMessage)">
-          <input v-model="currentMessage" type="text" >
-        </form>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script src="./chat.js"></script>
-
-
-<style lang="scss">
- .chat-window {
-   max-height: 80vh;
-   overflow-y: auto;
-   overflow-x: hidden;
- }
- .chat-message {
-   padding: 0.2em 0.5em
- }
- .chat-avatar {
-     img {
-         height: 32px;
-         width: 32px;
-         border-radius: 5px;
-         margin-right: 0.5em;
-     }
- }
- .chat-input {
-     display: flex;
-     form {
-         flex: auto;
-         input {
-             margin: 0.5em;
-             width: fill-available;
-         }
-     }
- }
-</style>
diff --git a/src/components/chat_panel/chat_panel.js b/src/components/chat_panel/chat_panel.js
new file mode 100644
index 00000000..b146c5d9
--- /dev/null
+++ b/src/components/chat_panel/chat_panel.js
@@ -0,0 +1,21 @@
+const chatPanel = {
+  data () {
+    return {
+      currentMessage: '',
+      channel: null
+    }
+  },
+  computed: {
+    messages () {
+      return this.$store.state.chat.messages
+    }
+  },
+  methods: {
+    submit (message) {
+      this.$store.state.chat.channel.push('new_msg', {text: message}, 10000)
+      this.currentMessage = ''
+    }
+  }
+}
+
+export default chatPanel
diff --git a/src/components/chat_panel/chat_panel.vue b/src/components/chat_panel/chat_panel.vue
new file mode 100644
index 00000000..ec379db5
--- /dev/null
+++ b/src/components/chat_panel/chat_panel.vue
@@ -0,0 +1,58 @@
+<template>
+  <div class="chat-panel">
+    <div class="panel panel-default base01-background">
+      <div class="panel-heading timeline-heading base02-background base04">
+        <div class="title">
+          {{$t('chat.title')}}
+        </div>
+      </div>
+      <div class="chat-window" v-chat-scroll>
+        <div class="chat-message" v-for="message in messages" :key="message.id">
+          <span class="chat-avatar">
+            <img :src="message.author.avatar" />
+            {{message.author.username}}:
+          </span>
+          <span class="chat-text">
+            {{message.text}}
+          </span>
+        </div>
+      </div>
+      <div class="chat-input">
+        <form @submit.prevent="submit(currentMessage)">
+          <input v-model="currentMessage" type="text" >
+        </form>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script src="./chat_panel.js"></script>
+
+<style lang="scss">
+ .chat-window {
+   max-height: 200px;
+   overflow-y: auto;
+   overflow-x: hidden;
+ }
+ .chat-message {
+   padding: 0.2em 0.5em
+ }
+ .chat-avatar {
+     img {
+         height: 32px;
+         width: 32px;
+         border-radius: 5px;
+         margin-right: 0.5em;
+     }
+ }
+ .chat-input {
+     display: flex;
+     form {
+         flex: auto;
+         input {
+             margin: 0.5em;
+             width: fill-available;
+         }
+     }
+ }
+</style>
diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue
index ccc772a8..aea841e9 100644
--- a/src/components/nav_panel/nav_panel.vue
+++ b/src/components/nav_panel/nav_panel.vue
@@ -7,11 +7,6 @@
             {{ $t("nav.timeline") }}
           </router-link>
         </li>
-        <li v-if='chat && currentUser'>
-          <router-link class="base00-background" to='/chat'>
-            {{ $t("nav.chat") }}
-          </router-link>
-        </li>
         <li v-if='currentUser'>
           <router-link class="base00-background" :to="{ name: 'mentions', params: { username: currentUser.screen_name } }">
             {{ $t("nav.mentions") }}
-- 
cgit v1.2.3-70-g09d2