add bubble timeline

This commit is contained in:
FloatingGhost 2022-07-22 15:36:45 +01:00
parent 75024d8501
commit 18fc3a0ad5
11 changed files with 86 additions and 4 deletions

View file

@ -2,6 +2,7 @@ import PublicTimeline from 'components/public_timeline/public_timeline.vue'
import PublicAndExternalTimeline from 'components/public_and_external_timeline/public_and_external_timeline.vue' import PublicAndExternalTimeline from 'components/public_and_external_timeline/public_and_external_timeline.vue'
import FriendsTimeline from 'components/friends_timeline/friends_timeline.vue' import FriendsTimeline from 'components/friends_timeline/friends_timeline.vue'
import TagTimeline from 'components/tag_timeline/tag_timeline.vue' import TagTimeline from 'components/tag_timeline/tag_timeline.vue'
import BubbleTimeline from 'components/bubble_timeline/bubble_timeline.vue'
import BookmarkTimeline from 'components/bookmark_timeline/bookmark_timeline.vue' import BookmarkTimeline from 'components/bookmark_timeline/bookmark_timeline.vue'
import ConversationPage from 'components/conversation-page/conversation-page.vue' import ConversationPage from 'components/conversation-page/conversation-page.vue'
import Interactions from 'components/interactions/interactions.vue' import Interactions from 'components/interactions/interactions.vue'
@ -42,6 +43,7 @@ export default (store) => {
}, },
{ name: 'public-external-timeline', path: '/main/all', component: PublicAndExternalTimeline }, { name: 'public-external-timeline', path: '/main/all', component: PublicAndExternalTimeline },
{ name: 'public-timeline', path: '/main/public', component: PublicTimeline }, { name: 'public-timeline', path: '/main/public', component: PublicTimeline },
{ name: 'bubble-timeline', path: '/main/bubble', component: BubbleTimeline },
{ name: 'friends', path: '/main/friends', component: FriendsTimeline, beforeEnter: validateAuthenticatedRoute }, { name: 'friends', path: '/main/friends', component: FriendsTimeline, beforeEnter: validateAuthenticatedRoute },
{ name: 'tag-timeline', path: '/tag/:tag', component: TagTimeline }, { name: 'tag-timeline', path: '/tag/:tag', component: TagTimeline },
{ name: 'bookmarks', path: '/bookmarks', component: BookmarkTimeline }, { name: 'bookmarks', path: '/bookmarks', component: BookmarkTimeline },

View file

@ -0,0 +1,18 @@
import Timeline from '../timeline/timeline.vue'
const PublicTimeline = {
components: {
Timeline
},
computed: {
timeline () { return this.$store.state.statuses.timelines.bubble }
},
created () {
this.$store.dispatch('startFetchingTimeline', { timeline: 'bubble' })
},
unmounted () {
this.$store.dispatch('stopFetchingTimeline', 'bubble')
}
}
export default PublicTimeline

View file

@ -0,0 +1,9 @@
<template>
<Timeline
:title="$t('nav.bubble_timeline')"
:timeline="timeline"
:timeline-name="'bubble'"
/>
</template>
<script src="./bubble_timeline.js"></script>

View file

@ -15,7 +15,8 @@ export const timelineNames = () => {
'bookmarks': 'nav.bookmarks', 'bookmarks': 'nav.bookmarks',
'dms': 'nav.dms', 'dms': 'nav.dms',
'public-timeline': 'nav.public_tl', 'public-timeline': 'nav.public_tl',
'public-external-timeline': 'nav.twkn' 'public-external-timeline': 'nav.twkn',
'bubble-timeline': 'nav.bubble_timeline'
} }
} }

View file

