设计器快捷调整间距操作优化
This commit is contained in:
parent
a824b91df2
commit
53d18f902c
@ -168,9 +168,9 @@ Designer.contextMenu.execAction = function(item) {
|
||||
} else if (action == "customdefine") {
|
||||
openCustomDefineDialog();
|
||||
} else if(action == 'selectVertical') {
|
||||
Designer.selectVertical(this.menuPos);
|
||||
Designer.selectVertical();
|
||||
} else if (action == 'selectHorizontal') {
|
||||
Designer.selectHorizontal(this.menuPos);
|
||||
Designer.selectHorizontal();
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@ -71,101 +71,117 @@ Designer.addFunction("selectAll", function(){
|
||||
/**
|
||||
* 设计器方法:调节垂直间距
|
||||
*/
|
||||
Designer.addFunction("selectVertical", function(menuPos) {
|
||||
var sublinePos = menuPos.y
|
||||
Designer.addFunction("selectVertical", function() {
|
||||
var sublinePos
|
||||
var subline1 = $('#designer_subline1') // 初始位置
|
||||
var subline2 = $('#designer_subline2')
|
||||
subline1.css({
|
||||
display : "block",
|
||||
"z-index" : Model.orderList.length + 4,
|
||||
width: Model.define.page.width,
|
||||
height: 0,
|
||||
borderStyle:'dotted',
|
||||
borderWidth: '1px',
|
||||
left: 0,
|
||||
top : sublinePos
|
||||
});
|
||||
subline2.css({
|
||||
display : "block",
|
||||
"z-index" : Model.orderList.length + 5,
|
||||
width: Model.define.page.width,
|
||||
height: 0,
|
||||
borderStyle:'dotted',
|
||||
borderWidth: '1px',
|
||||
left: 0,
|
||||
top : sublinePos,
|
||||
cursor: 'move'
|
||||
});
|
||||
|
||||
var obj = filterShapeAndLine('y',sublinePos)
|
||||
|
||||
var obj
|
||||
var container = $("#canvas_container");
|
||||
var canvas = $("#designer_canvas");
|
||||
subline2.bind('mousedown.drag',function (b) {
|
||||
container.bind('mousemove.drag',function (e) {
|
||||
var newPos = Utils.getRelativePos(e.pageX, e.pageY, canvas);
|
||||
if (newPos.y >= sublinePos) { // 增加
|
||||
subline1.css({
|
||||
borderColor: 'rgb(114,253,107)',
|
||||
backgroundColor: 'rgba(114,253,107,0.5)',
|
||||
height: newPos.y - sublinePos
|
||||
})
|
||||
subline2.css({
|
||||
borderColor: 'rgb(114,253,107)',
|
||||
backgroundColor: 'transparent',
|
||||
height: 0
|
||||
})
|
||||
subline2.css({
|
||||
top : newPos.y,
|
||||
});
|
||||
} else { // 减少
|
||||
let maxY = obj.passedShapesEdge - obj.sublineSideEdge > 0 ? obj.passedShapesEdge : obj.sublineSideEdge
|
||||
if (newPos.y < maxY) {
|
||||
newPos.y = maxY
|
||||
}
|
||||
subline1.css({
|
||||
borderColor: 'rgb(246,163,163)',
|
||||
backgroundColor: 'transparent',
|
||||
height: 0
|
||||
})
|
||||
subline2.css({
|
||||
borderColor: 'rgb(246,163,163)',
|
||||
backgroundColor: 'rgba(246,163,163,0.5)',
|
||||
height: sublinePos - newPos.y
|
||||
})
|
||||
subline2.css({
|
||||
top : newPos.y,
|
||||
});
|
||||
}
|
||||
$(document).unbind("mouseup.drop").bind("mouseup.drop",
|
||||
function(e) {
|
||||
var height1 = subline1.height()
|
||||
var height2 = subline2.height()
|
||||
if (height1 != 0 && height2 == 0) { // 增加
|
||||
moveShapeAndFile('y',sublinePos,height1)
|
||||
} else if (height1 == 0 && height2 != 0) { // 减少
|
||||
moveShapeAndFile('y',sublinePos,0-height2)
|
||||
}
|
||||
|
||||
container.bind('mousemove.drag',function (a) {
|
||||
let pos = Utils.getRelativePos(a.pageX, a.pageY, canvas)
|
||||
subline1.css({
|
||||
display : "block",
|
||||
"z-index" : Model.orderList.length + 4,
|
||||
width: Model.define.page.width,
|
||||
height: 0,
|
||||
borderStyle:'dotted',
|
||||
borderWidth: '1px',
|
||||
left: 0,
|
||||
top : pos.y
|
||||
});
|
||||
container.bind('mousedown.drag',function (b) {
|
||||
container.unbind("mousemove.drag");
|
||||
let pos1 = Utils.getRelativePos(b.pageX, b.pageY, canvas)
|
||||
sublinePos = pos1.y
|
||||
obj = filterShapeAndLine('y',sublinePos)
|
||||
subline1.css({
|
||||
display : "block",
|
||||
"z-index" : Model.orderList.length + 4,
|
||||
width: Model.define.page.width,
|
||||
height: 0,
|
||||
borderStyle:'dotted',
|
||||
borderWidth: '1px',
|
||||
left: 0,
|
||||
top : pos1.y
|
||||
});
|
||||
subline2.css({
|
||||
display : "block",
|
||||
"z-index" : Model.orderList.length + 5,
|
||||
width: Model.define.page.width,
|
||||
height: 0,
|
||||
borderStyle:'dotted',
|
||||
borderWidth: '1px',
|
||||
left: 0,
|
||||
top : pos1.y,
|
||||
cursor: 'move'
|
||||
});
|
||||
container.bind('mousemove.drag',function (e) {
|
||||
var newPos = Utils.getRelativePos(e.pageX, e.pageY, canvas);
|
||||
if (newPos.y >= sublinePos) { // 增加
|
||||
subline1.css({
|
||||
borderColor: '#333',
|
||||
borderColor: 'rgb(114,253,107)',
|
||||
backgroundColor: 'rgba(114,253,107,0.5)',
|
||||
height: newPos.y - sublinePos
|
||||
})
|
||||
subline2.css({
|
||||
borderColor: 'rgb(114,253,107)',
|
||||
backgroundColor: 'transparent',
|
||||
height: 0
|
||||
})
|
||||
subline2.css({
|
||||
borderColor: '#333',
|
||||
top : newPos.y,
|
||||
});
|
||||
} else { // 减少
|
||||
let maxY = obj.passedShapesEdge - obj.sublineSideEdge > 0 ? obj.passedShapesEdge : obj.sublineSideEdge
|
||||
if (newPos.y < maxY) {
|
||||
newPos.y = maxY
|
||||
}
|
||||
subline1.css({
|
||||
borderColor: 'rgb(246,163,163)',
|
||||
backgroundColor: 'transparent',
|
||||
height: 0
|
||||
})
|
||||
subline1.hide()
|
||||
subline2.hide()
|
||||
subline2.css({
|
||||
borderColor: 'rgb(246,163,163)',
|
||||
backgroundColor: 'rgba(246,163,163,0.5)',
|
||||
height: sublinePos - newPos.y
|
||||
})
|
||||
subline2.css({
|
||||
top : newPos.y,
|
||||
});
|
||||
}
|
||||
$(document).unbind("mouseup.drop").bind("mouseup.drop",
|
||||
function(e) {
|
||||
var height1 = subline1.height()
|
||||
var height2 = subline2.height()
|
||||
if (height1 != 0 && height2 == 0) { // 增加
|
||||
moveShapeAndFile('y',sublinePos,height1)
|
||||
} else if (height1 == 0 && height2 != 0) { // 减少
|
||||
moveShapeAndFile('y',sublinePos,0-height2)
|
||||
}
|
||||
subline1.css({
|
||||
borderColor: '#333',
|
||||
backgroundColor: 'transparent',
|
||||
height: 0
|
||||
})
|
||||
subline2.css({
|
||||
borderColor: '#333',
|
||||
backgroundColor: 'transparent',
|
||||
height: 0
|
||||
})
|
||||
subline1.hide()
|
||||
subline2.hide()
|
||||
|
||||
$(document).unbind("mouseup.drop")
|
||||
})
|
||||
})
|
||||
$(document).bind('mouseup.drag',function () {
|
||||
container.unbind("mousemove.drag");
|
||||
subline2.unbind("mousedown.drag");
|
||||
$(document).unbind("mouseup.drag");
|
||||
$(document).unbind("mouseup.drop")
|
||||
})
|
||||
})
|
||||
$(document).bind('mouseup.drag',function () {
|
||||
container.unbind("mousemove.drag");
|
||||
container.unbind("mousedown.drag");
|
||||
$(document).unbind("mouseup.drag");
|
||||
})
|
||||
})
|
||||
})
|
||||
});
|
||||
@ -559,103 +575,118 @@ function moveLanes(type,sublinePos,movedDistance) {
|
||||
/**
|
||||
* 设计器方法:调节水平间距
|
||||
*/
|
||||
Designer.addFunction("selectHorizontal", function(menuPos) {
|
||||
var sublinePos = menuPos.x
|
||||
Designer.addFunction("selectHorizontal", function() {
|
||||
var sublinePos
|
||||
var subline1 = $('#designer_subline1') // 初始位置
|
||||
var subline2 = $('#designer_subline2')
|
||||
subline1.css({
|
||||
display : "block",
|
||||
"z-index" : Model.orderList.length + 4,
|
||||
width: 0,
|
||||
height: Model.define.page.width,
|
||||
borderStyle:'dotted',
|
||||
borderWidth: '1px',
|
||||
left: sublinePos,
|
||||
top : 0
|
||||
});
|
||||
subline2.css({
|
||||
display : "block",
|
||||
"z-index" : Model.orderList.length + 5,
|
||||
width: 0,
|
||||
height: Model.define.page.width,
|
||||
borderStyle:'dotted',
|
||||
borderWidth: '1px',
|
||||
left: sublinePos,
|
||||
top : 0,
|
||||
cursor: 'move'
|
||||
});
|
||||
var obj = filterShapeAndLine('x',sublinePos)
|
||||
|
||||
var obj
|
||||
var container = $("#canvas_container");
|
||||
var canvas = $("#designer_canvas");
|
||||
|
||||
subline2.bind('mousedown.drag',function (b) {
|
||||
container.bind('mousemove.drag',function (e) {
|
||||
var newPos = Utils.getRelativePos(e.pageX, e.pageY, canvas);
|
||||
if (newPos.x >= sublinePos) { // 增加
|
||||
subline1.css({
|
||||
borderColor: 'rgb(114,253,107)',
|
||||
backgroundColor: 'rgba(114,253,107,0.5)',
|
||||
width: newPos.x - sublinePos
|
||||
})
|
||||
subline2.css({
|
||||
borderColor: 'rgb(114,253,107)',
|
||||
backgroundColor: 'transparent',
|
||||
width: 0
|
||||
})
|
||||
subline2.css({
|
||||
left : newPos.x,
|
||||
});
|
||||
} else { // 减少
|
||||
let max = obj.passedShapesEdge - obj.sublineSideEdge > 0 ? obj.passedShapesEdge : obj.sublineSideEdge
|
||||
if (newPos.x < max) {
|
||||
newPos.x = max
|
||||
}
|
||||
subline1.css({
|
||||
borderColor: 'rgb(246,163,163)',
|
||||
backgroundColor: 'transparent',
|
||||
width: 0
|
||||
})
|
||||
subline2.css({
|
||||
borderColor: 'rgb(246,163,163)',
|
||||
backgroundColor: 'rgba(246,163,163,0.5)',
|
||||
width: sublinePos - newPos.x
|
||||
})
|
||||
subline2.css({
|
||||
left : newPos.x,
|
||||
});
|
||||
}
|
||||
$(document).unbind("mouseup.drop").bind("mouseup.drop",
|
||||
function(e) {
|
||||
var width1 = subline1.width()
|
||||
var width2 = subline2.width()
|
||||
if(width1 != 0 && width2 == 0) { // 增加
|
||||
moveShapeAndFile('x',sublinePos,width1)
|
||||
} else if(width1 == 0 && width2 != 0) { // 减少
|
||||
moveShapeAndFile('x',sublinePos,0-width2)
|
||||
}
|
||||
|
||||
|
||||
container.bind('mousemove.drag',function (a) {
|
||||
let pos = Utils.getRelativePos(a.pageX, a.pageY, canvas)
|
||||
subline1.css({
|
||||
display : "block",
|
||||
"z-index" : Model.orderList.length + 4,
|
||||
width: 0,
|
||||
height: Model.define.page.height,
|
||||
borderStyle:'dotted',
|
||||
borderWidth: '1px',
|
||||
left: pos.x,
|
||||
top : 0
|
||||
});
|
||||
container.bind('mousedown.drag',function (b) {
|
||||
container.unbind("mousemove.drag");
|
||||
let pos1 = Utils.getRelativePos(b.pageX, b.pageY, canvas)
|
||||
sublinePos = pos1.x
|
||||
obj = filterShapeAndLine('x',sublinePos)
|
||||
subline1.css({
|
||||
display : "block",
|
||||
"z-index" : Model.orderList.length + 4,
|
||||
width: 0,
|
||||
height: Model.define.page.height,
|
||||
borderStyle:'dotted',
|
||||
borderWidth: '1px',
|
||||
left: pos1.x,
|
||||
top : 0
|
||||
});
|
||||
subline2.css({
|
||||
display : "block",
|
||||
"z-index" : Model.orderList.length + 5,
|
||||
width: 0,
|
||||
height: Model.define.page.height,
|
||||
borderStyle:'dotted',
|
||||
borderWidth: '1px',
|
||||
left: pos1.x,
|
||||
top : 0,
|
||||
cursor: 'move'
|
||||
});
|
||||
container.bind('mousemove.drag',function (e) {
|
||||
var newPos = Utils.getRelativePos(e.pageX, e.pageY, canvas);
|
||||
if (newPos.x >= sublinePos) { // 增加
|
||||
subline1.css({
|
||||
borderColor: '#333',
|
||||
borderColor: 'rgb(114,253,107)',
|
||||
backgroundColor: 'rgba(114,253,107,0.5)',
|
||||
width: newPos.x - sublinePos
|
||||
})
|
||||
subline2.css({
|
||||
borderColor: 'rgb(114,253,107)',
|
||||
backgroundColor: 'transparent',
|
||||
width: 0
|
||||
})
|
||||
subline2.css({
|
||||
borderColor: '#333',
|
||||
left : newPos.x,
|
||||
});
|
||||
} else { // 减少
|
||||
let max = obj.passedShapesEdge - obj.sublineSideEdge > 0 ? obj.passedShapesEdge : obj.sublineSideEdge
|
||||
if (newPos.x < max) {
|
||||
newPos.x = max
|
||||
}
|
||||
subline1.css({
|
||||
borderColor: 'rgb(246,163,163)',
|
||||
backgroundColor: 'transparent',
|
||||
width: 0
|
||||
})
|
||||
subline1.hide()
|
||||
subline2.hide()
|
||||
subline2.css({
|
||||
borderColor: 'rgb(246,163,163)',
|
||||
backgroundColor: 'rgba(246,163,163,0.5)',
|
||||
width: sublinePos - newPos.x
|
||||
})
|
||||
subline2.css({
|
||||
left : newPos.x,
|
||||
});
|
||||
}
|
||||
$(document).unbind("mouseup.drop").bind("mouseup.drop",
|
||||
function(e) {
|
||||
var width1 = subline1.width()
|
||||
var width2 = subline2.width()
|
||||
if(width1 != 0 && width2 == 0) { // 增加
|
||||
moveShapeAndFile('x',sublinePos,width1)
|
||||
} else if(width1 == 0 && width2 != 0) { // 减少
|
||||
moveShapeAndFile('x',sublinePos,0-width2)
|
||||
}
|
||||
|
||||
$(document).unbind("mouseup.drop")
|
||||
})
|
||||
})
|
||||
$(document).bind('mouseup.drag',function () {
|
||||
container.unbind("mousemove.drag");
|
||||
subline2.unbind("mousedown.drag");
|
||||
$(document).unbind("mouseup.drag");
|
||||
subline1.css({
|
||||
borderColor: '#333',
|
||||
backgroundColor: 'transparent',
|
||||
width: 0
|
||||
})
|
||||
subline2.css({
|
||||
borderColor: '#333',
|
||||
backgroundColor: 'transparent',
|
||||
width: 0
|
||||
})
|
||||
subline1.hide()
|
||||
subline2.hide()
|
||||
|
||||
$(document).unbind("mouseup.drop")
|
||||
})
|
||||
})
|
||||
$(document).bind('mouseup.drag',function () {
|
||||
container.unbind("mousemove.drag");
|
||||
container.unbind("mousedown.drag");
|
||||
$(document).unbind("mouseup.drag");
|
||||
})
|
||||
})
|
||||
})
|
||||
});
|
||||
@ -664,10 +695,10 @@ Designer.addFunction("selectHorizontal", function(menuPos) {
|
||||
* 设计器方法:修改字体样式
|
||||
*/
|
||||
Designer.addFunction("setFontStyle", function(style){
|
||||
var selected = Utils.getSelected();
|
||||
if(selected.length == 0){
|
||||
return;
|
||||
}
|
||||
var selected = Utils.getSelected();
|
||||
if(selected.length == 0){
|
||||
return;
|
||||
}
|
||||
for(var i = 0; i < selected.length; i++){
|
||||
var shape = selected[i];
|
||||
shape.fontStyle = Utils.copy(shape.fontStyle);
|
||||
@ -710,11 +741,11 @@ Designer.addFunction("setFontStyle", function(style){
|
||||
* 设计器方法:修改样式
|
||||
*/
|
||||
Designer.addFunction("setShapeStyle", function(style){
|
||||
var selected = Utils.getSelected();
|
||||
if(selected.length == 0){
|
||||
return;
|
||||
}
|
||||
var changed = [];
|
||||
var selected = Utils.getSelected();
|
||||
if(selected.length == 0){
|
||||
return;
|
||||
}
|
||||
var changed = [];
|
||||
for(var i = 0; i < selected.length; i++){
|
||||
var shape = selected[i];
|
||||
//连接线和形状不同的样式
|
||||
|
||||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user