Skip to content
Snippets Groups Projects
Unverified Commit 5e54751b authored by syuilo's avatar syuilo
Browse files

Refactor

parent 93f13ffc
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
src/client/app/desktop/views/components/note-detail.vue
+ 8
− 92
View file @ 5e54751b
<template>
<div class="mk-note-detail" :title="title">
<div class="mk-note-detail" :title="title" tabindex="-1">
<button
class="read-more"
v-if="appearNote.reply && appearNote.reply.replyId && conversation.length == 0"
......@@ -63,18 +63,18 @@
<footer>
<span class="app" v-if="note.app && $store.state.settings.showVia">via <b>{{ note.app.name }}</b></span>
<mk-reactions-viewer :note="appearNote"/>
<button class="replyButton" @click="reply" :title="$t('reply')">
<button class="replyButton" @click="reply()" :title="$t('reply')">
<template v-if="appearNote.reply"><fa icon="reply-all"/></template>
<template v-else><fa icon="reply"/></template>
<p class="count" v-if="appearNote.repliesCount > 0">{{ appearNote.repliesCount }}</p>
</button>
<button class="renoteButton" @click="renote" :title="$t('renote')">
<button class="renoteButton" @click="renote()" :title="$t('renote')">
<fa icon="retweet"/><p class="count" v-if="appearNote.renoteCount > 0">{{ appearNote.renoteCount }}</p>
</button>
<button class="reactionButton" :class="{ reacted: appearNote.myReaction != null }" @click="react" ref="reactButton" :title="$t('add-reaction')">
<button class="reactionButton" :class="{ reacted: appearNote.myReaction != null }" @click="react()" ref="reactButton" :title="$t('add-reaction')">
<fa icon="plus"/><p class="count" v-if="appearNote.reactions_count > 0">{{ appearNote.reactions_count }}</p>
</button>
<button @click="menu" ref="menuButton">
<button @click="menu()" ref="menuButton">
<fa icon="ellipsis-h"/>
</button>
</footer>
......@@ -88,23 +88,18 @@
<script lang="ts">
import Vue from 'vue';
import i18n from '../../../i18n';
import parse from '../../../../../mfm/parse';
import MkPostFormWindow from './post-form-window.vue';
import MkRenoteFormWindow from './renote-form-window.vue';
import MkNoteMenu from '../../../common/views/components/note-menu.vue';
import MkReactionPicker from '../../../common/views/components/reaction-picker.vue';
import XSub from './note.sub.vue';
import { sum, unique } from '../../../../../prelude/array';
import noteSubscriber from '../../../common/scripts/note-subscriber';
import noteMixin from '../../../common/scripts/note-mixin';
export default Vue.extend({
i18n: i18n('desktop/views/components/note-detail.vue'),
components: {
XSub
},
mixins: [noteSubscriber('note')],
mixins: [noteMixin(), noteSubscriber('note')],
props: {
note: {
......@@ -118,47 +113,12 @@ export default Vue.extend({
data() {
return {
showContent: false,
conversation: [],
conversationFetching: false,
replies: []
};
},
computed: {
isRenote(): boolean {
return (this.note.renote &&
this.note.text == null &&
this.note.fileIds.length == 0 &&
this.note.poll == null);
},
appearNote(): any {
return this.isRenote ? this.note.renote : this.note;
},
reactionsCount(): number {
return this.appearNote.reactionCounts
? sum(Object.values(this.appearNote.reactionCounts))
: 0;
},
title(): string {
return new Date(this.appearNote.createdAt).toLocaleString();
},
urls(): string[] {
if (this.appearNote.text) {
const ast = parse(this.appearNote.text);
return unique(ast
.filter(t => ((t.name == 'url' || t.name == 'link') && t.props.url && !t.silent))
.map(t => t.props.url));
} else {
return null;
}
}
},
mounted() {
// Get replies
if (!this.compact) {
......@@ -169,24 +129,6 @@ export default Vue.extend({
this.replies = replies;
});
}
// Draw map
if (this.appearNote.geo) {
const shouldShowMap = this.$store.getters.isSignedIn ? this.$store.state.settings.showMaps : true;
if (shouldShowMap) {
this.$root.os.getGoogleMaps().then(maps => {
const uluru = new maps.LatLng(this.appearNote.geo.coordinates[1], this.appearNote.geo.coordinates[0]);
const map = new maps.Map(this.$refs.map, {
center: uluru,
zoom: 15
});
new maps.Marker({
position: uluru,
map: map
});
});
}
}
},
methods: {
......@@ -200,32 +142,6 @@ export default Vue.extend({
this.conversationFetching = false;
this.conversation = conversation.reverse();
});
},
reply() {
this.$root.new(MkPostFormWindow, {
reply: this.appearNote
});
},
renote() {
this.$root.new(MkRenoteFormWindow, {
note: this.appearNote
});
},
react() {
this.$root.new(MkReactionPicker, {
source: this.$refs.reactButton,
note: this.appearNote
});
},
menu() {
this.$root.new(MkNoteMenu, {
source: this.$refs.menuButton,
note: this.appearNote
});
}
}
});
......
src/client/app/mobile/views/components/note-detail.vue
+ 8
− 89
View file @ 5e54751b
<template>
<div class="mk-note-detail">
<div class="mk-note-detail" tabindex="-1">
<button
class="more"
v-if="appearNote.reply && appearNote.reply.replyId && conversation.length == 0"
......@@ -61,18 +61,18 @@
</div>
<footer>
<mk-reactions-viewer :note="appearNote"/>
<button @click="reply" :title="$t('title')">
<button @click="reply()" :title="$t('title')">
<template v-if="appearNote.reply"><fa icon="reply-all"/></template>
<template v-else><fa icon="reply"/></template>
<p class="count" v-if="appearNote.repliesCount > 0">{{ appearNote.repliesCount }}</p>
</button>
<button @click="renote" title="Renote">
<button @click="renote()" title="Renote">
<fa icon="retweet"/><p class="count" v-if="appearNote.renoteCount > 0">{{ appearNote.renoteCount }}</p>
</button>
<button :class="{ reacted: appearNote.myReaction != null }" @click="react" ref="reactButton" :title="$t('title')">
<button :class="{ reacted: appearNote.myReaction != null }" @click="react()" ref="reactButton" :title="$t('title')">
<fa icon="plus"/><p class="count" v-if="appearNote.reactions_count > 0">{{ appearNote.reactions_count }}</p>
</button>
<button @click="menu" ref="menuButton">
<button @click="menu()" ref="menuButton">
<fa icon="ellipsis-h"/>
</button>
</footer>
......@@ -86,21 +86,18 @@
<script lang="ts">
import Vue from 'vue';
import i18n from '../../../i18n';
import parse from '../../../../../mfm/parse';
import MkNoteMenu from '../../../common/views/components/note-menu.vue';
import MkReactionPicker from '../../../common/views/components/reaction-picker.vue';
import XSub from './note.sub.vue';
import { sum, unique } from '../../../../../prelude/array';
import noteSubscriber from '../../../common/scripts/note-subscriber';
import noteMixin from '../../../common/scripts/note-mixin';
export default Vue.extend({
i18n: i18n('mobile/views/components/note-detail.vue'),
components: {
XSub
},
mixins: [noteSubscriber('note')],
mixins: [noteMixin(), noteSubscriber('note')],
props: {
note: {
......@@ -114,43 +111,12 @@ export default Vue.extend({
data() {
return {
showContent: false,
conversation: [],
conversationFetching: false,
replies: []
};
},
computed: {
isRenote(): boolean {
return (this.note.renote &&
this.note.text == null &&
this.note.fileIds.length == 0 &&
this.note.poll == null);
},
appearNote(): any {
return this.isRenote ? this.note.renote : this.note;
},
reactionsCount(): number {
return this.appearNote.reactionCounts
? sum(Object.values(this.appearNote.reactionCounts))
: 0;
},
urls(): string[] {
if (this.appearNote.text) {
const ast = parse(this.appearNote.text);
return unique(ast
.filter(t => ((t.name == 'url' || t.name == 'link') && t.props.url && !t.silent))
.map(t => t.props.url));
} else {
return null;
}
}
},
mounted() {
// Get replies
if (!this.compact) {
......@@ -161,24 +127,6 @@ export default Vue.extend({
this.replies = replies;
});
}
// Draw map
if (this.appearNote.geo) {
const shouldShowMap = this.$store.getters.isSignedIn ? this.$store.state.settings.showMaps : true;
if (shouldShowMap) {
this.$root.os.getGoogleMaps().then(maps => {
const uluru = new maps.LatLng(this.appearNote.geo.coordinates[1], this.appearNote.geo.coordinates[0]);
const map = new maps.Map(this.$refs.map, {
center: uluru,
zoom: 15
});
new maps.Marker({
position: uluru,
map: map
});
});
}
}
},
methods: {
......@@ -192,35 +140,6 @@ export default Vue.extend({
this.conversationFetching = false;
this.conversation = conversation.reverse();
});
},
reply() {
this.$post({
reply: this.appearNote
});
},
renote() {
this.$post({
renote: this.appearNote
});
},
react() {
this.$root.new(MkReactionPicker, {
source: this.$refs.reactButton,
note: this.appearNote,
compact: true,
big: true
});
},
menu() {
this.$root.new(MkNoteMenu, {
source: this.$refs.menuButton,
note: this.appearNote,
compact: true
});
}
}
});
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment