各种更新

css/base.css

@@ -24,8 +24,8 @@
 * {margin: 0;padding: 0;vertical-align: baseline;box-sizing:border-box;}
 
 /* HTML5 display-role reset for older browsers */
-article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
+article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section,content {display: block;}
-img {border:0;display:block;}
+img {border:0;display:inline-block;}
 ol, ul {list-style: none;}
 blockquote, q {quotes: none;}
 blockquote:before, blockquote:after,
@@ -33,7 +33,7 @@ q:before, q:after {content: '';content: none;}
 table {border-collapse: collapse;border-spacing: 0;}
 
 .do-fn-cl { *zoom: 1; }
-.do-fn-cl:after {visibility: hidden;overflow:hidden; display: block;height: 0;content: "."; clear: both;} 
+.do-fn-cl:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; overflow:hidden;} 
 .do-fn-clear {clear:both;display:inline;}
 
 .do-fn-show{display:block;}

css/base.min.css

@@ -1 +0,0 @@
-@charset "UTF-8";*{margin:0;padding:0;vertical-align:baseline;box-sizing:border-box}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}img{border:0;display:block}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}.do-fn-cl{*zoom:1}.do-fn-cl:after{content:".";display:block;height:0;clear:both;visibility:hidden;overflow:hidden}.do-fn-clear{clear:both;display:inline}.do-fn-show{display:block}.do-fn-hide{display:none}.do-fn-fl{float:left}.do-fn-fr{float:right}.do-fn-noselect{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.do-fn-noselect a,.do-fn-noselect img{-webkit-user-drag:none}.do-fn-ell{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.do-st-thin{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.do-st-hand{cursor:pointer}

css/basic-elem.css

@@ -0,0 +1 @@
+.do-ui-button{display:inline-block;padding:0 5px;text-align:center;font-size:12px;transition:all .1s ease-in-out}.do-ui-button.medium{min-width:100px;height:35px;line-height:35px;font-size:15px}.do-ui-button.large{min-width:150px;height:50px;line-height:50px;font-size:18px}.do-ui-button.radius-3{border-radius:3px}.do-ui-button.radius-5{border-radius:5px}.do-ui-button.green{background:#1abc9c;color:#fff}.do-ui-button.green:hover{background:#48c9b0}.do-ui-button.green:active{background:#16a085}.do-ui-button.blue{background:#3498db;color:#fff}.do-ui-button.blue:hover{background:#5dade2}.do-ui-button.blue:active{background:#2c81ba}.do-ui-button.red{background:#e74c3c;color:#fff}.do-ui-button.red:hover{background:#ec7063}.do-ui-button.red:active{background:#c54133}.do-ui-button.orange{background:#f39c12;color:#fff}.do-ui-button.orange:hover{background:#f1c40f}.do-ui-button.orange:active{background:#e67e22}.do-ui-button.plain{background:#e7e8eb;color:#34495e}.do-ui-button.plain:hover{background:#ecf0f1}.do-ui-button.plain:active{background:#bdc3c7}.do-ui-button.grey{background:#34495e;color:#fff}.do-ui-button.grey:hover{background:#5d6d7e}.do-ui-button.grey:active{background:#2c3e50}.do-ui-input{display:inline-block;min-height:30px;padding:0 5px;border:1px solid #bdc3c7;background:#fff;color:#34495e;outline:none;transition:all .1s ease-in-out}.do-ui-input::-webkit-input-placeholder{color:#bdc3c7}.do-ui-input.radius-3{border-radius:3px}.do-ui-input.radius-5{border-radius:5px}.do-ui-input:focus{border-color:#1abc9c}.do-ui-input.alert{border-color:#e74c3c;color:#e74c3c}.do-ui-input.disabled{border-color:transparent;background:#e7e8eb;color:#bdc3c7}.do-ui-select{display:inline-block;min-height:30px;padding:0 5px;border:1px solid #bdc3c7;background:#fff;color:#34495e;outline:none;-moz-appearance:none;transition:all .1s ease-in-out}.do-ui-select::-ms-expand{display:none}.do-ui-select.radius-3{border-radius:3px}.do-ui-select.radius-5{border-radius:5px}.do-ui-select:focus{border-color:#1abc9c}.do-ui-select.alert{border-color:#e74c3c;color:#e74c3c}.do-ui-select.disabled{border-color:transparent;background:#e7e8eb;color:#bdc3c7}.do-ui-radio,.do-ui-checkbox{display:inline-block;position:relative;width:auto;height:auto;min-height:30px;padding-left:50px;background:#fff}.do-ui-radio>input,.do-ui-checkbox>input{position:absolute;left:25px;top:5px;width:20px;height:20px;outline:none;-webkit-appearance:none;background:#fff;border:2px solid #1abc9c;border-radius:3px}.do-ui-radio>input:checked,.do-ui-checkbox>input:checked{background:#1abc9c}.do-ui-checkbox>input:checked{box-shadow:inset 0 0 0 2px #fff}.do-ui-radio>input{left:10px;width:35px;border-radius:10px;border-color:#bdc3c7;background:#bdc3c7}.do-ui-radio>input::after{float:left;display:block;width:16px;height:16px;border-radius:50%;content:"";background:#fff}.do-ui-radio>input:checked{border-color:#1abc9c}.do-ui-radio>input:checked::after{float:right}

css/basic-elem.scss

@@ -0,0 +1,98 @@
+@charset "UTF-8";
+/**
+ * 
+ * @authors yutent (yutent@doui.cc)
+ * @date    2017-05-20 21:35:30
+ * @version $Id$
+ */
+
+$cg: #1abc9c #48c9b0 #16a085;
+$cb: #3498db #5dade2 #2c81ba;
+$cr: #e74c3c #ec7063 #c54133;
+$co: #f39c12 #f1c40f #e67e22;
+$cp: #e7e8eb #ecf0f1 #bdc3c7;
+$cgr: #34495e #5d6d7e #2c3e50;
+
+@mixin ts($c: all, $t: .1s, $m: ease-in-out){
+    transition:$c $t $m;
+}
+/*--------各种按钮---------*/
+.do-ui-button {display:inline-block;padding:0 5px;text-align:center;font-size:12px;@include ts;
+
+    &.medium {min-width:100px;height:35px;line-height:35px;font-size:15px}
+    &.large {min-width:150px;height:50px;line-height:50px;font-size:18px;}
+    &.radius-3 {border-radius:3px;}
+    &.radius-5 {border-radius:5px;}
+
+    &.green {background:nth($cg, 1);color:#fff;}
+    &.green:hover {background:nth($cg, 2);}
+    &.green:active {background:nth($cg, 3);}
+    &.blue {background:nth($cb, 1);color:#fff;}
+    &.blue:hover {background:nth($cb, 2);}
+    &.blue:active {background:nth($cb, 3);}
+    &.red {background:nth($cr, 1);color:#fff;}
+    &.red:hover {background:nth($cr, 2);}
+    &.red:active {background:nth($cr, 3);}
+    &.orange {background:nth($co, 1);color:#fff;}
+    &.orange:hover {background:nth($co, 2);}
+    &.orange:active {background:nth($co, 3);}
+    &.plain {background:nth($cp, 1);color:nth($cgr, 1);}
+    &.plain:hover {background:nth($cp, 2);}
+    &.plain:active {background:nth($cp, 3);}
+    &.grey {background:nth($cgr, 1);color:#fff;}
+    &.grey:hover {background:nth($cgr, 2);}
+    &.grey:active {background:nth($cgr, 3);}
+}
+
+
+
+
+/*--------各种input---------*/
+
+
+.do-ui-input {display:inline-block;min-height:30px;padding:0 5px;border:1px solid nth($cp, 3);background:#fff;color:nth($cgr, 1);outline:none;@include ts;
+
+    &::-webkit-input-placeholder {color:nth($cp, 3);}
+
+    &.radius-3 {border-radius:3px;}
+    &.radius-5 {border-radius:5px;}
+    
+    &:focus {border-color:nth($cg, 1);}
+    &.alert {border-color:nth($cr, 1);color:nth($cr, 1)}
+    &.disabled {border-color:transparent;background:nth($cp, 1);color:nth($cp, 3)}
+
+}
+
+
+
+.do-ui-select {display:inline-block;min-height:30px;padding:0 5px;border:1px solid nth($cp, 3);background:#fff;color:nth($cgr, 1);outline:none;-moz-appearance: none;@include ts;
+    
+    &::-ms-expand {display:none;}
+    &.radius-3 {border-radius:3px;}
+    &.radius-5 {border-radius:5px;}
+
+    &:focus {border-color:nth($cg, 1);}
+    &.alert {border-color:nth($cr, 1);color:nth($cr, 1)}
+    &.disabled {border-color:transparent;background:nth($cp, 1);color:nth($cp, 3)}
+}
+
+
+.do-ui-radio,
+.do-ui-checkbox {display:inline-block;position:relative;width:auto;height:auto;min-height:30px;padding-left:50px;background:#fff;
+    
+    >input {position:absolute;left:25px;top:5px;width:20px;height:20px;outline:none;-webkit-appearance:none;background:#fff;border:2px solid nth($cg, 1);border-radius:3px;
+        
+        &:checked {background:nth($cg, 1);}
+    }
+}
+.do-ui-checkbox {
+    >input:checked {box-shadow:inset 0 0 0 2px #fff;}
+}
+.do-ui-radio {
+    >input {left:10px;width:35px;border-radius:10px;border-color:nth($cp, 3);background:nth($cp, 3);
+        
+        &::after {float:left;display:block;width:16px;height:16px;border-radius:50%;content:"";background:#fff;}
+        &:checked {border-color:nth($cg, 1);}
+        &:checked::after {float: right;}
+    }
+}

js/lib/layer/base.js

@@ -188,9 +188,9 @@ define(['yua', 'lib/drag', 'css!./skin/def'], function(yua){
                 conf.menubar = false;
                 return __layer.open(conf)
             },
-            prompt: function(msg, callback){
+            prompt: function(msg, yescb, nocb){
-                if(typeof callback !== 'function'){
+                if(typeof yescb !== 'function'){
-                    return console.error('argument [callback] requires a function, but ' + (typeof callback) + ' given')
+                    return console.error('argument [callback] requires a function, but ' + (typeof yescb) + ' given')
                 }
                 var conf = {
                         type: 3,
@@ -199,9 +199,12 @@ define(['yua', 'lib/drag', 'css!./skin/def'], function(yua){
                         title: msg,
                         content: '<input class="prompt-value" :duplex="prompt" />',
                         yes: function(id){
-                            callback(id, yua.vmodels[id].prompt)
+                            yescb(id, yua.vmodels[id].prompt)
                         }
                     }
+                if(typeof nocb === 'function'){
+                    conf.no = nocb
+                }
                 return __layer.open(conf)
             },
             use: function(skin, callback){
@@ -486,7 +489,7 @@ define(['yua', 'lib/drag', 'css!./skin/def'], function(yua){
                 this.init.$id = uuid();
             }
             if(this.init.icon > 17){
-                this.icon.icon = 17
+                this.init.icon = 17
             }
             //base版没有iframe类型
             if(this.init.type === 4){

js/lib/marked/marked.js

@@ -762,7 +762,8 @@ function Renderer(options) {
 }
 
 Renderer.prototype.code = function(code, lang, escaped) {
-
+    code = code.replace(/&lt;script&gt;/g, '<script>')
+            .replace(/&lt;\/script&gt;/g, '</script>')
     if (this.options.highlight) {
         var out = this.options.highlight(code, lang);
         if (out != null && out !== code) {
@@ -798,15 +799,15 @@ Renderer.prototype.code = function(code, lang, escaped) {
             }
         }
 
-        output += '<section><em class="linenum do-fn-noselect">'
+        output += /*'<section><em class="linenum do-fn-noselect">'
         + idx
         + '.</em>'
-        + '<code class="lang '
+        + */'<code class="lang '
         + lang
         + '">'
         + codes[idx - 1]
         + '\n</code>' //加\n为了避免空行时无法显示
-        + '</section>'
+        // + '</section>'
     }
 
     return '<pre class="do-ui-blockcode">'
@@ -886,6 +887,7 @@ Renderer.prototype.em = function(text) {
 };
 
 Renderer.prototype.codespan = function(txt) {
+    txt = txt.replace(/&amp;/g, '&')
     return '<code class="do-ui-inlinecode">' + txt + '</code>';
 };
 

js/lib/meditor/addon/attach.css

@@ -36,22 +36,24 @@
 
 .do-meditor-attach .cont-box .select-file  {width:100%;height:35px;line-height:33px}
 .do-meditor-attach .cont-box .select-file span.file  {float:left;width:100px;height:35px;border:1px solid #ddd;background:#f7f7f7;color:#666;text-align:center;cursor:pointer;}
+.do-meditor-attach .cont-box .select-file span.tips  {display:inline-block;padding:0 10px;line-height:35px;color:#666;}
 .do-meditor-attach .cont-box .upload-box  {width:100%;height:auto;min-height:190px;margin:10px 0;border:1px solid #e2e2e2;}
 .do-meditor-attach .cont-box .upload-box .tr {width:100%;height:35px;line-height:35px;text-align:center;}
 .do-meditor-attach .cont-box .upload-box .tr:hover {background:#fafafa}
 .do-meditor-attach .cont-box .upload-box .thead {line-height:34px;border-bottom:1px solid #e2e2e2;background:#f7f7f7;}
 
 .do-meditor-attach .cont-box .upload-box .td {float:left;}
-.do-meditor-attach .cont-box .upload-box .td.name {width:50%;}
+.do-meditor-attach .cont-box .upload-box .td.name {width:45%;}
-.do-meditor-attach .cont-box .upload-box .td.progress {width:20%;}
+.do-meditor-attach .cont-box .upload-box .td.progress {width:40%;}
-.do-meditor-attach .cont-box .upload-box .td.option {width:30%;}
+.do-meditor-attach .cont-box .upload-box .td.option {width:15%;}
 .do-meditor-attach .cont-box .upload-box .td.option a {display:inline-block;padding:3px 5px;line-height:13px;border:1px solid #e2e2e2;background:#f7f7f7;color:#666;}
+.do-meditor-attach .cont-box .upload-box .td .red {color:#f30;}
 
 .do-meditor-attach .cont-box .manager {overflow:hidden;overflow-y:auto;width:100%;height:320px;padding:10px;}
-.do-meditor-attach .cont-box .manager .item {float:left;width:22%;height:130px;margin:10px 1.5%;}
+.do-meditor-attach .cont-box .manager .item {float:left;width:22%;height:130px;margin:10px 1.5%;padding:5px;}
 .do-meditor-attach .cont-box .manager .item:hover {background:#f7f7f7;}
 .do-meditor-attach .cont-box .manager .thumb {display:block;width:100%;height:100px;}
-.do-meditor-attach .cont-box .manager .name {overflow:hidden;line-height:30px;text-align:center;}
+.do-meditor-attach .cont-box .manager .name {overflow:hidden;height:20px;line-height:30px;text-align:center;}
 .do-meditor-attach .cont-box .manager img {width:100%;height:100%;}
 .do-meditor-attach .cont-box .manager .attac-icon {display:inline-block;width:100%;height:100px;text-align:center;font:50px/100px "edicon" !important;-webkit-font-smoothing: antialiased;-webkit-text-stroke-width: 0.2px;-moz-osx-font-smoothing: grayscale;}
 

js/lib/meditor/addon/attach.js

@@ -78,6 +78,28 @@ define([
     }
 
 
+    function uploadScreenshot(vm, blob){
+        var upload = new Uploader(vm.uploadUrl || ME.uploadUrl)
+        if(ME.beforeUpload){
+            ME.beforeUpload(Date.now().toString(16) + '.jpg', function(qn){
+                upload.field('file', blob)
+                    .field('token', qn.token)
+                    .field('key', qn.key)
+                    .onEnd(function(json){
+                        ME.insert(vm.$editor, '![截图](' + qn.url + ')')
+                    })
+                    .start()
+            })
+        }else{
+            upload.field('file', blob)
+                .onEnd(function(json){
+                    ME.insert(vm.$editor, '![截图](' + json.data.url + ')')
+                })
+                .start()
+        }
+    }
+
+
     var $init = function(vm){
             if(!vm.uploadUrl && !ME.uploadUrl){
                 console.error('使用附件上传,必须先设置uploadUrl;\n可以给vm增加uploadUrl属性,也可以通过ME.uploadUrl设置')
@@ -85,7 +107,9 @@ define([
             if(!vm.manageUrl && !ME.manageUrl){
                 console.error('使用附件管理功能,必须先设置manageUrl;\n可以给vm增加manageUrl属性,也可以通过ME.manageUrl设置')
             }
-            // ME.addon.image()
+            if(!ME.maxSize){
+                ME.maxSize = 4194304
+            }
 
             vm.$editor.addEventListener('paste', function(ev){
                 var txt = ev.clipboardData.getData('text/plain').trim(),
@@ -107,12 +131,45 @@ define([
                     }
 
                     if(blob !== null) {
-                        var upload = new Uploader(vm.uploadUrl || ME.uploadUrl)
+                        layer.msg('截图处理中...')
+                        // 压缩截图,避免文件过大
+                        var reader = new FileReader()
+                        reader.onload = function(){
+                            var img = document.createElement('img'),
+                                canvas = document.createElement('canvas')
 
-                        upload.field('image', blob)
+                            img.onload = function(){
-                            .onEnd(function(json){
+                                canvas.width = img.width
-                            ME.insert(vm.$editor, '![截图](' + json.data.url + ')')
+                                canvas.height = img.height
-                        }).start()
+
+                                var ctx = canvas.getContext('2d')
+                                ctx.clearRect(0,0, canvas.width, canvas.height)
+                                ctx.drawImage(this, 0, 0, canvas.width, canvas.height)
+
+
+                                if(canvas.toBlob){
+                                    canvas.toBlob(function(obj){
+                                        uploadScreenshot(vm, obj)
+                                    }, 'image/jpeg', 0.8)
+                                }else{
+                                    var base64 = canvas.toDataURL('image/jpeg', 0.8),
+                                        buf = atob(base64.split(',')[1]),
+                                        arrBuf = new ArrayBuffer(buf.length),
+                                        intArr = new Uint8Array(arrBuf),
+                                        obj = null;
+
+                                    for(var i = 0; i < buf.length; i++){
+                                        intArr[i] = buf.charCodeAt(i)
+                                    }
+                                    obj = new Blob([intArr], {type: 'image/jpeg'})
+                                    uploadScreenshot(vm, obj)
+                                }
+
+                                
+                            }
+                            img.src = this.result
+                        }
+                        reader.readAsDataURL(blob)
                     }
                 }
                 ev.preventDefault()
@@ -131,7 +188,7 @@ define([
         fixCont = function(){
             return '<div class="do-meditor-attach meditor-font">'
                 + '<dl class="attach-wrap">'
-                    + '<dt class="tab-box">'
+                    + '<dt class="tab-box" :drag="do-layer" data-limit="window">'
                         + '<span class="item" :class="active:tab === 1" :click="$switch(1)">' + lang[openType][0] +'</span>'
                         + '<span class="item" :class="active:tab === 2" :click="$switch(2)">本地上传</span>'
                         + '<span class="item" :class="active:tab === 3" :click="$switch(3)">' + lang[openType][1] + '</span>'
@@ -150,12 +207,14 @@ define([
                             + '</section>'
                         + '</div>'
                         + '<div class="local" :visible="tab === 2">'
-                            + '<div class="select-file"><input id="meditor-attch" multiple :change="$change" type="file" class="hide" /><span class="file" :click="$select">选择文件</span></div>'
+                            + '<div class="select-file"><input id="meditor-attch" multiple :change="$change" type="file" class="hide" /><span class="file" :click="$select">选择文件</span><span class="tips">(上传大小限制:单文件最大'
+                                + (ME.maxSize/1048576).toFixed(2)
+                                + 'MB)</span></div>'
                             + '<ul class="upload-box">'
                                 + '<li class="tr thead"><span class="td name">文件名</span><span class="td progress">上传进度</span><span class="td option">操作</span></li>'
                                 + '<li class="tr" :repeat="uploadFile">'
                                     + '<span class="td name" :text="el.name"></span>'
-                                    + '<span class="td progress" :text="el.progress"></span>'
+                                    + '<span class="td progress" :html="el.progress"></span>'
                                     + '<span class="td option"><a href="javascript:;" :click="$insert(el)">插入</a></span>'
                                 + '</li>'
                             + '</ul>'
@@ -163,7 +222,7 @@ define([
                         + '<ul class="manager" :visible="tab === 3">'
                             + '<li class="item" :repeat="attachList" :click="$insert(el)">'
                                 + '<span class="thumb" :html="el.thumb"></span>'
-                                + '<p class="name" :text="el.name"></p>'
+                                + '<p class="name" :attr-title="el.name" :text="el.name"></p>'
                             + '</li>'
                         + '</ul>'
                     + '</dt>'
@@ -179,22 +238,44 @@ define([
      */
     function uploadFile(files, vm){
         for(var i = 0, it; it = files[i++];){
-            if(openType === 'image' && !/image/.test(it.type)){
+
+            if(openType === 'image' && !/\.(jpg|jpeg|png|gif|bmp|webp|ico)$/.test(it.name)){
+                vm.uploadFile.push({name: it.name, progress: '<span class="red">0%(失败,不允许的文件类型)</span>', url: ''})
                 continue
             }
+            if(it.size > ME.maxSize){
+                vm.uploadFile.push({name: it.name, progress: '<span class="red">0%(文件体积过大)</span>', url: ''})
+                continue
+            }
+            var fixName = Date.now().toString(16) + it.name.slice(it.name.lastIndexOf('.'))
+
             var idx = vm.uploadFile.length,
                 upload = new Uploader(vm.uploadUrl || ME.uploadUrl)
 
-
             vm.uploadFile.push({name: it.name, progress: '0%', url: ''})
-            upload.field(openType, it)
+
+            upload.field('file', it)
+
+            if(ME.beforeUpload){
+                ME.beforeUpload(fixName, function(qn){
+                    
+                    upload.field('token', qn.token)
+                        .field('key', qn.key)
                         .onProgress(function(val){
                             vm.uploadFile[idx].progress = val + '%'
+                        }).onEnd(function(json){
+                            vm.uploadFile[idx].url = qn.url
+                        }).start()
+                })
+            }else{
+                upload.onProgress(function(val){
+                        vm.uploadFile[idx].progress = val + '%'
                     }).onEnd(function(json){
                         vm.uploadFile[idx].url = json.data.url
                     }).start()
             }
         }
+    }
 
     function getAttach(vm, cb){
         var xhr = new XMLHttpRequest(),
@@ -232,7 +313,8 @@ define([
                 type: 7,
                 menubar: false,
                 shade: false,
-                offset: [offset.top + 37],
+                fixed: true,
+                offset: [offset.top + 37 - document.body.scrollTop],
                 tab: 2,
                 attach: '',
                 attachAlt: '',
@@ -264,6 +346,9 @@ define([
                 $select: yua.noop,
                 $change: yua.noop,
                 $insert: function(it){
+                    if(!it.url){
+                        return
+                    }
                     var val = (openType === 'image' ? '!' : '')
                             + '[' + it.name + '](' + it.url + ')'
                     ME.insert(vm.$editor, val)

js/lib/meditor/addon/base.js

@@ -42,7 +42,7 @@ define(['lib/layer/base'], function(){
                         ME.insert(vm.$editor, wrap)
                         layer.close(h1Obj)
                     },
-                    offset: [offset.top + 37, 'auto', 'auto', offset.left],
+                    offset: [offset.top + 37 - document.body.scrollTop, 'auto', 'auto', offset.left - document.body.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>'
@@ -121,7 +121,7 @@ define(['lib/layer/base'], function(){
                         ME.insert(vm.$editor, val)
                         layer.close(layid)
                     },
-                    offset: [offset.top + 37, 'auto', 'auto', offset.left],
+                    offset: [offset.top + 37 - document.body.scrollTop, 'auto', 'auto', offset.left - document.body.scrollLeft],
                     content: '<div class="do-meditor-common meditor-font">'
                         + '<section><span class="label">链接文字</span>'
                             + '<input class="input" :duplex="linkName" />'
@@ -151,7 +151,7 @@ define(['lib/layer/base'], function(){
                     fixed: true,
                     shadeClose: true,
                     arr: getOrderArr(36),
-                    offset: [offset.top + 37, 'auto', 'auto', offset.left],
+                    offset: [offset.top + 37 - document.body.scrollTop, 'auto', 'auto', offset.left - document.body.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>',
@@ -168,7 +168,7 @@ define(['lib/layer/base'], function(){
                 title: '0行 x 0列',
                 fixed: true,
                 shadeClose: true,
-                offset: [offset.top + 37, 'auto', 'auto', offset.left],
+                offset: [offset.top + 37 - document.body.scrollTop, 'auto', 'auto', offset.left - document.body.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>'
@@ -239,7 +239,7 @@ define(['lib/layer/base'], function(){
                         ME.insert(vm.$editor, val)
                         layer.close(layid)
                     },
-                    offset: [offset.top + 37, 'auto', 'auto', offset.left],
+                    offset: [offset.top + 37 - document.body.scrollTop, 'auto', 'auto', offset.left - document.body.scrollLeft],
                     content: '<div class="do-meditor-common meditor-font">'
                         + '<section><span class="label">图片描述</span>'
                             + '<input class="input" :duplex="imgAlt" />'
@@ -313,7 +313,7 @@ define(['lib/layer/base'], function(){
                     content: '<div class="do-meditor-codeblock meditor-font">'
                         + '<section><span class="label">语言类型</span>'
                             + '<select :duplex="lang">'
-                                + '<option :ME.repeat="$lang" :attr-value="el.id">{{el.name || el.id}}</option>'
+                                + '<option :repeat="$lang" :attr-value="el.id">{{el.name || el.id}}</option>'
                             + '</select>'
                         + '</section>'
                         + '<section>'
@@ -333,19 +333,14 @@ define(['lib/layer/base'], function(){
         },
         fullscreen: function(elem, vm){
             vm.fullscreen = !vm.fullscreen
-            if(vm.fullscreen){
+            vm.$onFullscreen(vm.fullscreen)
-                vm.preview = true
-                vm.htmlTxt = vm.$htmlTxt
-            }else{
-                vm.preview = false
-            }
         },
         about: function(elem){
             var offset = yua(elem).offset()
             layer.open({
                 type: 7,
                 title: '关于编辑器',
-                offset: [offset.top + 37],
+                offset: [offset.top + 37 - document.body.scrollTop],
                 content: '<div class="do-meditor-about meditor-font">'
                     + '<pre>'
                     + ' __  __ _____    _ _ _\n'             

js/lib/meditor/main.js

@@ -21,6 +21,7 @@ define([
         }
     })
 
+    var editorVM = []
     yua.ui.meditor = '0.0.1'
     //存放编辑器公共静态资源
     window.ME = {
@@ -28,11 +29,13 @@ define([
         toolbar: { //工具栏title
             pipe: '',
             h1: '标题',
+            quote: '引用文本',
             bold: '粗体',
             italic: '斜体',
             through: '删除线',
             unordered: '无序列表',
             ordered: '有序列表',
+            link: '超链接',
             hr: '横线',
             time: '插入当前时间',
             face: '表情',
@@ -47,7 +50,7 @@ define([
         },
         addon: {}, //已有插件
         //往文本框中插入内容
-        insert: function(dom, val){
+        insert: function(dom, val, isSelect){
             if(document.selection){
                 dom.focus()
                 var range = document.selection.createRange()
@@ -64,8 +67,7 @@ define([
                     + val
                     + dom.value.slice(endPos, dom.value.length);
 
-                
+                dom.selectionStart = isSelect ? startPos : (startPos + val.length)
-                dom.selectionStart = startPos
                 dom.selectionEnd = startPos + val.length
                 dom.scrollTop = scrollTop
                 dom.focus()
@@ -123,6 +125,33 @@ define([
                 }
                 return result
             }
+        },
+        get: function(id){
+            if(id === void 0){
+                id = editorVM.length - 1
+            }
+            var vm = editorVM[id]
+            if(vm){
+                return {
+                    id: vm.$id,
+                    getVal: function(){
+                        return vm.plainTxt.trim()
+                    },
+                    getHtml: function(){
+                        return vm.$htmlTxt
+                    },
+                    setVal: function(txt){
+                        vm.plainTxt = txt
+                    },
+                    show: function(){
+                        vm.editorVisible = true
+                    },
+                    hide: function(){
+                        vm.editorVisible = false
+                    }
+                }
+            }
+            return null
         }
     }
     //获取真实的引用路径,避免因为不同的目录结构导致加载失败的情况
@@ -274,14 +303,14 @@ define([
 
 
         yua.component('meditor', {
-            $template: '<div class="do-meditor meditor-font" :class="{fullscreen: fullscreen}">'
+            $template: '<div class="do-meditor meditor-font" '
+                + ':visible="editorVisible" '
+                + ':class="{fullscreen: fullscreen, preview: preview}">'
                 + '<div class="tool-bar do-fn-noselect">{toolbar}</div>'
                 + '<div class="editor-body">'
                     + '<textarea spellcheck="false" :duplex="plainTxt" :attr="{disabled: disabled}" :on-paste="$paste($event)" id="{uuid}"></textarea>'
                 + '</div>'
-                + '<div class="editor-md-preview" :visible="preview">'
+                + '<content class="md-preview" :visible="preview" :html="htmlTxt"></content>'
-                    + '<content class="preview" :html="htmlTxt"></content>'
-                + '</div>'
             + '</div>',
             $$template: function(txt){
                 
@@ -300,6 +329,10 @@ define([
                     })
                     delete base.$addons
                 }
+                if(base.hasOwnProperty('$show')){
+                    base.editorVisible = base.$show
+                    delete base.$show
+                }
                 return base
             },
             $init: function(vm){
@@ -324,6 +357,7 @@ define([
             $ready: function(vm){
                 vm.$editor = document.querySelector('#' + vm.$id)
                 
+                editorVM.push(vm)
                 //自动加载额外的插件
                 require(extraAddons, function(){
                     var args = Array.prototype.slice.call(arguments, 0)
@@ -334,17 +368,27 @@ define([
 
                 yua(vm.$editor).bind('keydown', function(ev){
                     
-                    //tab键改为插入4个空格,阻止默认事件,防止焦点失去
+                    var wrap = ME.selection(vm.$editor) || '',
+                        select = !!wrap;
+                    //tab键改为插入2个空格,阻止默认事件,防止焦点失去
                     if(ev.keyCode === 9){
-                        var wrap = ME.selection(vm.$editor) || ''
                         wrap = wrap.split('\n').map(function(it){
                             return ev.shiftKey ? it.replace(/^\s\s/, '') : '  ' + it
                         }).join('\n')
-                        ME.insert(this, wrap)
+                        ME.insert(this, wrap, select)
                         ev.preventDefault()
                     }
+                    //修复按退格键删除选中文本时,选中的状态不更新的bug
+                    if(ev.keyCode === 8){
+                        if(select){
+                            ME.insert(this, '', select)
+                            ev.preventDefault()
+                        }
+                    }
                     
                 })
+                //编辑器成功加载的回调
+                vm.$onSuccess(ME.get(), vm)
             },
             $paste: function(ev){
                 var txt = ev.clipboardData.getData('text/plain').trim(),
@@ -360,15 +404,22 @@ define([
                 ev.preventDefault()
             },
             $compile: function(){
+                var txt = this.plainTxt.trim()
+                txt = txt.replace(/<script>/g, '&lt;script&gt;')
+                    .replace(/<\/script>/g, '&lt;/script&gt;')
+                
                 //只解析,不渲染
-                this.$htmlTxt = marked(this.plainTxt.trim())
+                this.$htmlTxt = marked(txt)
             },
             $onToolbarClick: yua.noop,
+            $onSuccess: yua.noop,
             $onUpdate: yua.noop,
+            $onFullscreen: yua.noop,
             disabled: false, //禁用编辑器
-            fullscreen: true, //是否全屏
+            fullscreen: false, //是否全屏
             preview: false, //是否显示预览
             $editor: null, //编辑器元素
+            editorVisible: true,
             $htmlTxt: '', //临时储存html文本
             htmlTxt: '', //用于预览渲染
             plainTxt: '' //纯md文本

js/lib/meditor/skin/main.css

@@ -17,7 +17,7 @@
 ::-webkit-scrollbar-thumb {background:#cad5d5;}
 ::-webkit-scrollbar-thumb:hover {background:#9bacac;}
 
-.do-meditor {position:relative;width:100%;height:100%;min-height:180px;border:1px solid #ddd;background:#fff;color:#666;}
+.do-meditor {position:relative;width:100%;height:100%;min-height:180px;padding-top:43px;border:1px solid #ddd;background:#fff;color:#666;}
 .meditor-font {font-family:"PingFang SC","Helvetica Neue","Hiragino Sans GB","Segoe UI","Microsoft YaHei",sans-serif;}
 
 
@@ -25,7 +25,7 @@
 
 /* 关于编辑器模块*/
 .do-meditor-about {width:400px;padding:10px 20px;}
-.do-meditor-about pre {padding-bottom:15px}
+.do-meditor-about pre {padding-bottom:15px;line-height:1;}
 .do-meditor-about a {color:#049789}
 .do-meditor-about p {margin:0 auto 5px;}
 
@@ -79,7 +79,7 @@
 
 
 
-.do-meditor .tool-bar {position:relative;z-index:99;width:100%;height:auto;min-height:43px;padding:5px 10px;border-bottom:1px solid #ddd;background:#f5f5f5;color:#666;}
+.do-meditor .tool-bar {overflow:hidden;position:absolute;top:0;left:0;z-index:99;width:100%;height:43px;padding:5px 10px;border-bottom:1px solid #ddd;background:#f5f5f5;color:#666;}
 .do-meditor .tool-bar .edicon {display:inline-block;width:30px;height:32px;text-align:center;font:20px/32px "edicon" !important;-webkit-font-smoothing: antialiased;-webkit-text-stroke-width: 0.2px;-moz-osx-font-smoothing: grayscale;}
 .do-meditor .tool-bar .edicon:hover {background:#e5e5e5;}
 .do-meditor .tool-bar .icon-pipe {width:20px;}
@@ -107,46 +107,48 @@
 .do-meditor .tool-bar .icon-help::before {content:"\e614"}
 
 
-.do-meditor .editor-body {float:left;position:absolute;z-index:89;left:0;top:0;width:100%;height:100%;padding-top:43px;}
+.do-meditor .editor-body {float:left;width:100%;height:100%;background:#fff;}
-.do-meditor .editor-body>textarea {overflow:hidden;overflow-y:auto;width:100%;height:100%;padding:5px;border:0;outline:none;resize:none;color:#666;}
+.do-meditor .editor-body>textarea {overflow:hidden;overflow-y:auto;width:100%;height:100%;padding:5px;border:0;outline:none;resize:none;color:#666;background:none;}
-.do-meditor .editor-md-preview {position:absolute;z-index:90;right:0;top:0;width:100%;height:100%;padding-top:43px;}
+.do-meditor .md-preview {float:right;overflow:hidden;overflow-y:auto;display:block;width:50%;height:100%;padding:10px;line-height:2;border-left:1px solid #ddd;color:#666;font-size:14px;background:#fff;}
-
-.do-meditor .editor-md-preview>content.preview {overflow:hidden;overflow-y:auto;display:block;width:100%;height:100%;padding:10px;color:#666;font-size:14px;background:#fff;}
 
 
-.do-meditor .editor-md-preview .md-hd {position:relative;margin:15px 0;padding-left:30px;font-weight:normal;font-size:17px;}
+.do-meditor .md-preview .md-hd {position:relative;margin:15px 0;padding-left:30px;font-weight:normal;font-size:17px;}
-.do-meditor .editor-md-preview h1.md-hd {padding-left:0;}
+.do-meditor .md-preview h1.md-hd {padding-left:0;}
-.do-meditor .editor-md-preview .md-hd a {position:relative;display:inline-block;padding:0 8px;background:#fff;color:#454545}
+.do-meditor .md-preview .md-hd a {position:relative;display:inline-block;padding:0 8px;background:#fff;color:#454545}
-.do-meditor .editor-md-preview h1.md-hd a {padding-left:0;color:#000;}
+.do-meditor .md-preview .md-hd a:hover {text-decoration:none;}
-.do-meditor .editor-md-preview h2.md-hd a {color:#000;}
+.do-meditor .md-preview h1.md-hd a {padding-left:0;color:#000;}
+.do-meditor .md-preview h2.md-hd a {color:#000;}
 
-.do-meditor .editor-md-preview h1.md-hd {margin:0 0 30px;font-size:25px;}
+.do-meditor .md-preview h1.md-hd {margin:0 0 30px;font-size:25px;}
-.do-meditor .editor-md-preview h2.md-hd {margin:20px 0;font-size:23px;}
+.do-meditor .md-preview h2.md-hd {margin:20px 0;font-size:23px;}
-.do-meditor .editor-md-preview h3.md-hd {margin:20px 0 15px;font-size:20px;}
+.do-meditor .md-preview h3.md-hd {margin:20px 0 15px;font-size:20px;}
-.do-meditor .editor-md-preview h1:after {display:block;width:100%;content:" ";border-bottom:1px solid #ddd;}
+.do-meditor .md-preview h1:after {display:block;width:100%;content:" ";border-bottom:1px solid #ddd;}
-.do-meditor .editor-md-preview h2:before,
+.do-meditor .md-preview h2:before,
-.do-meditor .editor-md-preview h3:before,
+.do-meditor .md-preview h3:before,
-.do-meditor .editor-md-preview h4:before,
+.do-meditor .md-preview h4:before,
-.do-meditor .editor-md-preview h5:before,
+.do-meditor .md-preview h5:before,
-.do-meditor .editor-md-preview h6:before {display:block;position:absolute;left:0;top:50%;width:100%;content:" ";border-bottom:1px solid #ddd;}
+.do-meditor .md-preview h6:before {display:block;position:absolute;left:0;top:50%;width:100%;content:" ";border-bottom:1px solid #ddd;}
 
-.do-meditor .editor-md-preview a {text-decoration:none;}
+.do-meditor .md-preview a {text-decoration:none;}
-.do-meditor .editor-md-preview blockquote {margin:10px 0;padding:5px 10px;border-left:5px solid #6bb294;background:#f7f7f7}
+.do-meditor .md-preview a:hover {text-decoration:underline;}
-.do-meditor .editor-md-preview table thead tr {background:#f2f2f2}
+.do-meditor .md-preview p {margin:15px 0;}
-.do-meditor .editor-md-preview table thead th {padding:0 8px;border:1px solid #ddd}
+.do-meditor .md-preview blockquote {margin:10px 0;padding:5px 10px;border-left:5px solid #6bb294;background:#f7f7f7}
-.do-meditor .editor-md-preview table tbody td {padding:0 8px;border:1px solid #ddd}
+.do-meditor .md-preview blockquote p {margin:0;}
+.do-meditor .md-preview table thead tr {background:#f2f2f2}
+.do-meditor .md-preview table thead th {padding:0 8px;border:1px solid #ddd}
+.do-meditor .md-preview table tbody td {padding:0 8px;border:1px solid #ddd}
 
-.do-meditor .editor-md-preview hr {margin:30px 0;}
+.do-meditor .md-preview hr {margin:30px 0;border-bottom:0;}
-.do-meditor .editor-md-preview ol {list-style:decimal inside none;}
+.do-meditor .md-preview ol {margin-left:2em;list-style:decimal outside none;}
-.do-meditor .editor-md-preview ul {list-style:disc inside none;}
+.do-meditor .md-preview ul {margin-left:2em;list-style:disc outside none;}
-.do-meditor .editor-md-preview li ol {margin-left:2em;}
+.do-meditor .md-preview li ol {margin-left:2em;}
-.do-meditor .editor-md-preview li ul {margin-left:2em;list-style-type: circle;}
+.do-meditor .md-preview li ul {margin-left:2em;list-style-type: circle;}
-.do-meditor .editor-md-preview li ol ul,
+.do-meditor .md-preview li ol ul,
-.do-meditor .editor-md-preview li ul ul {list-style-type: square;}
+.do-meditor .md-preview li ul ul {list-style-type: square;}
 
 
 /*全屏模式*/
 .do-meditor.fullscreen {position:fixed;left:0;top:0;z-index:999;}
 
+.do-meditor.preview .editor-body,
 .do-meditor.fullscreen .editor-body {width:50%}
-.do-meditor.fullscreen .editor-md-preview {width:50%;border-left:1px solid #ddd;}

js/lib/pages/main.css

@@ -1,10 +1,60 @@
-.do-pages {width:100%;height:auto;text-align:center;font-size:13px;}
+.do-pages {height:auto;text-align:center;font-size:13px;}
-.do-pages a.normal,.do-pages a.disabled,.do-pages a.curr {display:inline-block;width:auto;height:30px;padding:0 10px;margin:0 3px;line-height:30px;text-decoration:none;border-radius:3px;cursor:pointer;background:#6bb294;color:#fff;}
+.do-pages a {color:#34495e;}
-.do-pages a.disabled,.do-pages a.curr {background:none;color:#666;cursor:default}
+.do-pages.skin-1 {width:100%;}
-.do-pages a.disabled {padding:0;}
+.do-pages.skin-2 {float:right;width:auto;}
-.do-pages a.curr {font-weight:bold;font-size:15px;color:#429572;}
+.do-pages.skin-1 a.normal,
+.do-pages.skin-1 a.disabled,
+.do-pages.skin-1 a.curr {display:inline-block;width:auto;min-width:40px;height:40px;padding:0 10px;margin:0 3px;line-height:40px;text-decoration:none;cursor:pointer;}
+.do-pages.skin-2 a.normal,
+.do-pages.skin-2 a.disabled,
+.do-pages.skin-2 a.curr {float:left;width:auto;min-width:40px;height:40px;margin:0;padding:0 5px;line-height:40px;}
+
+
+.do-pages.green a.normal {background: #1abc9c;color: #fff; }
+.do-pages.green a.normal:hover {background: #48c9b0; }
+.do-pages.green.skin-2 a.curr,
+.do-pages.green a.normal:active {background: #16a085;color: #fff;}
+
+.do-pages.blue a.normal {background: #3498db;color: #fff; }
+.do-pages.blue a.normal:hover {background: #5dade2; }
+.do-pages.blue.skin-2 a.curr,
+.do-pages.blue a.normal:active {background: #2c81ba;color: #fff;}
+
+.do-pages.red a.normal {background: #e74c3c;color: #fff; }
+.do-pages.red a.normal:hover {background: #ec7063; }
+.do-pages.red.skin-2 a.curr,
+.do-pages.red a.normal:active {background: #c54133;color: #fff;}
+
+.do-pages.orange a.normal {background: #f39c12;color: #fff; }
+.do-pages.orange a.normal:hover {background: #f1c40f; }
+.do-pages.orange.skin-2 a.curr,
+.do-pages.orange a.normal:active {background: #e67e22;color: #fff;}
+
+.do-pages.plain a.normal {background: #e7e8eb;color: #34495e; }
+.do-pages.plain a.normal:hover {background: #ecf0f1; }
+.do-pages.plain.skin-2 a.curr,
+.do-pages.plain a.normal:active {background: #bdc3c7;color: #34495e; }
+
+.do-pages.grey a.normal {background: #34495e;color: #fff; }
+
+.do-pages.grey a.normal:hover {background: #5d6d7e; }
+.do-pages.grey.skin-2 a.curr,
+.do-pages.grey a.normal:active {background: #2c3e50; color: #fff;}
+
+.do-pages.skin-1 a.disabled,
+.do-pages.skin-1 a.curr {background:none;color:#666;cursor:default}
+
+.do-pages.skin-1 a.disabled {min-width:0;padding:0;}
+.do-pages.skin-1 a.curr {font-weight:bold;font-size:15px;}
+
+.do-pages.skin-2 a.disabled {display:none;}
+
+
+.do-pages.skin-1 .input-box,
+.do-pages.skin-1 .input-box span,
+.do-pages.skin-1 .input-box input {display:inline-block}
+.do-pages.skin-1 .input-box input {width:25px;height:20px;padding:0 3px;background:#fff;border:1px solid #ddd}
+.do-pages.skin-1 .input-box a.normal{height:30px;line-height:30px;}
+
+.do-pages.skin-2 .input-box {display:none;}
 
-.do-pages a.normal:hover{background:#429572;}
-.do-pages a.normal:active{background:#64bf99;}
-.do-pages .input-box,.do-pages .input-box span,.do-pages .input-box input {display:inline-block}
-.do-pages .input-box input {width:25px;height:20px;padding:0 3px;background:#fff;border:1px solid #ddd}

js/lib/pages/main.htm

@@ -1,4 +1,4 @@
-<div class="do-pages do-fn-noselect" :class="{{'skin-' + skin}}">
+<div class="do-pages do-fn-noselect" :class="{{theme}}">
     <a class="normal"
         :if="curr > 1 && !simpleMode"
         :attr="{href: $setUrl(1)}"

js/lib/pages/main.js

@@ -2,6 +2,8 @@
 define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
 
     yua.ui.pages = '0.0.1'
+    var colors = {plain: 1, green: 1, blue: 1, red: 1, orange: 1, grey: 1},
+        themes = ['skin-1 ', 'skin-2 '];
     //计算页码列表
     function calculate(vm){
         if (vm.total < 2)
@@ -21,7 +23,8 @@ define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
         if(vm.curr + mid < vm.total){
             arr.push('...')
         }
-        vm.pageList = arr
+        vm.pageList.clear()
+        vm.pageList.pushArray(arr)
     }
 
     function update(pid, vm) {
@@ -39,6 +42,20 @@ define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
 
     return yua.component('pages', {
         $template: tpl,
+        $construct: function(a, b, c){
+            yua.mix(a, b, c)
+            a.theme = themes[a.theme>>0]
+            if(!a.theme){
+                a.theme = themes[0]
+            }
+            if(a.color && colors[a.color]){
+                a.theme += a.color
+            }else{
+                a.theme += 'plain'
+            }
+            delete a.color
+            return a
+        },
         $init: function(vm) {
 
             calculate(vm)
@@ -55,6 +72,10 @@ define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
                     return vm.url.replace('{id}', val)
                 }
             }
+            vm.$forceReset = function(){
+                vm.curr = 1
+                calculate(vm)
+            }
 
             vm.$jump = function(ev, val) {
                 if ('...' !== val) {
@@ -62,7 +83,7 @@ define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
 
                     if (val !== void 0){
                         if('javascript:;' !== link){
-                            location.hash = link
+                            location.href = link
                         }
                         var pid = val >> 0;
                         update(pid, vm)
@@ -90,6 +111,9 @@ define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
                 }
             })
         },
+        $ready: function(vm){
+            vm.$onSuccess(vm)
+        },
         curr: 1,
         total: 1,
         max: 5,
@@ -104,9 +128,12 @@ define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
             home: "首页",
             end: "末页"
         },
-        $skipArray: ['max', 'btns', 'url'],
+        theme: '',
+        $skipArray: ['max', 'btns', 'url', 'theme'],
         $setUrl: yua.noop,
         $jump: yua.noop,
-        $onJump: yua.noop
+        $onJump: yua.noop,
+        $onSuccess: yua.noop,
+        $forceReset: yua.noop,
     })
 });

js/lib/request/request.es5.js

@@ -49,7 +49,7 @@ define(['yua'], function(yua){
     win.Xhr = function(){
         return new XMLHttpRequest()
     }
-    // var supportCors = 'withCredentials' in Xhr()
+    var supportCors = 'withCredentials' in Xhr()
 
     // ------------------- 几个解释方法 -----------------------
 
@@ -543,6 +543,8 @@ define(['yua'], function(yua){
         // 2.2 如果不是跨域请求，则自动加上一条header信息，用以标识这是ajax请求
         if(!this.opt.crossDomain){
             this.set('X-Requested-With', 'XMLHttpRequest')
+        }else{
+            supportCors && (this.xhr.withCredentials = true)
         }
 
 

js/lib/router/router.js

@@ -87,9 +87,16 @@ define(['yua'], function(){
             this.errorFn && this.errorFn(hash);
         },
         on: function(rule, callback){
+            var _this = this
+            if(Array.isArray(rule)){
+                rule.forEach(function(it){
+                    _this._add('get', it, callback);
+                })
+            }else{
                 this._add('get', rule, callback);
             }
         }
+    }
 
     yua.bind(window, 'load', function(){
         if(!yua.router.started)

js/lib/tree/main.js

@@ -12,12 +12,12 @@ define(['yua', 'css!./skin/def.css'], function(){
     //储存版本信息
     yua.ui.tree = '0.0.1'
 
-    var box = '<ul class="do-tree skin-{skin}">{li}</ul>',
+    var box = '<ul>{li}</ul>',
         ul = '<ul :class="{open: {it}.open}">{li}</ul>',
         li = '<li :class="{open: {it}.open, dir: {it}.children}">'
-        + '<em :click="$toggle({it})"></em><span '
+            + '<em :click="$toggle({it})"></em>'
-        + ':click="$click({it})" '
+            + '<span :click="$select({it})" :class="{active: {it}.id === currItem}" :text="{it}.name"></span>'
-        + ':text="{it}.name"></span>{child}</li>';
+            + '{child}</li>';
 
 
     function repeat(arr, name){
@@ -30,51 +30,62 @@ define(['yua', 'css!./skin/def.css'], function(){
             if(it.children){
                 child += repeat(it.children, from +'.children')
                 child = ul.replace('{li}', child).replace('{it}', from)
-            }
-            if(child){
-                
             }
             html = html.replace(/\{child\}/, child)
         })
 
-        
         return html
     }
 
-    return yua.component('tree', {
+    function format(arr){
-        $template: '',
+        var tmp = {}, farr = []
-        $construct: function(base, opt, attr){
+        arr.sort(function(a, b){
-            if(!opt.from && !attr.from){
+            return (a.pid === b.pid) ? (a.sort - b.sort) : (a.pid - b.pid)
-                throw new Error('tree组件必须传入「from」属性')
+        })
+        arr.forEach(function(it){
+            tmp[it.id] = it
+            var parentItem = tmp[it.pid]
+            delete it.pid
+            
+            if(!parentItem){
+                return farr.push(tmp[it.id])
+            }
+            parentItem.open = !!parentItem.open
+            parentItem.children = parentItem.children || []
+            parentItem.children.push(it)
+        })
+        tmp = arr = null
+        return farr
     }
 
-            var from = attr.from || opt.from,
+    return yua.component('tree', {
-                arr = base.$up[from].$model,
+        $template: '<div class="do-tree" :class="{{$skin}}" :html="treeHTML"></div>',
-                tpl = repeat(arr, from)
-
-            delete attr.from
-            delete opt.from
-            yua.mix(base, opt, attr)
-
-            base.skin = base.skin || 'def'
-
-
-            tpl = box.replace('{li}', tpl).replace('{skin}', base.skin)
-
-            base.$template = tpl
-            
-            return base
-        },
         $init: function(vm){
-            
+            vm.$select = function(obj){
-            vm.$click = function(obj){
+                vm.currItem = obj.id
-                
                 if(vm.$onClick){
                     vm.$onClick(obj)
                 }
             }
+            vm.$update = function(arr){
+                vm.treeArr.clear()
+                vm.treeArr.pushArray(format(arr))
+                vm.currItem = -1
+                var tpl = repeat(vm.treeArr.$model, 'treeArr')
+                vm.treeHTML = box.replace('{li}', tpl)
+            }
         },
-        $click: yua.noop,
+        $ready: function(vm){
+            vm.$onSuccess(vm)
+        },
+        $skin: 'skin-def',
+        treeHTML: '',
+        currItem: -1,
+        treeArr: [],
+        $select: yua.noop,
+        $update: yua.noop,
+        $onSuccess: yua.noop,
+        $onClick: yua.noop,
         $toggle: function(obj){
             obj.open = !obj.open
         }

js/lib/tree/skin/def.css

@@ -1,46 +1 @@
-@charset "UTF-8";
+.do-fn-cl:after{content:".";display:block;height:0;clear:both;visibility:hidden;overflow:hidden}.do-tree,.do-tree *{margin:0;padding:0;vertical-align:baseline;box-sizing:border-box}@font-face{font-family:"treeicon";src:url("iconfont.eot");src:url("iconfont.ttf") format("truetype")}.do-tree{overflow:hidden;overflow-y:auto;position:relative;width:100%;height:100%;line-height:28px}.do-tree ul{width:100%;height:auto}.do-tree li{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.do-tree li ul{display:none;margin-left:20px}.do-tree li ul.open{display:block}.do-tree li em,.do-tree li span{display:block;cursor:pointer}.do-tree li em{float:left;padding:0 5px;color:#000;font-family:"treeicon" !important;font-style:normal;-webkit-font-smoothing:antialiased;-webkit-text-stroke-width:0.2px;-moz-osx-font-smoothing:grayscale}.do-tree li span:hover{color:#6bb294}.do-tree li span.active{color:#000;font-weight:bold}.do-tree.skin-def li>em::before{content:"\e610"}.do-tree.skin-def li.dir>em::before{content:"\e622"}.do-tree.skin-def li.dir.open>em::before{content:"\e8ea"}.do-tree.skin-light li>em::before{content:"\e73e"}.do-tree.skin-light li.dir>em::before{content:"\e635"}.do-tree.skin-light li.dir.open>em::before{content:"\e8ea"}.do-tree.skin-line li>em::before{content:"\e60e"}.do-tree.skin-line li.dir>em::before{content:"\e608";font-weight:bold}.do-tree.skin-line li.dir.open>em::before{content:"\e662"}.do-tree.skin-arrow li>em::before{content:"\e73e"}.do-tree.skin-arrow li.dir>em::before{content:"\e616";font-weight:bold}.do-tree.skin-arrow li.dir.open>em::before{content:"\e607"}
-/**
- * 
- * @authors yutent (yutent@doui.cc)
- * @date    2017-04-14 21:18:53
- * 
- */
-
-
-.do-fn-cl:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; overflow:hidden;} 
-.do-tree, .do-tree * {margin: 0;padding: 0;vertical-align: baseline;box-sizing:border-box;}
-
-@font-face {font-family: "iconfont";
-  src: url('iconfont.eot'); /* IE9*/
-  src: url('iconfont.ttf') format('truetype'); /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
-}
-
-.do-tree {width:100%;height:auto;line-height:28px;}
-
-.do-tree li {overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
-
-.do-tree li ul {display:none;margin-left:20px;}
-.do-tree li ul.open {display:block;}
-
-.do-tree li em,
-.do-tree li span {display:block;cursor:pointer;}
-.do-tree li em {float:left;padding:0 5px;color:#000;font-family:"iconfont" !important;font-style:normal;-webkit-font-smoothing: antialiased;-webkit-text-stroke-width: 0.2px;-moz-osx-font-smoothing: grayscale;}
-.do-tree li span:hover {color:#6bb294;}
-
-.do-tree.skin-def li>em::before {content:"\e610";}
-.do-tree.skin-def li.dir>em::before {content:"\e622";}
-.do-tree.skin-def li.dir.open>em::before {content:"\e8ea";}
-
-.do-tree.skin-light li>em::before {content:"\e73e";}
-.do-tree.skin-light li.dir>em::before {content:"\e635";}
-.do-tree.skin-light li.dir.open>em::before {content:"\e8ea";}
-
-
-.do-tree.skin-line li>em::before {content:"\e60e";}
-.do-tree.skin-line li.dir>em::before {content:"\e608";font-weight:bold;}
-.do-tree.skin-line li.dir.open>em::before {content:"\e662";}
-
-
-.do-tree.skin-arrow li>em::before {content:"\e73e";}
-.do-tree.skin-arrow li.dir>em::before {content:"\e616";font-weight:bold;}
-.do-tree.skin-arrow li.dir.open>em::before {content:"\e607";}

js/lib/tree/skin/def.scss

@@ -0,0 +1,48 @@
+@charset "UTF-8";
+/**
+ * 
+ * @authors yutent (yutent@doui.cc)
+ * @date    2017-04-14 21:18:53
+ * 
+ */
+
+
+.do-fn-cl:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; overflow:hidden;} 
+.do-tree, .do-tree * {margin: 0;padding: 0;vertical-align: baseline;box-sizing:border-box;}
+
+@font-face {font-family: "treeicon";
+  src: url('iconfont.eot'); /* IE9*/
+  src: url('iconfont.ttf') format('truetype'); /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
+}
+
+.do-tree {overflow:hidden;overflow-y:auto;position:relative;width:100%;height:100%;line-height:28px;}
+.do-tree ul {width:100%;height:auto;}
+
+.do-tree li {overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
+
+.do-tree li ul {display:none;margin-left:20px;}
+.do-tree li ul.open {display:block;}
+
+.do-tree li em,
+.do-tree li span {display:block;cursor:pointer;}
+.do-tree li em {float:left;padding:0 5px;color:#000;font-family:"treeicon" !important;font-style:normal;-webkit-font-smoothing: antialiased;-webkit-text-stroke-width: 0.2px;-moz-osx-font-smoothing: grayscale;}
+.do-tree li span:hover {color:#6bb294;}
+.do-tree li span.active {color:#000;font-weight:bold;}
+
+.do-tree.skin-def li>em::before {content:"\e610";}
+.do-tree.skin-def li.dir>em::before {content:"\e622";}
+.do-tree.skin-def li.dir.open>em::before {content:"\e8ea";}
+
+.do-tree.skin-light li>em::before {content:"\e73e";}
+.do-tree.skin-light li.dir>em::before {content:"\e635";}
+.do-tree.skin-light li.dir.open>em::before {content:"\e8ea";}
+
+
+.do-tree.skin-line li>em::before {content:"\e60e";}
+.do-tree.skin-line li.dir>em::before {content:"\e608";font-weight:bold;}
+.do-tree.skin-line li.dir.open>em::before {content:"\e662";}
+
+
+.do-tree.skin-arrow li>em::before {content:"\e73e";}
+.do-tree.skin-arrow li.dir>em::before {content:"\e616";font-weight:bold;}
+.do-tree.skin-arrow li.dir.open>em::before {content:"\e607";}

js/lib/uploader/uploader.min.js

@@ -0,0 +1 @@
+"use strict";define(function(){var e=function(){this.init()};return e.prototype={init:function(){return this.xhr=new XMLHttpRequest,this.form=new FormData,this.field={},this.header={},this},setUrl:function(e){return e&&"string"==typeof e?(this.url=e,this):console.error("url不能为空且必须是字符串")},setField:function(e,r){if("object"==typeof e)for(var t in e)this.field[t]=e[t];else this.field[e]=r;return this},setHeader:function(e,r){if("object"==typeof e)for(var t in e)this.header[t]=e[t];else this.header[e]=r;return this},start:function(){var e=this;if(!this.url)return console.error("请先设置url");this.xhr.open("POST",this.url,!0);for(var r in this.field)this.form.append(r,this.field[r]);var t=Date.now();this.xhr.upload.addEventListener("progress",function(r){if(r.lengthComputable&&e.progress){var s=Date.now(),i=1e3*r.loaded/1024,n={loaded:r.loaded,time:s-t};n.speed=i/n.time,n.speed<10?n.speed=Math.floor(1024*n.speed)+" B/s":n.speed=n.speed.toFixed(2)+" KB/s",n.progress=Math.round(100*r.loaded/r.total),e.progress(n)}},!1),this.xhr.onreadystatechange=function(){if(4===e.xhr.readyState&&200===e.xhr.status&&""!==e.xhr.responseText){var r=e.xhr.responseText;try{r=JSON.parse(r)}catch(e){}e.end&&e.end(r)}else 200!==e.xhr.status&&e.xhr.responseText&&e.error&&e.error(e.xhr.responseText)},this.xhr.send(this.form)},onProgress:function(e){return this.progress=e,this},onEnd:function(e){return this.end=e,this},onError:function(e){return this.error=e,this}},window.Uploader||(window.Uploader=e),e});

js/yua-touch.js

@@ -65,10 +65,21 @@ var W3C = window.dispatchEvent
 var root = DOC.documentElement
 var yuaFragment = DOC.createDocumentFragment()
 var cinerator = DOC.createElement("div")
-var class2type = {}
+var class2type = {
-"Boolean Number String Function Array Date RegExp Object Error".replace(rword, function (name) {
+        '[object Boolean]': 'boolean',
-    class2type["[object " + name + "]"] = name.toLowerCase()
+        '[object Number]': 'number',
-})
+        '[object String]': 'string',
+        '[object Function]': 'function',
+        '[object Array]': 'array',
+        '[object Date]': 'date',
+        '[object RegExp]': 'regexp',
+        '[object Object]': 'object',
+        '[object Error]': 'error',
+        '[object AsyncFunction]': 'asyncfunction',
+        '[object Promise]': 'promise',
+        '[object Generator]': 'generator',
+        '[object GeneratorFunction]': 'generatorfunction'
+    }
 var bindingID = 1024
 var IEVersion = NaN
 if (window.VBArray) {
@@ -531,6 +542,7 @@ yua.mix({
         }
         return result
     },
+    deepCopy: toJson,
     eventHooks: {},
     /*绑定事件*/
     bind: function (el, type, fn, phase) {
@@ -3088,10 +3100,6 @@ var rnoscanAttrBinding = /^if|widget|repeat$/
 var rnoscanNodeBinding = /^html|include$/
 
 function scanNodeList(elem, vmodels) {
-    if(isWidget(elem)){
-        // elem = elem.content
-        log(elem)
-    }
     var nodes = yua.slice(elem.childNodes)
     scanNodeArray(nodes, vmodels)
 }
@@ -3361,10 +3369,10 @@ yua.component = function (name, opts) {
 
 
                 //==========构建VM=========
-                var keepSlot = componentDefinition.$slot
-                var keepReplace = componentDefinition.$replace
                 var keepContainer = componentDefinition.$container
                 var keepTemplate = componentDefinition.$template
+                delete componentDefinition.$up
+                delete componentDefinition.$ups
                 delete componentDefinition.$slot
                 delete componentDefinition.$replace
                 delete componentDefinition.$container
@@ -3700,8 +3708,8 @@ yua.directive("class", {
     },
     update: function (val) {
         var obj = val
-        if(!obj)
+        if(!obj || this.param)
-            return log('class绑定错误')
+            return log('class指令语法错误 %c %s="%s"', 'color:#f00', this.name, this.expr)
 
         if(typeof obj === 'string'){
             obj = {}
@@ -3712,9 +3720,6 @@ yua.directive("class", {
             obj = obj.$model
         }
 
-        if(this.param)
-            return log('不再支持:class-xx="yy"的写法', this.name)
-
         var $elem = yua(this.element)
         for(var i in obj){
             $elem.toggleClass(i, !!obj[i])
@@ -3745,7 +3750,7 @@ yua.directive("css", {
                     $elem.css(i, obj[i])
                 }
             }catch(err){
-                log('样式格式错误', val)
+                log('样式格式错误 %c %s="%s"', 'color:#f00', this.name, this.expr)
             }
         }else{
             $elem.css(this.param, val)
@@ -3786,8 +3791,8 @@ yua.directive('rule', {
     init: function(binding){
         if(binding.param && !__rules[binding.param]){
             __rules[binding.param] = [];
-            binding.target = __rules[binding.param]
         }
+        binding.target = __rules[binding.param]
     },
     update: function(obj){
         var _this = this,
@@ -4072,6 +4077,8 @@ var duplexBinding = yua.directive("duplex", {
         }
         switch (this.xtype) {
             case "input": 
+                elem.value = value;
+                break;
             case "change":
                 curValue = this.pipe(value, this, "set")  //fix #673
                 if (curValue !== this.oldValue) {

js/yua.js

@@ -65,10 +65,21 @@ var W3C = window.dispatchEvent
 var root = DOC.documentElement
 var yuaFragment = DOC.createDocumentFragment()
 var cinerator = DOC.createElement("div")
-var class2type = {}
+var class2type = {
-"Boolean Number String Function Array Date RegExp Object Error".replace(rword, function (name) {
+        '[object Boolean]': 'boolean',
-    class2type["[object " + name + "]"] = name.toLowerCase()
+        '[object Number]': 'number',
-})
+        '[object String]': 'string',
+        '[object Function]': 'function',
+        '[object Array]': 'array',
+        '[object Date]': 'date',
+        '[object RegExp]': 'regexp',
+        '[object Object]': 'object',
+        '[object Error]': 'error',
+        '[object AsyncFunction]': 'asyncfunction',
+        '[object Promise]': 'promise',
+        '[object Generator]': 'generator',
+        '[object GeneratorFunction]': 'generatorfunction'
+    }
 var bindingID = 1024
 var IEVersion = NaN
 if (window.VBArray) {
@@ -160,7 +171,6 @@ yua.isPlainObject = function (obj) {
     return serialize.call(obj) === "[object Object]" && Object.getPrototypeOf(obj) === oproto
 }
 
-
 var VMODELS = yua.vmodels = {} //所有vmodel都储存在这里
 yua.init = function (source) {
     if(yua.isPlainObject(source)){
@@ -531,6 +541,7 @@ yua.mix({
         }
         return result
     },
+    deepCopy: toJson,
     eventHooks: {},
     /*绑定事件*/
     bind: function (el, type, fn, phase) {
@@ -1604,7 +1615,7 @@ function toJson(val) {
         for (i in val) {
             if (val.hasOwnProperty(i)) {
                 var value = val[i]
-                obj[i] = value && value.nodeType ? value : toJson(value)
+                obj[i] = (value && value.nodeType) ? value : toJson(value)
             }
         }
         return obj
@@ -3088,10 +3099,6 @@ var rnoscanAttrBinding = /^if|widget|repeat$/
 var rnoscanNodeBinding = /^html|include$/
 
 function scanNodeList(elem, vmodels) {
-    if(isWidget(elem)){
-        // elem = elem.content
-        log(elem)
-    }
     var nodes = yua.slice(elem.childNodes)
     scanNodeArray(nodes, vmodels)
 }
@@ -3160,6 +3167,7 @@ function scanTag(elem, vmodels, node) {
 
         //把父级VM补上
         newVmodel.$up = vmodels[0]
+        hideProperty(newVmodel, "$up", null)
         //:important不包含父VM，:controller相反
         vmodels = node === b ? [newVmodel] : [newVmodel].concat(vmodels)
 
@@ -3360,11 +3368,12 @@ yua.component = function (name, opts) {
                 componentDefinition.$id = $id
 
 
+
                 //==========构建VM=========
-                var keepSlot = componentDefinition.$slot
-                var keepReplace = componentDefinition.$replace
                 var keepContainer = componentDefinition.$container
                 var keepTemplate = componentDefinition.$template
+                delete componentDefinition.$up
+                delete componentDefinition.$ups
                 delete componentDefinition.$slot
                 delete componentDefinition.$replace
                 delete componentDefinition.$container
@@ -3394,6 +3403,7 @@ yua.component = function (name, opts) {
                     child = tmpDom
                     tmpDom = null
                 }
+                
                 elem.parentNode.replaceChild(child, elem)
                 
                 child.msResolved = 1
@@ -3409,8 +3419,7 @@ yua.component = function (name, opts) {
                 if (keepContainer) {
                     keepContainer.appendChild(elem)
                 }
-                yua.fireDom(elem, "datasetchanged",
+                yua.fireDom(elem, "datasetchanged", {vm: vmodel, childReady: 1})
-                        {vm: vmodel, childReady: 1})
                 var children = 0
                 var removeFn = yua.bind(elem, "datasetchanged", function (e) {
                     if (e.childReady) {
@@ -3703,8 +3712,8 @@ yua.directive("class", {
     },
     update: function (val) {
         var obj = val
-        if(!obj)
+        if(!obj || this.param)
-            return log('class绑定错误')
+            return log('class指令语法错误 %c %s="%s"', 'color:#f00', this.name, this.expr)
 
         if(typeof obj === 'string'){
             obj = {}
@@ -3715,9 +3724,6 @@ yua.directive("class", {
             obj = obj.$model
         }
 
-        if(this.param)
-            return log('不再支持:class-xx="yy"的写法', this.name)
-
         var $elem = yua(this.element)
         for(var i in obj){
             $elem.toggleClass(i, !!obj[i])
@@ -3748,7 +3754,7 @@ yua.directive("css", {
                     $elem.css(i, obj[i])
                 }
             }catch(err){
-                log('样式格式错误', val)
+                log('样式格式错误 %c %s="%s"', 'color:#f00', this.name, this.expr)
             }
         }else{
             $elem.css(this.param, val)
@@ -3789,8 +3795,8 @@ yua.directive('rule', {
     init: function(binding){
         if(binding.param && !__rules[binding.param]){
             __rules[binding.param] = [];
-            binding.target = __rules[binding.param]
         }
+        binding.target = __rules[binding.param]
     },
     update: function(obj){
         var _this = this,
@@ -4075,6 +4081,8 @@ var duplexBinding = yua.directive("duplex", {
         }
         switch (this.xtype) {
             case "input": 
+                elem.value = value;
+                break;
             case "change":
                 curValue = this.pipe(value, this, "set")  //fix #673
                 if (curValue !== this.oldValue) {