Skip to content
This repository has been archived by the owner on Jan 6, 2023. It is now read-only.

Commit

Permalink
Merge pull request #44 from Jinqn/dev-1.3.0
Browse files Browse the repository at this point in the history
Dev 1.3.0 grunt编译支持parse的编译, 修改表格排序的demo
  • Loading branch information
campaign committed Oct 25, 2013
2 parents 6eb2c4a + e272328 commit c6ebeed
Show file tree
Hide file tree
Showing 7 changed files with 169 additions and 107 deletions.
36 changes: 20 additions & 16 deletions Gruntfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,26 +6,20 @@ module.exports = function ( grunt ) {
Util = {

jsBasePath: '_src/',
parseBasePath: 'parse/',
cssBasePath: 'themes/default/_css/',

fetchScripts: function () {

var sources = fs.readFileSync( "_examples/editor_api.js" );

sources = /\[([^\]]+)\]/.exec( sources );
fetchScripts: function ( readFile, basePath) {

var sources = fs.readFileSync( readFile );
sources = /\[([^\]]+\.js'[^\]]+)\]/.exec( sources );
sources = sources[1].replace( /\/\/.*\n/g, '\n' ).replace( /'|"|\n|\t|\s/g, '' );

sources = sources.split( "," );

sources.forEach( function ( filepath, index ) {

sources[ index ] = Util.jsBasePath + filepath;

sources[ index ] = basePath + filepath;
} );

return sources;

},

fetchStyles: function () {
Expand All @@ -36,9 +30,7 @@ module.exports = function ( grunt ) {
src = [];

while ( filepath = pattern.exec( sources ) ) {

src.push( this.cssBasePath + filepath[ 1 ].replace( /'|"/g, "" ) );

}

return src;
Expand Down Expand Up @@ -68,13 +60,21 @@ module.exports = function ( grunt ) {
options: {
banner: banner + '(function(){\n\n',
footer: '\n\n})()',
process: function(src, filepath) {
process: function(src) {
return src.replace('/_css/', '/css/');
}
},
src: Util.fetchScripts(),
src: Util.fetchScripts( "_examples/editor_api.js", Util.jsBasePath ),
dest: disDir + '<%= pkg.name %>.all.js'
},
parse: {
options: {
banner: banner + '(function(){\n\n',
footer: '\n\n})()'
},
src: Util.fetchScripts( "ueditor.parse.js", Util.parseBasePath ),
dest: disDir + '<%= pkg.name %>.parse.js'
},
css: {
src: Util.fetchStyles(),
dest: disDir + 'themes/default/css/ueditor.css'
Expand All @@ -99,14 +99,18 @@ module.exports = function ( grunt ) {
dest: {
src: disDir + '<%= pkg.name %>.all.js',
dest: disDir + '<%= pkg.name %>.all.min.js'
},
dest1: {
src: disDir + '<%= pkg.name %>.parse.js',
dest: disDir + '<%= pkg.name %>.parse.min.js'
}
},
copy: {
base: {
files: [
{

src: [ 'themes/iframe.css', 'themes/default/dialogbase.css', 'themes/default/images/**', 'dialogs/**', 'lang/**', 'third-party/**', 'ueditor.parse.js' ],
src: [ 'themes/iframe.css', 'themes/default/dialogbase.css', 'themes/default/images/**', 'dialogs/**', 'lang/**', 'third-party/**' ],
dest: disDir

}
Expand Down
135 changes: 74 additions & 61 deletions _examples/sortableDemo.html
Original file line number Diff line number Diff line change
@@ -1,71 +1,84 @@
<!DOCTYPE HTML>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>UEditor表格排序示例</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--使用版-->
<!--<script type="text/javascript" charset="utf-8" src="../dist/utf8-php/ueditor.config.js"></script>-->
<!--<script type="text/javascript" charset="utf-8" src="../dist/utf8-php/ueditor.all.js"></script>-->

<!--开发版-->
<script type="text/javascript" charset="utf-8" src="../ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="editor_api.js"> </script>
<script type="text/javascript" charset="utf-8" src="../ueditor.parse.js"> </script>
<!--建议手动加在语言,避免在ie下有时因为加载语言失败导致编辑器加载失败-->
<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型,比如你在配置项目里配置的是英文,这里加载的中文,那最后就是中文-->
<script type="text/javascript" charset="utf-8" src="../lang/zh-cn/zh-cn.js"></script>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script src="../ueditor.parse.js" type="text/javascript"></script>
<script>
// 语法
// uParse(selector,[option])
/*
selector支持
id,class,tagName
*/
/*
目前支持的参数
option:
highlightJsUrl 代码高亮相关js的路径 如果展示有代码高亮,必须给定该属性
highlightCssUrl 代码高亮相关css的路径 如果展示有代码高亮,必须给定该属性
liiconpath 自定义列表样式的图标路径,可以不给定,默认'http://bs.baidu.com/listicon/',
listDefaultPaddingLeft : 自定义列表样式的左边宽度 默认'20',
customRule 可以传入你自己的处理规则函数,函数第一个参数是容器节点
*/

<style type="text/css">
#btns {
margin: 20px 0px;
}
#btns .message{
color:red;
}
#preview {
padding: 10px;
width:1004px;
border: 2px dashed #EEE;
}
</style>
uParse('#content1',{
rootPath : '../'
})
uParse('#content2',{
rootPath : '../',
tableSortCompareFn: function(td1, td2){
var value1 = td1.innerText||td1.textContent,
value2 = td2.innerText||td2.textContent;
return parseInt(value1) % 10 > parseInt(value2) % 10;
}
})
</script>
<title></title>
</head>
<body>
<h1>UEditor表格排序示例</h1>
<div>
<script id="editor" type="text/plain" style="width:1024px;height:300px;">
<table data-sort="sortEnabled" width="992" class="sortEnabled" data-sort-type="reversebynum"> <tbody> <tr class="firstRow"> <td width="165"> 343 </td> <td width="165"> 352 </td> <td width="165"> 323 </td> <td width="165"> 234 </td> <td width="165"> 379 </td> <td width="166"> 782 </td> </tr> <tr> <td width="165"> 341 </td> <td width="165"> 163 </td> <td width="165"> 422 </td> <td width="165"> 234 </td> <td width="165"> 725 </td> <td width="166"> 833 </td> </tr> <tr> <td width="165"> 221 </td> <td width="165"> 456 </td> <td width="165"> 335 </td> <td width="165"> 423 </td> <td width="165"> 445 </td> <td width="166"> 793 </td> </tr> <tr> <td width="165"> 112 </td> <td width="165"> 277 </td> <td width="165"> 563 </td> <td width="165"> 423 </td> <td width="165"> 932 </td> <td width="166"> 425 </td> </tr> </tbody> </table> <p> <span style="font-size: 14px; color: rgb(127, 127, 127);">当前排序: 按照第一列数值大小降序排序</span> </p>
</script>
</div>
<div id="btns">
<input id="updateToPreview" type="button" value="更新编辑器内容到下面区域" />
<span class="message">点击下面表格第一行的单元格进行排序</span>
<h1>表格排序演示</h1>
<p>
<p>
<strong>默认排序方法有五种:</strong><br/>
reversecurrent : 逆序当前<br/>
orderbyasc : 按ASCII字符升序<br/>
reversebyasc : 按ASCII字符降序<br/>
orderbynum : 按数值大小升序<br/>
reversebynum : 按数值大小降序
</p>
<p>
<span style="font-size: 14px; color: rgb(127, 127, 127);">表格data-sort-type属性值为reversebynum,<span style="color:#ff511a; font-weight: bold;">按照数值大小降序排序</span>,点击第一行的单元格进行排序。</span>
</p>
<div id="content1" class="content">
<table data-sort="sortEnabled" width="992" class="sortEnabled" data-sort-type="reversebynum">
<tbody>
<tr class="firstRow"> <td width="165">343</td> <td width="165">352</td> <td width="165">323</td> <td width="165">234</td> <td width="165">379</td> <td width="166">782</td> </tr>
<tr> <td width="165">341</td> <td width="165">163</td> <td width="165">422</td> <td width="165">234</td> <td width="165">725</td> <td width="166">833</td> </tr>
<tr> <td width="165">221</td> <td width="165">456</td> <td width="165">335</td> <td width="165">423</td> <td width="165">445</td> <td width="166">793</td> </tr>
<tr> <td width="165">112</td> <td width="165">277</td> <td width="165">563</td> <td width="165">423</td> <td width="165">932</td> <td width="166">425</td> </tr>
<tr> <td width="165">587</td> <td width="165">175</td> <td width="165">159</td> <td width="165">734</td> <td width="165">582</td> <td width="166">458</td> </tr>
</tbody>
</table>
</div>
<div id="preview">
<p><br /></p>
</div>
</body>
<script type="text/javascript">

//实例化编辑器
var ue = UE.getEditor('editor');
ue.ready(updateToPreview);

//设置按钮监听
$G('updateToPreview').onclick = updateToPreview;

//预览编辑器数据
function updateToPreview(){
$G('preview').innerHTML = ue.getContent();
uParse('#preview',{
rootPath : '../'
});
}

//根据id获取dom
function $G(id){
return document.getElementById(id);
}

<p>
<br />
</p>
<p>
<span style="font-size: 14px; color: rgb(127, 127, 127);">自定义排序,<span style="color:#ff511a; font-weight: bold;">按照个位数排序</span>,点击第一行的单元格进行排序。</span>
</p>
<div id="content2" class="content">
<table data-sort="sortEnabled" width="992" class="sortEnabled">
<tbody>
<tr class="firstRow"> <td width="165">343</td> <td width="165">352</td> <td width="165">323</td> <td width="165">234</td> <td width="165">379</td> <td width="166">782</td> </tr>
<tr> <td width="165">341</td> <td width="165">163</td> <td width="165">422</td> <td width="165">234</td> <td width="165">725</td> <td width="166">833</td> </tr>
<tr> <td width="165">221</td> <td width="165">456</td> <td width="165">335</td> <td width="165">423</td> <td width="165">445</td> <td width="166">793</td> </tr>
<tr> <td width="165">112</td> <td width="165">277</td> <td width="165">563</td> <td width="165">423</td> <td width="165">932</td> <td width="166">425</td> </tr>
<tr> <td width="165">587</td> <td width="165">175</td> <td width="165">159</td> <td width="165">734</td> <td width="165">582</td> <td width="166">458</td> </tr>
</tbody>
</table>
</div>

</script>
</body>
</html>
File renamed without changes.
File renamed without changes.
87 changes: 70 additions & 17 deletions parse/parse.js → _parse/parse.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,6 @@
(function(){
UE = window.UE || {};
var isIE = !!window.ActiveXObject,
trim = function (str) {
return str.replace(/(^[ \t\n\r]+)|([ \t\n\r]+$)/g, '');
};
var isIE = !!window.ActiveXObject;
//定义utils工具
var utils = {
removeLastbs : function(url){
Expand Down Expand Up @@ -126,7 +123,20 @@
arr.push(item)
}
},
trim:trim,
trim: function (str) {
return str.replace(/(^[ \t\n\r]+)|([ \t\n\r]+$)/g, '');
},
indexOf: function (array, item, start) {
var index = -1;
start = this.isNumber(start) ? start : 0;
this.each(array, function (v, i) {
if (i >= start && v === item) {
index = i;
return false;
}
});
return index;
},
hasClass: function (element, className) {
className = className.replace(/(^[ ]+)|([ ]+$)/g, '').replace(/[ ]{2,}/g, ' ').split(' ');
for (var i = 0, ci, cls = element.className; ci = className[i++];) {
Expand All @@ -138,7 +148,7 @@
},
addClass:function (elm, classNames) {
if(!elm)return;
classNames = trim(classNames).replace(/[ ]{2,}/g,' ').split(' ');
classNames = this.trim(classNames).replace(/[ ]{2,}/g,' ').split(' ');
for(var i = 0,ci,cls = elm.className;ci=classNames[i++];){
if(!new RegExp('\\b' + ci + '\\b').test(cls)){
cls += ' ' + ci;
Expand All @@ -147,27 +157,70 @@
elm.className = utils.trim(cls);
},
removeClass:function (elm, classNames) {
classNames = utils.isArray(classNames) ? classNames :
trim(classNames).replace(/[ ]{2,}/g,' ').split(' ');
classNames = this.isArray(classNames) ? classNames :
this.trim(classNames).replace(/[ ]{2,}/g,' ').split(' ');
for(var i = 0,ci,cls = elm.className;ci=classNames[i++];){
cls = cls.replace(new RegExp('\\b' + ci + '\\b'),'')
}
cls = trim(cls).replace(/[ ]{2,}/g,' ');
cls = this.trim(cls).replace(/[ ]{2,}/g,' ');
if(cls){
elm.className = cls;
}else{
elm.removeAttribute('class');
}
},
on: isIE ? function (element, type, fn) {
element.attachEvent(type, fn);
} : function (element, type, fn) {
element.addEventListener(type, fn);
on: function (element, type, handler) {
var types = this.isArray(type) ? type : type.split(/\s+/),
k = types.length;
if (k) while (k--) {
type = types[k];
if (element.addEventListener) {
element.addEventListener(type, handler, false);
} else {
if (!handler._d) {
handler._d = {
els : []
};
}
var key = type + handler.toString(),index = utils.indexOf(handler._d.els,element);
if (!handler._d[key] || index == -1) {
if(index == -1){
handler._d.els.push(element);
}
if(!handler._d[key]){
handler._d[key] = function (evt) {
return handler.call(evt.srcElement, evt || window.event);
};
}


element.attachEvent('on' + type, handler._d[key]);
}
}
}
element = null;
},
un: isIE ? function (element, type, fn) {
element.detachEvent(type, fn);
} : function (element, type, fn) {
element.removeEventListener(type, fn);
off: function (element, type, handler) {
var types = this.isArray(type) ? type : type.split(/\s+/),
k = types.length;
if (k) while (k--) {
type = types[k];
if (element.removeEventListener) {
element.removeEventListener(type, handler, false);
} else {
var key = type + handler.toString();
try{
element.detachEvent('on' + type, handler._d ? handler._d[key] : handler);
}catch(e){}
if (handler._d && handler._d[key]) {
var index = utils.indexOf(handler._d.els,element);
if(index!=-1){
handler._d.els.splice(index,1);
}
handler._d.els.length == 0 && delete handler._d[key];
}
}
}
},
loadFile : function () {
var tmpList = [];
Expand Down
16 changes: 4 additions & 12 deletions parse/table.js → _parse/table.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
UE.parse.register('table', function (utils) {
var root = this.root,
var me = this,
root = this.root,
tables = root.getElementsByTagName('table');
if (tables.length) {
var selector = this.selector;
Expand Down Expand Up @@ -36,10 +37,10 @@ UE.parse.register('table', function (utils) {
var target = e.target || e.srcElement,
cell = findParentByTagName(target, ['td', 'th']);
var table = findParentByTagName(target, 'table'),
colIndex = indexOf(table.rows[0].cells, cell),
colIndex = utils.indexOf(table.rows[0].cells, cell),
sortType = table.getAttribute('data-sort-type');
if(colIndex != -1) {
sortTable(table, colIndex, sortType);
sortTable(table, colIndex, me.tableSortCompareFn || sortType);
updateTable(table);
}
});
Expand All @@ -58,15 +59,6 @@ UE.parse.register('table', function (utils) {
}
return null;
}
//查找项在数组中的索引
function indexOf(arr, item) {
for (var i = 0; i < arr.length; i++) {
if(arr[i] === item) {
return i;
}
}
return -1;
}
//表格排序
function sortTable(table, sortByCellIndex, compareFn) {
var rows = table.rows,
Expand Down
Loading

0 comments on commit c6ebeed

Please sign in to comment.