优化MD解析;修复MD编辑器样式定位bug

2023-08-30 · 2017-09-27 01:20:50 +08:00 · 2017-09-27 01:20:50 +08:00 · 055d15436a
parent a597117368
commit 055d15436a
4 changed files with 46 additions and 44 deletions
--- a/js/lib/marked/main.js
+++ b/js/lib/marked/main.js
@ -799,7 +799,7 @@ function Renderer(options) {
 }

 Renderer.prototype.code = function(code, lang, escaped) {
-    code = code.replace(/&lt;script&gt;/g, '<script>')
+    code = code.replace(/&lt;script([^&]*?)&gt;/g, '<script$1>')
            .replace(/&lt;\/script&gt;/g, '</script>')
    if (this.options.highlight) {
        var out = this.options.highlight(code, lang);
--- a/js/lib/meditor/addon/attach.js
+++ b/js/lib/meditor/addon/attach.js
@ -314,7 +314,7 @@ define([
                menubar: false,
                shade: false,
                fixed: true,
-                offset: [offset.top + 37 - document.body.scrollTop],
+                offset: [offset.top + 37 - document.documentElement.scrollTop],
                tab: 2,
                attach: '',
                attachAlt: '',
@ -355,10 +355,10 @@ define([
                },
                $confirm: function(){
                    var lvm = yua.vmodels[layid]
-                    if(!lvm.img || !lvm.imgAlt){
+                    if(!lvm.attach || !lvm.attachAlt){
                        return layer.alert('描述和地址不能为空')
                    }
-                    var val = '![' + lvm.imgAlt + '](' + lvm.img + ')'
+                    var val = '![' + lvm.attachAlt + '](' + lvm.attach + ')'

                    ME.insert(vm.$editor, val)
                    lvm.no()
--- a/js/lib/meditor/addon/base.js
+++ b/js/lib/meditor/addon/base.js
@ -31,7 +31,7 @@ define(['lib/layer/base'], function(){
        h1: function(elem, vm){
            var offset = yua(elem).offset(),
                wrap = ME.selection(vm.$editor, true) || '在此输入文本',
-                h1Obj = layer.open({
+                h1ID = layer.open({
                    type: 7,
                    menubar: false,
                    shadeClose: true,
@ -39,10 +39,10 @@ define(['lib/layer/base'], function(){
                    $insert: function(level){
                        wrap = wrap.replace(/^#{1,6} /, '')
                        wrap = ME.repeat('#', level) + ' ' + wrap
-                        ME.insert(vm.$editor, wrap)
-                        layer.close(h1Obj)
+                        ME.insert(vm.$editor, wrap, true)
+                        layer.close(h1ID)
                    },
-                    offset: [offset.top + 37 - document.body.scrollTop, 'auto', 'auto', offset.left - document.body.scrollLeft],
+                    offset: [offset.top + 37 - document.documentElement.scrollTop, 'auto', 'auto', offset.left - document.documentElement.scrollLeft],
                    content: '<ul class="do-meditor-h1 do-fn-noselect meditor-font">'
                        + '<li :click="$insert(1)" class="h1">一级标题</li>'
                        + '<li :click="$insert(2)" class="h2">二级标题</li>'
@ -57,7 +57,7 @@ define(['lib/layer/base'], function(){
            var wrap = ME.selection(vm.$editor) || '在此输入文本'
            wrap = '> ' + wrap

-            ME.insert(vm.$editor, wrap)
+            ME.insert(vm.$editor, wrap, true)
        },
        bold: function(elem, vm){
            var wrap = ME.selection(vm.$editor) || '在此输入文本',
@ -65,7 +65,7 @@ define(['lib/layer/base'], function(){

            wrap = wrap === wraped ? ('**' + wrap + '**') : wraped

-            ME.insert(vm.$editor, wrap)
+            ME.insert(vm.$editor, wrap, true)
        },
        italic: function(elem, vm){
            var wrap = ME.selection(vm.$editor) || '在此输入文本',
@ -73,7 +73,7 @@ define(['lib/layer/base'], function(){

            wrap = wrap === wraped ? ('_' + wrap + '_') : wraped

-            ME.insert(vm.$editor, wrap)
+            ME.insert(vm.$editor, wrap, true)
        },
        through: function(elem, vm){
            var wrap = ME.selection(vm.$editor) || '在此输入文本',
@ -81,22 +81,22 @@ define(['lib/layer/base'], function(){

            wrap = wrap === wraped ? ('~~' + wrap + '~~') : wraped

-            ME.insert(vm.$editor, wrap)
+            ME.insert(vm.$editor, wrap, true)
        },
        unordered: function(elem, vm){
            var wrap = ME.selection(vm.$editor) || '在此输入文本'
            wrap = '* ' + wrap

-            ME.insert(vm.$editor, wrap)
+            ME.insert(vm.$editor, wrap, false)
        },
        ordered: function(elem, vm){
            var wrap = ME.selection(vm.$editor) || '在此输入文本'
            wrap = '1. ' + wrap

-            ME.insert(vm.$editor, wrap)
+            ME.insert(vm.$editor, wrap, false)
        },
        hr: function(elem, vm){
-            ME.insert(vm.$editor, '\n\n---\n\n')
+            ME.insert(vm.$editor, '\n\n---\n\n', false)
        },
        link: function(elem, vm){
            var offset = yua(elem).offset(),
@ -118,10 +118,10 @@ define(['lib/layer/base'], function(){
                            + lvm.link
                            + (lvm.linkTarget === 1 ? ' "target=_blank"' : '')
                            + ')'
-                        ME.insert(vm.$editor, val)
+                        ME.insert(vm.$editor, val, false)
                        layer.close(layid)
                    },
-                    offset: [offset.top + 37 - document.body.scrollTop, 'auto', 'auto', offset.left - document.body.scrollLeft],
+                    offset: [offset.top + 37 - document.documentElement.scrollTop, 'auto', 'auto', offset.left - document.documentElement.scrollLeft],
                    content: '<div class="do-meditor-common meditor-font">'
                        + '<section><span class="label">链接文字</span>'
                            + '<input class="input" :duplex="linkName" />'
@ -140,7 +140,7 @@ define(['lib/layer/base'], function(){
                })
        },
        time: function(elem, vm){
-            ME.insert(vm.$editor, new Date().format())
+            ME.insert(vm.$editor, new Date().format(), false)
        },
        face: function(elem, vm){
            var offset = yua(elem).offset(),
@ -151,12 +151,12 @@ define(['lib/layer/base'], function(){
                    fixed: true,
                    shadeClose: true,
                    arr: getOrderArr(36),
-                    offset: [offset.top + 37 - document.body.scrollTop, 'auto', 'auto', offset.left - document.body.scrollLeft],
+                    offset: [offset.top + 37 - document.documentElement.scrollTop, 'auto', 'auto', offset.left - document.documentElement.scrollLeft],
                    content: '<ul class="do-meditor-face">'
                        + '<li class="item" :repeat="arr" ><img :attr-src="ME.path + \'/addon/face/\' + el + \'.gif\'" :click="$insert(this.src)" /></li>'
                        + '</ul>',
                    $insert: function(src){
-                        ME.insert(vm.$editor, '![](' + src + ')')
+                        ME.insert(vm.$editor, '![](' + src + ')', false)
                        layer.close(layid)
                    }
                })
@ -168,7 +168,7 @@ define(['lib/layer/base'], function(){
                title: '0行 x 0列',
                fixed: true,
                shadeClose: true,
-                offset: [offset.top + 37 - document.body.scrollTop, 'auto', 'auto', offset.left - document.body.scrollLeft],
+                offset: [offset.top + 37 - document.documentElement.scrollTop, 'auto', 'auto', offset.left - document.documentElement.scrollLeft],
                matrix: objArr(10).map(function(){return objArr(10)}),
                content: '<ul class="do-meditor-table">'
                    + '<li :repeat="matrix"><span :repeat-o="el" :class="{active: o.v}" :data="{x: $index, y: $outer.$index}"></span></li>'
@ -212,7 +212,7 @@ define(['lib/layer/base'], function(){
                            var val = '\n\n' + ME.repeat('| 表头 ', x) + '|\n'
                                    + ME.repeat('| -- ', x) + '|\n'
                                    + ME.repeat(ME.repeat('| ', x) + '|\n', y)
-                            ME.insert(vm.$editor, val)
+                            ME.insert(vm.$editor, val, false)
                            layer.close(id)
                        }
                    })
@ -236,10 +236,10 @@ define(['lib/layer/base'], function(){
                        }
                        var val = '![' + lvm.imgAlt + '](' + lvm.img + ')'

-                        ME.insert(vm.$editor, val)
+                        ME.insert(vm.$editor, val, false)
                        layer.close(layid)
                    },
-                    offset: [offset.top + 37 - document.body.scrollTop, 'auto', 'auto', offset.left - document.body.scrollLeft],
+                    offset: [offset.top + 37 - document.documentElement.scrollTop, 'auto', 'auto', offset.left - document.documentElement.scrollLeft],
                    content: '<div class="do-meditor-common meditor-font">'
                        + '<section><span class="label">图片描述</span>'
                            + '<input class="input" :duplex="imgAlt" />'
@ -254,12 +254,12 @@ define(['lib/layer/base'], function(){
                })
        },
        file: function(elem, vm){
-            this.link(elem, vm)
+            this.link(elem, vm, false)
        },
        inlinecode: function(elem, vm){
            var wrap = ME.selection(vm.$editor) || '在此输入文本'
            wrap = '`' + wrap + '`'
-            ME.insert(vm.$editor, wrap)
+            ME.insert(vm.$editor, wrap, true)
        },
        blockcode: function(elem, vm){
            var layid = layer.open({
@ -307,7 +307,7 @@ define(['lib/layer/base'], function(){
                        var lvm = yua.vmodels[layid]
                        var val = '\n```' + lvm.lang + '\n' + (lvm.code || '//在此输入代码') + '\n```\n'

-                        ME.insert(vm.$editor, val)
+                        ME.insert(vm.$editor, val, false)
                        layer.close(layid)
                    },
                    content: '<div class="do-meditor-codeblock meditor-font">'
@ -340,7 +340,7 @@ define(['lib/layer/base'], function(){
            layer.open({
                type: 7,
                title: '关于编辑器',
-                offset: [offset.top + 37 - document.body.scrollTop],
+                offset: [offset.top + 37 - document.documentElement.scrollTop],
                content: '<div class="do-meditor-about meditor-font">'
                    + '<pre>'
                    + ' __  __ _____    _ _ _\n'             
--- a/js/lib/meditor/main.js
+++ b/js/lib/meditor/main.js
@ -7,7 +7,7 @@

 "use strict";

-var log = console.log;
+
 define([
    'yua',
    'lib/prism/base',
@ -264,7 +264,6 @@ define([
                    }
                    return li.join('\n')
                })
-                log(match)
                return '\n' + match.trim()
            })
        }
@ -353,6 +352,21 @@ define([
                        console.log('%c没有对应的插件%c[%s]', 'color:#f00;', '',name)
                    }
                }
+
+                vm.$paste = function(ev){
+                    ev.preventDefault()
+                    var txt = ev.clipboardData.getData('text/plain').trim(),
+                        html = ev.clipboardData.getData('text/html').trim();
+
+                    html = html2md(html)
+                    
+                    if(html){
+                        ME.insert(this, html)
+                    }else if(txt) {
+                        ME.insert(this, txt)
+                    }
+                    vm.plainTxt = this.value
+                }
            },
            $ready: function(vm){
                vm.$editor = document.querySelector('#' + vm.$id)
@ -390,22 +404,10 @@ define([
                //编辑器成功加载的回调
                vm.$onSuccess(ME.get(), vm)
            },
-            $paste: function(ev){
-                var txt = ev.clipboardData.getData('text/plain').trim(),
-                    html = ev.clipboardData.getData('text/html').trim();
-
-                html = html2md(html)
-                
-                if(html){
-                    ME.insert(this, html)
-                }else if(txt) {
-                    ME.insert(this, txt)
-                }
-                ev.preventDefault()
-            },
+            $paste: yua.noop,
            $compile: function(){
                var txt = this.plainTxt.trim()
-                txt = txt.replace(/<script>/g, '&lt;script&gt;')
+                txt = txt.replace(/<script([^>]*?)>/g, '&lt;script$1&gt;')
                    .replace(/<\/script>/g, '&lt;/script&gt;')
                
                //只解析,不渲染