Highlight current notice in conversation-page, add backlinks

This commit is contained in:
wakarimasen 2017-03-05 11:56:28 +01:00
parent 049c74f8e8
commit 22e8258a56
3 changed files with 19 additions and 3 deletions

View File

@ -4,6 +4,7 @@ import RetweetButton from '../retweet_button/retweet_button.vue'
import DeleteButton from '../delete_button/delete_button.vue' import DeleteButton from '../delete_button/delete_button.vue'
import PostStatusForm from '../post_status_form/post_status_form.vue' import PostStatusForm from '../post_status_form/post_status_form.vue'
import UserCardContent from '../user_card_content/user_card_content.vue' import UserCardContent from '../user_card_content/user_card_content.vue'
import { toInteger } from 'lodash'
const Status = { const Status = {
props: [ props: [
@ -30,7 +31,12 @@ const Status = {
loggedIn () { loggedIn () {
return !!this.$store.state.users.currentUser 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: { components: {
Attachment, Attachment,

View File

@ -1,5 +1,5 @@
<template> <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"> <template v-if="muted">
<div class="media status container 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> <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}} {{status.in_reply_to_screen_name}}
</router-link> </router-link>
</small> </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> <small>
<router-link :to="{ name: 'conversation', params: { id: status.id } }"> <router-link :to="{ name: 'conversation', params: { id: status.id } }">

View File

@ -53,7 +53,7 @@ const routes = [
{ path: '/main/all', component: PublicAndExternalTimeline }, { path: '/main/all', component: PublicAndExternalTimeline },
{ path: '/main/public', component: PublicTimeline }, { path: '/main/public', component: PublicTimeline },
{ path: '/main/friends', component: FriendsTimeline }, { 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: 'user-profile', path: '/users/:id', component: UserProfile },
{ name: 'mentions', path: '/:username/mentions', component: Mentions }, { name: 'mentions', path: '/:username/mentions', component: Mentions },
{ name: 'settings', path: '/settings', component: Settings } { name: 'settings', path: '/settings', component: Settings }
@ -63,6 +63,9 @@ const router = new VueRouter({
mode: 'history', mode: 'history',
routes, routes,
scrollBehavior: (to, from, savedPosition) => { scrollBehavior: (to, from, savedPosition) => {
if (to.matched.some(m => m.meta.dontScroll)) {
return false
}
return savedPosition || { x: 0, y: 0 } return savedPosition || { x: 0, y: 0 }
} }
}) })