@ -135,6 +135,7 @@
a { a {
display: block; display: block;
padding: 0.6em 0.65em; padding: 0.6em 0.65em;
padding-bottom: 0;
&:hover { &:hover {
background-color: $fallback--lightBg; background-color: $fallback--lightBg;

View file

@ -5,7 +5,8 @@ import {
faGlobe, faGlobe,
faBookmark, faBookmark,
faEnvelope, faEnvelope,
faHome faHome,
faCircle
} from '@fortawesome/free-solid-svg-icons' } from '@fortawesome/free-solid-svg-icons'
library.add( library.add(
@ -13,7 +14,8 @@ library.add(
faGlobe, faGlobe,
faBookmark, faBookmark,
faEnvelope, faEnvelope,
faHome faHome,
faCircle
) )
const TimelineMenuContent = { const TimelineMenuContent = {

View file

@ -11,6 +11,20 @@
icon="home" icon="home"
/>{{ $t("nav.home_timeline") }} />{{ $t("nav.home_timeline") }}
</router-link> </router-link>
<span class="timeline-desc">{{ $t("nav.home_timeline_description") }}</span>
</li>
<li v-if="currentUser">
<router-link
class="menu-item"
:to="{ name: 'bubble-timeline' }"
>
<FAIcon
fixed-width
class="fa-scale-110 fa-old-padding "
icon="circle"
/>{{ $t("nav.bubble_timeline") }}
</router-link>
<span class="timeline-desc">{{ $t("nav.bubble_timeline_description") }}</span>
</li> </li>
<li v-if="currentUser || !privateMode"> <li v-if="currentUser || !privateMode">
<router-link <router-link
@ -23,6 +37,7 @@
icon="users" icon="users"
/>{{ $t("nav.public_tl") }} />{{ $t("nav.public_tl") }}
</router-link> </router-link>
<span class="timeline-desc">{{ $t("nav.public_timeline_description") }}</span>
</li> </li>
<li v-if="federating && (currentUser || !privateMode)"> <li v-if="federating && (currentUser || !privateMode)">
<router-link <router-link
@ -35,6 +50,7 @@
icon="globe" icon="globe"
/>{{ $t("nav.twkn") }} />{{ $t("nav.twkn") }}
</router-link> </router-link>
<span class="timeline-desc">{{ $t("nav.twkn_timeline_description") }}</span>
</li> </li>
<li v-if="currentUser"> <li v-if="currentUser">
<router-link <router-link
@ -64,3 +80,15 @@
</template> </template>
<script src="./timeline_menu_content.js" ></script> <script src="./timeline_menu_content.js" ></script>
<style lang="scss">
@import "../../_variables.scss";
.timeline-desc {
text-decoration: none;
color: var(--text, $fallback--text);
padding-left: 1em;
display: block;
background-color: scale(var(--bg, $fallback--bg), 0.1);
padding-bottom: 0.4em;
}
</style>

View file

@ -158,9 +158,14 @@
"interactions": "Interactions", "interactions": "Interactions",
"dms": "Direct messages", "dms": "Direct messages",
"public_tl": "Public timeline", "public_tl": "Public timeline",
"public_timeline_description": "Public posts from this instance",
"timeline": "Timeline", "timeline": "Timeline",
"home_timeline": "Home timeline", "home_timeline": "Home timeline",
"home_timeline_description": "Posts from people you follow",
"bubble_timeline": "Bubble timeline",
"bubble_timeline_description": "Posts from instances close to yours, as recommended by the admin(s)",
"twkn": "Known Network", "twkn": "Known Network",
"twkn_timeline_description": "Posts from the entire network",
"bookmarks": "Bookmarks", "bookmarks": "Bookmarks",
"user_search": "User Search", "user_search": "User Search",
"search": "Search", "search": "Search",

View file

@ -90,9 +90,13 @@
"interactions": "インタラクション", "interactions": "インタラクション",
"dms": "ダイレクトメッセージ", "dms": "ダイレクトメッセージ",
"public_tl": "公開タイムライン", "public_tl": "公開タイムライン",
"public_timeline_description": "このインスタンスからの公開投稿",
"timeline": "タイムライン", "timeline": "タイムライン",
"lists": "リスト", "lists": "リスト",
"twkn": "すべてのネットワーク", "twkn": "すべてのネットワーク",
"twkn_timeline_description": "全連合からの投稿",
"bubble_timeline": "バブルタイムライン",
"bubble_timeline_description": "管理者がおすすめしているインスタンスからの投稿",
"user_search": "ユーザーを探す", "user_search": "ユーザーを探す",
"search": "検索", "search": "検索",
"who_to_follow": "おすすめユーザー", "who_to_follow": "おすすめユーザー",
@ -102,6 +106,7 @@
"timelines": "タイムライン", "timelines": "タイムライン",
"chats": "チャット", "chats": "チャット",
"home_timeline": "ホームタイムライン", "home_timeline": "ホームタイムライン",
"home_timeline_description": "フォローしているユーザーからの投稿",
"announcements": "お知らせ" "announcements": "お知らせ"
}, },
"notifications": { "notifications": {

View file

@ -63,7 +63,8 @@ export const defaultState = () => ({
tag: emptyTl(), tag: emptyTl(),
dms: emptyTl(), dms: emptyTl(),
bookmarks: emptyTl(), bookmarks: emptyTl(),
list: emptyTl() list: emptyTl(),
bubble: emptyTl()
} }
}) })

View file

@ -47,6 +47,7 @@ const MASTODON_DENY_USER_URL = id => `/api/v1/follow_requests/${id}/reject`
const MASTODON_DIRECT_MESSAGES_TIMELINE_URL = '/api/v1/timelines/direct' const MASTODON_DIRECT_MESSAGES_TIMELINE_URL = '/api/v1/timelines/direct'
const MASTODON_PUBLIC_TIMELINE = '/api/v1/timelines/public' const MASTODON_PUBLIC_TIMELINE = '/api/v1/timelines/public'
const MASTODON_USER_HOME_TIMELINE_URL = '/api/v1/timelines/home' const MASTODON_USER_HOME_TIMELINE_URL = '/api/v1/timelines/home'
const AKKOMA_BUBBLE_TIMELINE_URL = '/api/v1/timelines/bubble'
const MASTODON_STATUS_URL = id => `/api/v1/statuses/${id}` const MASTODON_STATUS_URL = id => `/api/v1/statuses/${id}`
const MASTODON_STATUS_CONTEXT_URL = id => `/api/v1/statuses/${id}/context` const MASTODON_STATUS_CONTEXT_URL = id => `/api/v1/statuses/${id}/context`
const MASTODON_USER_URL = id => `/api/v1/accounts/${id}?with_relationships=true` const MASTODON_USER_URL = id => `/api/v1/accounts/${id}?with_relationships=true`
@ -608,6 +609,7 @@ const fetchTimeline = ({
}) => { }) => {
const timelineUrls = { const timelineUrls = {
public: MASTODON_PUBLIC_TIMELINE, public: MASTODON_PUBLIC_TIMELINE,
bubble: AKKOMA_BUBBLE_TIMELINE_URL,
friends: MASTODON_USER_HOME_TIMELINE_URL, friends: MASTODON_USER_HOME_TIMELINE_URL,
dms: MASTODON_DIRECT_MESSAGES_TIMELINE_URL, dms: MASTODON_DIRECT_MESSAGES_TIMELINE_URL,
notifications: MASTODON_USER_NOTIFICATIONS_URL, notifications: MASTODON_USER_NOTIFICATIONS_URL,
@ -1395,7 +1397,15 @@ export const ProcessedWS = ({
} }
socket.addEventListener('open', (wsEvent) => { socket.addEventListener('open', (wsEvent) => {
console.debug(`[WS][${id}] Socket connected`, wsEvent) console.debug(`[WS][${id}] Socket connected`, wsEvent)
setInterval(() => {
try {
socket.send('ping')
} catch (e) {
clearInterval(this)
}
}, 30000)
}) })
socket.addEventListener('error', (wsEvent) => { socket.addEventListener('error', (wsEvent) => {
console.debug(`[WS][${id}] Socket errored`, wsEvent) console.debug(`[WS][${id}] Socket errored`, wsEvent)
}) })