Change computed to originalMessage in toot

This commit is contained in:
AkiraFukushima 2019-01-23 23:35:55 +09:00
parent 3a06489e74
commit ef20849dea
1 changed files with 77 additions and 77 deletions

View File

@ -9,52 +9,52 @@
role="article" role="article"
aria-label="toot" aria-label="toot"
> >
<div v-show="filtered(message)" class="filtered"> <div v-show="filtered()" class="filtered">
Filtered Filtered
</div> </div>
<div v-show="!filtered(message)" class="toot"> <div v-show="!filtered()" class="toot">
<div class="icon" role="presentation"> <div class="icon" role="presentation">
<FailoverImg <FailoverImg
:src="originalMessage(message).account.avatar" :src="originalMessage.account.avatar"
@click="openUser(originalMessage(message).account)" @click="openUser(originalMessage.account)"
:alt="`Avatar of ${originalMessage(message).account.username}`" :alt="`Avatar of ${originalMessage.account.username}`"
/> />
</div> </div>
<div class="detail" v-on:dblclick="openDetail(message)"> <div class="detail" v-on:dblclick="openDetail(message)">
<div class="toot-header"> <div class="toot-header">
<div class="user" @click="openUser(originalMessage(message).account)"> <div class="user" @click="openUser(originalMessage.account)">
<span class="display-name" @click="openUser(message.account)"><bdi v-html="username(originalMessage(message).account)"></bdi></span> <span class="display-name" @click="openUser(message.account)"><bdi v-html="username(originalMessage.account)"></bdi></span>
<span class="acct">{{ accountName(originalMessage(message).account) }}</span> <span class="acct">{{ accountName(originalMessage.account) }}</span>
</div> </div>
<div class="timestamp"> <div class="timestamp">
<time :datetime="originalMessage(message).created_at" :title="readableTimestamp"> <time :datetime="originalMessage.created_at" :title="readableTimestamp">
{{ timestamp }} {{ timestamp }}
</time> </time>
</div> </div>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div class="content-wrapper"> <div class="content-wrapper">
<div class="spoiler" v-show="spoilered(message)"> <div class="spoiler" v-show="spoilered()">
<span v-html="spoilerText(message)"></span> <span v-html="spoilerText()"></span>
<el-button v-if="!isShowContent(message)" plain type="primary" size="medium" class="spoil-button" @click="showContent = true"> <el-button v-if="!isShowContent()" plain type="primary" size="medium" class="spoil-button" @click="showContent = true">
{{ $t('cards.toot.show_more') }} {{ $t('cards.toot.show_more') }}
</el-button> </el-button>
<el-button v-else type="primary" size="medium" class="spoil-button" @click="showContent = false"> <el-button v-else type="primary" size="medium" class="spoil-button" @click="showContent = false">
{{ $t('cards.toot.hide')}} {{ $t('cards.toot.hide')}}
</el-button> </el-button>
</div> </div>
<div class="content" v-show="isShowContent(message)" v-html="status(message)" @click.capture.prevent="tootClick"></div> <div class="content" v-show="isShowContent()" v-html="status()" @click.capture.prevent="tootClick"></div>
</div> </div>
<div class="attachments"> <div class="attachments">
<el-button v-show="sensitive(message) && !isShowAttachments(message)" class="show-sensitive" type="info" @click="showAttachments = true"> <el-button v-show="sensitive() && !isShowAttachments()" class="show-sensitive" type="info" @click="showAttachments = true">
{{ $t('cards.toot.sensitive') }} {{ $t('cards.toot.sensitive') }}
</el-button> </el-button>
<div v-show="isShowAttachments(message)"> <div v-show="isShowAttachments()">
<el-button v-show="sensitive(message) && isShowAttachments(message)" class="hide-sensitive" type="text" @click="showAttachments = false" :title="$t('cards.toot.hide')"> <el-button v-show="sensitive() && isShowAttachments()" class="hide-sensitive" type="text" @click="showAttachments = false" :title="$t('cards.toot.hide')">
<icon name="eye" class="hide"></icon> <icon name="eye" class="hide"></icon>
</el-button> </el-button>
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message)"> <div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments()">
<FailoverImg :src="media.preview_url" @click="openImage(media.url, mediaAttachments(message))" :title="media.description" /> <FailoverImg :src="media.preview_url" @click="openImage(media.url, mediaAttachments())" :title="media.description" />
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag> <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> <el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
</div> </div>
@ -73,7 +73,7 @@
</span> </span>
</div> </div>
<div class="tool-box"> <div class="tool-box">
<el-button type="text" @click="openReply(message)" class="reply" :title="$t('cards.toot.reply')" :aria-label="$t('cards.toot.reply')"> <el-button type="text" @click="openReply()" class="reply" :title="$t('cards.toot.reply')" :aria-label="$t('cards.toot.reply')">
<icon name="reply" scale="0.9"></icon> <icon name="reply" scale="0.9"></icon>
</el-button> </el-button>
<el-button v-show="locked(message)" type="text" class="locked"> <el-button v-show="locked(message)" type="text" class="locked">
@ -82,17 +82,17 @@
<el-button v-show="directed(message)" type="text" class="directed"> <el-button v-show="directed(message)" type="text" class="directed">
<icon name="envelope" scale="0.9"></icon> <icon name="envelope" scale="0.9"></icon>
</el-button> </el-button>
<el-button v-show="!locked(message)&&!directed(message)" type="text" @click="changeReblog(originalMessage(message))" :class="originalMessage(message).reblogged ? 'reblogged' : 'reblog'" :title="$t('cards.toot.reblog')"> <el-button v-show="!locked(message)&&!directed(message)" type="text" @click="changeReblog(originalMessage)" :class="originalMessage.reblogged ? 'reblogged' : 'reblog'" :title="$t('cards.toot.reblog')">
<icon name="retweet" scale="0.9"></icon> <icon name="retweet" scale="0.9"></icon>
</el-button> </el-button>
<span class="count"> <span class="count">
{{ reblogsCount(message) }} {{ reblogsCount() }}
</span> </span>
<el-button type="text" @click="changeFavourite(originalMessage(message))" :class="originalMessage(message).favourited ? 'favourited animated bounceIn' : 'favourite'" :title="$t('cards.toot.fav')" :aria-label="$t('cards.toot.fav')"> <el-button type="text" @click="changeFavourite(originalMessage)" :class="originalMessage.favourited ? 'favourited animated bounceIn' : 'favourite'" :title="$t('cards.toot.fav')" :aria-label="$t('cards.toot.fav')">
<icon name="star" scale="0.9"></icon> <icon name="star" scale="0.9"></icon>
</el-button> </el-button>
<span class="count"> <span class="count">
{{ favouritesCount(message) }} {{ favouritesCount() }}
</span> </span>
<el-button class="pinned" type="text" :title="$t('cards.toot.pinned')" :aria-label="$t('cards.toot.pinned')" v-show="pinned"> <el-button class="pinned" type="text" :title="$t('cards.toot.pinned')" :aria-label="$t('cards.toot.pinned')" v-show="pinned">
<icon name="thumbtack" scale="0.9"></icon> <icon name="thumbtack" scale="0.9"></icon>
@ -103,22 +103,22 @@
<li role="button" @click="openDetail(message)"> <li role="button" @click="openDetail(message)">
{{ $t('cards.toot.view_toot_detail') }} {{ $t('cards.toot.view_toot_detail') }}
</li> </li>
<li role="button" @click="openBrowser(originalMessage(message))"> <li role="button" @click="openBrowser(originalMessage)">
{{ $t('cards.toot.open_in_browser') }} {{ $t('cards.toot.open_in_browser') }}
</li> </li>
<li role="button" @click="copyLink(originalMessage(message))"> <li role="button" @click="copyLink(originalMessage)">
{{ $t('cards.toot.copy_link_to_toot') }} {{ $t('cards.toot.copy_link_to_toot') }}
</li> </li>
<li role="button" class="separate" @click="confirmMute(message)"> <li role="button" class="separate" @click="confirmMute()">
{{ $t('cards.toot.mute') }} {{ $t('cards.toot.mute') }}
</li> </li>
<li role="button" @click="block(message)"> <li role="button" @click="block()">
{{ $t('cards.toot.block') }} {{ $t('cards.toot.block') }}
</li> </li>
<li role="button" @click="reportUser(message)" v-if="!isMyMessage(message)"> <li role="button" @click="reportUser()" v-if="!isMyMessage()">
{{ $t('cards.toot.report') }} {{ $t('cards.toot.report') }}
</li> </li>
<li role="button" class="separate" @click="deleteToot(message)" v-if="isMyMessage(message)"> <li role="button" class="separate" @click="deleteToot(message)" v-if="isMyMessage()">
{{ $t('cards.toot.delete') }} {{ $t('cards.toot.delete') }}
</li> </li>
</ul> </ul>
@ -128,8 +128,8 @@
</el-button> </el-button>
</popper> </popper>
</div> </div>
<div class="application" v-show="application(message) !== null"> <div class="application" v-show="application() !== null">
{{ $t('cards.toot.via', { application: application(message) }) }} {{ $t('cards.toot.via', { application: application() }) }}
</div> </div>
</div> </div>
<div class="clearfix"></div> <div class="clearfix"></div>
@ -193,11 +193,18 @@ export default {
return this.focused && !this.overlaid return this.focused && !this.overlaid
}, },
timestamp: function () { timestamp: function () {
return this.parseDatetime(this.originalMessage(this.message).created_at, this.now) return this.parseDatetime(this.originalMessage.created_at, this.now)
}, },
readableTimestamp: function () { readableTimestamp: function () {
moment.locale(this.language) moment.locale(this.language)
return moment(this.originalMessage(this.message).created_at).format('LLLL') return moment(this.originalMessage.created_at).format('LLLL')
},
originalMessage: function () {
if (this.message.reblog !== null) {
return this.message.reblog
} else {
return this.message
}
} }
}, },
mounted () { mounted () {
@ -225,13 +232,6 @@ export default {
} }
}, },
methods: { methods: {
originalMessage (message) {
if (message.reblog !== null) {
return message.reblog
} else {
return message
}
},
username (account) { username (account) {
switch (this.displayNameStyle) { switch (this.displayNameStyle) {
case DisplayStyle.DisplayNameAndUsername.value: case DisplayStyle.DisplayNameAndUsername.value:
@ -298,8 +298,8 @@ export default {
return shell.openExternal(link) return shell.openExternal(link)
} }
}, },
openReply (message) { openReply () {
this.$store.dispatch('TimelineSpace/Modals/NewToot/openReply', this.originalMessage(message)) this.$store.dispatch('TimelineSpace/Modals/NewToot/openReply', this.originalMessage)
}, },
openDetail (message) { openDetail (message) {
this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent') this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
@ -315,17 +315,17 @@ export default {
clipboard.writeText(message.url, 'toot-link') clipboard.writeText(message.url, 'toot-link')
this.$refs.popper.doClose() this.$refs.popper.doClose()
}, },
reportUser (message) { reportUser () {
this.$store.dispatch('TimelineSpace/Modals/Report/openReport', this.originalMessage(message)) this.$store.dispatch('TimelineSpace/Modals/Report/openReport', this.originalMessage)
this.$refs.popper.doClose() this.$refs.popper.doClose()
}, },
confirmMute (message) { confirmMute () {
this.$store.dispatch('TimelineSpace/Modals/MuteConfirm/changeAccount', this.originalMessage(message).account) this.$store.dispatch('TimelineSpace/Modals/MuteConfirm/changeAccount', this.originalMessage.account)
this.$store.dispatch('TimelineSpace/Modals/MuteConfirm/changeModal', true) this.$store.dispatch('TimelineSpace/Modals/MuteConfirm/changeModal', true)
this.$refs.popper.doClose() this.$refs.popper.doClose()
}, },
block (message) { block () {
this.$store.dispatch('molecules/Toot/block', this.originalMessage(message).account) this.$store.dispatch('molecules/Toot/block', this.originalMessage.account)
this.$refs.popper.doClose() this.$refs.popper.doClose()
}, },
changeReblog (message) { changeReblog (message) {
@ -395,23 +395,23 @@ export default {
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account) this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true) this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
}, },
mediaAttachments (message) { mediaAttachments () {
return this.originalMessage(message).media_attachments return this.originalMessage.media_attachments
}, },
reblogsCount (message) { reblogsCount () {
if (this.originalMessage(message).reblogs_count > 0) { if (this.originalMessage.reblogs_count > 0) {
return this.originalMessage(message).reblogs_count return this.originalMessage.reblogs_count
} }
return '' return ''
}, },
favouritesCount (message) { favouritesCount () {
if (this.originalMessage(message).favourites_count > 0) { if (this.originalMessage.favourites_count > 0) {
return this.originalMessage(message).favourites_count return this.originalMessage.favourites_count
} }
return '' return ''
}, },
isMyMessage (message) { isMyMessage () {
return this.$store.state.TimelineSpace.account.accountId === this.originalMessage(message).account.id return this.$store.state.TimelineSpace.account.accountId === this.originalMessage.account.id
}, },
deleteToot (message) { deleteToot (message) {
this.$store.dispatch('molecules/Toot/deleteToot', message) this.$store.dispatch('molecules/Toot/deleteToot', message)
@ -425,28 +425,28 @@ export default {
}) })
}) })
}, },
application (message) { application () {
let msg = this.originalMessage(message) let msg = this.originalMessage
if (msg.application !== undefined && if (msg.application !== undefined &&
msg.application !== null) { msg.application !== null) {
return msg.application.name return msg.application.name
} }
return null return null
}, },
spoilered (message) { spoilered () {
return this.originalMessage(message).spoiler_text.length > 0 return this.originalMessage.spoiler_text.length > 0
}, },
isShowContent (message) { isShowContent () {
return !this.spoilered(message) || this.showContent return !this.spoilered() || this.showContent
}, },
sensitive (message) { sensitive () {
return this.originalMessage(message).sensitive && this.mediaAttachments(message).length > 0 return this.originalMessage.sensitive && this.mediaAttachments().length > 0
}, },
isShowAttachments (message) { isShowAttachments () {
return !this.sensitive(message) || this.showAttachments return !this.sensitive() || this.showAttachments
}, },
filtered (message) { filtered () {
return this.filter.length > 0 && this.originalMessage(message).content.search(this.filter) >= 0 return this.filter.length > 0 && this.originalMessage.content.search(this.filter) >= 0
}, },
locked (message) { locked (message) {
return message.visibility === 'private' return message.visibility === 'private'
@ -454,12 +454,12 @@ export default {
directed (message) { directed (message) {
return message.visibility === 'direct' return message.visibility === 'direct'
}, },
status (message) { status () {
const original = this.originalMessage(message) const original = this.originalMessage
return emojify(original.content, original.emojis) return emojify(original.content, original.emojis)
}, },
spoilerText (message) { spoilerText () {
const original = this.originalMessage(message) const original = this.originalMessage
return emojify(original.spoiler_text, original.emojis) return emojify(original.spoiler_text, original.emojis)
}, },
handleTootControl (event) { handleTootControl (event) {
@ -477,7 +477,7 @@ export default {
this.$emit('focusLeft') this.$emit('focusLeft')
break break
case 'reply': case 'reply':
this.openReply(this.message) this.openReply()
break break
case 'boost': case 'boost':
this.changeReblog(this.message) this.changeReblog(this.message)
@ -489,10 +489,10 @@ export default {
this.openDetail(this.message) this.openDetail(this.message)
break break
case 'profile': case 'profile':
this.openUser(this.originalMessage(this.message).account) this.openUser(this.originalMessage.account)
break break
case 'image': case 'image':
const images = this.mediaAttachments(this.message) const images = this.mediaAttachments()
if (images.length === 0) { if (images.length === 0) {
return 0 return 0
} }