提交 03281fd2 编写于 作者: D Devil

编辑器图片、附件、视频多选支持按照顺序选择插入编辑器

上级 a692a1ae
......@@ -737,6 +737,23 @@ i.file-preview.file-type-psd{
padding: 2px 0;
}
/**
* 选择计数
*/
#fileList .select-count {
position: absolute;
top: 25px;
left: 5px;
background: #1194fa;
color: #fff;
font-weight: bold;
padding: 2px 5px;
border-radius: 15px;
min-width: 12px;
text-align: center;
display: none;
}
/**
* 右侧小导航
......
......@@ -515,7 +515,8 @@
var responseText = (ret._raw || ret),
json = utils.str2json(responseText);
if (json.code == 0) {
_this.fileList.push(json.data);
//_this.fileList.push(json.data);
_this.fileList[$file.index()] = json.data;
$file.append('<span class="success"></span>');
} else {
$file.find('.error').text(json.msg).show();
......@@ -564,12 +565,15 @@
var i, link, data, list = [],
prefix = editor.getOpt('fileUrlPrefix');
for (i = 0; i < this.fileList.length; i++) {
data = this.fileList[i];
link = data.url;
list.push({
title: data.original || link.substr(link.lastIndexOf('/') + 1),
url: prefix + link
});
data = this.fileList[i] || null;
if(data != null && (data.url || null) != null)
{
link = data.url;
list.push({
title: data.original || link.substr(link.lastIndexOf('/') + 1),
url: prefix + link
});
}
}
return list;
}
......@@ -616,14 +620,62 @@
li = target.parentNode;
if (li.tagName.toLowerCase() == 'li') {
// 选择顺序 start
var $select_count_container = $(li).find('.select-count');
// 选择顺序 end
if (domUtils.hasClass(li, 'selected')) {
domUtils.removeClasses(li, 'selected');
// 选择顺序 start
$select_count_container.css('display', 'none');
$select_count_container.text('');
// 选择顺序 end
} else {
domUtils.addClass(li, 'selected');
// 选择顺序 start
var count = 0;
$($G('fileList')).find('li.selected').each(function(k, v)
{
var temp = parseInt($(this).find('.select-count').text());
if(temp > count)
{
count = temp;
}
});
$select_count_container.css('display', 'block');
$select_count_container.text(count+1);
// 选择顺序 end
}
// 选择顺序 start
_this.selectSortHandle();
// 选择顺序 end
}
});
},
/* 选择顺序处理 */
selectSortHandle: function()
{
var arr = [];
$($G('fileList')).find('li.selected').each(function(k, v)
{
var count = parseInt($(this).find('.select-count').text())-1;
arr[count] = {
"count": count,
"e": $(this)
};
});
if(arr.length > 0)
{
arr = arr.sort();
for(var i in arr)
{
$(arr[i]['e']).find('.select-count').text(parseInt(i)+1);
}
}
},
/* 初始化第一次的数据 */
initData: function () {
......@@ -723,6 +775,14 @@
original.innerHTML = list[i].original;
item.appendChild(original);
// 原名功能 end
// 选择计数 start
var select_count = document.createElement('span');
select_count.setAttribute('class', 'select-count');
select_count.style.display = 'none';
select_count.innerHTML = '';
item.appendChild(select_count);
// 选择计数 end
// 文件添加删除功能 start
item.appendChild($("<span class='delbtn' data-id='" + list[i].id + "'>x</span>").click(function() {
......@@ -735,8 +795,16 @@
} finally {
if(!confirm("确定要删除吗?")) return;
$.post(editor.getOpt("serverUrl") + "?action=deletefile", { "id": del.attr("data-id") }, function(response) {
if (response.code == 0) del.parent().remove();
else alert(response.msg);
if (response.code == 0)
{
del.parent().remove();
// 选择顺序 start
_this.selectSortHandle();
// 选择顺序 end
} else {
alert(response.msg);
}
});
}
})[0]);
......@@ -779,13 +847,17 @@
if (domUtils.hasClass(lis[i], 'selected')) {
var url = lis[i].getAttribute('data-url');
var title = lis[i].getAttribute('data-title') || url.substr(url.lastIndexOf('/') + 1);
list.push({
title: title,
url: url
});
if((lis[i] || null) != null)
{
var index = parseInt($(lis[i]).find('.select-count').text())-1;
list[index] = {
title: title,
url: url
}
}
}
}
return list;
return list.length ? list.sort() : list;
}
};
......
......@@ -734,6 +734,23 @@
padding: 2px 0;
}
/**
* 选择计数
*/
#imageList .select-count {
position: absolute;
top: 25px;
left: 5px;
background: #1194fa;
color: #fff;
font-weight: bold;
padding: 2px 5px;
border-radius: 15px;
min-width: 12px;
text-align: center;
display: none;
}
/**
* 右侧小导航
*/
......
......@@ -93,5 +93,17 @@
</div>
<script type="text/javascript" src="image.js"></script>
<!-- 拖拽 -->
<script type='text/javascript' src="../../../dragsort/jquery.dragsort-0.5.2.min.js"></script>
<script type="text/javascript">
$(function()
{
// 上传预览拖拽排序
$('ul.filelist').dragsort({
dragSelector: 'img',
placeHolderTemplate: '<li></li>'
});
});
</script>
</body>
</html>
\ No newline at end of file
......@@ -354,7 +354,7 @@
width: imageCompressBorder,
height: imageCompressBorder,
// 图片质量,只有type为`image/jpeg`的时候才有效。
quality: 90,
quality: 100,
// 是否允许放大,如果想要生成小图的时候不失真,此选项应该设置为false.
allowMagnify: false,
// 是否允许裁剪。
......@@ -694,7 +694,8 @@
var responseText = (ret._raw || ret),
json = utils.str2json(responseText);
if (json.code == 0) {
_this.imageList.push(json.data);
//_this.imageList.push(json.data);
_this.imageList[$file.index()] = json.data;
$file.append('<span class="success"></span>');
} else {
$file.find('.error').text(json.msg).show();
......@@ -747,14 +748,17 @@
align = getAlign(),
prefix = editor.getOpt('imageUrlPrefix');
for (i = 0; i < this.imageList.length; i++) {
data = this.imageList[i];
list.push({
src: prefix + data.url,
_src: prefix + data.url,
title: data.title,
alt: data.original,
floatStyle: align
});
data = this.imageList[i] || null;
if(data != null && (data.url || null) != null)
{
list.push({
src: prefix + data.url,
_src: prefix + data.url,
title: data.title,
alt: data.original,
floatStyle: align
});
}
}
return list;
}
......@@ -798,16 +802,64 @@
domUtils.on(this.container, 'click', function (e) {
var target = e.target || e.srcElement,
li = target.parentNode;
var index = 0;
if (li.tagName.toLowerCase() == 'li') {
// 选择顺序 start
var $select_count_container = $(li).find('.select-count');
// 选择顺序 end
if (domUtils.hasClass(li, 'selected')) {
domUtils.removeClasses(li, 'selected');
// 选择顺序 start
$select_count_container.css('display', 'none');
$select_count_container.text('');
// 选择顺序 end
} else {
domUtils.addClass(li, 'selected');
// 选择顺序 start
var count = 0;
$($G('imageList')).find('li.selected').each(function(k, v)
{
var temp = parseInt($(this).find('.select-count').text());
if(temp > count)
{
count = temp;
}
});
$select_count_container.css('display', 'block');
$select_count_container.text(count+1);
// 选择顺序 end
}
// 选择顺序 start
_this.selectSortHandle();
// 选择顺序 end
}
});
},
/* 选择顺序处理 */
selectSortHandle: function()
{
var arr = [];
$($G('imageList')).find('li.selected').each(function(k, v)
{
var count = parseInt($(this).find('.select-count').text())-1;
arr[count] = {
"count": count,
"e": $(this)
};
});
if(arr.length > 0)
{
arr = arr.sort();
for(var i in arr)
{
$(arr[i]['e']).find('.select-count').text(parseInt(i)+1);
}
}
},
/* 初始化第一次的数据 */
initData: function () {
......@@ -898,6 +950,14 @@
original.innerHTML = list[i].original;
item.appendChild(original);
// 原名功能 end
// 选择计数 start
var select_count = document.createElement('span');
select_count.setAttribute('class', 'select-count');
select_count.style.display = 'none';
select_count.innerHTML = '';
item.appendChild(select_count);
// 选择计数 end
// 图片添加删除功能 start
item.appendChild($("<span class='delbtn' data-id='" + list[i].id + "'>x</span>").click(function() {
......@@ -910,8 +970,16 @@
} finally {
if(!confirm("确定要删除吗?")) return;
$.post(editor.getOpt("serverUrl") + "?action=deletefile", { "id": del.attr("data-id") }, function(response) {
if (response.code == 0) del.parent().remove();
else alert(response.msg);
if (response.code == 0)
{
del.parent().remove();
// 选择顺序 start
_this.selectSortHandle();
// 选择顺序 end
} else {
alert(response.msg);
}
});
}
})[0]);
......@@ -954,16 +1022,19 @@
if (domUtils.hasClass(lis[i], 'selected')) {
var img = lis[i].firstChild,
src = img.getAttribute('_src');
list.push({
src: src,
_src: src,
alt: src.substr(src.lastIndexOf('/') + 1),
floatStyle: align
});
if((lis[i] || null) != null)
{
var index = parseInt($(lis[i]).find('.select-count').text())-1;
list[index] = {
src: src,
_src: src,
alt: src.substr(src.lastIndexOf('/') + 1),
floatStyle: align
}
}
}
}
return list;
return list.length ? list.sort() : list;
}
};
})();
......@@ -805,6 +805,23 @@ i.file-preview.file-type-psd{
padding: 2px 0;
}
/**
* 选择计数
*/
#videoList .select-count {
position: absolute;
top: 25px;
left: 5px;
background: #1194fa;
color: #fff;
font-weight: bold;
padding: 2px 5px;
border-radius: 15px;
min-width: 12px;
text-align: center;
display: none;
}
/**
* 右侧小导航
......
......@@ -180,14 +180,62 @@
li = target.parentNode;
if (li.tagName.toLowerCase() == 'li') {
// 选择顺序 start
var $select_count_container = $(li).find('.select-count');
// 选择顺序 end
if (domUtils.hasClass(li, 'selected')) {
domUtils.removeClasses(li, 'selected');
// 选择顺序 start
$select_count_container.css('display', 'none');
$select_count_container.text('');
// 选择顺序 end
} else {
domUtils.addClass(li, 'selected');
// 选择顺序 start
var count = 0;
$($G('videoList')).find('li.selected').each(function(k, v)
{
var temp = parseInt($(this).find('.select-count').text());
if(temp > count)
{
count = temp;
}
});
$select_count_container.css('display', 'block');
$select_count_container.text(count+1);
// 选择顺序 end
}
// 选择顺序 start
_this.selectSortHandle();
// 选择顺序 end
}
});
},
/* 选择顺序处理 */
selectSortHandle: function()
{
var arr = [];
$($G('videoList')).find('li.selected').each(function(k, v)
{
var count = parseInt($(this).find('.select-count').text())-1;
arr[count] = {
"count": count,
"e": $(this)
};
});
if(arr.length > 0)
{
arr = arr.sort();
for(var i in arr)
{
$(arr[i]['e']).find('.select-count').text(parseInt(i)+1);
}
}
},
/* 初始化第一次的数据 */
initData: function () {
......@@ -275,6 +323,14 @@
original.innerHTML = list[i].original;
item.appendChild(original);
// 原名功能 end
// 选择计数 start
var select_count = document.createElement('span');
select_count.setAttribute('class', 'select-count');
select_count.style.display = 'none';
select_count.innerHTML = '';
item.appendChild(select_count);
// 选择计数 end
// 视频添加删除功能 start
item.appendChild($("<span class='delbtn' data-id='" + list[i].id + "'>x</span>").click(function() {
......@@ -287,8 +343,16 @@
} finally {
if(!confirm("确定要删除吗?")) return;
$.post(editor.getOpt("serverUrl") + "?action=deletefile", { "id": del.attr("data-id") }, function(response) {
if (response.code == 0) del.parent().remove();
else alert(response.msg);
if (response.code == 0)
{
del.parent().remove();
// 选择顺序 start
_this.selectSortHandle();
// 选择顺序 end
} else {
alert(response.msg);
}
});
}
})[0]);
......@@ -304,16 +368,20 @@
if (domUtils.hasClass(lis[i], 'selected')) {
var video = lis[i].firstChild,
src = video.getAttribute('_src');
list.push({
src: src,
_src: src,
alt: src.substr(src.lastIndexOf('/') + 1),
floatStyle: align
});
if((lis[i] || null) != null)
{
var index = parseInt($(lis[i]).find('.select-count').text())-1;
list[index] = {
src: src,
_src: src,
alt: src.substr(src.lastIndexOf('/') + 1),
floatStyle: align
}
}
}
}
return list;
return list.length ? list.sort() : list;
}
};
......@@ -964,11 +1032,16 @@
var responseText = (ret._raw || ret),
json = utils.str2json(responseText);
if (json.code == 0) {
uploadVideoList.push({
// uploadVideoList.push({
// 'url': json.data.url,
// 'type': json.data.type,
// 'original':json.data.original
// });
uploadVideoList[$file.index()] = {
'url': json.data.url,
'type': json.data.type,
'original':json.data.original
});
};
$file.append('<span class="success"></span>');
} else {
$file.find('.error').text(json.msg).show();
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册