sendnrw/misskey
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Post --> Note

Browse Source 
Closes #1411
This commit is contained in:
syuilo
2018-04-08 02:30:37 +09:00
parent c7106d250c
commit a1b490afa7
167 changed files with 4440 additions and 1762 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
src/client/app/desktop/views/components/posts.post.vue
View File

@@ -1,19 +1,19 @@
<template>
<div class="post" tabindex="-1" :title="title" @keydown="onKeydown">
<div class="note" tabindex="-1" :title="title" @keydown="onKeydown">
<div class="reply-to" v-if="p.reply">
<x-sub :post="p.reply"/>
<x-sub :note="p.reply"/>
</div>
<div class="repost" v-if="isRepost">
<div class="renote" v-if="isRenote">
<p>
<router-link class="avatar-anchor" :to="`/@${acct}`" v-user-preview="post.userId">
<img class="avatar" :src="`${post.user.avatarUrl}?thumbnail&size=32`" alt="avatar"/>
<router-link class="avatar-anchor" :to="`/@${acct}`" v-user-preview="note.userId">
<img class="avatar" :src="`${note.user.avatarUrl}?thumbnail&size=32`" alt="avatar"/>
</router-link>
%fa:retweet%
<span>{{ '%i18n:desktop.tags.mk-timeline-post.reposted-by%'.substr(0, '%i18n:desktop.tags.mk-timeline-post.reposted-by%'.indexOf('{')) }}</span>
<a class="name" :href="`/@${acct}`" v-user-preview="post.userId">{{ getUserName(post.user) }}</a>
<span>{{ '%i18n:desktop.tags.mk-timeline-post.reposted-by%'.substr('%i18n:desktop.tags.mk-timeline-post.reposted-by%'.indexOf('}') + 1) }}</span>
<span>{{ '%i18n:desktop.tags.mk-timeline-note.reposted-by%'.substr(0, '%i18n:desktop.tags.mk-timeline-note.reposted-by%'.indexOf('{')) }}</span>
<a class="name" :href="`/@${acct}`" v-user-preview="note.userId">{{ getUserName(note.user) }}</a>
<span>{{ '%i18n:desktop.tags.mk-timeline-note.reposted-by%'.substr('%i18n:desktop.tags.mk-timeline-note.reposted-by%'.indexOf('}') + 1) }}</span>
</p>
<mk-time :time="post.createdAt"/>
<mk-time :time="note.createdAt"/>
</div>
<article>
<router-link class="avatar-anchor" :to="`/@${acct}`">
@@ -38,38 +38,38 @@
</p>
<div class="text">
<a class="reply" v-if="p.reply">%fa:reply%</a>
<mk-post-html v-if="p.textHtml" :text="p.text" :i="os.i" :class="$style.text"/>
<a class="rp" v-if="p.repost">RP:</a>
<mk-note-html v-if="p.textHtml" :text="p.text" :i="os.i" :class="$style.text"/>
<a class="rp" v-if="p.renote">RP:</a>
</div>
<div class="media" v-if="p.media.length > 0">
<mk-media-list :media-list="p.media"/>
</div>
<mk-poll v-if="p.poll" :post="p" ref="pollViewer"/>
<mk-poll v-if="p.poll" :note="p" ref="pollViewer"/>
<div class="tags" v-if="p.tags && p.tags.length > 0">
<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
</div>
<a class="location" v-if="p.geo" :href="`http://maps.google.com/maps?q=${p.geo.coordinates[1]},${p.geo.coordinates[0]}`" target="_blank">%fa:map-marker-alt% 位置情報</a>
<div class="map" v-if="p.geo" ref="map"></div>
<div class="repost" v-if="p.repost">
<mk-post-preview :post="p.repost"/>
<div class="renote" v-if="p.renote">
<mk-note-preview :note="p.renote"/>
</div>
<mk-url-preview v-for="url in urls" :url="url" :key="url"/>
</div>
<footer>
<mk-reactions-viewer :post="p" ref="reactionsViewer"/>
<button @click="reply" title="%i18n:desktop.tags.mk-timeline-post.reply%">
<mk-reactions-viewer :note="p" ref="reactionsViewer"/>
<button @click="reply" title="%i18n:desktop.tags.mk-timeline-note.reply%">
%fa:reply%<p class="count" v-if="p.repliesCount > 0">{{ p.repliesCount }}</p>
</button>
<button @click="repost" title="%i18n:desktop.tags.mk-timeline-post.repost%">
%fa:retweet%<p class="count" v-if="p.repostCount > 0">{{ p.repostCount }}</p>
<button @click="renote" title="%i18n:desktop.tags.mk-timeline-note.renote%">
%fa:retweet%<p class="count" v-if="p.renoteCount > 0">{{ p.renoteCount }}</p>
</button>
<button :class="{ reacted: p.myReaction != null }" @click="react" ref="reactButton" title="%i18n:desktop.tags.mk-timeline-post.add-reaction%">
<button :class="{ reacted: p.myReaction != null }" @click="react" ref="reactButton" title="%i18n:desktop.tags.mk-timeline-note.add-reaction%">
%fa:plus%<p class="count" v-if="p.reactions_count > 0">{{ p.reactions_count }}</p>
</button>
<button @click="menu" ref="menuButton">
%fa:ellipsis-h%
</button>
<button title="%i18n:desktop.tags.mk-timeline-post.detail">
<button title="%i18n:desktop.tags.mk-timeline-note.detail">
<template v-if="!isDetailOpened">%fa:caret-down%</template>
<template v-if="isDetailOpened">%fa:caret-up%</template>
</button>
@@ -77,7 +77,7 @@
</div>
</article>
<div class="detail" v-if="isDetailOpened">
<mk-post-status-graph width="462" height="130" :post="p"/>
<mk-note-status-graph width="462" height="130" :note="p"/>
</div>
</div>
</template>
@@ -90,10 +90,10 @@ import getUserName from '../../../../../renderers/get-user-name';
import parse from '../../../../../text/parse';
import MkPostFormWindow from './post-form-window.vue';
import MkRepostFormWindow from './repost-form-window.vue';
import MkPostMenu from '../../../common/views/components/post-menu.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 './posts.post.sub.vue';
import XSub from './notes.note.sub.vue';
function focus(el, fn) {
const target = fn(el);
@@ -111,7 +111,7 @@ export default Vue.extend({
XSub
},
props: ['post'],
props: ['note'],
data() {
return {
@@ -128,14 +128,14 @@ export default Vue.extend({
name(): string {
return getUserName(this.p.user);
},
isRepost(): boolean {
return (this.post.repost &&
this.post.text == null &&
this.post.mediaIds == null &&
this.post.poll == null);
isRenote(): boolean {
return (this.note.renote &&
this.note.text == null &&
this.note.mediaIds == null &&
this.note.poll == null);
},
p(): any {
return this.isRepost ? this.post.repost : this.post;
return this.isRenote ? this.note.renote : this.note;
},
reactionsCount(): number {
return this.p.reactionCounts
@@ -211,7 +211,7 @@ export default Vue.extend({
type: 'capture',
id: this.p.id
});
if (withHandler) this.connection.on('post-updated', this.onStreamPostUpdated);
if (withHandler) this.connection.on('note-updated', this.onStreamNoteUpdated);
}
},
decapture(withHandler = false) {
@@ -220,18 +220,18 @@ export default Vue.extend({
type: 'decapture',
id: this.p.id
});
if (withHandler) this.connection.off('post-updated', this.onStreamPostUpdated);
if (withHandler) this.connection.off('note-updated', this.onStreamNoteUpdated);
}
},
onStreamConnected() {
this.capture();
},
onStreamPostUpdated(data) {
const post = data.post;
if (post.id == this.post.id) {
this.$emit('update:post', post);
} else if (post.id == this.post.repostId) {
this.post.repost = post;
onStreamNoteUpdated(data) {
const note = data.note;
if (note.id == this.note.id) {
this.$emit('update:note', note);
} else if (note.id == this.note.renoteId) {
this.note.renote = note;
}
},
reply() {
@@ -239,21 +239,21 @@ export default Vue.extend({
reply: this.p
});
},
repost() {
(this as any).os.new(MkRepostFormWindow, {
post: this.p
renote() {
(this as any).os.new(MkRenoteFormWindow, {
note: this.p
});
},
react() {
(this as any).os.new(MkReactionPicker, {
source: this.$refs.reactButton,
post: this.p
note: this.p
});
},
menu() {
(this as any).os.new(MkPostMenu, {
(this as any).os.new(MkNoteMenu, {
source: this.$refs.menuButton,
post: this.p
note: this.p
});
},
onKeydown(e) {
@@ -274,7 +274,7 @@ export default Vue.extend({
case e.which == 81: // [q]
case e.which == 69: // [e]
this.repost();
this.renote();
break;
case e.which == 70: // [f]
@@ -299,7 +299,7 @@ export default Vue.extend({
<style lang="stylus" scoped>
@import '~const.styl'
.post
.note
margin 0
padding 0
background #fff
@@ -309,7 +309,7 @@ export default Vue.extend({
border-top-left-radius 6px
border-top-right-radius 6px
> .repost
> .renote
border-top-left-radius 6px
border-top-right-radius 6px
@@ -330,7 +330,7 @@ export default Vue.extend({
border 2px solid rgba($theme-color, 0.3)
border-radius 4px
> .repost
> .renote
color #9dbb00
background linear-gradient(to bottom, #edfde2 0%, #fff 100%)
@@ -369,7 +369,7 @@ export default Vue.extend({
padding 0 16px
background rgba(0, 0, 0, 0.0125)
> .mk-post-preview
> .mk-note-preview
background transparent
> article
@@ -529,10 +529,10 @@ export default Vue.extend({
> .mk-poll
font-size 80%
> .repost
> .renote
margin 8px 0
> .mk-post-preview
> .mk-note-preview
padding 16px
border dashed 1px #c0dac6
border-radius 8px