From fc1736618b4e1a9f178c0ae287754c6ac1244b08 Mon Sep 17 00:00:00 2001 From: shpuld Date: Tue, 21 Nov 2017 16:12:47 +0200 Subject: attempt to recognize when holes in timeline for various reasons, clear timeline and fetch older when showing new to get rid of holes --- src/modules/statuses.js | 7 +++++++ 1 file changed, 7 insertions(+) (limited to 'src/modules') diff --git a/src/modules/statuses.js b/src/modules/statuses.js index d954b023..82a7eda1 100644 --- a/src/modules/statuses.js +++ b/src/modules/statuses.js @@ -9,6 +9,7 @@ export const defaultState = { notifications: [], favorites: new Set(), error: false, + flushMarker: 0, timelines: { mentions: { statuses: [], @@ -422,6 +423,9 @@ export const mutations = { each(notifications, (notification) => { notification.seen = true }) + }, + queueFlush (state, { timeline, id }) { + state.timelines[timeline].flushMarker = id } } @@ -458,6 +462,9 @@ const statuses = { // Optimistic retweeting... commit('setRetweeted', { status, value: true }) apiService.retweet({ id: status.id, credentials: rootState.users.currentUser.credentials }) + }, + queueFlush ({ rootState, commit }, { timeline, id }) { + commit('queueFlush', { timeline, id }) } }, mutations -- cgit v1.2.3-70-g09d2 From 6b773902e8dae36b2c4cf4c970fd1437cfdc13bc Mon Sep 17 00:00:00 2001 From: shpuld Date: Thu, 23 Nov 2017 13:46:37 +0200 Subject: Fix mistake in flushMarker init, make startFetching behave properly with older statuses existing. --- src/components/timeline/timeline.js | 4 ++-- src/modules/statuses.js | 22 ++++++++++++++-------- .../timeline_fetcher/timeline_fetcher.service.js | 5 ++++- 3 files changed, 20 insertions(+), 11 deletions(-) (limited to 'src/modules') diff --git a/src/components/timeline/timeline.js b/src/components/timeline/timeline.js index 10ad4561..660a8752 100644 --- a/src/components/timeline/timeline.js +++ b/src/components/timeline/timeline.js @@ -31,7 +31,7 @@ const Timeline = { return this.timeline.newStatusCount }, newStatusCountStr () { - if (this.timeline.flushMarker > 0) { + if (this.timeline.flushMarker !== 0) { return '' } else { return ` (${this.newStatusCount})` @@ -71,7 +71,7 @@ const Timeline = { }, methods: { showNewStatuses () { - if (this.timeline.flushMarker) { + if (this.timeline.flushMarker !== 0) { this.$store.commit('clearTimeline', { timeline: this.timelineName }) this.$store.commit('queueFlush', { timeline: this.timelineName, id: 0 }) this.fetchOlderStatuses() diff --git a/src/modules/statuses.js b/src/modules/statuses.js index 82a7eda1..18191424 100644 --- a/src/modules/statuses.js +++ b/src/modules/statuses.js @@ -9,7 +9,6 @@ export const defaultState = { notifications: [], favorites: new Set(), error: false, - flushMarker: 0, timelines: { mentions: { statuses: [], @@ -23,7 +22,8 @@ export const defaultState = { loading: false, followers: [], friends: [], - viewing: 'statuses' + viewing: 'statuses', + flushMarker: 0 }, public: { statuses: [], @@ -37,7 +37,8 @@ export const defaultState = { loading: false, followers: [], friends: [], - viewing: 'statuses' + viewing: 'statuses', + flushMarker: 0 }, user: { statuses: [], @@ -51,7 +52,8 @@ export const defaultState = { loading: false, followers: [], friends: [], - viewing: 'statuses' + viewing: 'statuses', + flushMarker: 0 }, publicAndExternal: { statuses: [], @@ -65,7 +67,8 @@ export const defaultState = { loading: false, followers: [], friends: [], - viewing: 'statuses' + viewing: 'statuses', + flushMarker: 0 }, friends: { statuses: [], @@ -79,7 +82,8 @@ export const defaultState = { loading: false, followers: [], friends: [], - viewing: 'statuses' + viewing: 'statuses', + flushMarker: 0 }, tag: { statuses: [], @@ -93,7 +97,8 @@ export const defaultState = { loading: false, followers: [], friends: [], - viewing: 'statuses' + viewing: 'statuses', + flushMarker: 0 } } } @@ -382,7 +387,8 @@ export const mutations = { loading: false, followers: [], friends: [], - viewing: 'statuses' + viewing: 'statuses', + flushMarker: 0 } state.timelines[timeline] = emptyTimeline diff --git a/src/services/timeline_fetcher/timeline_fetcher.service.js b/src/services/timeline_fetcher/timeline_fetcher.service.js index a02d67d0..a4a80df0 100644 --- a/src/services/timeline_fetcher/timeline_fetcher.service.js +++ b/src/services/timeline_fetcher/timeline_fetcher.service.js @@ -38,7 +38,10 @@ const fetchAndUpdate = ({store, credentials, timeline = 'friends', older = false } const startFetching = ({timeline = 'friends', credentials, store, userId = false, tag = false}) => { - fetchAndUpdate({timeline, credentials, store, showImmediately: true, userId, tag}) + const rootState = store.rootState || store.state + const timelineData = rootState.statuses.timelines[camelCase(timeline)] + const showImmediately = timelineData.visibleStatuses.length === 0 + fetchAndUpdate({timeline, credentials, store, showImmediately, userId, tag}) const boundFetchAndUpdate = () => fetchAndUpdate({ timeline, credentials, store, userId, tag }) return setInterval(boundFetchAndUpdate, 10000) } -- cgit v1.2.3-70-g09d2 From fbee80474baf3bfc41656268e22395983811f2f7 Mon Sep 17 00:00:00 2001 From: Roger Braun Date: Mon, 4 Dec 2017 19:08:33 +0100 Subject: Basic frontend changes for chat. --- config/index.js | 8 +++++++- package.json | 1 + src/components/nav_panel/nav_panel.vue | 5 +++++ src/i18n/messages.js | 4 ++++ src/main.js | 7 +++++-- src/modules/users.js | 14 +++++++++++++- yarn.lock | 4 ++++ 7 files changed, 39 insertions(+), 4 deletions(-) (limited to 'src/modules') diff --git a/config/index.js b/config/index.js index 6652048c..c48d91b8 100644 --- a/config/index.js +++ b/config/index.js @@ -23,9 +23,15 @@ module.exports = { assetsPublicPath: '/', proxyTable: { '/api': { - target: 'https://social.heldscal.la/', + target: 'htts://localhost:4000/', changeOrigin: true, cookieDomainRewrite: 'localhost' + }, + '/socket': { + target: 'htts://localhost:4000/', + changeOrigin: true, + cookieDomainRewrite: 'localhost', + ws: true } }, // CSS Sourcemaps off by default because relative paths are "buggy" diff --git a/package.json b/package.json index e8d84274..4e98647b 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "localforage": "^1.5.0", "node-sass": "^3.10.1", "object-path": "^0.11.3", + "phoenix": "^1.3.0", "sanitize-html": "^1.13.0", "sass-loader": "^4.0.2", "vue": "^2.3.4", diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue index aea841e9..fa4000b0 100644 --- a/src/components/nav_panel/nav_panel.vue +++ b/src/components/nav_panel/nav_panel.vue @@ -7,6 +7,11 @@ {{ $t("nav.timeline") }} +
  • + + {{ $t("nav.chat") }} + +
  • {{ $t("nav.mentions") }} diff --git a/src/i18n/messages.js b/src/i18n/messages.js index 9aeffdfa..ecb3557c 100644 --- a/src/i18n/messages.js +++ b/src/i18n/messages.js @@ -179,7 +179,11 @@ const fi = { } const en = { + chat: { + title: 'Chat' + }, nav: { + chat: 'Local Chat', timeline: 'Timeline', mentions: 'Mentions', public_tl: 'Public Timeline', diff --git a/src/main.js b/src/main.js index 6c5bf83e..ca3bb955 100644 --- a/src/main.js +++ b/src/main.js @@ -12,6 +12,7 @@ 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' @@ -60,7 +61,8 @@ const store = new Vuex.Store({ config: configModule }, 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({ @@ -90,7 +92,8 @@ 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: 'user-settings', path: '/user-settings', component: UserSettings }, + { name: 'chat', path: '/chat', component: Chat } ] const router = new VueRouter({ diff --git a/src/modules/users.js b/src/modules/users.js index 30f8dc27..a75271a4 100644 --- a/src/modules/users.js +++ b/src/modules/users.js @@ -1,6 +1,7 @@ import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js' import { compact, map, each, merge } from 'lodash' import { set } from 'vue' +import { Socket } from 'phoenix' // TODO: Unify with mergeOrAdd in statuses.js export const mergeOrAdd = (arr, obj, item) => { @@ -19,6 +20,9 @@ export const mergeOrAdd = (arr, obj, item) => { } export const mutations = { + setSocket (state, socket) { + state.socket = socket + }, setMuted (state, { user: {id}, muted }) { const user = state.usersObject[id] set(user, 'muted', muted) @@ -50,7 +54,8 @@ export const defaultState = { currentUser: false, loggingIn: false, users: [], - usersObject: {} + usersObject: {}, + socket: null } const users = { @@ -97,6 +102,13 @@ const users = { // Set our new backend interactor 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. store.dispatch('startFetching', 'friends') diff --git a/yarn.lock b/yarn.lock index d0d2dde9..3fcd29ab 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4226,6 +4226,10 @@ phantomjs-prebuilt@^2.1.3, phantomjs-prebuilt@^2.1.7: request-progress "~2.0.1" 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: version "2.3.0" resolved "https://registry.yarnpkg.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c" -- cgit v1.2.3-70-g09d2 From 27be1e0fa3a9779a624012a8528801679721cb40 Mon Sep 17 00:00:00 2001 From: Roger Braun Date: Tue, 5 Dec 2017 11:47:10 +0100 Subject: Move chat to own module. --- src/components/chat/chat.js | 15 +++++---------- src/main.js | 4 +++- src/modules/api.js | 13 ++++++++++++- src/modules/chat.js | 33 +++++++++++++++++++++++++++++++++ src/modules/users.js | 12 ++---------- 5 files changed, 55 insertions(+), 22 deletions(-) create mode 100644 src/modules/chat.js (limited to 'src/modules') diff --git a/src/components/chat/chat.js b/src/components/chat/chat.js index 3b84bd3d..fc942a30 100644 --- a/src/components/chat/chat.js +++ b/src/components/chat/chat.js @@ -1,23 +1,18 @@ const chat = { data () { return { - messages: [], currentMessage: '', - socket: this.$store.state.users.socket, channel: null } }, - created () { - this.channel = this.socket.channel('chat:public') - this.channel.on('new_msg', (msg) => { - this.messages.push(msg) - this.messages = this.messages.slice(-19, 20) - }) - this.channel.join() + computed: { + messages () { + return this.$store.state.chat.messages + } }, methods: { submit(message) { - this.channel.push('new_msg', {text: message}, 10000) + this.$store.state.chat.channel.push('new_msg', {text: message}, 10000) this.currentMessage = ''; } } diff --git a/src/main.js b/src/main.js index ca3bb955..72b75a52 100644 --- a/src/main.js +++ b/src/main.js @@ -18,6 +18,7 @@ import statusesModule from './modules/statuses.js' import usersModule from './modules/users.js' import apiModule from './modules/api.js' import configModule from './modules/config.js' +import chatModule from './modules/chat.js' import VueTimeago from 'vue-timeago' import VueI18n from 'vue-i18n' @@ -58,7 +59,8 @@ const store = new Vuex.Store({ statuses: statusesModule, users: usersModule, api: apiModule, - config: configModule + config: configModule, + chat: chatModule }, plugins: [createPersistedState(persistedStateOptions)], strict: false // Socket modifies itself, let's ignore this for now. diff --git a/src/modules/api.js b/src/modules/api.js index e61382eb..ccd6cfb7 100644 --- a/src/modules/api.js +++ b/src/modules/api.js @@ -1,10 +1,12 @@ import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js' import {isArray} from 'lodash' +import { Socket } from 'phoenix' const api = { state: { backendInteractor: backendInteractorService(), - fetchers: {} + fetchers: {}, + socket: null }, mutations: { setBackendInteractor (state, backendInteractor) { @@ -15,6 +17,9 @@ const api = { }, removeFetcher (state, {timeline}) { delete state.fetchers[timeline] + }, + setSocket (state, socket) { + state.socket = socket } }, actions: { @@ -37,6 +42,12 @@ const api = { const fetcher = store.state.fetchers[timeline] window.clearInterval(fetcher) store.commit('removeFetcher', {timeline}) + }, + initializeSocket (store, token) { + // Set up websocket connection + let socket = new Socket('/socket', {params: {token: token}}) + socket.connect() + store.dispatch('initializeChat', socket) } } } diff --git a/src/modules/chat.js b/src/modules/chat.js new file mode 100644 index 00000000..b1244ebe --- /dev/null +++ b/src/modules/chat.js @@ -0,0 +1,33 @@ +const chat = { + state: { + messages: [], + channel: null + }, + mutations: { + setChannel (state, channel) { + state.channel = channel + }, + addMessage (state, message) { + state.messages.push(message) + state.messages = state.messages.slice(-19, 20) + }, + setMessages (state, messages) { + state.messages = messages.slice(-19, 20) + } + }, + actions: { + initializeChat (store, socket) { + const channel = socket.channel('chat:public') + channel.on('new_msg', (msg) => { + store.commit('addMessage', msg) + }) + channel.on('messages', ({messages}) => { + store.commit('setMessages', messages) + }) + channel.join() + store.commit('setChannel', channel) + } + } +} + +export default chat diff --git a/src/modules/users.js b/src/modules/users.js index a75271a4..8303ecc1 100644 --- a/src/modules/users.js +++ b/src/modules/users.js @@ -1,7 +1,6 @@ import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js' import { compact, map, each, merge } from 'lodash' import { set } from 'vue' -import { Socket } from 'phoenix' // TODO: Unify with mergeOrAdd in statuses.js export const mergeOrAdd = (arr, obj, item) => { @@ -20,9 +19,6 @@ export const mergeOrAdd = (arr, obj, item) => { } export const mutations = { - setSocket (state, socket) { - state.socket = socket - }, setMuted (state, { user: {id}, muted }) { const user = state.usersObject[id] set(user, 'muted', muted) @@ -54,8 +50,7 @@ export const defaultState = { currentUser: false, loggingIn: false, users: [], - usersObject: {}, - socket: null + usersObject: {} } const users = { @@ -103,10 +98,7 @@ const users = { 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) + store.dispatch('initializeSocket', user.token) } // Start getting fresh tweets. -- cgit v1.2.3-70-g09d2 From 612fb183671783c3ac3eeea21428c024a47713b1 Mon Sep 17 00:00:00 2001 From: eal Date: Thu, 7 Dec 2017 18:20:44 +0200 Subject: Add option for disabling chat. --- src/main.js | 3 +++ src/modules/api.js | 17 +++++++++++++---- static/config.json | 3 ++- 3 files changed, 18 insertions(+), 5 deletions(-) (limited to 'src/modules') diff --git a/src/main.js b/src/main.js index 72b75a52..a8ee5fda 100644 --- a/src/main.js +++ b/src/main.js @@ -82,6 +82,9 @@ window.fetch('/static/config.json') store.dispatch('setOption', { name: 'background', value: background }) store.dispatch('setOption', { name: 'logo', value: logo }) store.dispatch('setOption', { name: 'registrationOpen', value: registrationOpen }) + if (data['chatDisabled']) { + store.dispatch('disableChat') + } const routes = [ { name: 'root', path: '/', redirect: data['defaultPath'] || '/main/all' }, diff --git a/src/modules/api.js b/src/modules/api.js index ccd6cfb7..c91fb97b 100644 --- a/src/modules/api.js +++ b/src/modules/api.js @@ -6,7 +6,8 @@ const api = { state: { backendInteractor: backendInteractorService(), fetchers: {}, - socket: null + socket: null, + chatDisabled: false }, mutations: { setBackendInteractor (state, backendInteractor) { @@ -20,6 +21,9 @@ const api = { }, setSocket (state, socket) { state.socket = socket + }, + setChatDisabled (state, value) { + state.chatDisabled = value } }, actions: { @@ -45,9 +49,14 @@ const api = { }, initializeSocket (store, token) { // Set up websocket connection - let socket = new Socket('/socket', {params: {token: token}}) - socket.connect() - store.dispatch('initializeChat', socket) + if (!store.state.chatDisabled) { + let socket = new Socket('/socket', {params: {token: token}}) + socket.connect() + store.dispatch('initializeChat', socket) + } + }, + disableChat (store) { + store.commit('setChatDisabled', true) } } } diff --git a/static/config.json b/static/config.json index b186246b..880efca8 100644 --- a/static/config.json +++ b/static/config.json @@ -4,5 +4,6 @@ "background": "/static/bg.jpg", "logo": "/static/logo.png", "registrationOpen": false, - "defaultPath": "/main/all" + "defaultPath": "/main/all", + "chatDisabled": false } -- cgit v1.2.3-70-g09d2