From 7a270275efcb49c182db5db73ce10c65ba6ad3ff Mon Sep 17 00:00:00 2001 From: syuilo Date: Thu, 19 Apr 2018 15:05:39 +0900 Subject: [PATCH] Add new text syntax And some fixes --- .../app/common/views/components/note-html.ts | 13 +++++++++++-- .../app/desktop/views/components/notes.note.vue | 12 ++++++++++++ src/client/app/mobile/views/components/note.vue | 12 ++++++++++++ src/text/html.ts | 6 ++++++ src/text/parse/elements/title.ts | 14 ++++++++++++++ src/text/parse/index.ts | 1 + 6 files changed, 56 insertions(+), 2 deletions(-) create mode 100644 src/text/parse/elements/title.ts diff --git a/src/client/app/common/views/components/note-html.ts b/src/client/app/common/views/components/note-html.ts index 24e750a671..38f6251cf7 100644 --- a/src/client/app/common/views/components/note-html.ts +++ b/src/client/app/common/views/components/note-html.ts @@ -97,7 +97,9 @@ export default Vue.component('mk-note-html', { }, token.content); case 'code': - return createElement('pre', [ + return createElement('pre', { + class: 'code' + }, [ createElement('code', { domProps: { innerHTML: token.html @@ -132,6 +134,13 @@ export default Vue.component('mk-note-html', { }, text2.replace(/\n/g, ' ')); } + case 'title': + return createElement('div', { + attrs: { + class: 'title' + } + }, token.title); + case 'emoji': const emoji = emojilib.lib[token.emoji]; return createElement('span', emoji ? emoji.char : token.content); @@ -144,7 +153,7 @@ export default Vue.component('mk-note-html', { const _els = []; els.forEach((el, i) => { if (el.tag == 'br') { - if (els[i - 1].tag != 'div') { + if (!['div', 'pre'].includes(els[i - 1].tag)) { _els.push(el); } } else { diff --git a/src/client/app/desktop/views/components/notes.note.vue b/src/client/app/desktop/views/components/notes.note.vue index 752242d7d0..873d724b25 100644 --- a/src/client/app/desktop/views/components/notes.note.vue +++ b/src/client/app/desktop/views/components/notes.note.vue @@ -456,6 +456,18 @@ export default Vue.extend({ font-size 1.1em color #717171 + >>> .title + display block + margin-bottom 4px + padding 4px + font-size 90% + text-align center + background #eef1f3 + border-radius 4px + + >>> .code + margin 8px 0 + >>> .quote margin 8px padding 6px 12px diff --git a/src/client/app/mobile/views/components/note.vue b/src/client/app/mobile/views/components/note.vue index 5d3a6c7362..71fa43aea2 100644 --- a/src/client/app/mobile/views/components/note.vue +++ b/src/client/app/mobile/views/components/note.vue @@ -391,6 +391,18 @@ export default Vue.extend({ font-size 1.1em color #717171 + >>> .title + display block + margin-bottom 4px + padding 4px + font-size 90% + text-align center + background #eef1f3 + border-radius 4px + + >>> .code + margin 8px 0 + >>> .quote margin 8px padding 6px 12px diff --git a/src/text/html.ts b/src/text/html.ts index 797f3b3f33..e2db2457c1 100644 --- a/src/text/html.ts +++ b/src/text/html.ts @@ -54,6 +54,12 @@ const handlers = { document.body.appendChild(blockquote); }, + title({ document }, { title }) { + const h1 = document.createElement('h1'); + h1.textContent = title; + document.body.appendChild(h1); + }, + text({ document }, { content }) { for (const text of content.split('\n')) { const node = document.createTextNode(text); diff --git a/src/text/parse/elements/title.ts b/src/text/parse/elements/title.ts new file mode 100644 index 0000000000..9f4708f5d6 --- /dev/null +++ b/src/text/parse/elements/title.ts @@ -0,0 +1,14 @@ +/** + * Title + */ + +module.exports = text => { + const match = text.match(/^【(.+?)】\n/); + if (!match) return null; + const title = match[0]; + return { + type: 'title', + content: title, + title: title.substr(1, title.length - 3) + }; +}; diff --git a/src/text/parse/index.ts b/src/text/parse/index.ts index b958da81b0..4bcedd22ac 100644 --- a/src/text/parse/index.ts +++ b/src/text/parse/index.ts @@ -4,6 +4,7 @@ const elements = [ require('./elements/bold'), + require('./elements/title'), require('./elements/url'), require('./elements/link'), require('./elements/mention'),