Commit cc63d6cb authored by Jason Robinson's avatar Jason Robinson

Refactor frontend store

Make the store based on modules, more like a standard Vuex example.
Lots of small changes related to this here and there.

Also place all built resources in a "dist" folder to make it possible
to exclude those in an IDE and to in general make it clearer which
files are sources and which compiled.
parent a0cf606b
......@@ -10,9 +10,7 @@ socialhome/media/
.cache
env.local
socialhome/static/css/*.css
socialhome/static/js/project.js
socialhome/static/js/webpack.*.js
socialhome/static/js/webpack.*.js.map
socialhome/static/dist
socialhome/static/fonts/
staticfiles/
bower_components/
......
......@@ -12,7 +12,7 @@
"max-len": ["error", 120],
"no-unused-expressions": "off",
"object-curly-spacing": ["error", "never"],
"quotes": ["warn", "double"],
"quotes": "off",
"semi": ["error", "never"],
"no-return-assign": "off"
},
......
......@@ -75,9 +75,7 @@ env.local
# Collected statics
socialhome/static/css/*.css
socialhome/static/css/*.css.map
socialhome/static/js/project.js
socialhome/static/js/webpack.*.js
socialhome/static/js/webpack.*.js.map
socialhome/static/dist
socialhome/static/fonts/
!/socialhome/static/fonts/.gitkeep
staticfiles/
......
......@@ -16,11 +16,11 @@ module.exports = function (grunt) {
return {
app: this.app,
templates: this.app + '/templates',
css: this.app + '/static/css',
sass: this.app + '/static/sass',
fonts: this.app + '/static/fonts',
images: this.app + '/static/images',
js: this.app + '/static/js',
dist: this.app + '/static/dist',
bower: "bower_components",
node: "node_modules",
}
......@@ -68,14 +68,14 @@ module.exports = function (grunt) {
precision: 10
},
files: {
'<%= paths.css %>/fontawesome.css': '<%= paths.bower %>/fontawesome/scss/font-awesome.scss',
'<%= paths.css %>/common.css': '<%= paths.sass %>/common.scss',
'<%= paths.css %>/grids.css': '<%= paths.sass %>/grids.scss',
'<%= paths.css %>/streams.css': '<%= paths.sass %>/streams.scss',
'<%= paths.css %>/publisher.css': '<%= paths.sass %>/publisher.scss',
'<%= paths.css %>/content.css': '<%= paths.sass %>/content.scss',
'<%= paths.css %>/contacts.css': '<%= paths.sass %>/contacts.scss',
'<%= paths.css %>/search.css': '<%= paths.sass %>/search.scss',
'<%= paths.dist %>/fontawesome.css': '<%= paths.bower %>/fontawesome/scss/font-awesome.scss',
'<%= paths.dist %>/common.css': '<%= paths.sass %>/common.scss',
'<%= paths.dist %>/grids.css': '<%= paths.sass %>/grids.scss',
'<%= paths.dist %>/streams.css': '<%= paths.sass %>/streams.scss',
'<%= paths.dist %>/publisher.css': '<%= paths.sass %>/publisher.scss',
'<%= paths.dist %>/content.css': '<%= paths.sass %>/content.scss',
'<%= paths.dist %>/contacts.css': '<%= paths.sass %>/contacts.scss',
'<%= paths.dist %>/search.css': '<%= paths.sass %>/search.scss',
},
},
dist: {
......@@ -85,14 +85,14 @@ module.exports = function (grunt) {
precision: 10
},
files: {
'<%= paths.css %>/fontawesome.css': '<%= paths.bower %>/fontawesome/scss/font-awesome.scss',
'<%= paths.css %>/common.css': '<%= paths.sass %>/common.scss',
'<%= paths.css %>/grids.css': '<%= paths.sass %>/grids.scss',
'<%= paths.css %>/streams.css': '<%= paths.sass %>/streams.scss',
'<%= paths.css %>/publisher.css': '<%= paths.sass %>/publisher.scss',
'<%= paths.css %>/content.css': '<%= paths.sass %>/content.scss',
'<%= paths.css %>/contacts.css': '<%= paths.sass %>/contacts.scss',
'<%= paths.css %>/search.css': '<%= paths.sass %>/search.scss',
'<%= paths.dist %>/fontawesome.css': '<%= paths.bower %>/fontawesome/scss/font-awesome.scss',
'<%= paths.dist %>/common.css': '<%= paths.sass %>/common.scss',
'<%= paths.dist %>/grids.css': '<%= paths.sass %>/grids.scss',
'<%= paths.dist %>/streams.css': '<%= paths.sass %>/streams.scss',
'<%= paths.dist %>/publisher.css': '<%= paths.sass %>/publisher.scss',
'<%= paths.dist %>/content.css': '<%= paths.sass %>/content.scss',
'<%= paths.dist %>/contacts.css': '<%= paths.sass %>/contacts.scss',
'<%= paths.dist %>/search.css': '<%= paths.sass %>/search.scss',
},
}
},
......@@ -113,7 +113,7 @@ module.exports = function (grunt) {
"<%= paths.js %>/publisher.js",
"<%= paths.js %>/search.js",
],
dest: "<%= paths.js %>/project.js",
dest: "<%= paths.dist %>/project.js",
nonull: true,
},
css: {
......@@ -121,16 +121,16 @@ module.exports = function (grunt) {
"<%= paths.bower %>/bootstrap/dist/css/bootstrap.min.css",
"<%= paths.bower %>/tether/dist/css/tether.min.css",
"<%= paths.bower %>/bootstrap-markdown/css/bootstrap-markdown.min.css",
"<%= paths.css %>/fontawesome.css",
"<%= paths.css %>/common.css",
"<%= paths.css %>/grids.css",
"<%= paths.css %>/streams.css",
"<%= paths.css %>/publisher.css",
"<%= paths.css %>/content.css",
"<%= paths.css %>/contacts.css",
"<%= paths.css %>/search.css",
"<%= paths.dist %>/fontawesome.css",
"<%= paths.dist %>/common.css",
"<%= paths.dist %>/grids.css",
"<%= paths.dist %>/streams.css",
"<%= paths.dist %>/publisher.css",
"<%= paths.dist %>/content.css",
"<%= paths.dist %>/contacts.css",
"<%= paths.dist %>/search.css",
],
dest: "<%= paths.css %>/project.css",
dest: "<%= paths.dist %>/project.css",
nonull: true,
},
},
......
......@@ -5,7 +5,7 @@ module.exports = {
entry: path.resolve(__dirname, "../../socialhome/frontend/main.js"),
output: {
path: path.resolve(__dirname, "../../socialhome/static"),
filename: "js/webpack.bundle.js",
filename: "dist/webpack.bundle.js",
},
module: {
loaders: [
......@@ -49,7 +49,7 @@ module.exports = {
],
},
plugins: [
new ExtractTextPlugin("css/webpack.bundle.css"),
new ExtractTextPlugin("dist/webpack.bundle.css"),
],
resolve: {
modules: [
......
......@@ -57,6 +57,7 @@ Internal changes
................
* Removed ``User`` relationship fields. These were migrated to ``Profile`` a long time ago.
* Heavy refactoring of Vue frontend store.
0.9.3 (2018-08-29)
------------------
......
......@@ -2,6 +2,7 @@
"name": "socialhome",
"version": "0.1.0",
"scripts": {
"bower": "./node_modules/.bin/bower install",
"build": "./node_modules/grunt/bin/grunt build && ./node_modules/webpack/bin/webpack.js --config config/webpack/webpack.prod.js",
"dev": "./node_modules/grunt/bin/grunt dev && ./node_modules/webpack/bin/webpack.js --config config/webpack/webpack.dev.js",
"watch": "./node_modules/grunt/bin/grunt dev && ./node_modules/webpack/bin/webpack.js --watch --config config/webpack/webpack.dev.js",
......
......@@ -13,7 +13,7 @@
{% block css %}
<!-- Compiled project CSS -->
<link href="{% static 'css/project.css' %}" rel="stylesheet">
<link href="{% static 'dist/project.css' %}" rel="stylesheet">
{% endblock %}
</head>
......@@ -26,7 +26,7 @@
<!-- JavaScript locales -->
<script type="text/javascript" src="{% url 'javascript-catalog' %}"></script>
<!-- Compiled project JS -->
<script src="{% static 'js/project.js' %}"></script>
<script src="{% static 'dist/project.js' %}"></script>
{{ form.media }}
{% endblock javascript %}
</body>
......
......@@ -56,7 +56,7 @@ export default Vue.component("author-bar", {
return this.author.fid
},
isUserAuthenticated() {
return this.$store.state.applicationStore.isUserAuthenticated
return this.$store.state.application.isUserAuthenticated
},
},
methods: {
......
......@@ -40,7 +40,7 @@ export default Vue.component("nsfw-shield", {
},
methods: {
onImageLoad() {
if (!this.$store.state.stream.single) {
if (!this.$store.state.stream.stream.single) {
Vue.redrawVueMasonry()
}
},
......@@ -52,7 +52,7 @@ export default Vue.component("nsfw-shield", {
},
},
updated() {
if (!this.$store.state.stream.single) {
if (!this.$store.state.stream.stream.single) {
Vue.redrawVueMasonry()
}
},
......
......@@ -42,8 +42,6 @@
</template>
<script>
export default {
name: "profile-reaction-buttons",
data() {
......@@ -58,19 +56,19 @@ export default {
},
computed: {
currentBrowsingProfileId() {
return this.$store.state.applicationStore.currentBrowsingProfileId
return this.$store.state.application.currentBrowsingProfileId
},
displayName() {
return this.profile.name ? this.profile.name : this.profile.fid
},
isUserAuthenticated() {
return this.$store.state.applicationStore.isUserAuthenticated
return this.$store.state.application.isUserAuthenticated
},
showFollowBtn() {
return this.$store.state.applicationStore.isUserAuthenticated && !this.following
return this.$store.state.application.isUserAuthenticated && !this.following
},
showUnfollowBtn() {
return this.$store.state.applicationStore.isUserAuthenticated && this.following
return this.$store.state.application.isUserAuthenticated && this.following
},
translations() {
return {
......
......@@ -58,17 +58,17 @@ export default Vue.component("reactions-bar", {
},
computed: {
showRepliesContainer() {
return this.showRepliesBox || this.$store.state.stream.single
return this.showRepliesBox || this.$store.state.stream.stream.single
},
showReplyReactionIcon() {
if (this.content.content_type === "content") {
return this.$store.state.applicationStore.isUserAuthenticated || this.content.reply_count > 0
return this.$store.state.application.isUserAuthenticated || this.content.reply_count > 0
}
return false
},
showShareReactionIcon() {
if (this.content.content_type === "content") {
return this.$store.state.applicationStore.isUserAuthenticated || this.content.shares_count > 0
return this.$store.state.application.isUserAuthenticated || this.content.shares_count > 0
}
return false
},
......@@ -99,7 +99,7 @@ export default Vue.component("reactions-bar", {
this.$snotify.error(gettext("Unable to reshare own post"))
return
}
if (!this.$store.state.applicationStore.isUserAuthenticated) {
if (!this.$store.state.application.isUserAuthenticated) {
this.$snotify.error(gettext("You must be logged in to reshare"))
return
}
......@@ -117,7 +117,7 @@ export default Vue.component("reactions-bar", {
this.$snotify.error(gettext("Unable to unshare own post"))
return
}
if (!this.$store.state.applicationStore.isUserAuthenticated) {
if (!this.$store.state.application.isUserAuthenticated) {
this.$snotify.error(gettext("You must be logged in to unshare"))
return
}
......@@ -132,7 +132,7 @@ export default Vue.component("reactions-bar", {
},
},
updated() {
if (!this.$store.state.stream.single) {
if (!this.$store.state.stream.stream.single) {
Vue.redrawVueMasonry()
}
},
......
......@@ -30,7 +30,6 @@
import imagesLoaded from "vue-images-loaded"
import Vue from "vue"
import {streamStoreOperations} from "frontend/stores/streamStore.operations";
import "frontend/components/streams/ReplyEditor.vue"
......@@ -49,17 +48,17 @@ export default Vue.component("replies-container", {
return this.content.content_type === "content"
},
isUserAuthenticated() {
return this.$store.state.applicationStore.isUserAuthenticated
return this.$store.state.application.isUserAuthenticated
},
replies() {
return this.$store.getters.replies(this.content)
return this.$store.getters["stream/replies"](this.content)
},
shares() {
return this.$store.getters.shares(this.content.id)
return this.$store.getters["stream/shares"](this.content.id)
},
showReplyButton() {
if (!this.isUserAuthenticated || this.replyEditorActive || (
this.$store.state.pending.replies && this.content.reply_count > 0)) {
this.$store.state.stream.pending.replies && this.content.reply_count > 0)) {
return false
}
if (this.content.content_type === "content") {
......@@ -70,7 +69,7 @@ export default Vue.component("replies-container", {
return false
},
showSpinner() {
return this.isContent && this.$store.state.pending.replies && this.content.reply_count > 0
return this.isContent && this.$store.state.stream.pending.replies && this.content.reply_count > 0
},
translations() {
return {
......@@ -80,7 +79,7 @@ export default Vue.component("replies-container", {
},
methods: {
onImageLoad() {
if (!this.$store.state.stream.single) {
if (!this.$store.state.stream.stream.single) {
Vue.redrawVueMasonry()
}
},
......@@ -90,12 +89,12 @@ export default Vue.component("replies-container", {
},
mounted() {
if (this.isContent) {
this.$store.dispatch(streamStoreOperations.getReplies, { params: { id: this.content.id } })
this.$store.dispatch(streamStoreOperations.getShares, { params: { id: this.content.id } })
this.$store.dispatch("stream/getReplies", { params: { id: this.content.id } })
this.$store.dispatch("stream/getShares", { params: { id: this.content.id } })
}
},
updated() {
if (!this.$store.state.stream.single) {
if (!this.$store.state.stream.stream.single) {
Vue.redrawVueMasonry()
}
},
......
......@@ -21,9 +21,6 @@
<script>
import Vue from "vue"
import {streamStoreOperations} from "frontend/stores/streamStore.operations";
export default Vue.component("reply-editor", {
props: {
contentId: {type: Number, required: true},
......@@ -49,7 +46,7 @@ export default Vue.component("reply-editor", {
saveReply() {
if (this.replyText) {
this.$store.dispatch(
streamStoreOperations.saveReply, {
"stream/saveReply", {
data: {parent: this.contentId, text: this.replyText},
}
)
......
<template>
<div :class="{ container: this.$store.state.stream.single }">
<div v-show="$store.getters.hasNewContent" class="new-content-container">
<div :class="{ container: this.$store.state.stream.stream.single }">
<div v-show="$store.getters['stream/hasNewContent']" class="new-content-container">
<b-link @click.prevent.stop="onNewContentClick" class="new-content-load-link">
<b-badge pill variant="primary">
{{ translations.newPostsAvailables }}
</b-badge>
</b-link>
</div>
<div v-if="this.$store.state.stream.single">
<div v-if="this.$store.state.stream.stream.single">
<stream-element
class="grid-item grid-item-full"
:content="singleContent"
......@@ -23,22 +23,19 @@
class="grid-item"
@loadmore="loadStream"
v-masonry-tile
v-for="content in $store.getters.contentList"
v-for="content in $store.getters['stream/contentList']"
:content="content"
:key="content.id"
/>
</div>
<loading-element v-show="$store.state.pending.contents" />
<loading-element v-show="$store.state.stream.pending.contents" />
</div>
</template>
<script>
import Vue from "vue"
import VueScrollTo from "vue-scrollto"
import {streamStoreOperations} from "frontend/stores/streamStore"
import "frontend/components/streams/StreamElement.vue"
import PublicStampedElement from "frontend/components/streams/stamped_elements/PublicStampedElement.vue"
import FollowedStampedElement from "frontend/components/streams/stamped_elements/FollowedStampedElement.vue"
......@@ -48,7 +45,6 @@ import TagStampedElement from "frontend/components/streams/stamped_elements/TagS
import ProfileStampedElement from "frontend/components/streams/stamped_elements/ProfileStampedElement.vue"
import "frontend/components/streams/LoadingElement.vue"
Vue.use(VueScrollTo)
export default Vue.component("stream", {
......@@ -82,13 +78,13 @@ export default Vue.component("stream", {
},
computed: {
singleContent() {
if (!this.$store.state.singleContentId) {
if (!this.$store.state.stream.singleContentId) {
return null
}
return this.$store.state.contents[this.$store.state.singleContentId]
return this.$store.state.stream.contents[this.$store.state.stream.singleContentId]
},
stampedElement() {
switch (this.$store.state.stream.name) {
switch (this.$store.state.stream.stream.name) {
case "followed":
return "FollowedStampedElement"
case "limited":
......@@ -103,7 +99,7 @@ export default Vue.component("stream", {
case "profile_pinned":
return "ProfileStampedElement"
default:
console.error(`Unsupported stream name ${this.$store.state.stream.name}`)
console.error(`Unsupported stream name ${this.$store.state.stream.stream.name}`)
return ""
}
},
......@@ -114,46 +110,46 @@ export default Vue.component("stream", {
}
},
unfetchedContentIds() {
return this.$store.state.unfetchedContentIds
return this.$store.state.stream.unfetchedContentIds
},
},
methods: {
onNewContentClick() {
this.$store.dispatch(streamStoreOperations.newContentAck).then(
this.$store.dispatch("stream/newContentAck").then(
() => this.$nextTick( // Wait for new content to be rendered
() => this.$scrollTo("body")))
},
loadStream() {
const options = {params: {}}
const lastContentId = this.$store.state.contentIds[this.$store.state.contentIds.length - 1]
if (lastContentId && this.$store.state.contents[lastContentId]) {
options.params.lastId = this.$store.state.contents[lastContentId].through
const lastContentId = this.$store.state.stream.contentIds[this.$store.state.stream.contentIds.length - 1]
if (lastContentId && this.$store.state.stream.contents[lastContentId]) {
options.params.lastId = this.$store.state.stream.contents[lastContentId].through
}
switch (this.$store.state.stream.name) {
switch (this.$store.state.stream.stream.name) {
case "followed":
this.$store.dispatch(streamStoreOperations.getFollowedStream, options)
this.$store.dispatch("stream/getFollowedStream", options)
break
case "limited":
this.$store.dispatch(streamStoreOperations.getLimitedStream, options)
this.$store.dispatch("stream/getLimitedStream", options)
break
case "local":
this.$store.dispatch(streamStoreOperations.getLocalStream, options)
this.$store.dispatch("stream/getLocalStream", options)
break
case "public":
this.$store.dispatch(streamStoreOperations.getPublicStream, options)
this.$store.dispatch("stream/getPublicStream", options)
break
case "tag":
options.params.name = this.tag
this.$store.dispatch(streamStoreOperations.getTagStream, options)
this.$store.dispatch("stream/getTagStream", options)
break
case "profile_all":
options.params.uuid = this.$store.state.applicationStore.profile.uuid
this.$store.dispatch(streamStoreOperations.getProfileAll, options)
options.params.uuid = this.$store.state.application.profile.uuid
this.$store.dispatch("stream/getProfileAll", options)
break
case "profile_pinned":
options.params.uuid = this.$store.state.applicationStore.profile.uuid
this.$store.dispatch(streamStoreOperations.getProfilePinned, options)
options.params.uuid = this.$store.state.application.profile.uuid
this.$store.dispatch("stream/getProfilePinned", options)
break
default:
break
......@@ -161,7 +157,7 @@ export default Vue.component("stream", {
},
},
beforeMount() {
if (!this.$store.state.stream.single) {
if (!this.$store.state.stream.stream.single) {
this.loadStream()
}
},
......
......@@ -40,7 +40,6 @@
import Vue from "vue"
import imagesLoaded from "vue-images-loaded"
import {streamStoreOperations} from "frontend/stores/streamStore.operations"
import "frontend/components/streams/AuthorBar.vue"
import "frontend/components/streams/ReactionsBar.vue"
import "frontend/components/streams/NsfwShield.vue"
......@@ -56,7 +55,7 @@ export default Vue.component("stream-element", {
return Urls["content:delete"]({pk: this.content.id})
},
disableLoadMore() {
return this.$store.state.pending.contents || !this.content.hasLoadMore
return this.$store.state.stream.pending.contents || !this.content.hasLoadMore
},
isLimited() {
return this.content.visibility === "limited"
......@@ -70,12 +69,12 @@ export default Vue.component("stream-element", {
if (this.content.content_type === "reply") {
// Always show author bar for replies
return true
} else if (this.$store.state.applicationStore.isUserAuthenticated && !this.content.user_is_author) {
} else if (this.$store.state.application.isUserAuthenticated && !this.content.user_is_author) {
// Always show if authenticated and not own content
return true
}
// Fall back to central state
return this.$store.state.showAuthorBar
return this.$store.state.stream.showAuthorBar
},
updateUrl() {
return Urls["content:update"]({pk: this.content.id})
......@@ -97,8 +96,8 @@ export default Vue.component("stream-element", {
window.twttr.widgets.load(document.getElementsByClassName(".streams-container")[0])
}, 1000)
}
if (this.$store.state.layoutDoneAfterTwitterOEmbeds) return
this.$store.dispatch(streamStoreOperations.setLayoutDoneAfterTwitterOEmbeds, true)
if (this.$store.state.stream.layoutDoneAfterTwitterOEmbeds) return
this.$store.dispatch("stream/setLayoutDoneAfterTwitterOEmbeds", true)
const c = this
setTimeout(() => {
c.onImageLoad()
......@@ -109,11 +108,11 @@ export default Vue.component("stream-element", {
}
},
loadMore() {
this.$store.dispatch(streamStoreOperations.disableLoadMore, this.content.id)
this.$store.dispatch("stream/disableLoadMore", this.content.id)
this.$emit("loadmore")
},
onImageLoad() {
if (!this.$store.state.stream.single) {
if (!this.$store.state.stream.stream.single) {
Vue.redrawVueMasonry()
}
},
......@@ -122,7 +121,7 @@ export default Vue.component("stream-element", {
this.layoutAfterTwitterOEmbeds()
},
updated() {
if (!this.$store.state.stream.single) {
if (!this.$store.state.stream.stream.single) {
Vue.redrawVueMasonry()
}
},
......
......@@ -134,15 +134,15 @@ export default Vue.component("profile-stamped-element", {
return this.profile.stream_type === "all_content" ? "primary" : "secondary"
},
profile() {
return this.$store.state.applicationStore.profile
return this.$store.state.application.profile
},
showProfileButtons() {
return this.$store.state.applicationStore.isUserAuthenticated &&
this.profile.id === this.$store.state.applicationStore.currentBrowsingProfileId
return this.$store.state.application.isUserAuthenticated &&
this.profile.id === this.$store.state.application.currentBrowsingProfileId
},
showProfileReactionButtons() {
return this.$store.state.applicationStore.isUserAuthenticated &&
this.profile.id !== this.$store.state.applicationStore.currentBrowsingProfileId
return this.$store.state.application.isUserAuthenticated &&
this.profile.id !== this.$store.state.application.currentBrowsingProfileId
},
translations() {
return {
......
......@@ -11,10 +11,10 @@ import "frontend/components/streams/stamped_elements/BaseStampedElement.vue"
export default Vue.component("tag-stamped-element", {
computed: {
title() {
return `#${this.$store.state.tagName}`
return `#${this.$store.state.stream.tagName}`
},
helpText() {
return `${gettext("All content tagged with")} #${this.$store.state.tagName}.`
return `${gettext("All content tagged with")} #${this.$store.state.stream.tagName}.`
},
},
})
......
......@@ -4,20 +4,16 @@ import VueInfiniteScroll from "vue-infinite-scroll"
import VueMasonryPlugin from "vue-masonry"
import VueRouter from "vue-router"
import VueSnotify from "vue-snotify"
import Axios from "axios"
import ReconnectingWebSocket from "ReconnectingWebSocket/reconnecting-websocket.min"
import router from "frontend/routes"
import {newStreamStore, streamStoreOperations} from "frontend/stores/streamStore"
import applicationStore from "frontend/stores/applicationStore"
import "frontend/components/streams/Stream.vue"
// CSS
import "frontend/main.stylesheet"
import store from "./store"
Vue.use(BootstrapVue)
Vue.use(VueInfiniteScroll)
......@@ -25,16 +21,7 @@ Vue.use(VueMasonryPlugin)
Vue.use(VueRouter)
Vue.use(VueSnotify)
Vue.prototype.$http = Axios.create({
xsrfCookieName: "csrftoken",
xsrfHeaderName: "X-CSRFToken",
})
const store = newStreamStore({
modules: {applicationStore},
baseURL: "",
axios: Vue.prototype.$http,
})
console.log(store)
const main = new Vue({
el: "#app",
......@@ -45,12 +32,12 @@ const main = new Vue({
const data = JSON.parse(message.data)
if (data.event === "new") {
this.$store.dispatch(streamStoreOperations.receivedNewContent, data.id)
this.$store.dispatch("streams/receivedNewContent", data.id)
}
},
websocketPath() {
const websocketProtocol = window.location.protocol === "https:" ? "wss" : "ws"
return `${websocketProtocol}://${window.location.host}/ch/streams/${this.$store.state.streamName}/`
return `${websocketProtocol}://${window.location.host}/ch/streams/${this.$store.state.stream.streamName}/`
},
},
created() {
......
import Vue from 'vue'
import Vuex from 'vuex'
import application from "./modules/application"
import profile from "./modules/profile"
import stream from "./modules/stream"
Vue.use(Vuex)
const debug = process.env.NODE_ENV !== 'production'
export default new Vuex