diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/App.js | 7 | ||||
| -rw-r--r-- | src/App.vue | 1 | ||||
| -rw-r--r-- | src/components/chat_panel/chat_panel.js (renamed from src/components/chat/chat.js) | 4 | ||||
| -rw-r--r-- | src/components/chat_panel/chat_panel.vue (renamed from src/components/chat/chat.vue) | 19 | ||||
| -rw-r--r-- | src/components/nav_panel/nav_panel.vue | 5 | ||||
| -rw-r--r-- | src/main.js | 7 |
6 files changed, 21 insertions, 22 deletions
@@ -2,6 +2,7 @@ import UserPanel from './components/user_panel/user_panel.vue' import NavPanel from './components/nav_panel/nav_panel.vue' import Notifications from './components/notifications/notifications.vue' import UserFinder from './components/user_finder/user_finder.vue' +import ChatPanel from './components/chat_panel/chat_panel.vue' export default { name: 'app', @@ -9,7 +10,8 @@ export default { UserPanel, NavPanel, Notifications, - UserFinder + UserFinder, + ChatPanel }, data: () => ({ mobileActivePanel: 'timeline' @@ -21,7 +23,8 @@ export default { }, logoStyle () { return { 'background-image': `url(${this.$store.state.config.logo})` } }, style () { return { 'background-image': `url(${this.background})` } }, - sitename () { return this.$store.state.config.name } + sitename () { return this.$store.state.config.name }, + chat () { return this.$store.state.chat.channel } }, methods: { activatePanel (panelName) { diff --git a/src/App.vue b/src/App.vue index 74a18dc7..ec403519 100644 --- a/src/App.vue +++ b/src/App.vue @@ -23,6 +23,7 @@ <div class="sidebar"> <user-panel></user-panel> <nav-panel></nav-panel> + <chat-panel v-if="currentUser && chat"></chat-panel> <notifications v-if="currentUser"></notifications> </div> </div> diff --git a/src/components/chat/chat.js b/src/components/chat_panel/chat_panel.js index ef326d4a..b146c5d9 100644 --- a/src/components/chat/chat.js +++ b/src/components/chat_panel/chat_panel.js @@ -1,4 +1,4 @@ -const chat = { +const chatPanel = { data () { return { currentMessage: '', @@ -18,4 +18,4 @@ const chat = { } } -export default chat +export default chatPanel diff --git a/src/components/chat/chat.vue b/src/components/chat_panel/chat_panel.vue index 6c1e2c38..ec379db5 100644 --- a/src/components/chat/chat.vue +++ b/src/components/chat_panel/chat_panel.vue @@ -1,12 +1,12 @@ <template> - <div class="chat-panel panel panel-default"> - <div class="panel-heading timeline-heading base02-background base04"> - <div class="title"> - {{$t('chat.title')}} + <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> - <div class="panel-body base01-background"> - <div class="chat-window"> + <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" /> @@ -26,12 +26,11 @@ </div> </template> -<script src="./chat.js"></script> - +<script src="./chat_panel.js"></script> <style lang="scss"> .chat-window { - max-height: 80vh; + max-height: 200px; overflow-y: auto; overflow-x: hidden; } 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") }} diff --git a/src/main.js b/src/main.js index 2dd6aed1..de74511b 100644 --- a/src/main.js +++ b/src/main.js @@ -12,7 +12,6 @@ import UserProfile from './components/user_profile/user_profile.vue' import Settings from './components/settings/settings.vue' import Registration from './components/registration/registration.vue' import UserSettings from './components/user_settings/user_settings.vue' -import Chat from './components/chat/chat.vue' import statusesModule from './modules/statuses.js' import usersModule from './modules/users.js' @@ -27,6 +26,8 @@ import createPersistedState from './lib/persisted_state.js' import messages from './i18n/messages.js' +import VueChatScroll from 'vue-chat-scroll' + const currentLocale = (window.navigator.language || 'en').split('-')[0] Vue.use(Vuex) @@ -39,6 +40,7 @@ Vue.use(VueTimeago, { } }) Vue.use(VueI18n) +Vue.use(VueChatScroll) const persistedStateOptions = { paths: [ @@ -97,8 +99,7 @@ window.fetch('/static/config.json') { name: 'mentions', path: '/:username/mentions', component: Mentions }, { name: 'settings', path: '/settings', component: Settings }, { name: 'registration', path: '/registration', component: Registration }, - { name: 'user-settings', path: '/user-settings', component: UserSettings }, - { name: 'chat', path: '/chat', component: Chat } + { name: 'user-settings', path: '/user-settings', component: UserSettings } ] const router = new VueRouter({ |