Stream.vue 5.86 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155
import Vue from "vue"

import StreamElement from "@/components/streams/StreamElement.vue"
import PublicStampedElement from "@/components/streams/stamped_elements/PublicStampedElement.vue"
import FollowedStampedElement from "@/components/streams/stamped_elements/FollowedStampedElement.vue"
import LimitedStampedElement from "@/components/streams/stamped_elements/LimitedStampedElement.vue"
import LocalStampedElement from "@/components/streams/stamped_elements/LocalStampedElement.vue"
import TagStampedElement from "@/components/streams/stamped_elements/TagStampedElement.vue"
import TagsStampedElement from "@/components/streams/stamped_elements/TagsStampedElement.vue"
import ProfileStampedElement from "@/components/streams/stamped_elements/ProfileStampedElement.vue"
import LoadingElement from "@/components/common/LoadingElement.vue"
import ProfileStreamButtons from "@/components/streams/stamped_elements/ProfileStreamButtons"

export default Vue.component("Stream", {
    components: {
        FollowedStampedElement,
        LimitedStampedElement,
        LoadingElement,
        LocalStampedElement,
        ProfileStampedElement,
        ProfileStreamButtons,
        PublicStampedElement,
        StreamElement,
        TagStampedElement,
        TagsStampedElement,
    },
    // TODO: Seperate Stream.vue into TagStream.vue, GuidProfile.vue and UsernameProfile.vue, etc. in the future
    props: {
        contentId: {
            type: String, default: "",
        },
        uuid: {
            type: String, default: "",
        },
        user: {
            type: String, default: "",
        },
        tag: {
            type: String, default: "",
        },
    },
    data() {
        return {
            masonryOptions: {
                "item-selector": ".grid-item",
                "column-width": ".grid-sizer",
                gutter: ".gutter-sizer",
                "percent-position": true,
                "transition-duration": "0s",
                stagger: 0,
            },
        }
    },
    computed: {
        singleContent() {
            if (!this.$store.state.stream.singleContentId) {
                return null
            }
            return this.$store.state.stream.contents[this.$store.state.stream.singleContentId]
        },
        showProfileStreamButtons() {
            return this.streamName === "profile_all" || this.streamName === "profile_pinned"
        },
        stampedElement() {
            switch (this.streamName) {
                case "followed":
                    return "FollowedStampedElement"
                case "limited":
                    return "LimitedStampedElement"
                case "local":
                    return "LocalStampedElement"
                case "public":
                    return "PublicStampedElement"
                case "tag":
                    return "TagStampedElement"
                case "tags":
                    return "TagsStampedElement"
                case "profile_all":
                case "profile_pinned":
                    return "ProfileStampedElement"
                default:
                    // eslint-disable-next-line no-console
                    console.error(`Unsupported stream name ${this.streamName}`)
                    return ""
            }
        },
        streamName() {
            return this.$store.state.stream.stream.name
        },
        translations() {
            const ln = this.unfetchedContentIds.length
            s = ngettext(`${ln} new post available`, `${ln} new posts available`, ln)
            return {newPostsAvailables: s}
        },
        unfetchedContentIds() {
            return this.$store.state.stream.unfetchedContentIds
        },
    },
    beforeMount() {
        if (!this.$store.state.stream.stream.single) {
            this.loadStream()
        }
    },
    methods: {
        onNewContentClick() {
            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.stream.currentContentIds[
                this.$store.state.stream.currentContentIds.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.stream.name) {
                case "followed":
                    this.$store.dispatch("stream/getFollowedStream", options)
                    break
                case "limited":
                    this.$store.dispatch("stream/getLimitedStream", options)
                    break
                case "local":
                    this.$store.dispatch("stream/getLocalStream", options)
                    break
                case "public":
                    this.$store.dispatch("stream/getPublicStream", options)
                    break
                case "tag":
                    options.params.name = this.tag
                    this.$store.dispatch("stream/getTagStream", options)
                    break
                case "tags":
                    this.$store.dispatch("stream/getTagsStream", options)
                    break
                case "profile_all":
                    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.application.profile.uuid
                    this.$store.dispatch("stream/getProfilePinned", options)
                    break
                default:
                    break
            }
        },
    },
})