From 22e8258a56ab0828231bc0e510b52dd39eebb5c7 Mon Sep 17 00:00:00 2001 From: wakarimasen <wakarimasen@airmail.cc> Date: Sun, 5 Mar 2017 11:56:28 +0100 Subject: [PATCH] Highlight current notice in conversation-page, add backlinks --- src/components/status/status.js | 8 +++++++- src/components/status/status.vue | 9 ++++++++- src/main.js | 5 ++++- 3 files changed, 19 insertions(+), 3 deletions(-) diff --git a/src/components/status/status.js b/src/components/status/status.js index 22292ffa..9550c19f 100644 --- a/src/components/status/status.js +++ b/src/components/status/status.js @@ -4,6 +4,7 @@ import RetweetButton from '../retweet_button/retweet_button.vue' import DeleteButton from '../delete_button/delete_button.vue' import PostStatusForm from '../post_status_form/post_status_form.vue' import UserCardContent from '../user_card_content/user_card_content.vue' +import { toInteger } from 'lodash' const Status = { props: [ @@ -30,7 +31,12 @@ const Status = { loggedIn () { return !!this.$store.state.users.currentUser }, - muted () { return !this.unmuted && this.status.user.muted } + muted () { return !this.unmuted && this.status.user.muted }, + focused () { + const id = toInteger(this.$route.params.id) + return (this.statusoid.id == id) + }, + isReply () { return !!this.statusoid.in_reply_to_status_id } }, components: { Attachment, diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 585bf621..6476e1e5 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -1,5 +1,5 @@ <template> - <div class="status-el base00-background" v-if="!status.deleted" v-bind:class="{ 'expanded-status': !expandable }"> + <div class="status-el base00-background" v-if="!status.deleted" v-bind:class="[{ 'expanded-status': !expandable }, { 'base01-background': focused }]"> <template v-if="muted"> <div class="media status container muted"> <small><router-link :to="{ name: 'user-profile', params: { id: status.user.id } }">{{status.user.screen_name}}</router-link></small> @@ -34,6 +34,13 @@ {{status.in_reply_to_screen_name}} </router-link> </small> + <template v-if="isReply"> + <small> + <router-link :to="{ name: 'conversation', params: { id: status.in_reply_to_status_id } }"> + <i class="icon-reply"></i> + </router-link> + </small> + </template> - <small> <router-link :to="{ name: 'conversation', params: { id: status.id } }"> diff --git a/src/main.js b/src/main.js index fa0a872f..30929f0b 100644 --- a/src/main.js +++ b/src/main.js @@ -53,7 +53,7 @@ const routes = [ { path: '/main/all', component: PublicAndExternalTimeline }, { path: '/main/public', component: PublicTimeline }, { path: '/main/friends', component: FriendsTimeline }, - { name: 'conversation', path: '/notice/:id', component: ConversationPage }, + { name: 'conversation', path: '/notice/:id', component: ConversationPage, meta: { dontScroll: true } }, { name: 'user-profile', path: '/users/:id', component: UserProfile }, { name: 'mentions', path: '/:username/mentions', component: Mentions }, { name: 'settings', path: '/settings', component: Settings } @@ -63,6 +63,9 @@ const router = new VueRouter({ mode: 'history', routes, scrollBehavior: (to, from, savedPosition) => { + if (to.matched.some(m => m.meta.dontScroll)) { + return false + } return savedPosition || { x: 0, y: 0 } } })