"); // 遮罩层
drager.list.on("mousewheel DOMMouseScroll", function (e) { // 拖拽的时候滚动div
var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDelta > 0 ? 1 : -1)) || // chrome & ie
(e.originalEvent.detail && (e.originalEvent.detail > 0 ? -1 : 1)); // firefox
findObjScrollParent(drager.ghost)[0].scrollTop -= delta * parseInt(drager.items.css("height").replace("px", ""));
});
if (items.eq(0).is('tr')) {
var tb = $("
");
tb.append(items);
drager.list.append(tb);
} else {
drager.list.append(items);
}
$("body", doc).append(drager.list);
};
/**
*
* @param {MouseEvent}
* event
*/
function moveList(event) {
justDragEnd = false;
itemDraging = true;
drager.list.css('left', (event.clientX - drager.left) + "px");
drager.list.css('top', (event.clientY - drager.top) + "px");
clearSlct();
setGhost(event);
};
function setGhost(event, element) {
var items = new Array();
if (element) {
if ($(element).is(".dragList")) {
items = [element];
} else {
items = $(element).find(".dragList:not('.item')");
}
} else {
items = $(".dragList:not('.item')", doc);
}
$.each(items, function () {
var result = true;
var theList = ($(this).children('tbody').length > 0) ? $(
this).children('tbody') :
$(this);
if (theList.isMouseOver(event) > 0) {
drager.list.children(".panel")
.css("cursor", "move");
if (theList.children('#ghost').length < 1) {
theList.append(drager.ghost);
}
if (theList.is(yx)) {
drager.ghost.slideDown();
} else {
drager.ghost.slideUp();
}
$.each(theList.children('.item'),
function () {
// drager.ghost.lineMode();
var flag = true;
var item = $(this);
if ($(this).isMouseOver(event) > 0) { // 这里触发item的鼠标进出事件， 以后可能会调整， 同时这里的逻辑有点问题但是能用， 以后处理
if (!this.isEnter) { // 从未进来过，这次进来了
$(this).trigger(
"itemEnter");
this.isEnter = true; // 进来了
}
} else {
if (this.isEnter) { // 曾经是进来过的
$(this).trigger("itemOut");
this.isEnter = false; // 出去了
}
}
if (window.options &&
window.options.alignMode != 'horizontal' || window.options && window.options.alignMode != 'hor') { // 如果不是水平分布，就上下拖动排序
switch ($(this).isMouseOver(event)) {
case 3: // 左上
case 6: // 右上
if (!item.prev().is(
"#ghost")) {
item
.before(drager.ghost);
}
console.log("上半部分")
flag = false;
break;
case 4:
case 8:
if (!item.next().is(
"#ghost")) {
item
.after(drager.ghost);
}
console.log("下半部分")
flag = false;
break;
}
} else { // 不然就左右分布
switch ($(this).isMouseOver(event)) {
case 3: // 左上
case 4: // 左下
if (!item.prev().is("#ghost")) {
item.before(drager.ghost);
}
console.log("左半部分")
flag = false;
break;
case 6: // 右上
case 8: // 右下
if (!item.next().is("#ghost")) {
item.after(drager.ghost);
}
console.log("半部分")
flag = false;
break;
}
result = false;
}
if (item.is(".dragList") && item.is(".expand")) {
if (drager.list.children(".item").find(".item").length < 1) {
setGhost(event, this);
drager.list.children(".panel").css("cursor", "move");
drager.list.children(".panel").attr("title", "");
drager.ghost.dashMode();
} else {
drager.list.children(".panel").css("cursor", "not-allowed");
drager.list.children(".panel").attr("title", "选中项存在子元素，不得放入该列表");
drager.ghost.lineMode();
}
} else {
drager.list.children(".panel").css("cursor", "move");
drager.list.children(".panel").attr("title", "");
drager.ghost.lineMode();
}
return flag
});
} else {}
return result; // return true = continue；return false = break；
});
focusList(drager.ghost);
}
function drawDashed(event) {
// 画虚线框
dashedDrawing = true;
if ($(".focused").length < 1) {
return;
}
var nowScrollPoint = {
top: $(".focused")[0].scrollTop +
findObjScrollParent(".focused")[0].scrollTop,
left: $(".focused")[0].scrollLeft +
findObjScrollParent(".focused")[0].scrollLeft
};
dashedEndPoint = getMouseCoordinateOf('.focused', event);
dashedEndPoint.x += nowScrollPoint.left;
dashedEndPoint.y += nowScrollPoint.top;
var xdiff = dashedStartPoint.x - dashedEndPoint.x; // 计算两个点的横坐标之差
var ydiff = dashedStartPoint.y - dashedEndPoint.y; // 计算两个点的纵坐标之差
if (Math.pow((xdiff * xdiff + ydiff * ydiff), 0.5) < 8) {
return false;
}
// 重新定义起点终点坐标
var fieldSize = $(".focused").getSize();
start = {
x: dashedStartPoint.x,
y: dashedStartPoint.y
};
var end = {
x: dashedEndPoint.x,
y: dashedEndPoint.y
};
var scrollwidth = $(".focused")[0].scrollWidth;
var scrollheight = $(".focused")[0].scrollHeight;
// 让虚线框保持在draglist里面
start.x = start.x < 0 ? 0 : ((start.x > scrollwidth) ? scrollwidth :
start.x);
start.y = start.y < 0 ? 0 : ((start.y > scrollheight) ? scrollheight :
start.y);
end.x = end.x < 0 ? 0 : ((end.x > scrollwidth) ? scrollwidth : end.x);
end.y = end.y < 0 ? 0 : ((end.y > scrollheight) ? scrollheight : end.y);
updateDashed(start, end);
var ds = $(".dasheddiv").getSize();
$(".selected", doc).removeClass("selected");
$.each($(".focused").find(".item"), function (index) {
var is = $(this).getSize();
// 判断是否重叠
if ((is.top >= ds.top && (is.top) <= (ds.top + ds.height)) ||
(is.top + is.height) >= ds.top &&
(is.top + is.height) <= (ds.top + ds.height)) { // item的y在拖选匡的y里面
if ((is.left >= ds.left && is.left <= (ds.left + ds.width)) ||
((is.left + is.width) >= ds.left && is.left < ds.left))
$(this).addClass("selected");
} else if (is.top <= ds.top &&
(is.top + is.height) >= (ds.top) ||
is.top <= (ds.top + ds.height) &&
(is.top + is.height) >= (ds.top + ds.height)) {
if ((is.left >= ds.left && is.left <= (ds.left + ds.width)) ||
((is.left + is.width) >= ds.left && (is.left + is.width) <= (ds.left +
ds.width))) {
$(this).addClass("selected");
}
}
});
clearSlct();
};
/**
*
* @param {MouseEvent}
* event
* @param {拖拽结束的回调}
* callback
*/
function _dragEnd(event, callback) {
if (drager && drager.list) { // 清除拖拽列
$(".F,.L,.N").removeClass("F L N");
drager.ghost.parent().find(".shadow").each(function () {
var shadow = this;
drager.items.each(function () {
if (shadow == this.shadow[0]) {
$(shadow).slideUp();
}
});
});
drager.ghost.before(drager.items);
$('.dragList', doc).css('background', "");
$('.dragList tbody', doc).css('background', "");
$.each(drager.items, function () {
if ($(this).hasClass("dragList_")) {
$(this).addClass("dragList");
$(this).removeClass("dragList_");
}
});
var result = true;
if (itemDraging) { // 回调
justDragEnd = true;
itemDraging = false;
if (callback) {
try {
result = callback(event);
} catch (e) {
console.err(e.message);
}
}
}
if (result == false || !drager.ghost.is(":visible")) { // 取消移动
$.each(drager.items, function () {
$(this.shadow).before(this);
this.shadow == null;
});
}
drager.list.remove();
drager.ghost.remove();
drager.startpoint.remove();
drager = {};
distnic();
$(".shadow").slideUp('fast', function () {
$(".shadow").remove();
});
}
if (dashedDrawing) {
dashedDrawing = false;
dashedDrawEnd = true;
}
$(".dasheddiv").remove();
handleDown = false;
itemDraging = false;
dragItemDown = dragListDown = false;
dashedEndPoint = dashedStartPoint = null;
}
/**
* 获取最靠近的带滚动条的父级
*
* @param {Object}
* obj
* @param {Object}
* i
*/
function findObjScrollParent(obj, i) {
i = i || 0;
i++;
// console.log($(obj)[0].tagName + ":" + ($(obj)[0].tagName != "HTML"))
var par = $(obj).parent();
if ($(obj)[0].tagName == "HTML") {
return $(obj).find("body");
}
if (isCanScroll(par)) {
return $(par);
} else {
return findObjScrollParent(par, i);
}
}
/**
* 判断是否带滚动条
*
* @param {Object}
* obj
*/
function isCanScroll(obj) {
if (obj) {
// console.log(obj)
var of = $(obj).css("overflow-y");
return ("scroll|auto".indexOf( of ) > -1) && (obj[0].scrollHeight > 0);
} else {
console.groupEnd()
return false
}
}
/**
* 查找最近的.dragList
*
* @param {Object}
* obj
*/
function findClosestDragList(obj) {
var o = $(obj);
if (o.is("td")) {
// -td tr tbody table
return o.parent().parent().parent();
} else if (o.is("tr")) {
return o.parent().parent();
} else if (o.is("body")) {
return o.parent();
} else if (o.is(".dragList")) {
return o;
// } else if (o.is(".item") || o.is("#ghost")) {
// return o.parent();
// } else if (o.is(".handle")) {
// return o.parent().parent();
} else {
return o.parents(".dragList").eq(0);
}
}
/**
* 查找最近的父级的selector 元素
*
* @param {Object}
* obj
* @param {Object}
* selector
*/
function findClosestObj(obj, selector) {
// try {
// console.log(obj);
// var par = $(obj).parent();
// if (par.is(selector)) {
// return par;
// } else {
// return findClosestObj(par, selector);
// }
// } catch (e) {
// console.log(e.message)
// return {
// length: 0
// }
// }
return $(obj).parents(selector).eq(0);
}
/**
* 获取鼠标在selector的相对位置
*
* @param {Object}
* selector
* @param {Object}
* event
*/
function getMouseCoordinateOf(selector, event) {
var top, left, oDiv;
if ($(selector).length < 1)
return;
oDiv = $(selector)[0];
top = getY(oDiv);
left = getX(oDiv);
function getX(obj) {
var parObj = obj;
var left = obj.offsetLeft;
while (parObj = parObj.offsetParent) {
left += parObj.offsetLeft;
}
return left;
}
function getY(obj) {
var parObj = obj;
var top = obj.offsetTop;
while (parObj = parObj.offsetParent) {
top += parObj.offsetTop;
}
return top;
}
var result = {
x: (event.clientX - left + document.body.scrollLeft) - 2,
y: (event.clientY - top + document.body.scrollTop) - 2
}
return result;
}
/**
* 设置list的焦点样式
*
* @param {Object}
* obj
*/
function focusList(obj) {
$(".focused").removeClass("focused");
findClosestDragList(obj).addClass("focused");
};
/**
* 注销掉拖拽
*/
function destroyDrag() {
_dragEnd(event);
$.each($(".dragList", doc), function () {
$(this).before($(this).clone())
$(this).remove();
})
doc.off("selectstart keydown keyup mousedown mouseup mousemove click");
$("#dragcss").remove();
$(".dCheck").remove();
$("#dragcss").remove();
}
/**
* 清除选中的文字
*/
var clearSlct = "getSelection" in window ? function () {
window.getSelection().removeAllRanges();
} : function () {
document.selection.empty();
};
function setUpTriangle(dragList) {
var span = $("
");
var list = $(dragList);
span.isShow = false;
span.addClass("triangle");
var defaulthigh = list.height();
list.on("hideT", function () {
if (!span.isShow)
return;
span.isShow = false;
$(this).css("overflow", "hidden");
$(this).animate({
height: defaulthigh
}, "fast");
$(this).removeClass("expand");
focusList($(this).parents(".dragList").eq(0));
});
list.on("showT", function () {
if (span.isShow)
return;
span.isShow = true;
$(this).addClass("expand");
if ($(this).children(".item").length == 0) {
$(this).animate({
height: $(this).height() * 2,
"overflow": "visible"
}, "fast");
} else {
$(this).css({
"overflow": "visible"
});
$(this).autoHeightAnimate("fast", function () {
$(this).height("auto");
});
}
focusList(this);
});
span.click(function (event) {
if (span.isShow) {
list.trigger("hideT");
} else {
list.trigger("showT");
}
event.stopPropagation();
return false;
});
list.prepend(span);
list.css("overflow", "hidden");
list.css("height", list.children(".item").eq(0).height());
var n = span.next();
n.css("display", "inline-block");
n.css("padding-left", 15);
span.animate({
"top": (n.height() - 10) / 2 + "px"
}, "fast");
dragList.triangle = span[0];
}
jQuery.fn.autoHeightAnimate = function (time, callback) {
var element = this;
this.curHeight = element.height(); // Get Default Height
element.height('auto'); // Get Auto Height
this.autoHeight = element.height()
element.height(this.curHeight); // Reset to Default Height
if (this.autoHeight)
element.stop().animate({
height: this.autoHeight
}, time, null, callback); // Animate to Auto Height
}
jQuery.fn.isChildOf = function (b) {
return this.parent()[0] == $(b)[0];
};
jQuery.fn.getSize = function () {
var obj = $(this);
var xy = {};
if (!isDom(obj)) {
console.group("------------------------");
console.log(obj);
console.error(obj + "不是DOM对象");
console.groupEnd("------------------------");
return xy;
}
var offset = obj.offset();
if (offset) {
xy.top = offset.top - $("body", doc)[0].scrollTop; // 距离浏览器上边距的高 top
xy.left = offset.left; // 左
xy.width = obj.outerWidth(); // 宽
xy.height = obj.outerHeight(); // 高
xy.margin = parseInt(obj.css('margin').replace("px", "")) || 0;
xy.margin = isNaN(xy.margin) ? 0 : xy.margin;
}
function isDom(obj) {
obj = obj[0] || obj;
if (typeof HTMLElement === 'object')
return obj instanceof HTMLElement;
else
return obj && typeof obj === 'object' && obj.nodeType === 1 &&
typeof obj.nodeName === 'string';
}
return xy;
};