This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
bytedo
/
wcui
Archived
1
0
Fork 0
Code Issues Pull Requests Wiki Activity

各种更新

old
宇天 2017-07-11 17:40:45 +08:00
parent 4758fb26b5
commit e5aee134f3
24 changed files with 3307 additions and 278 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

94
css/base.css
View File

@ -1,47 +1,47 @@
@charset "UTF-8"; @charset "UTF-8";
/** /**
* *
* @authors yutent (yutent@doui.cc) * @authors yutent (yutent@doui.cc)
* @date 2014-10-10 00:45:09 * @date 2014-10-10 00:45:09
* *
* doui的CSS规范 * doui的CSS规范
* *
* 不能出现大写,以连字符风格命名 * 不能出现大写,以连字符风格命名
* 表示状态的应该用do-st-*命名 * 表示状态的应该用do-st-*命名
* 表示功能的应该用do-fn-*命名 * 表示功能的应该用do-fn-*命名
* 表示页面模块的应该用do-mod-modname 命名 * 表示页面模块的应该用do-mod-modname 命名
* 表示UI组件的应该用do-uiname命名, 它的子元素应该全部包在 .do-uiname这个根类下 * 表示UI组件的应该用do-uiname命名, 它的子元素应该全部包在 .do-uiname这个根类下
* 如 .do-layer .body { ... } * 如 .do-layer .body { ... }
* *
* 样式规则的出现顺序 * 样式规则的出现顺序
* 1 display float position overflow z-index 表示定位/布局的属性 * 1 display float position overflow z-index 表示定位/布局的属性
* 2 width height margin padding border 表示盒子模型的属性 * 2 width height margin padding border 表示盒子模型的属性
* 3 line-height font-size vertical-align text-align user-select outline ....排版相关的属性 * 3 line-height font-size vertical-align text-align user-select outline ....排版相关的属性
* 4 color background opacity cursor ...表示装饰相关的属性 * 4 color background opacity cursor ...表示装饰相关的属性
* 5 content list-style quotes ... 内容生成相关的属性 * 5 content list-style quotes ... 内容生成相关的属性
* *
*/ */
* {margin: 0;padding: 0;vertical-align: baseline;box-sizing:border-box;} * {margin: 0;padding: 0;vertical-align: baseline;box-sizing:border-box;}
/* HTML5 display-role reset for older browsers */ /* 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;} ol, ul {list-style: none;}
blockquote, q {quotes: none;} blockquote, q {quotes: none;}
blockquote:before, blockquote:after, blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;} q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;} table {border-collapse: collapse;border-spacing: 0;}
.do-fn-cl { *zoom: 1; } .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-clear {clear:both;display:inline;}
.do-fn-show{display:block;} .do-fn-show{display:block;}
.do-fn-hide{display:none;} .do-fn-hide{display:none;}
.do-fn-fl{float:left;} .do-fn-fl{float:left;}
.do-fn-fr{float:right;} .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 {-webkit-touch-callout: none;-webkit-user-select: none;-moz-user-select: none;user-select: none;}
.do-fn-noselect img, .do-fn-noselect a {-webkit-user-drag:none;} .do-fn-noselect img, .do-fn-noselect a {-webkit-user-drag:none;}
.do-fn-ell {overflow:hidden; white-space:nowrap; text-overflow:ellipsis } .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-thin {-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.do-st-hand {cursor:pointer;} .do-st-hand {cursor:pointer;}

1
css/base.min.css vendored
View File

@ -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}

1
css/basic-elem.css Normal file
View File

@ -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}

98
css/basic-elem.scss Normal file
View File

@ -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;}
}
}

13
js/lib/layer/base.js
View File

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

10
js/lib/marked/marked.js
View File

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

12
js/lib/meditor/addon/attach.css
View File

@ -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 {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.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 {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 {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 .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 .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 {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.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 {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 .item:hover {background:#f7f7f7;}
.do-meditor-attach .cont-box .manager .thumb {display:block;width:100%;height:100px;} .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 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;} .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;}

125
js/lib/meditor/addon/attach.js
View File

@ -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){ var $init = function(vm){
if(!vm.uploadUrl && !ME.uploadUrl){ if(!vm.uploadUrl && !ME.uploadUrl){
console.error('使用附件上传,必须先设置uploadUrl;\n可以给vm增加uploadUrl属性,也可以通过ME.uploadUrl设置') console.error('使用附件上传,必须先设置uploadUrl;\n可以给vm增加uploadUrl属性,也可以通过ME.uploadUrl设置')
@ -85,7 +107,9 @@ define([
if(!vm.manageUrl && !ME.manageUrl){ if(!vm.manageUrl && !ME.manageUrl){
console.error('使用附件管理功能,必须先设置manageUrl;\n可以给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){ vm.$editor.addEventListener('paste', function(ev){
var txt = ev.clipboardData.getData('text/plain').trim(), var txt = ev.clipboardData.getData('text/plain').trim(),
@ -107,12 +131,45 @@ define([
} }
if(blob !== null) { if(blob !== null) {
var upload = new Uploader(vm.uploadUrl || ME.uploadUrl) layer.msg('截图处理中...')
// 压缩截图,避免文件过大
upload.field('image', blob) var reader = new FileReader()
.onEnd(function(json){ reader.onload = function(){
ME.insert(vm.$editor, '![截图](' + json.data.url + ')') var img = document.createElement('img'),
}).start() canvas = document.createElement('canvas')
img.onload = function(){
canvas.width = img.width
canvas.height = img.height
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() ev.preventDefault()
@ -131,7 +188,7 @@ define([
fixCont = function(){ fixCont = function(){
return '<div class="do-meditor-attach meditor-font">' return '<div class="do-meditor-attach meditor-font">'
+ '<dl class="attach-wrap">' + '<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 === 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 === 2" :click="$switch(2)">本地上传</span>'
+ '<span class="item" :class="active:tab === 3" :click="$switch(3)">' + lang[openType][1] + '</span>' + '<span class="item" :class="active:tab === 3" :click="$switch(3)">' + lang[openType][1] + '</span>'
@ -150,12 +207,14 @@ define([
+ '</section>' + '</section>'
+ '</div>' + '</div>'
+ '<div class="local" :visible="tab === 2">' + '<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">' + '<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 thead"><span class="td name">文件名</span><span class="td progress">上传进度</span><span class="td option">操作</span></li>'
+ '<li class="tr" :repeat="uploadFile">' + '<li class="tr" :repeat="uploadFile">'
+ '<span class="td name" :text="el.name"></span>' + '<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>' + '<span class="td option"><a href="javascript:;" :click="$insert(el)">插入</a></span>'
+ '</li>' + '</li>'
+ '</ul>' + '</ul>'
@ -163,7 +222,7 @@ define([
+ '<ul class="manager" :visible="tab === 3">' + '<ul class="manager" :visible="tab === 3">'
+ '<li class="item" :repeat="attachList" :click="$insert(el)">' + '<li class="item" :repeat="attachList" :click="$insert(el)">'
+ '<span class="thumb" :html="el.thumb"></span>' + '<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>' + '</li>'
+ '</ul>' + '</ul>'
+ '</dt>' + '</dt>'
@ -179,20 +238,42 @@ define([
*/ */
function uploadFile(files, vm){ function uploadFile(files, vm){
for(var i = 0, it; it = files[i++];){ 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 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, var idx = vm.uploadFile.length,
upload = new Uploader(vm.uploadUrl || ME.uploadUrl) upload = new Uploader(vm.uploadUrl || ME.uploadUrl)
vm.uploadFile.push({name: it.name, progress: '0%', url: ''}) vm.uploadFile.push({name: it.name, progress: '0%', url: ''})
upload.field(openType, it)
.onProgress(function(val){ upload.field('file', it)
vm.uploadFile[idx].progress = val + '%'
}).onEnd(function(json){ if(ME.beforeUpload){
vm.uploadFile[idx].url = json.data.url ME.beforeUpload(fixName, function(qn){
}).start()
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()
}
} }
} }
@ -232,7 +313,8 @@ define([
type: 7, type: 7,
menubar: false, menubar: false,
shade: false, shade: false,
offset: [offset.top + 37], fixed: true,
offset: [offset.top + 37 - document.body.scrollTop],
tab: 2, tab: 2,
attach: '', attach: '',
attachAlt: '', attachAlt: '',
@ -264,6 +346,9 @@ define([
$select: yua.noop, $select: yua.noop,
$change: yua.noop, $change: yua.noop,
$insert: function(it){ $insert: function(it){
if(!it.url){
return
}
var val = (openType === 'image' ? '!' : '') var val = (openType === 'image' ? '!' : '')
+ '[' + it.name + '](' + it.url + ')' + '[' + it.name + '](' + it.url + ')'
ME.insert(vm.$editor, val) ME.insert(vm.$editor, val)

21
js/lib/meditor/addon/base.js
View File

@ -42,7 +42,7 @@ define(['lib/layer/base'], function(){
ME.insert(vm.$editor, wrap) ME.insert(vm.$editor, wrap)
layer.close(h1Obj) 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">' content: '<ul class="do-meditor-h1 do-fn-noselect meditor-font">'
+ '<li :click="$insert(1)" class="h1">一级标题</li>' + '<li :click="$insert(1)" class="h1">一级标题</li>'
+ '<li :click="$insert(2)" class="h2">二级标题</li>' + '<li :click="$insert(2)" class="h2">二级标题</li>'
@ -121,7 +121,7 @@ define(['lib/layer/base'], function(){
ME.insert(vm.$editor, val) ME.insert(vm.$editor, val)
layer.close(layid) 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">' content: '<div class="do-meditor-common meditor-font">'
+ '<section><span class="label">链接文字</span>' + '<section><span class="label">链接文字</span>'
+ '<input class="input" :duplex="linkName" />' + '<input class="input" :duplex="linkName" />'
@ -151,7 +151,7 @@ define(['lib/layer/base'], function(){
fixed: true, fixed: true,
shadeClose: true, shadeClose: true,
arr: getOrderArr(36), 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">' 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>' + '<li class="item" :repeat="arr" ><img :attr-src="ME.path + \'/addon/face/\' + el + \'.gif\'" :click="$insert(this.src)" /></li>'
+ '</ul>', + '</ul>',
@ -168,7 +168,7 @@ define(['lib/layer/base'], function(){
title: '0行 x 0列', title: '0行 x 0列',
fixed: true, fixed: true,
shadeClose: 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)}), matrix: objArr(10).map(function(){return objArr(10)}),
content: '<ul class="do-meditor-table">' 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>' + '<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) ME.insert(vm.$editor, val)
layer.close(layid) 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">' content: '<div class="do-meditor-common meditor-font">'
+ '<section><span class="label">图片描述</span>' + '<section><span class="label">图片描述</span>'
+ '<input class="input" :duplex="imgAlt" />' + '<input class="input" :duplex="imgAlt" />'
@ -313,7 +313,7 @@ define(['lib/layer/base'], function(){
content: '<div class="do-meditor-codeblock meditor-font">' content: '<div class="do-meditor-codeblock meditor-font">'
+ '<section><span class="label">语言类型</span>' + '<section><span class="label">语言类型</span>'
+ '<select :duplex="lang">' + '<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>' + '</select>'
+ '</section>' + '</section>'
+ '<section>' + '<section>'
@ -333,19 +333,14 @@ define(['lib/layer/base'], function(){
}, },
fullscreen: function(elem, vm){ fullscreen: function(elem, vm){
vm.fullscreen = !vm.fullscreen 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){ about: function(elem){
var offset = yua(elem).offset() var offset = yua(elem).offset()
layer.open({ layer.open({
type: 7, type: 7,
title: '关于编辑器', title: '关于编辑器',
offset: [offset.top + 37], offset: [offset.top + 37 - document.body.scrollTop],
content: '<div class="do-meditor-about meditor-font">' content: '<div class="do-meditor-about meditor-font">'
+ '<pre>' + '<pre>'
+ ' __ __ _____ _ _ _\n' + ' __ __ _____ _ _ _\n'

75
js/lib/meditor/main.js
View File

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

72
js/lib/meditor/skin/main.css
View File

@ -17,7 +17,7 @@
::-webkit-scrollbar-thumb {background:#cad5d5;} ::-webkit-scrollbar-thumb {background:#cad5d5;}
::-webkit-scrollbar-thumb:hover {background:#9bacac;} ::-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;} .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 {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 a {color:#049789}
.do-meditor-about p {margin:0 auto 5px;} .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 {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 .edicon:hover {background:#e5e5e5;}
.do-meditor .tool-bar .icon-pipe {width:20px;} .do-meditor .tool-bar .icon-pipe {width:20px;}
@ -107,46 +107,48 @@
.do-meditor .tool-bar .icon-help::before {content:"\e614"} .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.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-body {width:50%}
.do-meditor.fullscreen .editor-md-preview {width:50%;border-left:1px solid #ddd;}

68
js/lib/pages/main.css
View File

@ -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}

2
js/lib/pages/main.htm
View File

@ -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" <a class="normal"
:if="curr > 1 && !simpleMode" :if="curr > 1 && !simpleMode"
:attr="{href: $setUrl(1)}" :attr="{href: $setUrl(1)}"

35
js/lib/pages/main.js
View File

@ -2,6 +2,8 @@
define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) { define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
yua.ui.pages = '0.0.1' 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){ function calculate(vm){
if (vm.total < 2) if (vm.total < 2)
@ -21,7 +23,8 @@ define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
if(vm.curr + mid < vm.total){ if(vm.curr + mid < vm.total){
arr.push('...') arr.push('...')
} }
vm.pageList = arr vm.pageList.clear()
vm.pageList.pushArray(arr)
} }
function update(pid, vm) { function update(pid, vm) {
@ -39,6 +42,20 @@ define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
return yua.component('pages', { return yua.component('pages', {
$template: tpl, $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) { $init: function(vm) {
calculate(vm) calculate(vm)
@ -55,6 +72,10 @@ define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
return vm.url.replace('{id}', val) return vm.url.replace('{id}', val)
} }
} }
vm.$forceReset = function(){
vm.curr = 1
calculate(vm)
}
vm.$jump = function(ev, val) { vm.$jump = function(ev, val) {
if ('...' !== val) { if ('...' !== val) {
@ -62,7 +83,7 @@ define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
if (val !== void 0){ if (val !== void 0){
if('javascript:;' !== link){ if('javascript:;' !== link){
location.hash = link location.href = link
} }
var pid = val >> 0; var pid = val >> 0;
update(pid, vm) 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, curr: 1,
total: 1, total: 1,
max: 5, max: 5,
@ -104,9 +128,12 @@ define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
home: "首页", home: "首页",
end: "末页" end: "末页"
}, },
$skipArray: ['max', 'btns', 'url'], theme: '',
$skipArray: ['max', 'btns', 'url', 'theme'],
$setUrl: yua.noop, $setUrl: yua.noop,
$jump: yua.noop, $jump: yua.noop,
$onJump: yua.noop $onJump: yua.noop,
$onSuccess: yua.noop,
$forceReset: yua.noop,
}) })
}); });

793
js/lib/prism/core.js Normal file
View File

File diff suppressed because one or more lines are too long

1882
js/lib/prism/main.js Normal file
View File

File diff suppressed because one or more lines are too long

4
js/lib/request/request.es5.js
View File

@ -49,7 +49,7 @@ define(['yua'], function(yua){
win.Xhr = function(){ win.Xhr = function(){
return new XMLHttpRequest() 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请求 // 2.2 如果不是跨域请求，则自动加上一条header信息，用以标识这是ajax请求
if(!this.opt.crossDomain){ if(!this.opt.crossDomain){
this.set('X-Requested-With', 'XMLHttpRequest') this.set('X-Requested-With', 'XMLHttpRequest')
}else{
supportCors && (this.xhr.withCredentials = true)
} }

9
js/lib/router/router.js
View File

@ -87,7 +87,14 @@ define(['yua'], function(){
this.errorFn && this.errorFn(hash); this.errorFn && this.errorFn(hash);
}, },
on: function(rule, callback){ on: function(rule, callback){
this._add('get', rule, callback); var _this = this
if(Array.isArray(rule)){
rule.forEach(function(it){
_this._add('get', it, callback);
})
}else{
this._add('get', rule, callback);
}
} }
} }

79
js/lib/tree/main.js
View File

@ -12,12 +12,12 @@ define(['yua', 'css!./skin/def.css'], function(){
//储存版本信息 //储存版本信息
yua.ui.tree = '0.0.1' 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>', ul = '<ul :class="{open: {it}.open}">{li}</ul>',
li = '<li :class="{open: {it}.open, dir: {it}.children}">' 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){ function repeat(arr, name){
@ -30,51 +30,62 @@ define(['yua', 'css!./skin/def.css'], function(){
if(it.children){ if(it.children){
child += repeat(it.children, from +'.children') child += repeat(it.children, from +'.children')
child = ul.replace('{li}', child).replace('{it}', from) child = ul.replace('{li}', child).replace('{it}', from)
}
if(child){
} }
html = html.replace(/\{child\}/, child) html = html.replace(/\{child\}/, child)
}) })
return html 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
var from = attr.from || opt.from, parentItem.children = parentItem.children || []
arr = base.$up[from].$model, parentItem.children.push(it)
tpl = repeat(arr, from) })
tmp = arr = null
return farr
}
delete attr.from return yua.component('tree', {
delete opt.from $template: '<div class="do-tree" :class="{{$skin}}" :html="treeHTML"></div>',
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){ $init: function(vm){
vm.$select = function(obj){
vm.$click = function(obj){ vm.currItem = obj.id
if(vm.$onClick){ if(vm.$onClick){
vm.$onClick(obj) 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){ $toggle: function(obj){
obj.open = !obj.open obj.open = !obj.open
} }

47
js/lib/tree/skin/def.css
View File

@ -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";}

48
js/lib/tree/skin/def.scss Normal file
View File

@ -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";}

1
js/lib/uploader/uploader.min.js vendored
View File

@ -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});

43
js/yua-touch.js
View File

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

52
js/yua.js
View File

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