From bbf5510bc8374735847a02dd91702a453fc50dbe Mon Sep 17 00:00:00 2001 From: JimQing Date: Sat, 4 Jul 2020 01:03:57 +0800 Subject: [PATCH 1/4] fix: code white-space fix --- src/components/codeMirror/header.vue | 37 ++++++++++++++++------------ src/scripts/renderers/wx-renderer.js | 2 +- src/scripts/util.js | 10 ++++++++ src/store/index.js | 5 ++-- 4 files changed, 34 insertions(+), 20 deletions(-) diff --git a/src/components/codeMirror/header.vue b/src/components/codeMirror/header.vue index 4143738..0de5ab0 100644 --- a/src/components/codeMirror/header.vue +++ b/src/components/codeMirror/header.vue @@ -58,7 +58,7 @@ - 复制 + 复制 关于
@@ -73,7 +73,8 @@ import { setColorWithCustomTemplate, setFontSize, - isImageIllegal + isImageIllegal, + fixCodeWhiteSpace } from '../../scripts/util' import fileApi from '../../api/file'; import { @@ -170,21 +171,25 @@ export default { return false; }, // 复制到微信公众号 - copy() { + copy(e) { this.$emit('startCopy'); setTimeout(() => { - let clipboardDiv = document.getElementById('output') - solveWeChatImage() - this.setHtml(solveHtml(this.nightMode)) + solveWeChatImage(); + fixCodeWhiteSpace(); + this.setOutput(solveHtml()); + let clipboardDiv = document.getElementById('output'); - clipboardDiv.focus() - window.getSelection().removeAllRanges() - let range = document.createRange() + clipboardDiv.focus(); + window.getSelection().removeAllRanges(); + let range = document.createRange(); - range.setStartBefore(clipboardDiv.firstChild) - range.setEndAfter(clipboardDiv.lastChild) - window.getSelection().addRange(range) - document.execCommand('copy') + range.setStartBefore(clipboardDiv.firstChild); + range.setEndAfter(clipboardDiv.lastChild); + window.getSelection().addRange(range); + document.execCommand('copy'); + range.setStartBefore(clipboardDiv.firstChild); + range.setEndAfter(clipboardDiv.firstChild); + fixCodeWhiteSpace('normal'); // 输出提示 this.$notify({ showClose: true, @@ -192,11 +197,11 @@ export default { offset: 80, duration: 1600, type: 'success' - }) - clipboardDiv.innerHTML = this.output; // 恢复现场 + }); this.$emit('refresh'); this.$emit('endCopy'); }, 350); + e.target.blur(); }, // 自定义CSS样式 async customStyle () { @@ -247,7 +252,7 @@ export default { document.body.removeChild(downLink) }, ...mapMutations(['clearEditorToDefault','setCurrentColor', 'setCiteStatus', 'themeChanged', - 'setHtml', 'setCurrentFont', 'setCurrentSize', 'setCssEditorValue', 'setWxRendererOptions']) + 'setOutput', 'setCurrentFont', 'setCurrentSize', 'setCssEditorValue', 'setWxRendererOptions']) }, mounted() { this.selectFont = this.currentFont; diff --git a/src/scripts/renderers/wx-renderer.js b/src/scripts/renderers/wx-renderer.js index 93ac65b..535c12d 100644 --- a/src/scripts/renderers/wx-renderer.js +++ b/src/scripts/renderers/wx-renderer.js @@ -140,7 +140,7 @@ const WxRenderer = function (opts) { return `
    ${numbers.join('')}
- 
+            
                 ${codeLines.join('')}
diff --git a/src/scripts/util.js b/src/scripts/util.js index aa48894..c70174e 100644 --- a/src/scripts/util.js +++ b/src/scripts/util.js @@ -204,3 +204,13 @@ export function formatDoc(content) { }) return doc } + +export function fixCodeWhiteSpace(value = 'pre') { + const preDomList = document.getElementsByClassName('code__pre'); + + if (preDomList.length > 0) { + preDomList.forEach(pre=> { + pre.style.whiteSpace = value; + }) + } +} \ No newline at end of file diff --git a/src/store/index.js b/src/store/index.js index 6bfc516..71669f2 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -18,7 +18,6 @@ const state = { output: '', editor: null, cssEditor: null, - html: '', currentFont: '', currentSize: '', currentColor: '', @@ -26,8 +25,8 @@ const state = { nightMode: false }; const mutations = { - setHtml(state, data) { - state.html = data; + setOutput(state, data) { + state.output = data; }, setEditorValue(state, data) { state.editor.setValue(data) From 90fe9d45b0d73e31a11ffe7caf373c359a01b4aa Mon Sep 17 00:00:00 2001 From: JimQing Date: Sat, 4 Jul 2020 01:18:02 +0800 Subject: [PATCH 2/4] fix: remove select ranges --- src/components/codeMirror/header.vue | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/codeMirror/header.vue b/src/components/codeMirror/header.vue index 0de5ab0..a240c03 100644 --- a/src/components/codeMirror/header.vue +++ b/src/components/codeMirror/header.vue @@ -187,8 +187,7 @@ export default { range.setEndAfter(clipboardDiv.lastChild); window.getSelection().addRange(range); document.execCommand('copy'); - range.setStartBefore(clipboardDiv.firstChild); - range.setEndAfter(clipboardDiv.firstChild); + window.getSelection().removeAllRanges() fixCodeWhiteSpace('normal'); // 输出提示 this.$notify({ From c8575cd0160172a036022c107712b58d24fc1d71 Mon Sep 17 00:00:00 2001 From: yanglbme Date: Sat, 4 Jul 2020 09:41:47 +0800 Subject: [PATCH 3/4] fix: resolve images issue --- src/components/codeMirror/header.vue | 8 +++++--- src/store/index.js | 5 +++-- 2 files changed, 8 insertions(+), 5 deletions(-) diff --git a/src/components/codeMirror/header.vue b/src/components/codeMirror/header.vue index a240c03..2652ea7 100644 --- a/src/components/codeMirror/header.vue +++ b/src/components/codeMirror/header.vue @@ -174,10 +174,10 @@ export default { copy(e) { this.$emit('startCopy'); setTimeout(() => { + let clipboardDiv = document.getElementById('output'); solveWeChatImage(); fixCodeWhiteSpace(); - this.setOutput(solveHtml()); - let clipboardDiv = document.getElementById('output'); + this.setHtml(solveHtml()); clipboardDiv.focus(); window.getSelection().removeAllRanges(); @@ -189,6 +189,8 @@ export default { document.execCommand('copy'); window.getSelection().removeAllRanges() fixCodeWhiteSpace('normal'); + + clipboardDiv.innerHTML = this.output; // 输出提示 this.$notify({ showClose: true, @@ -251,7 +253,7 @@ export default { document.body.removeChild(downLink) }, ...mapMutations(['clearEditorToDefault','setCurrentColor', 'setCiteStatus', 'themeChanged', - 'setOutput', 'setCurrentFont', 'setCurrentSize', 'setCssEditorValue', 'setWxRendererOptions']) + 'setHtml', 'setCurrentFont', 'setCurrentSize', 'setCssEditorValue', 'setWxRendererOptions']) }, mounted() { this.selectFont = this.currentFont; diff --git a/src/store/index.js b/src/store/index.js index 71669f2..0e9876e 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -16,6 +16,7 @@ Vue.use(Vuex) const state = { wxRenderer: null, output: '', + html: '', editor: null, cssEditor: null, currentFont: '', @@ -25,8 +26,8 @@ const state = { nightMode: false }; const mutations = { - setOutput(state, data) { - state.output = data; + setHtmL(state, data) { + state.html = data; }, setEditorValue(state, data) { state.editor.setValue(data) From 1541766a07d3c1a690bcb06399699a7a9708fbca Mon Sep 17 00:00:00 2001 From: yanglbme Date: Sat, 4 Jul 2020 10:28:19 +0800 Subject: [PATCH 4/4] build: release v1.3.3 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * 修复代码块滚动条消息并自动换行的问题(https://gitee.com/Doocs/md/issues/I1LQY4) * 修复侧边滚动条宽度问题 --- README.md | 1 + package.json | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 370462b..a9d7a4e 100644 --- a/README.md +++ b/README.md @@ -18,6 +18,7 @@ Markdown 文档自动即时渲染为微信图文，让你不再为微信文章排版而发愁！只要你会基本的 Markdown 语法，就能做出一篇样式简洁而又美观大方的微信图文。 ## 在线编辑器地址 + - Gitee Pages：https://doocs.gitee.io/md - GitHub Pages：https://doocs.github.io/md diff --git a/package.json b/package.json index 6800eaa..653cde0 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue-md", - "version": "1.3.2", + "version": "1.3.3", "private": true, "homepage": "https://doocs.gitee.io/md", "scripts": {