From a1b490afa756a71b9cef4afa424575bc223bc612 Mon Sep 17 00:00:00 2001 From: syuilo Date: Sun, 8 Apr 2018 02:30:37 +0900 Subject: Post --> Note Closes #1411 --- src/client/app/common/views/components/index.ts | 4 +- .../views/components/messaging-room.message.vue | 2 +- .../app/common/views/components/note-html.ts | 157 +++++++++++++++++++++ .../app/common/views/components/note-menu.vue | 141 ++++++++++++++++++ src/client/app/common/views/components/poll.vue | 8 +- .../app/common/views/components/post-html.ts | 157 --------------------- .../app/common/views/components/post-menu.vue | 141 ------------------ .../common/views/components/reaction-picker.vue | 6 +- .../common/views/components/reactions-viewer.vue | 4 +- .../common/views/components/welcome-timeline.vue | 26 ++-- 10 files changed, 323 insertions(+), 323 deletions(-) create mode 100644 src/client/app/common/views/components/note-html.ts create mode 100644 src/client/app/common/views/components/note-menu.vue delete mode 100644 src/client/app/common/views/components/post-html.ts delete mode 100644 src/client/app/common/views/components/post-menu.vue (limited to 'src/client/app/common/views/components') diff --git a/src/client/app/common/views/components/index.ts b/src/client/app/common/views/components/index.ts index b58ba37ecb..6bfe43a800 100644 --- a/src/client/app/common/views/components/index.ts +++ b/src/client/app/common/views/components/index.ts @@ -4,7 +4,7 @@ import signin from './signin.vue'; import signup from './signup.vue'; import forkit from './forkit.vue'; import nav from './nav.vue'; -import postHtml from './post-html'; +import noteHtml from './note-html'; import poll from './poll.vue'; import pollEditor from './poll-editor.vue'; import reactionIcon from './reaction-icon.vue'; @@ -29,7 +29,7 @@ Vue.component('mk-signin', signin); Vue.component('mk-signup', signup); Vue.component('mk-forkit', forkit); Vue.component('mk-nav', nav); -Vue.component('mk-post-html', postHtml); +Vue.component('mk-note-html', noteHtml); Vue.component('mk-poll', poll); Vue.component('mk-poll-editor', pollEditor); Vue.component('mk-reaction-icon', reactionIcon); diff --git a/src/client/app/common/views/components/messaging-room.message.vue b/src/client/app/common/views/components/messaging-room.message.vue index 1518602c63..7200b59bb2 100644 --- a/src/client/app/common/views/components/messaging-room.message.vue +++ b/src/client/app/common/views/components/messaging-room.message.vue @@ -10,7 +10,7 @@ Delete
- +
diff --git a/src/client/app/common/views/components/note-html.ts b/src/client/app/common/views/components/note-html.ts new file mode 100644 index 0000000000..24e750a671 --- /dev/null +++ b/src/client/app/common/views/components/note-html.ts @@ -0,0 +1,157 @@ +import Vue from 'vue'; +import * as emojilib from 'emojilib'; +import parse from '../../../../../text/parse'; +import getAcct from '../../../../../acct/render'; +import { url } from '../../../config'; +import MkUrl from './url.vue'; + +const flatten = list => list.reduce( + (a, b) => a.concat(Array.isArray(b) ? flatten(b) : b), [] +); + +export default Vue.component('mk-note-html', { + props: { + text: { + type: String, + required: true + }, + ast: { + type: [], + required: false + }, + shouldBreak: { + type: Boolean, + default: true + }, + i: { + type: Object, + default: null + } + }, + + render(createElement) { + let ast; + + if (this.ast == null) { + // Parse text to ast + ast = parse(this.text); + } else { + ast = this.ast; + } + + // Parse ast to DOM + const els = flatten(ast.map(token => { + switch (token.type) { + case 'text': + const text = token.content.replace(/(\r\n|\n|\r)/g, '\n'); + + if (this.shouldBreak) { + const x = text.split('\n') + .map(t => t == '' ? [createElement('br')] : [createElement('span', t), createElement('br')]); + x[x.length - 1].pop(); + return x; + } else { + return createElement('span', text.replace(/\n/g, ' ')); + } + + case 'bold': + return createElement('strong', token.bold); + + case 'url': + return createElement(MkUrl, { + props: { + url: token.content, + target: '_blank' + } + }); + + case 'link': + return createElement('a', { + attrs: { + class: 'link', + href: token.url, + target: '_blank', + title: token.url + } + }, token.title); + + case 'mention': + return (createElement as any)('a', { + attrs: { + href: `${url}/@${getAcct(token)}`, + target: '_blank', + dataIsMe: (this as any).i && getAcct((this as any).i) == getAcct(token) + }, + directives: [{ + name: 'user-preview', + value: token.content + }] + }, token.content); + + case 'hashtag': + return createElement('a', { + attrs: { + href: `${url}/search?q=${token.content}`, + target: '_blank' + } + }, token.content); + + case 'code': + return createElement('pre', [ + createElement('code', { + domProps: { + innerHTML: token.html + } + }) + ]); + + case 'inline-code': + return createElement('code', { + domProps: { + innerHTML: token.html + } + }); + + case 'quote': + const text2 = token.quote.replace(/(\r\n|\n|\r)/g, '\n'); + + if (this.shouldBreak) { + const x = text2.split('\n') + .map(t => [createElement('span', t), createElement('br')]); + x[x.length - 1].pop(); + return createElement('div', { + attrs: { + class: 'quote' + } + }, x); + } else { + return createElement('span', { + attrs: { + class: 'quote' + } + }, text2.replace(/\n/g, ' ')); + } + + case 'emoji': + const emoji = emojilib.lib[token.emoji]; + return createElement('span', emoji ? emoji.char : token.content); + + default: + console.log('unknown ast type:', token.type); + } + })); + + const _els = []; + els.forEach((el, i) => { + if (el.tag == 'br') { + if (els[i - 1].tag != 'div') { + _els.push(el); + } + } else { + _els.push(el); + } + }); + + return createElement('span', _els); + } +}); diff --git a/src/client/app/common/views/components/note-menu.vue b/src/client/app/common/views/components/note-menu.vue new file mode 100644 index 0000000000..d053748728 --- /dev/null +++ b/src/client/app/common/views/components/note-menu.vue @@ -0,0 +1,141 @@ + + + + + diff --git a/src/client/app/common/views/components/poll.vue b/src/client/app/common/views/components/poll.vue index 711d89720e..eb29aa8837 100644 --- a/src/client/app/common/views/components/poll.vue +++ b/src/client/app/common/views/components/poll.vue @@ -22,7 +22,7 @@ - - diff --git a/src/client/app/common/views/components/reaction-picker.vue b/src/client/app/common/views/components/reaction-picker.vue index bcb6b2b965..fa1998dca9 100644 --- a/src/client/app/common/views/components/reaction-picker.vue +++ b/src/client/app/common/views/components/reaction-picker.vue @@ -25,7 +25,7 @@ import * as anime from 'animejs'; const placeholder = '%i18n:common.tags.mk-reaction-picker.choose-reaction%'; export default Vue.extend({ - props: ['post', 'source', 'compact', 'cb'], + props: ['note', 'source', 'compact', 'cb'], data() { return { title: placeholder @@ -68,8 +68,8 @@ export default Vue.extend({ }, methods: { react(reaction) { - (this as any).api('posts/reactions/create', { - postId: this.post.id, + (this as any).api('notes/reactions/create', { + noteId: this.note.id, reaction: reaction }).then(() => { if (this.cb) this.cb(); diff --git a/src/client/app/common/views/components/reactions-viewer.vue b/src/client/app/common/views/components/reactions-viewer.vue index 246451008f..1afcf525d2 100644 --- a/src/client/app/common/views/components/reactions-viewer.vue +++ b/src/client/app/common/views/components/reactions-viewer.vue @@ -17,10 +17,10 @@