Fix issues which are blocking rendering
This commit is contained in:
AkiraFukushima
parent
6f307cd298
commit
85ef5e5f01
|
|
@ -109,8 +109,7 @@
|
||||||
"vue-popperjs": "^2.3.0",
|
"vue-popperjs": "^2.3.0",
|
||||||
"vue-resize": "^2.0.0-alpha.1",
|
"vue-resize": "^2.0.0-alpha.1",
|
||||||
"vue-router": "^4.0.14",
|
"vue-router": "^4.0.14",
|
||||||
"vue-shortkey": "^3.1.7",
|
"@h3poteto/vue-virtual-scroller": "2.0.0-alpha.1",
|
||||||
"vue-virtual-scroller": "^2.0.0-alpha.1",
|
|
||||||
"vuex": "^4.0.2",
|
"vuex": "^4.0.2",
|
||||||
"vuex-router-sync": "^6.0.0-rc.1"
|
"vuex-router-sync": "^6.0.0-rc.1"
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-header>
|
</el-header>
|
||||||
<el-container>
|
<el-container>
|
||||||
<div v-shortkey="['esc']" @shortkey="close"></div>
|
<div></div>
|
||||||
<login-form></login-form>
|
<login-form></login-form>
|
||||||
</el-container>
|
</el-container>
|
||||||
</el-container>
|
</el-container>
|
||||||
|
|
|
||||||
|
|
@ -9,7 +9,7 @@
|
||||||
:model="form"
|
:model="form"
|
||||||
>
|
>
|
||||||
<el-form-item :label="$t('login.domain_name_label')" prop="domainName">
|
<el-form-item :label="$t('login.domain_name_label')" prop="domainName">
|
||||||
<el-input v-model="form.domainName" placeholder="mastodon.social" v-shortkey="['enter']" @shortkey="handleKey"></el-input>
|
<el-input v-model="form.domainName" placeholder="mastodon.social"></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<p class="proxy-info">
|
<p class="proxy-info">
|
||||||
{{ $t('login.proxy_info') }}<router-link to="/preferences/network">{{ $t('login.proxy_here') }}</router-link>
|
{{ $t('login.proxy_info') }}<router-link to="/preferences/network">{{ $t('login.proxy_here') }}</router-link>
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,7 @@
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-header>
|
</el-header>
|
||||||
<el-container>
|
<el-container>
|
||||||
<div v-shortkey="['esc']" @shortkey="close"></div>
|
<div></div>
|
||||||
<el-aside width="240px" class="menu">
|
<el-aside width="240px" class="menu">
|
||||||
<el-menu
|
<el-menu
|
||||||
:default-active="activeRoute()"
|
:default-active="activeRoute()"
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,7 @@
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-header>
|
</el-header>
|
||||||
<el-container>
|
<el-container>
|
||||||
<div v-shortkey="['esc']" @shortkey="close"></div>
|
<div></div>
|
||||||
<el-aside width="240px" class="menu">
|
<el-aside width="240px" class="menu">
|
||||||
<el-menu
|
<el-menu
|
||||||
:default-active="activeRoute()"
|
:default-active="activeRoute()"
|
||||||
|
|
|
||||||
|
|
@ -5,8 +5,6 @@
|
||||||
:element-loading-text="$t('message.loading')"
|
:element-loading-text="$t('message.loading')"
|
||||||
element-loading-spinner="el-icon-loading"
|
element-loading-spinner="el-icon-loading"
|
||||||
element-loading-background="rgba(0, 0, 0, 0.8)"
|
element-loading-background="rgba(0, 0, 0, 0.8)"
|
||||||
v-shortkey="shortcutEnabled ? { help: ['shift', '?'] } : {}"
|
|
||||||
@shortkey="handleKey"
|
|
||||||
>
|
>
|
||||||
<side-menu></side-menu>
|
<side-menu></side-menu>
|
||||||
<div :class="collapse ? 'page-narrow' : 'page'">
|
<div :class="collapse ? 'page-narrow' : 'page'">
|
||||||
|
|
@ -39,18 +37,18 @@ export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
dropTarget: null,
|
dropTarget: null,
|
||||||
droppableVisible: false,
|
droppableVisible: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState({
|
...mapState({
|
||||||
loading: (state) => state.TimelineSpace.loading,
|
loading: state => state.TimelineSpace.loading,
|
||||||
collapse: (state) => state.TimelineSpace.SideMenu.collapse,
|
collapse: state => state.TimelineSpace.SideMenu.collapse
|
||||||
}),
|
}),
|
||||||
...mapGetters('TimelineSpace/Modals', ['modalOpened']),
|
...mapGetters('TimelineSpace/Modals', ['modalOpened']),
|
||||||
shortcutEnabled: function () {
|
shortcutEnabled: function () {
|
||||||
return !this.modalOpened
|
return !this.modalOpened
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
async created() {
|
async created() {
|
||||||
this.$store.dispatch('TimelineSpace/Contents/SideBar/close')
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/close')
|
||||||
|
|
@ -88,20 +86,17 @@ export default {
|
||||||
await this.clear()
|
await this.clear()
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await this.$store.dispatch(
|
await this.$store.dispatch('TimelineSpace/initLoad', this.$route.params.id)
|
||||||
'TimelineSpace/initLoad',
|
|
||||||
this.$route.params.id
|
|
||||||
)
|
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
if (err instanceof AccountLoadError) {
|
if (err instanceof AccountLoadError) {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: this.$t('message.account_load_error'),
|
message: this.$t('message.account_load_error'),
|
||||||
type: 'error',
|
type: 'error'
|
||||||
})
|
})
|
||||||
} else if (err instanceof TimelineFetchError) {
|
} else if (err instanceof TimelineFetchError) {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: this.$t('message.timeline_fetch_error'),
|
message: this.$t('message.timeline_fetch_error'),
|
||||||
type: 'error',
|
type: 'error'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -112,17 +107,14 @@ export default {
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
e.stopPropagation()
|
e.stopPropagation()
|
||||||
this.droppableVisible = false
|
this.droppableVisible = false
|
||||||
if (
|
if (e.dataTransfer.files.item(0) === null || e.dataTransfer.files.item(0) === undefined) {
|
||||||
e.dataTransfer.files.item(0) === null ||
|
|
||||||
e.dataTransfer.files.item(0) === undefined
|
|
||||||
) {
|
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
const file = e.dataTransfer.files.item(0)
|
const file = e.dataTransfer.files.item(0)
|
||||||
if (!file.type.includes('image') && !file.type.includes('video')) {
|
if (!file.type.includes('image') && !file.type.includes('video')) {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: this.$t('validation.new_toot.attach_image'),
|
message: this.$t('validation.new_toot.attach_image'),
|
||||||
type: 'error',
|
type: 'error'
|
||||||
})
|
})
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
@ -133,16 +125,16 @@ export default {
|
||||||
.then(() => {
|
.then(() => {
|
||||||
Event.$emit('image-uploaded')
|
Event.$emit('image-uploaded')
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch(err => {
|
||||||
if (err instanceof NewTootAttachLength) {
|
if (err instanceof NewTootAttachLength) {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: this.$t('validation.new_toot.attach_length', { max: 4 }),
|
message: this.$t('validation.new_toot.attach_length', { max: 4 }),
|
||||||
type: 'error',
|
type: 'error'
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: this.$t('message.attach_error'),
|
message: this.$t('message.attach_error'),
|
||||||
type: 'error',
|
type: 'error'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
@ -168,8 +160,8 @@ export default {
|
||||||
this.$store.commit('TimelineSpace/Modals/Shortcut/changeModal', true)
|
this.$store.commit('TimelineSpace/Modals/Shortcut/changeModal', true)
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="bookmarks" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
|
<div id="bookmarks">
|
||||||
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
|
<div></div>
|
||||||
<DynamicScroller :items="bookmarks" :min-item-size="60" id="scroller" class="scroller" ref="scroller">
|
<DynamicScroller :items="bookmarks" :min-item-size="60" id="scroller" class="scroller" ref="scroller">
|
||||||
<template v-slot="{ item, index, active }">
|
<template v-slot="{ item, index, active }">
|
||||||
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="directmessages" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
|
<div id="directmessages">
|
||||||
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
|
<div></div>
|
||||||
<DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
<DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
||||||
<template v-slot="{ item, index, active }">
|
<template v-slot="{ item, index, active }">
|
||||||
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="favourites" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
|
<div id="favourites">
|
||||||
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
|
<div></div>
|
||||||
<DynamicScroller :items="favourites" :min-item-size="60" id="scroller" class="scroller" ref="scroller">
|
<DynamicScroller :items="favourites" :min-item-size="60" id="scroller" class="scroller" ref="scroller">
|
||||||
<template v-slot="{ item, index, active }">
|
<template v-slot="{ item, index, active }">
|
||||||
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
||||||
|
|
|
||||||
|
|
@ -9,21 +9,10 @@
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item input">
|
<div class="form-item input">
|
||||||
<input
|
<input v-model="tag" :placeholder="$t('hashtag.tag_name')" class="search-keyword" v-on:keyup.enter="search" autofocus />
|
||||||
v-model="tag"
|
|
||||||
:placeholder="$t('hashtag.tag_name')"
|
|
||||||
class="search-keyword"
|
|
||||||
v-shortkey.avoid
|
|
||||||
v-on:keyup.enter="search"
|
|
||||||
autofocus
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item" v-show="tagPage()">
|
<div class="form-item" v-show="tagPage()">
|
||||||
<el-button
|
<el-button type="text" @click="save" :title="$t('hashtag.save_tag')">
|
||||||
type="text"
|
|
||||||
@click="save"
|
|
||||||
:title="$t('hashtag.save_tag')"
|
|
||||||
>
|
|
||||||
<font-awesome-icon icon="thumbtack" />
|
<font-awesome-icon icon="thumbtack" />
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -39,7 +28,7 @@ export default {
|
||||||
name: 'hashtag',
|
name: 'hashtag',
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
tag: '',
|
tag: ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
|
@ -52,7 +41,7 @@ export default {
|
||||||
if (route.name === 'tag') {
|
if (route.name === 'tag') {
|
||||||
this.tag = route.params.tag
|
this.tag = route.params.tag
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
id() {
|
id() {
|
||||||
|
|
@ -69,8 +58,8 @@ export default {
|
||||||
},
|
},
|
||||||
save() {
|
save() {
|
||||||
this.$store.dispatch('TimelineSpace/Contents/Hashtag/saveTag', this.tag)
|
this.$store.dispatch('TimelineSpace/Contents/Hashtag/saveTag', this.tag)
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div name="tag" class="tag-timeline" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
|
<div name="tag" class="tag-timeline">
|
||||||
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
|
<div></div>
|
||||||
<DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
<DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
||||||
<template v-slot="{ item, index, active }">
|
<template v-slot="{ item, index, active }">
|
||||||
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div name="list" class="list-timeline" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
|
<div name="list" class="list-timeline">
|
||||||
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
|
<div></div>
|
||||||
<DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
<DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
||||||
<template v-slot="{ item, index, active }">
|
<template v-slot="{ item, index, active }">
|
||||||
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="local" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
|
<div id="local">
|
||||||
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
|
<div></div>
|
||||||
<DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
<DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
||||||
<template v-slot="{ item, index, active }">
|
<template v-slot="{ item, index, active }">
|
||||||
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="mentions" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
|
<div id="mentions">
|
||||||
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
|
<div></div>
|
||||||
<DynamicScroller :items="mentions" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
<DynamicScroller :items="mentions" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
||||||
<template v-slot="{ item, index, active }">
|
<template v-slot="{ item, index, active }">
|
||||||
<template v-if="item.id === 'loading-card'">
|
<template v-if="item.id === 'loading-card'">
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="notifications" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
|
<div id="notifications">
|
||||||
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
|
<div></div>
|
||||||
<DynamicScroller :items="handledNotifications" :min-item-size="20" id="scroller" class="scroller" ref="scroller">
|
<DynamicScroller :items="handledNotifications" :min-item-size="20" id="scroller" class="scroller" ref="scroller">
|
||||||
<template v-slot="{ item, index, active }">
|
<template v-slot="{ item, index, active }">
|
||||||
<template v-if="item.id === 'loading-card'">
|
<template v-if="item.id === 'loading-card'">
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="public" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
|
<div id="public">
|
||||||
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
|
<div></div>
|
||||||
<DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
<DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
|
||||||
<template v-slot="{ item, index, active }">
|
<template v-slot="{ item, index, active }">
|
||||||
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
|
||||||
|
|
|
||||||
|
|
@ -2,27 +2,10 @@
|
||||||
<div id="search">
|
<div id="search">
|
||||||
<div class="search-header">
|
<div class="search-header">
|
||||||
<el-form :inline="true">
|
<el-form :inline="true">
|
||||||
<el-select
|
<el-select v-model="target" :placeholder="$t('search.search')" class="search-target">
|
||||||
v-model="target"
|
<el-option v-for="item in searchTargets" :key="item.target" :label="item.label" :value="item.target"> </el-option>
|
||||||
:placeholder="$t('search.search')"
|
|
||||||
class="search-target"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in searchTargets"
|
|
||||||
:key="item.target"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.target"
|
|
||||||
>
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
</el-select>
|
||||||
<input
|
<input v-model="query" :placeholder="$t('search.keyword')" class="search-keyword" v-on:keyup.enter="search" autofocus />
|
||||||
v-model="query"
|
|
||||||
:placeholder="$t('search.keyword')"
|
|
||||||
class="search-keyword"
|
|
||||||
v-shortkey.avoid
|
|
||||||
v-on:keyup.enter="search"
|
|
||||||
autofocus
|
|
||||||
/>
|
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
</el-form>
|
</el-form>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -45,7 +28,7 @@ export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
target: 'account',
|
target: 'account',
|
||||||
query: '',
|
query: ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
|
@ -54,64 +37,52 @@ export default {
|
||||||
return [
|
return [
|
||||||
{
|
{
|
||||||
target: 'account',
|
target: 'account',
|
||||||
label: this.$t('search.account'),
|
label: this.$t('search.account')
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
target: 'tag',
|
target: 'tag',
|
||||||
label: this.$t('search.tag'),
|
label: this.$t('search.tag')
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
target: 'toot',
|
target: 'toot',
|
||||||
label: this.$t('search.toot'),
|
label: this.$t('search.toot')
|
||||||
},
|
}
|
||||||
]
|
]
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
search() {
|
search() {
|
||||||
switch (this.target) {
|
switch (this.target) {
|
||||||
case 'account':
|
case 'account':
|
||||||
this.$store
|
this.$store.dispatch('TimelineSpace/Contents/Search/Account/search', this.query).catch(() => {
|
||||||
.dispatch(
|
this.$message({
|
||||||
'TimelineSpace/Contents/Search/Account/search',
|
message: this.$t('message.search_error'),
|
||||||
this.query
|
type: 'error'
|
||||||
)
|
|
||||||
.catch(() => {
|
|
||||||
this.$message({
|
|
||||||
message: this.$t('message.search_error'),
|
|
||||||
type: 'error',
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
})
|
||||||
break
|
break
|
||||||
case 'tag':
|
case 'tag':
|
||||||
this.$store
|
this.$store.dispatch('TimelineSpace/Contents/Search/Tag/search', `#${this.query}`).catch(() => {
|
||||||
.dispatch(
|
this.$message({
|
||||||
'TimelineSpace/Contents/Search/Tag/search',
|
message: this.$t('message.search_error'),
|
||||||
`#${this.query}`
|
type: 'error'
|
||||||
)
|
|
||||||
.catch(() => {
|
|
||||||
this.$message({
|
|
||||||
message: this.$t('message.search_error'),
|
|
||||||
type: 'error',
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
})
|
||||||
break
|
break
|
||||||
case 'toot':
|
case 'toot':
|
||||||
this.$store
|
this.$store.dispatch('TimelineSpace/Contents/Search/Toots/search', this.query).catch(() => {
|
||||||
.dispatch('TimelineSpace/Contents/Search/Toots/search', this.query)
|
this.$message({
|
||||||
.catch(() => {
|
message: this.$t('message.search_error'),
|
||||||
this.$message({
|
type: 'error'
|
||||||
message: this.$t('message.search_error'),
|
|
||||||
type: 'error',
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
})
|
||||||
break
|
break
|
||||||
default:
|
default:
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="side-bar" v-if="openSideBar" v-shortkey="shortcutEnabled ? { close: ['esc'] } : {}" @shortkey="handleKey">
|
<div class="side-bar" v-if="openSideBar">
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<font-awesome-icon icon="spinner" />
|
<font-awesome-icon icon="spinner" />
|
||||||
<font-awesome-icon icon="rotate" />
|
<font-awesome-icon icon="rotate" />
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
<el-dialog :title="$t('modals.add_list_member.title')" v-model="addListMemberModal" width="400px" class="add-member">
|
<el-dialog :title="$t('modals.add_list_member.title')" v-model="addListMemberModal" width="400px" class="add-member">
|
||||||
<div class="search-account" :element-loading-background="loadingBackground">
|
<div class="search-account" :element-loading-background="loadingBackground">
|
||||||
<el-form :inline="true">
|
<el-form :inline="true">
|
||||||
<input v-model="name" placeholder="Account name" class="account-name" v-shortkey="['enter']" @shortkey="search" autofocus />
|
<input v-model="name" placeholder="Account name" class="account-name" autofocus />
|
||||||
<el-button type="text" class="search" @click="search">
|
<el-button type="text" class="search" @click="search">
|
||||||
<font-awesome-icon icon="magnifying-glass" />
|
<font-awesome-icon icon="magnifying-glass" />
|
||||||
</el-button>
|
</el-button>
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<transition name="image-viewer">
|
<transition name="image-viewer">
|
||||||
<div id="image" v-show="modalOpen" @click="close" :aria-hidden="!modalOpen" aria-modal="true" role="dialog">
|
<div id="image" v-show="modalOpen" @click="close" :aria-hidden="!modalOpen" aria-modal="true" role="dialog">
|
||||||
<div class="image-wrapper" v-shortkey="modalOpen ? { close: ['esc'] } : {}" @shortkey="closeHandle">
|
<div class="image-wrapper">
|
||||||
<div class="image-header">
|
<div class="image-header">
|
||||||
<el-button type="text" @click="close" class="close-button">
|
<el-button type="text" @click="close" class="close-button">
|
||||||
<font-awesome-icon icon="xmark" />
|
<font-awesome-icon icon="xmark" />
|
||||||
|
|
@ -9,13 +9,11 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="image-content" role="presentation">
|
<div class="image-content" role="presentation">
|
||||||
<span class="button-area"
|
<span class="button-area"
|
||||||
><el-button type="text" v-show="showLeft" v-shortkey="['arrowleft']" @shortkey="decrementIndex()">
|
><el-button type="text"> <font-awesome-icon icon="arrow-left" /> </el-button
|
||||||
<font-awesome-icon icon="arrow-left" /> </el-button
|
|
||||||
></span>
|
></span>
|
||||||
<Media :src="imageURL" :type="imageType"></Media>
|
<Media :src="imageURL" :type="imageType"></Media>
|
||||||
<span class="button-area"
|
<span class="button-area"
|
||||||
><el-button type="text" v-show="showRight" v-shortkey="['arrowright']" @shortkey="incrementIndex()">
|
><el-button type="text"> <font-awesome-icon icon="arrow-right" /> </el-button
|
||||||
<font-awesome-icon icon="arrow-right" /> </el-button
|
|
||||||
></span>
|
></span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -2,14 +2,7 @@
|
||||||
<el-dialog v-model="jumpModal" width="440px" class="jump-modal">
|
<el-dialog v-model="jumpModal" width="440px" class="jump-modal">
|
||||||
<el-form class="jump-form" v-on:submit.prevent="jump">
|
<el-form class="jump-form" v-on:submit.prevent="jump">
|
||||||
<div class="channel">
|
<div class="channel">
|
||||||
<input
|
<input type="text" v-model="channel" :placeholder="$t('modals.jump.jump_to')" ref="channel" />
|
||||||
type="text"
|
|
||||||
v-model="channel"
|
|
||||||
:placeholder="$t('modals.jump.jump_to')"
|
|
||||||
ref="channel"
|
|
||||||
v-shortkey="shortcutEnabled ? { next: ['arrowdown'], prev: ['arrowup'], select: ['enter'] } : {}"
|
|
||||||
@shortkey="handleKey"
|
|
||||||
/>
|
|
||||||
<ul class="channel-list">
|
<ul class="channel-list">
|
||||||
<li
|
<li
|
||||||
v-for="c in filterdChannel"
|
v-for="c in filterdChannel"
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@
|
||||||
<Quote :message="quoteToMessage" :displayNameStyle="displayNameStyle" v-if="quoteToMessage !== null" ref="quote"></Quote>
|
<Quote :message="quoteToMessage" :displayNameStyle="displayNameStyle" v-if="quoteToMessage !== null" ref="quote"></Quote>
|
||||||
<div class="spoiler" v-if="showContentWarning" ref="spoiler">
|
<div class="spoiler" v-if="showContentWarning" ref="spoiler">
|
||||||
<div class="el-input">
|
<div class="el-input">
|
||||||
<input type="text" class="el-input__inner" :placeholder="$t('modals.new_toot.cw')" v-model="spoiler" v-shortkey.avoid />
|
<input type="text" class="el-input__inner" :placeholder="$t('modals.new_toot.cw')" v-model="spoiler" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Status
|
<Status
|
||||||
|
|
@ -45,7 +45,6 @@
|
||||||
:placeholder="$t('modals.new_toot.description')"
|
:placeholder="$t('modals.new_toot.description')"
|
||||||
:value="mediaDescriptions[media.id]"
|
:value="mediaDescriptions[media.id]"
|
||||||
@input="updateDescription(media.id, $event.target.value)"
|
@input="updateDescription(media.id, $event.target.value)"
|
||||||
v-shortkey.avoid
|
|
||||||
role="textbox"
|
role="textbox"
|
||||||
contenteditable="true"
|
contenteditable="true"
|
||||||
aria-multiline="true"
|
aria-multiline="true"
|
||||||
|
|
|
||||||
|
|
@ -3,22 +3,6 @@
|
||||||
<textarea
|
<textarea
|
||||||
v-model="status"
|
v-model="status"
|
||||||
ref="status"
|
ref="status"
|
||||||
v-shortkey="
|
|
||||||
openSuggest
|
|
||||||
? {
|
|
||||||
up: ['arrowup'],
|
|
||||||
down: ['arrowdown'],
|
|
||||||
enter: ['enter'],
|
|
||||||
esc: ['esc']
|
|
||||||
}
|
|
||||||
: {
|
|
||||||
linux: ['ctrl', 'enter'],
|
|
||||||
mac: ['meta', 'enter'],
|
|
||||||
left: ['arrowleft'],
|
|
||||||
right: ['arrowright']
|
|
||||||
}
|
|
||||||
"
|
|
||||||
@shortkey="handleKey"
|
|
||||||
@paste="onPaste"
|
@paste="onPaste"
|
||||||
v-on:input="startSuggest"
|
v-on:input="startSuggest"
|
||||||
:placeholder="$t('modals.new_toot.status')"
|
:placeholder="$t('modals.new_toot.status')"
|
||||||
|
|
@ -35,7 +19,6 @@
|
||||||
v-for="(item, index) in filteredSuggestion"
|
v-for="(item, index) in filteredSuggestion"
|
||||||
:key="index"
|
:key="index"
|
||||||
@click="insertItem(item)"
|
@click="insertItem(item)"
|
||||||
@shortkey="insertItem(item)"
|
|
||||||
@mouseover="highlightedIndex = index"
|
@mouseover="highlightedIndex = index"
|
||||||
:class="{ highlighted: highlightedIndex === index }"
|
:class="{ highlighted: highlightedIndex === index }"
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -14,11 +14,13 @@
|
||||||
<span class="el-dropdown-link">
|
<span class="el-dropdown-link">
|
||||||
<font-awesome-icon icon="arrow-up" class="el-icon--right" />
|
<font-awesome-icon icon="arrow-up" class="el-icon--right" />
|
||||||
</span>
|
</span>
|
||||||
<el-dropdown-menu slot="dropdown">
|
<template #dropdown>
|
||||||
<el-dropdown-item command="show">{{ $t('side_menu.show_profile') }}</el-dropdown-item>
|
<el-dropdown-menu>
|
||||||
<el-dropdown-item command="edit">{{ $t('side_menu.edit_profile') }}</el-dropdown-item>
|
<el-dropdown-item command="show">{{ $t('side_menu.show_profile') }}</el-dropdown-item>
|
||||||
<el-dropdown-item command="settings">{{ $t('side_menu.settings') }}</el-dropdown-item>
|
<el-dropdown-item command="edit">{{ $t('side_menu.edit_profile') }}</el-dropdown-item>
|
||||||
</el-dropdown-menu>
|
<el-dropdown-item command="settings">{{ $t('side_menu.settings') }}</el-dropdown-item>
|
||||||
|
</el-dropdown-menu>
|
||||||
|
</template>
|
||||||
</el-dropdown>
|
</el-dropdown>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -184,7 +186,7 @@
|
||||||
<span>{{ $t('side_menu.hashtag') }}</span>
|
<span>{{ $t('side_menu.hashtag') }}</span>
|
||||||
</div>
|
</div>
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<template v-if="enabledTemplates.tag">
|
<template v-if="enabledTimelines.tag">
|
||||||
<template v-for="tag in tags" :key="tag.tagName">
|
<template v-for="tag in tags" :key="tag.tagName">
|
||||||
<el-menu-item
|
<el-menu-item
|
||||||
:index="`/${id()}/hashtag/${tag.tagName}`"
|
:index="`/${id()}/hashtag/${tag.tagName}`"
|
||||||
|
|
|
||||||
|
|
@ -1,25 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div class="status" tabIndex="0" ref="status" @click="$emit('select')" role="article" aria-label="favourited toot">
|
||||||
class="status"
|
|
||||||
tabIndex="0"
|
|
||||||
v-shortkey="
|
|
||||||
shortcutEnabled
|
|
||||||
? {
|
|
||||||
next: ['j'],
|
|
||||||
prev: ['k'],
|
|
||||||
right: ['l'],
|
|
||||||
left: ['h'],
|
|
||||||
open: ['o'],
|
|
||||||
profile: ['p'],
|
|
||||||
}
|
|
||||||
: {}
|
|
||||||
"
|
|
||||||
@shortkey="handleStatusControl"
|
|
||||||
ref="status"
|
|
||||||
@click="$emit('select')"
|
|
||||||
role="article"
|
|
||||||
aria-label="favourited toot"
|
|
||||||
>
|
|
||||||
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
||||||
<div v-show="!filtered(message)" class="favourite">
|
<div v-show="!filtered(message)" class="favourite">
|
||||||
<div class="action">
|
<div class="action">
|
||||||
|
|
@ -32,34 +12,25 @@
|
||||||
v-html="
|
v-html="
|
||||||
$t('notification.favourite.body', {
|
$t('notification.favourite.body', {
|
||||||
username: username(message.account),
|
username: username(message.account),
|
||||||
interpolation: { escapeValue: false },
|
interpolation: { escapeValue: false }
|
||||||
})
|
})
|
||||||
"
|
"
|
||||||
></bdi>
|
></bdi>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="action-icon" role="presentation">
|
<div class="action-icon" role="presentation">
|
||||||
<FailoverImg
|
<FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />
|
||||||
:src="message.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.account.username}`"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
<div class="target" v-on:dblclick="openDetail(message.status)">
|
<div class="target" v-on:dblclick="openDetail(message.status)">
|
||||||
<div class="icon" @click="openUser(message.status.account)">
|
<div class="icon" @click="openUser(message.status.account)">
|
||||||
<FailoverImg
|
<FailoverImg :src="message.status.account.avatar" :alt="`Avatar of ${message.status.account.username}`" role="presentation" />
|
||||||
:src="message.status.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.status.account.username}`"
|
|
||||||
role="presentation"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="detail">
|
<div class="detail">
|
||||||
<div class="toot-header">
|
<div class="toot-header">
|
||||||
<div class="user" @click="openUser(message.status.account)">
|
<div class="user" @click="openUser(message.status.account)">
|
||||||
<span class="display-name"
|
<span class="display-name"><bdi v-html="username(message.status.account)"></bdi></span>
|
||||||
><bdi v-html="username(message.status.account)"></bdi
|
|
||||||
></span>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="timestamp">
|
<div class="timestamp">
|
||||||
{{ parseDatetime(message.status.created_at) }}
|
{{ parseDatetime(message.status.created_at) }}
|
||||||
|
|
@ -79,14 +50,7 @@
|
||||||
>
|
>
|
||||||
{{ $t('cards.toot.show_more') }}
|
{{ $t('cards.toot.show_more') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button
|
<el-button v-else plain type="primary" size="medium" class="spoil-button" @click="showContent = false">
|
||||||
v-else
|
|
||||||
plain
|
|
||||||
type="primary"
|
|
||||||
size="medium"
|
|
||||||
class="spoil-button"
|
|
||||||
@click="showContent = false"
|
|
||||||
>
|
|
||||||
{{ $t('cards.toot.hide') }}
|
{{ $t('cards.toot.hide') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -99,9 +63,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="attachments">
|
<div class="attachments">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && !isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && !isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="show-sensitive"
|
class="show-sensitive"
|
||||||
type="info"
|
type="info"
|
||||||
@click="showAttachments = true"
|
@click="showAttachments = true"
|
||||||
|
|
@ -110,9 +72,7 @@
|
||||||
</el-button>
|
</el-button>
|
||||||
<div v-show="isShowAttachments(message.status)">
|
<div v-show="isShowAttachments(message.status)">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="hide-sensitive"
|
class="hide-sensitive"
|
||||||
type="text"
|
type="text"
|
||||||
@click="showAttachments = false"
|
@click="showAttachments = false"
|
||||||
|
|
@ -120,28 +80,10 @@
|
||||||
>
|
>
|
||||||
<font-awesome-icon icon="eye" class="hide" />
|
<font-awesome-icon icon="eye" class="hide" />
|
||||||
</el-button>
|
</el-button>
|
||||||
<div
|
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||||
class="media"
|
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||||
v-bind:key="media.preview_url"
|
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||||
v-for="media in mediaAttachments(message.status)"
|
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||||
>
|
|
||||||
<FailoverImg
|
|
||||||
:src="media.preview_url"
|
|
||||||
:title="media.description"
|
|
||||||
:readExif="true"
|
|
||||||
/>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-if="media.type == 'gifv'"
|
|
||||||
>GIF</el-tag
|
|
||||||
>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-else-if="media.type == 'video'"
|
|
||||||
>VIDEO</el-tag
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
|
|
@ -175,42 +117,42 @@ export default {
|
||||||
name: 'favourite',
|
name: 'favourite',
|
||||||
components: {
|
components: {
|
||||||
FailoverImg,
|
FailoverImg,
|
||||||
LinkPreview,
|
LinkPreview
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
message: {
|
message: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: {},
|
default: {}
|
||||||
},
|
},
|
||||||
filters: {
|
filters: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: [],
|
default: []
|
||||||
},
|
},
|
||||||
focused: {
|
focused: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
},
|
||||||
overlaid: {
|
overlaid: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
showContent: false,
|
showContent: false,
|
||||||
showAttachments: false,
|
showAttachments: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState('App', {
|
...mapState('App', {
|
||||||
displayNameStyle: (state) => state.displayNameStyle,
|
displayNameStyle: state => state.displayNameStyle,
|
||||||
timeFormat: (state) => state.timeFormat,
|
timeFormat: state => state.timeFormat,
|
||||||
language: (state) => state.language,
|
language: state => state.language,
|
||||||
hideAllAttachments: (state) => state.hideAllAttachments,
|
hideAllAttachments: state => state.hideAllAttachments
|
||||||
}),
|
}),
|
||||||
shortcutEnabled: function () {
|
shortcutEnabled: function () {
|
||||||
return this.focused && !this.overlaid
|
return this.focused && !this.overlaid
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
if (this.focused) {
|
if (this.focused) {
|
||||||
|
|
@ -228,7 +170,7 @@ export default {
|
||||||
this.$refs.status.blur()
|
this.$refs.status.blur()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
username(account) {
|
username(account) {
|
||||||
|
|
@ -256,31 +198,17 @@ export default {
|
||||||
}
|
}
|
||||||
const parsedAccount = findAccount(e.target, 'favourite')
|
const parsedAccount = findAccount(e.target, 'favourite')
|
||||||
if (parsedAccount !== null) {
|
if (parsedAccount !== null) {
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
this.$store
|
this.$store
|
||||||
.dispatch(
|
.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/searchAccount', parsedAccount)
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/searchAccount',
|
.then(account => {
|
||||||
parsedAccount
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
)
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
.then((account) => {
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
|
||||||
)
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch(err => {
|
||||||
console.error(err)
|
console.error(err)
|
||||||
this.openLink(e)
|
this.openLink(e)
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', false)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
false
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
return parsedAccount.acct
|
return parsedAccount.acct
|
||||||
}
|
}
|
||||||
|
|
@ -293,28 +221,14 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
openUser(account) {
|
openUser(account) {
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
)
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
openDetail(message) {
|
openDetail(message) {
|
||||||
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/TootDetail/changeToot', message)
|
||||||
'TimelineSpace/Contents/SideBar/TootDetail/changeToot',
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
message
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
mediaAttachments(message) {
|
mediaAttachments(message) {
|
||||||
return message.media_attachments
|
return message.media_attachments
|
||||||
|
|
@ -329,10 +243,7 @@ export default {
|
||||||
return !this.spoilered(message) || this.showContent
|
return !this.spoilered(message) || this.showContent
|
||||||
},
|
},
|
||||||
sensitive(message) {
|
sensitive(message) {
|
||||||
return (
|
return (this.hideAllAttachments || message.sensitive) && this.mediaAttachments(message).length > 0
|
||||||
(this.hideAllAttachments || message.sensitive) &&
|
|
||||||
this.mediaAttachments(message).length > 0
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
isShowAttachments(message) {
|
isShowAttachments(message) {
|
||||||
return !this.sensitive(message) || this.showAttachments
|
return !this.sensitive(message) || this.showAttachments
|
||||||
|
|
@ -364,8 +275,8 @@ export default {
|
||||||
this.openUser(this.message.account)
|
this.openUser(this.message.account)
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,18 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div class="relationship" tabIndex="0" ref="status" @click="$emit('select')" role="article" aria-label="follow event">
|
||||||
class="relationship"
|
|
||||||
tabIndex="0"
|
|
||||||
v-shortkey="
|
|
||||||
shortcutEnabled
|
|
||||||
? { next: ['j'], prev: ['k'], right: ['l'], profile: ['p'] }
|
|
||||||
: {}
|
|
||||||
"
|
|
||||||
@shortkey="handleStatusControl"
|
|
||||||
ref="status"
|
|
||||||
@click="$emit('select')"
|
|
||||||
role="article"
|
|
||||||
aria-label="follow event"
|
|
||||||
>
|
|
||||||
<div class="follow">
|
<div class="follow">
|
||||||
<div class="action">
|
<div class="action">
|
||||||
<div class="action-mark">
|
<div class="action-mark">
|
||||||
|
|
@ -24,7 +11,7 @@
|
||||||
v-html="
|
v-html="
|
||||||
$t('notification.follow.body', {
|
$t('notification.follow.body', {
|
||||||
username: username(message.account),
|
username: username(message.account),
|
||||||
interpolation: { escapeValue: false },
|
interpolation: { escapeValue: false }
|
||||||
})
|
})
|
||||||
"
|
"
|
||||||
></bdi>
|
></bdi>
|
||||||
|
|
@ -47,26 +34,26 @@ import emojify from '~/src/renderer/utils/emojify'
|
||||||
export default {
|
export default {
|
||||||
name: 'follow',
|
name: 'follow',
|
||||||
components: {
|
components: {
|
||||||
FailoverImg,
|
FailoverImg
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
message: {
|
message: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: {},
|
default: {}
|
||||||
},
|
},
|
||||||
focused: {
|
focused: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
},
|
||||||
overlaid: {
|
overlaid: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
shortcutEnabled: function () {
|
shortcutEnabled: function () {
|
||||||
return this.focused && !this.overlaid
|
return this.focused && !this.overlaid
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
if (this.focused) {
|
if (this.focused) {
|
||||||
|
|
@ -84,7 +71,7 @@ export default {
|
||||||
this.$refs.status.blur()
|
this.$refs.status.blur()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
username(account) {
|
username(account) {
|
||||||
|
|
@ -95,17 +82,9 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
openUser(account) {
|
openUser(account) {
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
)
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
handleStatusControl(event) {
|
handleStatusControl(event) {
|
||||||
switch (event.srcKey) {
|
switch (event.srcKey) {
|
||||||
|
|
@ -122,8 +101,8 @@ export default {
|
||||||
this.openUser(this.message.account)
|
this.openUser(this.message.account)
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,18 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div class="relationship" tabIndex="0" ref="status" @click="$emit('select')" role="article" aria-label="follow event">
|
||||||
class="relationship"
|
|
||||||
tabIndex="0"
|
|
||||||
v-shortkey="
|
|
||||||
shortcutEnabled
|
|
||||||
? { next: ['j'], prev: ['k'], right: ['l'], profile: ['p'] }
|
|
||||||
: {}
|
|
||||||
"
|
|
||||||
@shortkey="handleStatusControl"
|
|
||||||
ref="status"
|
|
||||||
@click="$emit('select')"
|
|
||||||
role="article"
|
|
||||||
aria-label="follow event"
|
|
||||||
>
|
|
||||||
<div class="follow-request">
|
<div class="follow-request">
|
||||||
<div class="action">
|
<div class="action">
|
||||||
<div class="action-mark">
|
<div class="action-mark">
|
||||||
|
|
@ -24,7 +11,7 @@
|
||||||
v-html="
|
v-html="
|
||||||
$t('notification.follow_request.body', {
|
$t('notification.follow_request.body', {
|
||||||
username: username(message.account),
|
username: username(message.account),
|
||||||
interpolation: { escapeValue: false },
|
interpolation: { escapeValue: false }
|
||||||
})
|
})
|
||||||
"
|
"
|
||||||
></bdi>
|
></bdi>
|
||||||
|
|
@ -47,26 +34,26 @@ import emojify from '~/src/renderer/utils/emojify'
|
||||||
export default {
|
export default {
|
||||||
name: 'follow-request',
|
name: 'follow-request',
|
||||||
components: {
|
components: {
|
||||||
FailoverImg,
|
FailoverImg
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
message: {
|
message: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: {},
|
default: {}
|
||||||
},
|
},
|
||||||
focused: {
|
focused: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
},
|
||||||
overlaid: {
|
overlaid: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
shortcutEnabled: function () {
|
shortcutEnabled: function () {
|
||||||
return this.focused && !this.overlaid
|
return this.focused && !this.overlaid
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
if (this.focused) {
|
if (this.focused) {
|
||||||
|
|
@ -84,7 +71,7 @@ export default {
|
||||||
this.$refs.status.blur()
|
this.$refs.status.blur()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
username(account) {
|
username(account) {
|
||||||
|
|
@ -95,17 +82,9 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
openUser(account) {
|
openUser(account) {
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
)
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
handleStatusControl(event) {
|
handleStatusControl(event) {
|
||||||
switch (event.srcKey) {
|
switch (event.srcKey) {
|
||||||
|
|
@ -122,8 +101,8 @@ export default {
|
||||||
this.openUser(this.message.account)
|
this.openUser(this.message.account)
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,25 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div class="status" tabIndex="0" ref="status" @click="$emit('select')" role="article" aria-label="poll expired">
|
||||||
class="status"
|
|
||||||
tabIndex="0"
|
|
||||||
v-shortkey="
|
|
||||||
shortcutEnabled
|
|
||||||
? {
|
|
||||||
next: ['j'],
|
|
||||||
prev: ['k'],
|
|
||||||
right: ['l'],
|
|
||||||
left: ['h'],
|
|
||||||
open: ['o'],
|
|
||||||
profile: ['p'],
|
|
||||||
}
|
|
||||||
: {}
|
|
||||||
"
|
|
||||||
@shortkey="handleStatusControl"
|
|
||||||
ref="status"
|
|
||||||
@click="$emit('select')"
|
|
||||||
role="article"
|
|
||||||
aria-label="poll expired"
|
|
||||||
>
|
|
||||||
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
||||||
<div v-show="!filtered(message)" class="poll-expired">
|
<div v-show="!filtered(message)" class="poll-expired">
|
||||||
<div class="action">
|
<div class="action">
|
||||||
|
|
@ -32,34 +12,25 @@
|
||||||
v-html="
|
v-html="
|
||||||
$t('notification.poll_expired.body', {
|
$t('notification.poll_expired.body', {
|
||||||
username: username(message.account),
|
username: username(message.account),
|
||||||
interpolation: { escapeValue: false },
|
interpolation: { escapeValue: false }
|
||||||
})
|
})
|
||||||
"
|
"
|
||||||
></bdi>
|
></bdi>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="action-icon" role="presentation">
|
<div class="action-icon" role="presentation">
|
||||||
<FailoverImg
|
<FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />
|
||||||
:src="message.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.account.username}`"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
<div class="target" v-on:dblclick="openDetail(message.status)">
|
<div class="target" v-on:dblclick="openDetail(message.status)">
|
||||||
<div class="icon" @click="openUser(message.status.account)">
|
<div class="icon" @click="openUser(message.status.account)">
|
||||||
<FailoverImg
|
<FailoverImg :src="message.status.account.avatar" :alt="`Avatar of ${message.status.account.username}`" role="presentation" />
|
||||||
:src="message.status.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.status.account.username}`"
|
|
||||||
role="presentation"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="detail">
|
<div class="detail">
|
||||||
<div class="toot-header">
|
<div class="toot-header">
|
||||||
<div class="user" @click="openUser(message.status.account)">
|
<div class="user" @click="openUser(message.status.account)">
|
||||||
<span class="display-name"
|
<span class="display-name"><bdi v-html="username(message.status.account)"></bdi></span>
|
||||||
><bdi v-html="username(message.status.account)"></bdi
|
|
||||||
></span>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="timestamp">
|
<div class="timestamp">
|
||||||
{{ parseDatetime(message.status.created_at) }}
|
{{ parseDatetime(message.status.created_at) }}
|
||||||
|
|
@ -79,14 +50,7 @@
|
||||||
>
|
>
|
||||||
{{ $t('cards.toot.show_more') }}
|
{{ $t('cards.toot.show_more') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button
|
<el-button v-else plain type="primary" size="medium" class="spoil-button" @click="showContent = false">
|
||||||
v-else
|
|
||||||
plain
|
|
||||||
type="primary"
|
|
||||||
size="medium"
|
|
||||||
class="spoil-button"
|
|
||||||
@click="showContent = false"
|
|
||||||
>
|
|
||||||
{{ $t('cards.toot.hide') }}
|
{{ $t('cards.toot.hide') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -99,9 +63,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="attachments">
|
<div class="attachments">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && !isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && !isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="show-sensitive"
|
class="show-sensitive"
|
||||||
type="info"
|
type="info"
|
||||||
@click="showAttachments = true"
|
@click="showAttachments = true"
|
||||||
|
|
@ -110,9 +72,7 @@
|
||||||
</el-button>
|
</el-button>
|
||||||
<div v-show="isShowAttachments(message.status)">
|
<div v-show="isShowAttachments(message.status)">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="hide-sensitive"
|
class="hide-sensitive"
|
||||||
type="text"
|
type="text"
|
||||||
@click="showAttachments = false"
|
@click="showAttachments = false"
|
||||||
|
|
@ -120,28 +80,10 @@
|
||||||
>
|
>
|
||||||
<font-awesome-icon icon="eye" class="hide" />
|
<font-awesome-icon icon="eye" class="hide" />
|
||||||
</el-button>
|
</el-button>
|
||||||
<div
|
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||||
class="media"
|
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||||
v-bind:key="media.preview_url"
|
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||||
v-for="media in mediaAttachments(message.status)"
|
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||||
>
|
|
||||||
<FailoverImg
|
|
||||||
:src="media.preview_url"
|
|
||||||
:title="media.description"
|
|
||||||
:readExif="true"
|
|
||||||
/>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-if="media.type == 'gifv'"
|
|
||||||
>GIF</el-tag
|
|
||||||
>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-else-if="media.type == 'video'"
|
|
||||||
>VIDEO</el-tag
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
|
|
@ -175,42 +117,42 @@ export default {
|
||||||
name: 'poll-expired',
|
name: 'poll-expired',
|
||||||
components: {
|
components: {
|
||||||
FailoverImg,
|
FailoverImg,
|
||||||
LinkPreview,
|
LinkPreview
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
message: {
|
message: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: {},
|
default: {}
|
||||||
},
|
},
|
||||||
filters: {
|
filters: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: [],
|
default: []
|
||||||
},
|
},
|
||||||
focused: {
|
focused: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
},
|
||||||
overlaid: {
|
overlaid: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
showContent: false,
|
showContent: false,
|
||||||
showAttachments: false,
|
showAttachments: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState('App', {
|
...mapState('App', {
|
||||||
displayNameStyle: (state) => state.displayNameStyle,
|
displayNameStyle: state => state.displayNameStyle,
|
||||||
timeFormat: (state) => state.timeFormat,
|
timeFormat: state => state.timeFormat,
|
||||||
language: (state) => state.language,
|
language: state => state.language,
|
||||||
hideAllAttachments: (state) => state.hideAllAttachments,
|
hideAllAttachments: state => state.hideAllAttachments
|
||||||
}),
|
}),
|
||||||
shortcutEnabled: function () {
|
shortcutEnabled: function () {
|
||||||
return this.focused && !this.overlaid
|
return this.focused && !this.overlaid
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
if (this.focused) {
|
if (this.focused) {
|
||||||
|
|
@ -228,7 +170,7 @@ export default {
|
||||||
this.$refs.status.blur()
|
this.$refs.status.blur()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
username(account) {
|
username(account) {
|
||||||
|
|
@ -256,31 +198,17 @@ export default {
|
||||||
}
|
}
|
||||||
const parsedAccount = findAccount(e.target, 'poll-expired')
|
const parsedAccount = findAccount(e.target, 'poll-expired')
|
||||||
if (parsedAccount !== null) {
|
if (parsedAccount !== null) {
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
this.$store
|
this.$store
|
||||||
.dispatch(
|
.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/searchAccount', parsedAccount)
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/searchAccount',
|
.then(account => {
|
||||||
parsedAccount
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
)
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
.then((account) => {
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
|
||||||
)
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch(err => {
|
||||||
console.error(err)
|
console.error(err)
|
||||||
this.openLink(e)
|
this.openLink(e)
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', false)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
false
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
return parsedAccount.acct
|
return parsedAccount.acct
|
||||||
}
|
}
|
||||||
|
|
@ -293,28 +221,14 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
openUser(account) {
|
openUser(account) {
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
)
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
openDetail(message) {
|
openDetail(message) {
|
||||||
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/TootDetail/changeToot', message)
|
||||||
'TimelineSpace/Contents/SideBar/TootDetail/changeToot',
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
message
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
mediaAttachments(message) {
|
mediaAttachments(message) {
|
||||||
return message.media_attachments
|
return message.media_attachments
|
||||||
|
|
@ -329,10 +243,7 @@ export default {
|
||||||
return !this.spoilered(message) || this.showContent
|
return !this.spoilered(message) || this.showContent
|
||||||
},
|
},
|
||||||
sensitive(message) {
|
sensitive(message) {
|
||||||
return (
|
return (this.hideAllAttachments || message.sensitive) && this.mediaAttachments(message).length > 0
|
||||||
(this.hideAllAttachments || message.sensitive) &&
|
|
||||||
this.mediaAttachments(message).length > 0
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
isShowAttachments(message) {
|
isShowAttachments(message) {
|
||||||
return !this.sensitive(message) || this.showAttachments
|
return !this.sensitive(message) || this.showAttachments
|
||||||
|
|
@ -364,8 +275,8 @@ export default {
|
||||||
this.openUser(this.message.account)
|
this.openUser(this.message.account)
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,25 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div class="status" tabIndex="0" ref="status" @click="$emit('select')" role="article" aria-label="poll vote">
|
||||||
class="status"
|
|
||||||
tabIndex="0"
|
|
||||||
v-shortkey="
|
|
||||||
shortcutEnabled
|
|
||||||
? {
|
|
||||||
next: ['j'],
|
|
||||||
prev: ['k'],
|
|
||||||
right: ['l'],
|
|
||||||
left: ['h'],
|
|
||||||
open: ['o'],
|
|
||||||
profile: ['p'],
|
|
||||||
}
|
|
||||||
: {}
|
|
||||||
"
|
|
||||||
@shortkey="handleStatusControl"
|
|
||||||
ref="status"
|
|
||||||
@click="$emit('select')"
|
|
||||||
role="article"
|
|
||||||
aria-label="poll vote"
|
|
||||||
>
|
|
||||||
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
||||||
<div v-show="!filtered(message)" class="poll-vote">
|
<div v-show="!filtered(message)" class="poll-vote">
|
||||||
<div class="action">
|
<div class="action">
|
||||||
|
|
@ -32,34 +12,25 @@
|
||||||
v-html="
|
v-html="
|
||||||
$t('notification.poll_vote.body', {
|
$t('notification.poll_vote.body', {
|
||||||
username: username(message.account),
|
username: username(message.account),
|
||||||
interpolation: { escapeValue: false },
|
interpolation: { escapeValue: false }
|
||||||
})
|
})
|
||||||
"
|
"
|
||||||
></bdi>
|
></bdi>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="action-icon" role="presentation">
|
<div class="action-icon" role="presentation">
|
||||||
<FailoverImg
|
<FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />
|
||||||
:src="message.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.account.username}`"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
<div class="target" v-on:dblclick="openDetail(message.status)">
|
<div class="target" v-on:dblclick="openDetail(message.status)">
|
||||||
<div class="icon" @click="openUser(message.status.account)">
|
<div class="icon" @click="openUser(message.status.account)">
|
||||||
<FailoverImg
|
<FailoverImg :src="message.status.account.avatar" :alt="`Avatar of ${message.status.account.username}`" role="presentation" />
|
||||||
:src="message.status.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.status.account.username}`"
|
|
||||||
role="presentation"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="detail">
|
<div class="detail">
|
||||||
<div class="toot-header">
|
<div class="toot-header">
|
||||||
<div class="user" @click="openUser(message.status.account)">
|
<div class="user" @click="openUser(message.status.account)">
|
||||||
<span class="display-name"
|
<span class="display-name"><bdi v-html="username(message.status.account)"></bdi></span>
|
||||||
><bdi v-html="username(message.status.account)"></bdi
|
|
||||||
></span>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="timestamp">
|
<div class="timestamp">
|
||||||
{{ parseDatetime(message.status.created_at) }}
|
{{ parseDatetime(message.status.created_at) }}
|
||||||
|
|
@ -79,14 +50,7 @@
|
||||||
>
|
>
|
||||||
{{ $t('cards.toot.show_more') }}
|
{{ $t('cards.toot.show_more') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button
|
<el-button v-else plain type="primary" size="medium" class="spoil-button" @click="showContent = false">
|
||||||
v-else
|
|
||||||
plain
|
|
||||||
type="primary"
|
|
||||||
size="medium"
|
|
||||||
class="spoil-button"
|
|
||||||
@click="showContent = false"
|
|
||||||
>
|
|
||||||
{{ $t('cards.toot.hide') }}
|
{{ $t('cards.toot.hide') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -99,9 +63,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="attachments">
|
<div class="attachments">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && !isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && !isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="show-sensitive"
|
class="show-sensitive"
|
||||||
type="info"
|
type="info"
|
||||||
@click="showAttachments = true"
|
@click="showAttachments = true"
|
||||||
|
|
@ -110,9 +72,7 @@
|
||||||
</el-button>
|
</el-button>
|
||||||
<div v-show="isShowAttachments(message.status)">
|
<div v-show="isShowAttachments(message.status)">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="hide-sensitive"
|
class="hide-sensitive"
|
||||||
type="text"
|
type="text"
|
||||||
@click="showAttachments = false"
|
@click="showAttachments = false"
|
||||||
|
|
@ -120,28 +80,10 @@
|
||||||
>
|
>
|
||||||
<font-awesome-icon icon="eye" class="hide" />
|
<font-awesome-icon icon="eye" class="hide" />
|
||||||
</el-button>
|
</el-button>
|
||||||
<div
|
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||||
class="media"
|
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||||
v-bind:key="media.preview_url"
|
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||||
v-for="media in mediaAttachments(message.status)"
|
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||||
>
|
|
||||||
<FailoverImg
|
|
||||||
:src="media.preview_url"
|
|
||||||
:title="media.description"
|
|
||||||
:readExif="true"
|
|
||||||
/>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-if="media.type == 'gifv'"
|
|
||||||
>GIF</el-tag
|
|
||||||
>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-else-if="media.type == 'video'"
|
|
||||||
>VIDEO</el-tag
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
|
|
@ -175,42 +117,42 @@ export default {
|
||||||
name: 'poll-vote',
|
name: 'poll-vote',
|
||||||
components: {
|
components: {
|
||||||
FailoverImg,
|
FailoverImg,
|
||||||
LinkPreview,
|
LinkPreview
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
message: {
|
message: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: {},
|
default: {}
|
||||||
},
|
},
|
||||||
filters: {
|
filters: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: [],
|
default: []
|
||||||
},
|
},
|
||||||
focused: {
|
focused: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
},
|
||||||
overlaid: {
|
overlaid: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
showContent: false,
|
showContent: false,
|
||||||
showAttachments: false,
|
showAttachments: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState('App', {
|
...mapState('App', {
|
||||||
displayNameStyle: (state) => state.displayNameStyle,
|
displayNameStyle: state => state.displayNameStyle,
|
||||||
timeFormat: (state) => state.timeFormat,
|
timeFormat: state => state.timeFormat,
|
||||||
language: (state) => state.language,
|
language: state => state.language,
|
||||||
hideAllAttachments: (state) => state.hideAllAttachments,
|
hideAllAttachments: state => state.hideAllAttachments
|
||||||
}),
|
}),
|
||||||
shortcutEnabled: function () {
|
shortcutEnabled: function () {
|
||||||
return this.focused && !this.overlaid
|
return this.focused && !this.overlaid
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
if (this.focused) {
|
if (this.focused) {
|
||||||
|
|
@ -228,7 +170,7 @@ export default {
|
||||||
this.$refs.status.blur()
|
this.$refs.status.blur()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
username(account) {
|
username(account) {
|
||||||
|
|
@ -256,31 +198,17 @@ export default {
|
||||||
}
|
}
|
||||||
const parsedAccount = findAccount(e.target, 'poll-vote')
|
const parsedAccount = findAccount(e.target, 'poll-vote')
|
||||||
if (parsedAccount !== null) {
|
if (parsedAccount !== null) {
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
this.$store
|
this.$store
|
||||||
.dispatch(
|
.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/searchAccount', parsedAccount)
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/searchAccount',
|
.then(account => {
|
||||||
parsedAccount
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
)
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
.then((account) => {
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
|
||||||
)
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch(err => {
|
||||||
console.error(err)
|
console.error(err)
|
||||||
this.openLink(e)
|
this.openLink(e)
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', false)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
false
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
return parsedAccount.acct
|
return parsedAccount.acct
|
||||||
}
|
}
|
||||||
|
|
@ -293,28 +221,14 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
openUser(account) {
|
openUser(account) {
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
)
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
openDetail(message) {
|
openDetail(message) {
|
||||||
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/TootDetail/changeToot', message)
|
||||||
'TimelineSpace/Contents/SideBar/TootDetail/changeToot',
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
message
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
mediaAttachments(message) {
|
mediaAttachments(message) {
|
||||||
return message.media_attachments
|
return message.media_attachments
|
||||||
|
|
@ -329,10 +243,7 @@ export default {
|
||||||
return !this.spoilered(message) || this.showContent
|
return !this.spoilered(message) || this.showContent
|
||||||
},
|
},
|
||||||
sensitive(message) {
|
sensitive(message) {
|
||||||
return (
|
return (this.hideAllAttachments || message.sensitive) && this.mediaAttachments(message).length > 0
|
||||||
(this.hideAllAttachments || message.sensitive) &&
|
|
||||||
this.mediaAttachments(message).length > 0
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
isShowAttachments(message) {
|
isShowAttachments(message) {
|
||||||
return !this.sensitive(message) || this.showAttachments
|
return !this.sensitive(message) || this.showAttachments
|
||||||
|
|
@ -364,8 +275,8 @@ export default {
|
||||||
this.openUser(this.message.account)
|
this.openUser(this.message.account)
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,25 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div class="status" tabIndex="0" ref="status" @click="$emit('select')" role="article" aria-label="quoted toot">
|
||||||
class="status"
|
|
||||||
tabIndex="0"
|
|
||||||
v-shortkey="
|
|
||||||
shortcutEnabled
|
|
||||||
? {
|
|
||||||
next: ['j'],
|
|
||||||
prev: ['k'],
|
|
||||||
right: ['l'],
|
|
||||||
left: ['h'],
|
|
||||||
open: ['o'],
|
|
||||||
profile: ['p'],
|
|
||||||
}
|
|
||||||
: {}
|
|
||||||
"
|
|
||||||
@shortkey="handleStatusControl"
|
|
||||||
ref="status"
|
|
||||||
@click="$emit('select')"
|
|
||||||
role="article"
|
|
||||||
aria-label="quoted toot"
|
|
||||||
>
|
|
||||||
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
||||||
<div v-show="!filtered(message)" class="quoted">
|
<div v-show="!filtered(message)" class="quoted">
|
||||||
<div class="action">
|
<div class="action">
|
||||||
|
|
@ -32,30 +12,20 @@
|
||||||
v-html="
|
v-html="
|
||||||
$t('notification.quote.body', {
|
$t('notification.quote.body', {
|
||||||
username: username(message.account),
|
username: username(message.account),
|
||||||
interpolation: { escapeValue: false },
|
interpolation: { escapeValue: false }
|
||||||
})
|
})
|
||||||
"
|
"
|
||||||
></bdi>
|
></bdi>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="action-icon" role="presentation">
|
<div class="action-icon" role="presentation">
|
||||||
<FailoverImg
|
<FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />
|
||||||
:src="message.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.account.username}`"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
<div class="target" v-on:dblclick="openDetail(message.status)">
|
<div class="target" v-on:dblclick="openDetail(message.status)">
|
||||||
<div
|
<div class="icon" @click="openUser(message.status.account)" role="presentation">
|
||||||
class="icon"
|
<FailoverImg :src="message.status.account.avatar" :alt="`Avatar of ${message.status.account.username}`" />
|
||||||
@click="openUser(message.status.account)"
|
|
||||||
role="presentation"
|
|
||||||
>
|
|
||||||
<FailoverImg
|
|
||||||
:src="message.status.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.status.account.username}`"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="detail">
|
<div class="detail">
|
||||||
<div class="toot-header">
|
<div class="toot-header">
|
||||||
|
|
@ -71,11 +41,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="content-wrapper">
|
<div class="content-wrapper">
|
||||||
<div class="spoiler" v-show="spoilered(message.status)">
|
<div class="spoiler" v-show="spoilered(message.status)">
|
||||||
<span
|
<span v-html="emojiText(message.status.spoiler_text, message.status.emojis)"></span>
|
||||||
v-html="
|
|
||||||
emojiText(message.status.spoiler_text, message.status.emojis)
|
|
||||||
"
|
|
||||||
></span>
|
|
||||||
<el-button
|
<el-button
|
||||||
v-if="!isShowContent(message.status)"
|
v-if="!isShowContent(message.status)"
|
||||||
plain
|
plain
|
||||||
|
|
@ -86,14 +52,7 @@
|
||||||
>
|
>
|
||||||
{{ $t('cards.toot.show_more') }}
|
{{ $t('cards.toot.show_more') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button
|
<el-button v-else plain type="primary" size="medium" class="spoil-button" @click="showContent = false">
|
||||||
v-else
|
|
||||||
plain
|
|
||||||
type="primary"
|
|
||||||
size="medium"
|
|
||||||
class="spoil-button"
|
|
||||||
@click="showContent = false"
|
|
||||||
>
|
|
||||||
{{ $t('cards.toot.hide') }}
|
{{ $t('cards.toot.hide') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -106,9 +65,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="attachments">
|
<div class="attachments">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && !isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && !isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="show-sensitive"
|
class="show-sensitive"
|
||||||
type="info"
|
type="info"
|
||||||
@click="showAttachments = true"
|
@click="showAttachments = true"
|
||||||
|
|
@ -117,9 +74,7 @@
|
||||||
</el-button>
|
</el-button>
|
||||||
<div v-show="isShowAttachments(message.status)">
|
<div v-show="isShowAttachments(message.status)">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="hide-sensitive"
|
class="hide-sensitive"
|
||||||
type="text"
|
type="text"
|
||||||
@click="showAttachments = false"
|
@click="showAttachments = false"
|
||||||
|
|
@ -127,28 +82,10 @@
|
||||||
>
|
>
|
||||||
<font-awesome-icon icon="eye" class="hide" />
|
<font-awesome-icon icon="eye" class="hide" />
|
||||||
</el-button>
|
</el-button>
|
||||||
<div
|
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||||
class="media"
|
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||||
v-bind:key="media.preview_url"
|
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||||
v-for="media in mediaAttachments(message.status)"
|
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||||
>
|
|
||||||
<FailoverImg
|
|
||||||
:src="media.preview_url"
|
|
||||||
:title="media.description"
|
|
||||||
:readExif="true"
|
|
||||||
/>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-if="media.type == 'gifv'"
|
|
||||||
>GIF</el-tag
|
|
||||||
>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-else-if="media.type == 'video'"
|
|
||||||
>VIDEO</el-tag
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
|
|
@ -158,12 +95,7 @@
|
||||||
:icon="message.status.reblog.account.avatar"
|
:icon="message.status.reblog.account.avatar"
|
||||||
:username="username(message.status.reblog.account)"
|
:username="username(message.status.reblog.account)"
|
||||||
:accountName="''"
|
:accountName="''"
|
||||||
:body="
|
:body="emojiText(message.status.reblog.content, message.status.reblog.emojis)"
|
||||||
emojiText(
|
|
||||||
message.status.reblog.content,
|
|
||||||
message.status.reblog.emojis
|
|
||||||
)
|
|
||||||
"
|
|
||||||
@select="openDetail(message.status.reblog)"
|
@select="openDetail(message.status.reblog)"
|
||||||
/>
|
/>
|
||||||
<LinkPreview
|
<LinkPreview
|
||||||
|
|
@ -197,41 +129,41 @@ export default {
|
||||||
components: {
|
components: {
|
||||||
FailoverImg,
|
FailoverImg,
|
||||||
LinkPreview,
|
LinkPreview,
|
||||||
Quote,
|
Quote
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
message: {
|
message: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: {},
|
default: {}
|
||||||
},
|
},
|
||||||
filters: {
|
filters: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: [],
|
default: []
|
||||||
},
|
},
|
||||||
focused: {
|
focused: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
},
|
||||||
overlaid: {
|
overlaid: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
showContent: false,
|
showContent: false,
|
||||||
showAttachments: false,
|
showAttachments: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState('App', {
|
...mapState('App', {
|
||||||
timeFormat: (state) => state.timeFormat,
|
timeFormat: state => state.timeFormat,
|
||||||
language: (state) => state.language,
|
language: state => state.language,
|
||||||
hideAllAttachments: (state) => state.hideAllAttachments,
|
hideAllAttachments: state => state.hideAllAttachments
|
||||||
}),
|
}),
|
||||||
shortcutEnabled: function () {
|
shortcutEnabled: function () {
|
||||||
return this.focused && !this.overlaid
|
return this.focused && !this.overlaid
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
if (this.focused) {
|
if (this.focused) {
|
||||||
|
|
@ -249,7 +181,7 @@ export default {
|
||||||
this.$refs.status.blur()
|
this.$refs.status.blur()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
username(account) {
|
username(account) {
|
||||||
|
|
@ -277,30 +209,16 @@ export default {
|
||||||
}
|
}
|
||||||
const parsedAccount = findAccount(e.target, 'quoted')
|
const parsedAccount = findAccount(e.target, 'quoted')
|
||||||
if (parsedAccount !== null) {
|
if (parsedAccount !== null) {
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
this.$store
|
this.$store
|
||||||
.dispatch(
|
.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/searchAccount', parsedAccount)
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/searchAccount',
|
.then(account => {
|
||||||
parsedAccount
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
)
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
.then((account) => {
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
|
||||||
)
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
this.openLink(e)
|
this.openLink(e)
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', false)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
false
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
return parsedAccount
|
return parsedAccount
|
||||||
}
|
}
|
||||||
|
|
@ -313,28 +231,14 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
openUser(account) {
|
openUser(account) {
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
)
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
openDetail(message) {
|
openDetail(message) {
|
||||||
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/TootDetail/changeToot', message)
|
||||||
'TimelineSpace/Contents/SideBar/TootDetail/changeToot',
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
message
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
mediaAttachments(message) {
|
mediaAttachments(message) {
|
||||||
return message.media_attachments
|
return message.media_attachments
|
||||||
|
|
@ -349,10 +253,7 @@ export default {
|
||||||
return !this.spoilered(message) || this.showContent
|
return !this.spoilered(message) || this.showContent
|
||||||
},
|
},
|
||||||
sensitive(message) {
|
sensitive(message) {
|
||||||
return (
|
return (this.hideAllAttachments || message.sensitive) && this.mediaAttachments(message).length > 0
|
||||||
(this.hideAllAttachments || message.sensitive) &&
|
|
||||||
this.mediaAttachments(message).length > 0
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
isShowAttachments(message) {
|
isShowAttachments(message) {
|
||||||
return !this.sensitive(message) || this.showAttachments
|
return !this.sensitive(message) || this.showAttachments
|
||||||
|
|
@ -381,8 +282,8 @@ export default {
|
||||||
this.openUser(this.message.account)
|
this.openUser(this.message.account)
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,25 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div class="status" tabIndex="0" ref="status" @click="$emit('select')" role="article" aria-label="reacted toot">
|
||||||
class="status"
|
|
||||||
tabIndex="0"
|
|
||||||
v-shortkey="
|
|
||||||
shortcutEnabled
|
|
||||||
? {
|
|
||||||
next: ['j'],
|
|
||||||
prev: ['k'],
|
|
||||||
right: ['l'],
|
|
||||||
left: ['h'],
|
|
||||||
open: ['o'],
|
|
||||||
profile: ['p'],
|
|
||||||
}
|
|
||||||
: {}
|
|
||||||
"
|
|
||||||
@shortkey="handleStatusControl"
|
|
||||||
ref="status"
|
|
||||||
@click="$emit('select')"
|
|
||||||
role="article"
|
|
||||||
aria-label="reacted toot"
|
|
||||||
>
|
|
||||||
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
||||||
<div v-show="!filtered(message)" class="favourite">
|
<div v-show="!filtered(message)" class="favourite">
|
||||||
<div class="action">
|
<div class="action">
|
||||||
|
|
@ -32,34 +12,25 @@
|
||||||
v-html="
|
v-html="
|
||||||
$t('notification.reaction.body', {
|
$t('notification.reaction.body', {
|
||||||
username: username(message.account),
|
username: username(message.account),
|
||||||
interpolation: { escapeValue: false },
|
interpolation: { escapeValue: false }
|
||||||
})
|
})
|
||||||
"
|
"
|
||||||
></bdi>
|
></bdi>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="action-icon" role="presentation">
|
<div class="action-icon" role="presentation">
|
||||||
<FailoverImg
|
<FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />
|
||||||
:src="message.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.account.username}`"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
<div class="target" v-on:dblclick="openDetail(message.status)">
|
<div class="target" v-on:dblclick="openDetail(message.status)">
|
||||||
<div class="icon" @click="openUser(message.status.account)">
|
<div class="icon" @click="openUser(message.status.account)">
|
||||||
<FailoverImg
|
<FailoverImg :src="message.status.account.avatar" :alt="`Avatar of ${message.status.account.username}`" role="presentation" />
|
||||||
:src="message.status.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.status.account.username}`"
|
|
||||||
role="presentation"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="detail">
|
<div class="detail">
|
||||||
<div class="toot-header">
|
<div class="toot-header">
|
||||||
<div class="user" @click="openUser(message.status.account)">
|
<div class="user" @click="openUser(message.status.account)">
|
||||||
<span class="display-name"
|
<span class="display-name"><bdi v-html="username(message.status.account)"></bdi></span>
|
||||||
><bdi v-html="username(message.status.account)"></bdi
|
|
||||||
></span>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="timestamp">
|
<div class="timestamp">
|
||||||
{{ parseDatetime(message.status.created_at) }}
|
{{ parseDatetime(message.status.created_at) }}
|
||||||
|
|
@ -79,14 +50,7 @@
|
||||||
>
|
>
|
||||||
{{ $t('cards.toot.show_more') }}
|
{{ $t('cards.toot.show_more') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button
|
<el-button v-else plain type="primary" size="medium" class="spoil-button" @click="showContent = false">
|
||||||
v-else
|
|
||||||
plain
|
|
||||||
type="primary"
|
|
||||||
size="medium"
|
|
||||||
class="spoil-button"
|
|
||||||
@click="showContent = false"
|
|
||||||
>
|
|
||||||
{{ $t('cards.toot.hide') }}
|
{{ $t('cards.toot.hide') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -99,9 +63,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="attachments">
|
<div class="attachments">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && !isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && !isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="show-sensitive"
|
class="show-sensitive"
|
||||||
type="info"
|
type="info"
|
||||||
@click="showAttachments = true"
|
@click="showAttachments = true"
|
||||||
|
|
@ -110,9 +72,7 @@
|
||||||
</el-button>
|
</el-button>
|
||||||
<div v-show="isShowAttachments(message.status)">
|
<div v-show="isShowAttachments(message.status)">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="hide-sensitive"
|
class="hide-sensitive"
|
||||||
type="text"
|
type="text"
|
||||||
@click="showAttachments = false"
|
@click="showAttachments = false"
|
||||||
|
|
@ -120,28 +80,10 @@
|
||||||
>
|
>
|
||||||
<font-awesome-icon icon="eye" class="hide" />
|
<font-awesome-icon icon="eye" class="hide" />
|
||||||
</el-button>
|
</el-button>
|
||||||
<div
|
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||||
class="media"
|
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||||
v-bind:key="media.preview_url"
|
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||||
v-for="media in mediaAttachments(message.status)"
|
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||||
>
|
|
||||||
<FailoverImg
|
|
||||||
:src="media.preview_url"
|
|
||||||
:title="media.description"
|
|
||||||
:readExif="true"
|
|
||||||
/>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-if="media.type == 'gifv'"
|
|
||||||
>GIF</el-tag
|
|
||||||
>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-else-if="media.type == 'video'"
|
|
||||||
>VIDEO</el-tag
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
|
|
@ -175,42 +117,42 @@ export default {
|
||||||
name: 'reaction',
|
name: 'reaction',
|
||||||
components: {
|
components: {
|
||||||
FailoverImg,
|
FailoverImg,
|
||||||
LinkPreview,
|
LinkPreview
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
message: {
|
message: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: {},
|
default: {}
|
||||||
},
|
},
|
||||||
filters: {
|
filters: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: [],
|
default: []
|
||||||
},
|
},
|
||||||
focused: {
|
focused: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
},
|
||||||
overlaid: {
|
overlaid: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
showContent: false,
|
showContent: false,
|
||||||
showAttachments: false,
|
showAttachments: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState('App', {
|
...mapState('App', {
|
||||||
displayNameStyle: (state) => state.displayNameStyle,
|
displayNameStyle: state => state.displayNameStyle,
|
||||||
timeFormat: (state) => state.timeFormat,
|
timeFormat: state => state.timeFormat,
|
||||||
language: (state) => state.language,
|
language: state => state.language,
|
||||||
hideAllAttachments: (state) => state.hideAllAttachments,
|
hideAllAttachments: state => state.hideAllAttachments
|
||||||
}),
|
}),
|
||||||
shortcutEnabled: function () {
|
shortcutEnabled: function () {
|
||||||
return this.focused && !this.overlaid
|
return this.focused && !this.overlaid
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
if (this.focused) {
|
if (this.focused) {
|
||||||
|
|
@ -228,7 +170,7 @@ export default {
|
||||||
this.$refs.status.blur()
|
this.$refs.status.blur()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
username(account) {
|
username(account) {
|
||||||
|
|
@ -256,31 +198,17 @@ export default {
|
||||||
}
|
}
|
||||||
const parsedAccount = findAccount(e.target, 'favourite')
|
const parsedAccount = findAccount(e.target, 'favourite')
|
||||||
if (parsedAccount !== null) {
|
if (parsedAccount !== null) {
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
this.$store
|
this.$store
|
||||||
.dispatch(
|
.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/searchAccount', parsedAccount)
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/searchAccount',
|
.then(account => {
|
||||||
parsedAccount
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
)
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
.then((account) => {
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
|
||||||
)
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch(err => {
|
||||||
console.error(err)
|
console.error(err)
|
||||||
this.openLink(e)
|
this.openLink(e)
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', false)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
false
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
return parsedAccount.acct
|
return parsedAccount.acct
|
||||||
}
|
}
|
||||||
|
|
@ -293,28 +221,14 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
openUser(account) {
|
openUser(account) {
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
)
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
openDetail(message) {
|
openDetail(message) {
|
||||||
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/TootDetail/changeToot', message)
|
||||||
'TimelineSpace/Contents/SideBar/TootDetail/changeToot',
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
message
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
mediaAttachments(message) {
|
mediaAttachments(message) {
|
||||||
return message.media_attachments
|
return message.media_attachments
|
||||||
|
|
@ -329,10 +243,7 @@ export default {
|
||||||
return !this.spoilered(message) || this.showContent
|
return !this.spoilered(message) || this.showContent
|
||||||
},
|
},
|
||||||
sensitive(message) {
|
sensitive(message) {
|
||||||
return (
|
return (this.hideAllAttachments || message.sensitive) && this.mediaAttachments(message).length > 0
|
||||||
(this.hideAllAttachments || message.sensitive) &&
|
|
||||||
this.mediaAttachments(message).length > 0
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
isShowAttachments(message) {
|
isShowAttachments(message) {
|
||||||
return !this.sensitive(message) || this.showAttachments
|
return !this.sensitive(message) || this.showAttachments
|
||||||
|
|
@ -364,8 +275,8 @@ export default {
|
||||||
this.openUser(this.message.account)
|
this.openUser(this.message.account)
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,25 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div class="status" tabIndex="0" ref="status" @click="$emit('select')" role="article" aria-label="reblogged toot">
|
||||||
class="status"
|
|
||||||
tabIndex="0"
|
|
||||||
v-shortkey="
|
|
||||||
shortcutEnabled
|
|
||||||
? {
|
|
||||||
next: ['j'],
|
|
||||||
prev: ['k'],
|
|
||||||
right: ['l'],
|
|
||||||
left: ['h'],
|
|
||||||
open: ['o'],
|
|
||||||
profile: ['p'],
|
|
||||||
}
|
|
||||||
: {}
|
|
||||||
"
|
|
||||||
@shortkey="handleStatusControl"
|
|
||||||
ref="status"
|
|
||||||
@click="$emit('select')"
|
|
||||||
role="article"
|
|
||||||
aria-label="reblogged toot"
|
|
||||||
>
|
|
||||||
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
<div v-show="filtered(message)" class="filtered">Filtered</div>
|
||||||
<div v-show="!filtered(message)" class="reblog">
|
<div v-show="!filtered(message)" class="reblog">
|
||||||
<div class="action">
|
<div class="action">
|
||||||
|
|
@ -32,30 +12,20 @@
|
||||||
v-html="
|
v-html="
|
||||||
$t('notification.reblog.body', {
|
$t('notification.reblog.body', {
|
||||||
username: username(message.account),
|
username: username(message.account),
|
||||||
interpolation: { escapeValue: false },
|
interpolation: { escapeValue: false }
|
||||||
})
|
})
|
||||||
"
|
"
|
||||||
></bdi>
|
></bdi>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="action-icon" role="presentation">
|
<div class="action-icon" role="presentation">
|
||||||
<FailoverImg
|
<FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />
|
||||||
:src="message.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.account.username}`"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
<div class="target" v-on:dblclick="openDetail(message.status)">
|
<div class="target" v-on:dblclick="openDetail(message.status)">
|
||||||
<div
|
<div class="icon" @click="openUser(message.status.account)" role="presentation">
|
||||||
class="icon"
|
<FailoverImg :src="message.status.account.avatar" :alt="`Avatar of ${message.status.account.username}`" />
|
||||||
@click="openUser(message.status.account)"
|
|
||||||
role="presentation"
|
|
||||||
>
|
|
||||||
<FailoverImg
|
|
||||||
:src="message.status.account.avatar"
|
|
||||||
:alt="`Avatar of ${message.status.account.username}`"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="detail">
|
<div class="detail">
|
||||||
<div class="toot-header">
|
<div class="toot-header">
|
||||||
|
|
@ -82,14 +52,7 @@
|
||||||
>
|
>
|
||||||
{{ $t('cards.toot.show_more') }}
|
{{ $t('cards.toot.show_more') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button
|
<el-button v-else plain type="primary" size="medium" class="spoil-button" @click="showContent = false">
|
||||||
v-else
|
|
||||||
plain
|
|
||||||
type="primary"
|
|
||||||
size="medium"
|
|
||||||
class="spoil-button"
|
|
||||||
@click="showContent = false"
|
|
||||||
>
|
|
||||||
{{ $t('cards.toot.hide') }}
|
{{ $t('cards.toot.hide') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -102,9 +65,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="attachments">
|
<div class="attachments">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && !isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && !isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="show-sensitive"
|
class="show-sensitive"
|
||||||
type="info"
|
type="info"
|
||||||
@click="showAttachments = true"
|
@click="showAttachments = true"
|
||||||
|
|
@ -113,9 +74,7 @@
|
||||||
</el-button>
|
</el-button>
|
||||||
<div v-show="isShowAttachments(message.status)">
|
<div v-show="isShowAttachments(message.status)">
|
||||||
<el-button
|
<el-button
|
||||||
v-show="
|
v-show="sensitive(message.status) && isShowAttachments(message.status)"
|
||||||
sensitive(message.status) && isShowAttachments(message.status)
|
|
||||||
"
|
|
||||||
class="hide-sensitive"
|
class="hide-sensitive"
|
||||||
type="text"
|
type="text"
|
||||||
@click="showAttachments = false"
|
@click="showAttachments = false"
|
||||||
|
|
@ -123,28 +82,10 @@
|
||||||
>
|
>
|
||||||
<font-awesome-icon icon="eye" class="hide" />
|
<font-awesome-icon icon="eye" class="hide" />
|
||||||
</el-button>
|
</el-button>
|
||||||
<div
|
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||||
class="media"
|
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||||
v-bind:key="media.preview_url"
|
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||||
v-for="media in mediaAttachments(message.status)"
|
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||||
>
|
|
||||||
<FailoverImg
|
|
||||||
:src="media.preview_url"
|
|
||||||
:title="media.description"
|
|
||||||
:readExif="true"
|
|
||||||
/>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-if="media.type == 'gifv'"
|
|
||||||
>GIF</el-tag
|
|
||||||
>
|
|
||||||
<el-tag
|
|
||||||
class="media-label"
|
|
||||||
size="mini"
|
|
||||||
v-else-if="media.type == 'video'"
|
|
||||||
>VIDEO</el-tag
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
|
|
@ -178,41 +119,41 @@ export default {
|
||||||
name: 'reblog',
|
name: 'reblog',
|
||||||
components: {
|
components: {
|
||||||
FailoverImg,
|
FailoverImg,
|
||||||
LinkPreview,
|
LinkPreview
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
message: {
|
message: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: {},
|
default: {}
|
||||||
},
|
},
|
||||||
filters: {
|
filters: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: [],
|
default: []
|
||||||
},
|
},
|
||||||
focused: {
|
focused: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
},
|
||||||
overlaid: {
|
overlaid: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
showContent: false,
|
showContent: false,
|
||||||
showAttachments: false,
|
showAttachments: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState('App', {
|
...mapState('App', {
|
||||||
timeFormat: (state) => state.timeFormat,
|
timeFormat: state => state.timeFormat,
|
||||||
language: (state) => state.language,
|
language: state => state.language,
|
||||||
hideAllAttachments: (state) => state.hideAllAttachments,
|
hideAllAttachments: state => state.hideAllAttachments
|
||||||
}),
|
}),
|
||||||
shortcutEnabled: function () {
|
shortcutEnabled: function () {
|
||||||
return this.focused && !this.overlaid
|
return this.focused && !this.overlaid
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
if (this.focused) {
|
if (this.focused) {
|
||||||
|
|
@ -230,7 +171,7 @@ export default {
|
||||||
this.$refs.status.blur()
|
this.$refs.status.blur()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
username(account) {
|
username(account) {
|
||||||
|
|
@ -258,30 +199,16 @@ export default {
|
||||||
}
|
}
|
||||||
const parsedAccount = findAccount(e.target, 'reblog')
|
const parsedAccount = findAccount(e.target, 'reblog')
|
||||||
if (parsedAccount !== null) {
|
if (parsedAccount !== null) {
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
this.$store
|
this.$store
|
||||||
.dispatch(
|
.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/searchAccount', parsedAccount)
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/searchAccount',
|
.then(account => {
|
||||||
parsedAccount
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
)
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
.then((account) => {
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
|
||||||
)
|
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
this.openLink(e)
|
this.openLink(e)
|
||||||
this.$store.commit(
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', false)
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
false
|
|
||||||
)
|
|
||||||
})
|
})
|
||||||
return parsedAccount
|
return parsedAccount
|
||||||
}
|
}
|
||||||
|
|
@ -294,28 +221,14 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
openUser(account) {
|
openUser(account) {
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||||
)
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
this.$store.dispatch(
|
|
||||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
|
||||||
account
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
openDetail(message) {
|
openDetail(message) {
|
||||||
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
|
||||||
this.$store.dispatch(
|
this.$store.dispatch('TimelineSpace/Contents/SideBar/TootDetail/changeToot', message)
|
||||||
'TimelineSpace/Contents/SideBar/TootDetail/changeToot',
|
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||||
message
|
|
||||||
)
|
|
||||||
this.$store.commit(
|
|
||||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
|
||||||
true
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
mediaAttachments(message) {
|
mediaAttachments(message) {
|
||||||
return message.media_attachments
|
return message.media_attachments
|
||||||
|
|
@ -330,10 +243,7 @@ export default {
|
||||||
return !this.spoilered(message) || this.showContent
|
return !this.spoilered(message) || this.showContent
|
||||||
},
|
},
|
||||||
sensitive(message) {
|
sensitive(message) {
|
||||||
return (
|
return (this.hideAllAttachments || message.sensitive) && this.mediaAttachments(message).length > 0
|
||||||
(this.hideAllAttachments || message.sensitive) &&
|
|
||||||
this.mediaAttachments(message).length > 0
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
isShowAttachments(message) {
|
isShowAttachments(message) {
|
||||||
return !this.sensitive(message) || this.showAttachments
|
return !this.sensitive(message) || this.showAttachments
|
||||||
|
|
@ -365,8 +275,8 @@ export default {
|
||||||
this.openUser(this.message.account)
|
this.openUser(this.message.account)
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -70,8 +70,8 @@ import { sync } from 'vuex-router-sync'
|
||||||
import { createI18n } from 'vue-i18n'
|
import { createI18n } from 'vue-i18n'
|
||||||
import 'vue-resize/dist/vue-resize.css'
|
import 'vue-resize/dist/vue-resize.css'
|
||||||
import VueResize from 'vue-resize'
|
import VueResize from 'vue-resize'
|
||||||
import VueVirtualScroller from 'vue-virtual-scroller'
|
import VueVirtualScroller from '@h3poteto/vue-virtual-scroller'
|
||||||
import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
|
import '@h3poteto/vue-virtual-scroller/dist/vue-virtual-scroller.css'
|
||||||
|
|
||||||
import './assets/fonts/fonts.css'
|
import './assets/fonts/fonts.css'
|
||||||
import App from './App.vue'
|
import App from './App.vue'
|
||||||
|
|
|
||||||
36
yarn.lock
36
yarn.lock
|
|
@ -1143,6 +1143,15 @@
|
||||||
resolved "https://registry.yarnpkg.com/@gar/promisify/-/promisify-1.1.2.tgz#30aa825f11d438671d585bd44e7fd564535fc210"
|
resolved "https://registry.yarnpkg.com/@gar/promisify/-/promisify-1.1.2.tgz#30aa825f11d438671d585bd44e7fd564535fc210"
|
||||||
integrity sha512-82cpyJyKRoQoRi+14ibCeGPu0CwypgtBAdBhq1WfvagpCZNKqwXbKwXllYSMG91DhmG4jt9gN8eP6lGOtozuaw==
|
integrity sha512-82cpyJyKRoQoRi+14ibCeGPu0CwypgtBAdBhq1WfvagpCZNKqwXbKwXllYSMG91DhmG4jt9gN8eP6lGOtozuaw==
|
||||||
|
|
||||||
|
"@h3poteto/vue-virtual-scroller@2.0.0-alpha.1":
|
||||||
|
version "2.0.0-alpha.1"
|
||||||
|
resolved "https://npm.pkg.github.com/download/@h3poteto/vue-virtual-scroller/2.0.0-alpha.1/202991053ed05fd7f919ac4451e35a6e8a8f2d5297f042c3f2a7c5de34b05288#793c1b17f3515cd29dc267e67d1a61a90aeec9f1"
|
||||||
|
integrity sha512-gfSCGPGAEBuk6znAsFb/0vj6FiCbvEPXhipAojWECyFPtnFF3XH36So37CfHT7i7+96Mq+e1GfV8HfO6SQaaVg==
|
||||||
|
dependencies:
|
||||||
|
mitt "^2.1.0"
|
||||||
|
vue-observe-visibility "^2.0.0-alpha.1"
|
||||||
|
vue-resize "^2.0.0-alpha.1"
|
||||||
|
|
||||||
"@humanwhocodes/config-array@^0.5.0":
|
"@humanwhocodes/config-array@^0.5.0":
|
||||||
version "0.5.0"
|
version "0.5.0"
|
||||||
resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.5.0.tgz#1407967d4c6eecd7388f83acf1eaf4d0c6e58ef9"
|
resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.5.0.tgz#1407967d4c6eecd7388f83acf1eaf4d0c6e58ef9"
|
||||||
|
|
@ -4391,11 +4400,6 @@ csstype@^2.6.8:
|
||||||
resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.20.tgz#9229c65ea0b260cf4d3d997cb06288e36a8d6dda"
|
resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.20.tgz#9229c65ea0b260cf4d3d997cb06288e36a8d6dda"
|
||||||
integrity sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==
|
integrity sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==
|
||||||
|
|
||||||
custom-event-polyfill@^1.0.7:
|
|
||||||
version "1.0.7"
|
|
||||||
resolved "https://registry.yarnpkg.com/custom-event-polyfill/-/custom-event-polyfill-1.0.7.tgz#9bc993ddda937c1a30ccd335614c6c58c4f87aee"
|
|
||||||
integrity sha512-TDDkd5DkaZxZFM8p+1I3yAlvM3rSr1wbrOliG4yJiwinMZN8z/iGL7BTlDkrJcYTmgUSb4ywVCc3ZaUtOtC76w==
|
|
||||||
|
|
||||||
dashdash@^1.12.0:
|
dashdash@^1.12.0:
|
||||||
version "1.14.1"
|
version "1.14.1"
|
||||||
resolved "https://registry.yarnpkg.com/dashdash/-/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0"
|
resolved "https://registry.yarnpkg.com/dashdash/-/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0"
|
||||||
|
|
@ -5073,11 +5077,6 @@ elegant-spinner@^1.0.1:
|
||||||
resolved "https://registry.yarnpkg.com/elegant-spinner/-/elegant-spinner-1.0.1.tgz#db043521c95d7e303fd8f345bedc3349cfb0729e"
|
resolved "https://registry.yarnpkg.com/elegant-spinner/-/elegant-spinner-1.0.1.tgz#db043521c95d7e303fd8f345bedc3349cfb0729e"
|
||||||
integrity sha1-2wQ1IcldfjA/2PNFvtwzSc+wcp4=
|
integrity sha1-2wQ1IcldfjA/2PNFvtwzSc+wcp4=
|
||||||
|
|
||||||
element-matches@^0.1.2:
|
|
||||||
version "0.1.2"
|
|
||||||
resolved "https://registry.yarnpkg.com/element-matches/-/element-matches-0.1.2.tgz#7345cb71e965bd2b12f725e524591c102198361a"
|
|
||||||
integrity sha512-yWh1otcs3OKUWDvu/IxyI36ZI3WNaRZlI0uG/DK6fu0pap0VYZ0J5pEGTk1zakme+hT0OKHwhlHc0N5TJhY6yQ==
|
|
||||||
|
|
||||||
element-plus@^2.1.9:
|
element-plus@^2.1.9:
|
||||||
version "2.1.9"
|
version "2.1.9"
|
||||||
resolved "https://registry.yarnpkg.com/element-plus/-/element-plus-2.1.9.tgz#8779b041f32f871eef2f903ee4c0da16dfb13024"
|
resolved "https://registry.yarnpkg.com/element-plus/-/element-plus-2.1.9.tgz#8779b041f32f871eef2f903ee4c0da16dfb13024"
|
||||||
|
|
@ -12420,14 +12419,6 @@ vue-router@^4.0.14:
|
||||||
dependencies:
|
dependencies:
|
||||||
"@vue/devtools-api" "^6.0.0"
|
"@vue/devtools-api" "^6.0.0"
|
||||||
|
|
||||||
vue-shortkey@^3.1.7:
|
|
||||||
version "3.1.7"
|
|
||||||
resolved "https://registry.yarnpkg.com/vue-shortkey/-/vue-shortkey-3.1.7.tgz#31c09a99ed597331a6a49a45eeff894a78a19eef"
|
|
||||||
integrity sha512-Wm/vPXXS+4Wl/LoYpD+cZc0J0HIoVlY8Ep0JLIqqswmAya3XUBtsqKbhzEf9sXo+3rZ5p1YsUyZfXas8XD7YjQ==
|
|
||||||
dependencies:
|
|
||||||
custom-event-polyfill "^1.0.7"
|
|
||||||
element-matches "^0.1.2"
|
|
||||||
|
|
||||||
vue-style-loader@^4.1.3:
|
vue-style-loader@^4.1.3:
|
||||||
version "4.1.3"
|
version "4.1.3"
|
||||||
resolved "https://registry.yarnpkg.com/vue-style-loader/-/vue-style-loader-4.1.3.tgz#6d55863a51fa757ab24e89d9371465072aa7bc35"
|
resolved "https://registry.yarnpkg.com/vue-style-loader/-/vue-style-loader-4.1.3.tgz#6d55863a51fa757ab24e89d9371465072aa7bc35"
|
||||||
|
|
@ -12445,15 +12436,6 @@ vue-virtual-scroller@^1.0.10:
|
||||||
vue-observe-visibility "^0.4.4"
|
vue-observe-visibility "^0.4.4"
|
||||||
vue-resize "^0.4.5"
|
vue-resize "^0.4.5"
|
||||||
|
|
||||||
vue-virtual-scroller@^2.0.0-alpha.1:
|
|
||||||
version "2.0.0-alpha.1"
|
|
||||||
resolved "https://registry.yarnpkg.com/vue-virtual-scroller/-/vue-virtual-scroller-2.0.0-alpha.1.tgz#5b5410105b8e60ca57bbd5f2faf5ad1d8108d046"
|
|
||||||
integrity sha512-Mn5w3Qe06t7c3Imm2RHD43RACab1CCWplpdgzq+/FWJcpQtcGKd5vDep8i+nIwFtzFLsWAqEK0RzM7KrfAcBng==
|
|
||||||
dependencies:
|
|
||||||
mitt "^2.1.0"
|
|
||||||
vue-observe-visibility "^2.0.0-alpha.1"
|
|
||||||
vue-resize "^2.0.0-alpha.1"
|
|
||||||
|
|
||||||
vue@^3.2.31:
|
vue@^3.2.31:
|
||||||
version "3.2.33"
|
version "3.2.33"
|
||||||
resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.33.tgz#7867eb16a3293a28c4d190a837bc447878bd64c2"
|
resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.33.tgz#7867eb16a3293a28c4d190a837bc447878bd64c2"
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue