Basic frontend changes for chat.

This commit is contained in:
Roger Braun 2017-12-04 19:08:33 +01:00
parent f72d6ec83e
commit fbee80474b
7 changed files with 39 additions and 4 deletions

View file

@ -23,9 +23,15 @@ module.exports = {
assetsPublicPath: '/', assetsPublicPath: '/',
proxyTable: { proxyTable: {
'/api': { '/api': {
target: 'https://social.heldscal.la/', target: 'htts://localhost:4000/',
changeOrigin: true, changeOrigin: true,
cookieDomainRewrite: 'localhost' cookieDomainRewrite: 'localhost'
},
'/socket': {
target: 'htts://localhost:4000/',
changeOrigin: true,
cookieDomainRewrite: 'localhost',
ws: true
} }
}, },
// CSS Sourcemaps off by default because relative paths are "buggy" // CSS Sourcemaps off by default because relative paths are "buggy"

View file

@ -21,6 +21,7 @@
"localforage": "^1.5.0", "localforage": "^1.5.0",
"node-sass": "^3.10.1", "node-sass": "^3.10.1",
"object-path": "^0.11.3", "object-path": "^0.11.3",
"phoenix": "^1.3.0",
"sanitize-html": "^1.13.0", "sanitize-html": "^1.13.0",
"sass-loader": "^4.0.2", "sass-loader": "^4.0.2",
"vue": "^2.3.4", "vue": "^2.3.4",

View file

@ -7,6 +7,11 @@
{{ $t("nav.timeline") }} {{ $t("nav.timeline") }}
</router-link> </router-link>
</li> </li>
<li v-if='currentUser'>
<router-link class="base00-background" to='/chat'>
{{ $t("nav.chat") }}
</router-link>
</li>
<li v-if='currentUser'> <li v-if='currentUser'>
<router-link class="base00-background" :to="{ name: 'mentions', params: { username: currentUser.screen_name } }"> <router-link class="base00-background" :to="{ name: 'mentions', params: { username: currentUser.screen_name } }">
{{ $t("nav.mentions") }} {{ $t("nav.mentions") }}

View file

@ -179,7 +179,11 @@ const fi = {
} }
const en = { const en = {
chat: {
title: 'Chat'
},
nav: { nav: {
chat: 'Local Chat',
timeline: 'Timeline', timeline: 'Timeline',
mentions: 'Mentions', mentions: 'Mentions',
public_tl: 'Public Timeline', public_tl: 'Public Timeline',

View file

@ -12,6 +12,7 @@ import UserProfile from './components/user_profile/user_profile.vue'
import Settings from './components/settings/settings.vue' import Settings from './components/settings/settings.vue'
import Registration from './components/registration/registration.vue' import Registration from './components/registration/registration.vue'
import UserSettings from './components/user_settings/user_settings.vue' import UserSettings from './components/user_settings/user_settings.vue'
import Chat from './components/chat/chat.vue'
import statusesModule from './modules/statuses.js' import statusesModule from './modules/statuses.js'
import usersModule from './modules/users.js' import usersModule from './modules/users.js'
@ -60,7 +61,8 @@ const store = new Vuex.Store({
config: configModule config: configModule
}, },
plugins: [createPersistedState(persistedStateOptions)], plugins: [createPersistedState(persistedStateOptions)],
strict: process.env.NODE_ENV !== 'production' strict: false // Socket modifies itself, let's ignore this for now.
// strict: process.env.NODE_ENV !== 'production'
}) })
const i18n = new VueI18n({ const i18n = new VueI18n({
@ -90,7 +92,8 @@ window.fetch('/static/config.json')
{ name: 'mentions', path: '/:username/mentions', component: Mentions }, { name: 'mentions', path: '/:username/mentions', component: Mentions },
{ name: 'settings', path: '/settings', component: Settings }, { name: 'settings', path: '/settings', component: Settings },
{ name: 'registration', path: '/registration', component: Registration }, { name: 'registration', path: '/registration', component: Registration },
{ name: 'user-settings', path: '/user-settings', component: UserSettings } { name: 'user-settings', path: '/user-settings', component: UserSettings },
{ name: 'chat', path: '/chat', component: Chat }
] ]
const router = new VueRouter({ const router = new VueRouter({

View file

@ -1,6 +1,7 @@
import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js' import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
import { compact, map, each, merge } from 'lodash' import { compact, map, each, merge } from 'lodash'
import { set } from 'vue' import { set } from 'vue'
import { Socket } from 'phoenix'
// TODO: Unify with mergeOrAdd in statuses.js // TODO: Unify with mergeOrAdd in statuses.js
export const mergeOrAdd = (arr, obj, item) => { export const mergeOrAdd = (arr, obj, item) => {
@ -19,6 +20,9 @@ export const mergeOrAdd = (arr, obj, item) => {
} }
export const mutations = { export const mutations = {
setSocket (state, socket) {
state.socket = socket
},
setMuted (state, { user: {id}, muted }) { setMuted (state, { user: {id}, muted }) {
const user = state.usersObject[id] const user = state.usersObject[id]
set(user, 'muted', muted) set(user, 'muted', muted)
@ -50,7 +54,8 @@ export const defaultState = {
currentUser: false, currentUser: false,
loggingIn: false, loggingIn: false,
users: [], users: [],
usersObject: {} usersObject: {},
socket: null
} }
const users = { const users = {
@ -97,6 +102,13 @@ const users = {
// Set our new backend interactor // Set our new backend interactor
commit('setBackendInteractor', backendInteractorService(userCredentials)) commit('setBackendInteractor', backendInteractorService(userCredentials))
if (user.token) {
// Set up websocket connection
let socket = new Socket('/socket', {params: {token: user.token}})
socket.connect()
store.commit('setSocket', socket)
}
// Start getting fresh tweets. // Start getting fresh tweets.
store.dispatch('startFetching', 'friends') store.dispatch('startFetching', 'friends')

View file

@ -4226,6 +4226,10 @@ phantomjs-prebuilt@^2.1.3, phantomjs-prebuilt@^2.1.7:
request-progress "~2.0.1" request-progress "~2.0.1"
which "~1.2.10" which "~1.2.10"
phoenix@^1.3.0:
version "1.3.0"
resolved "https://registry.yarnpkg.com/phoenix/-/phoenix-1.3.0.tgz#1df2c27f986ee295e37c9983ec28ebac1d7f4a3e"
pify@^2.0.0: pify@^2.0.0:
version "2.3.0" version "2.3.0"
resolved "https://registry.yarnpkg.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c" resolved "https://registry.yarnpkg.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c"