Improve Rule Chain UI edit.

This commit is contained in:
Igor Kulikov 2018-04-12 10:50:40 +03:00
parent b13d666f1b
commit 8e3989c9a1
3 changed files with 77 additions and 32 deletions

View File

@ -62,6 +62,12 @@ export function RuleChainController($state, $scope, $compile, $q, $mdUtil, $time
vm.isEditingRuleNodeLink = false;
vm.isLibraryOpen = true;
Object.defineProperty(vm, 'isLibraryOpenReadonly', {
get: function() { return vm.isLibraryOpen },
set: function() {}
});
vm.ruleNodeSearch = '';
vm.ruleChain = ruleChain;
@ -140,6 +146,19 @@ export function RuleChainController($state, $scope, $compile, $q, $mdUtil, $time
subtitle: $translate.instant('rulechain.rulechain')
};
contextInfo.items = [];
if (vm.modelservice.nodes.getSelectedNodes().length) {
contextInfo.items.push(
{
action: function () {
copyRuleNodes();
},
enabled: true,
value: "rulenode.copy-selected",
icon: "content_copy",
shortcut: "M-C"
}
);
}
contextInfo.items.push(
{
action: function ($event) {
@ -168,17 +187,6 @@ export function RuleChainController($state, $scope, $compile, $q, $mdUtil, $time
shortcut: "Esc"
}
);
contextInfo.items.push(
{
action: function (event) {
copyRuleNodes(event);
},
enabled: true,
value: "rulenode.copy-selected",
icon: "content_copy",
shortcut: "M-C"
}
);
contextInfo.items.push(
{
action: function () {
@ -254,8 +262,8 @@ export function RuleChainController($state, $scope, $compile, $q, $mdUtil, $time
);
contextInfo.items.push(
{
action: function (event) {
copyNode(event, node);
action: function () {
copyNode(node);
},
enabled: true,
value: "action.copy",
@ -323,12 +331,33 @@ export function RuleChainController($state, $scope, $compile, $q, $mdUtil, $time
vm.modelservice.selectAll();
}
})
.add({
combo: 'ctrl+c',
description: $translate.instant('rulenode.copy-selected'),
allowIn: ['INPUT', 'SELECT', 'TEXTAREA'],
callback: function (event) {
event.preventDefault();
copyRuleNodes();
}
})
.add({
combo: 'ctrl+v',
description: $translate.instant('action.paste'),
allowIn: ['INPUT', 'SELECT', 'TEXTAREA'],
callback: function (event) {
event.preventDefault();
if (itembuffer.hasRuleNodes()) {
pasteRuleNodes();
}
}
})
.add({
combo: 'esc',
description: $translate.instant('rulenode.deselect-all-objects'),
allowIn: ['INPUT', 'SELECT', 'TEXTAREA'],
callback: function (event) {
event.preventDefault();
event.stopPropagation();
vm.modelservice.deselectAll();
}
})
@ -624,17 +653,11 @@ export function RuleChainController($state, $scope, $compile, $q, $mdUtil, $time
}
}
function copyNode(event, node) {
var offset = angular.element(vm.canvasControl.modelservice.getCanvasHtmlElement()).offset();
var x = Math.round(event.clientX - offset.left);
var y = Math.round(event.clientY - offset.top);
itembuffer.copyRuleNodes(x, y, [node], []);
function copyNode(node) {
itembuffer.copyRuleNodes([node], []);
}
function copyRuleNodes(event) {
var offset = angular.element(vm.canvasControl.modelservice.getCanvasHtmlElement()).offset();
var x = Math.round(event.clientX - offset.left);
var y = Math.round(event.clientY - offset.top);
function copyRuleNodes() {
var nodes = vm.modelservice.nodes.getSelectedNodes();
var edges = vm.modelservice.edges.getSelectedEdges();
var connections = [];
@ -655,13 +678,23 @@ export function RuleChainController($state, $scope, $compile, $q, $mdUtil, $time
connections.push(connection);
}
}
itembuffer.copyRuleNodes(x, y, nodes, connections);
itembuffer.copyRuleNodes(nodes, connections);
}
function pasteRuleNodes(event) {
var offset = angular.element(vm.canvasControl.modelservice.getCanvasHtmlElement()).offset();
var x = Math.round(event.clientX - offset.left);
var y = Math.round(event.clientY - offset.top);
var canvas = angular.element(vm.canvasControl.modelservice.getCanvasHtmlElement());
var x,y;
if (event) {
var offset = canvas.offset();
x = Math.round(event.clientX - offset.left);
y = Math.round(event.clientY - offset.top);
} else {
var scrollParent = canvas.parent();
var scrollTop = scrollParent.scrollTop();
var scrollLeft = scrollParent.scrollLeft();
x = scrollLeft + scrollParent.width()/2;
y = scrollTop + scrollParent.height()/2;
}
var ruleNodes = itembuffer.pasteRuleNodes(x, y, event);
if (ruleNodes) {
vm.modelservice.deselectAll();

View File

@ -36,8 +36,8 @@
</section>
<md-sidenav class="tb-rulechain-library md-sidenav-left md-whiteframe-4dp"
md-disable-backdrop
md-is-locked-open="vm.isLibraryOpen"
md-is-open="vm.isLibraryOpen"
md-is-locked-open="vm.isLibraryOpenReadonly"
md-is-open="vm.isLibraryOpenReadonly"
md-component-id="rulechain-library-sidenav" layout="column">
<md-toolbar>
<div class="md-toolbar-tools">

View File

@ -155,13 +155,12 @@ function ItemBuffer($q, bufferStore, types, utils, dashboardUtils, ruleChainServ
};
}
function copyRuleNodes(x, y, nodes, connections) {
function copyRuleNodes(nodes, connections) {
var ruleNodes = {
nodes: [],
connections: [],
originX: x,
originY: y
connections: []
};
var top = -1, left = -1, bottom = -1, right = -1;
for (var i=0;i<nodes.length;i++) {
var origNode = nodes[i];
var node = {
@ -180,7 +179,20 @@ function ItemBuffer($q, bufferStore, types, utils, dashboardUtils, ruleChainServ
node.error = origNode.error;
}
ruleNodes.nodes.push(node);
if (i==0) {
top = node.y;
left = node.x;
bottom = node.y + 50;
right = node.x + 170;
} else {
top = Math.min(top, node.y);
left = Math.min(left, node.x);
bottom = Math.max(bottom, node.y + 50);
right = Math.max(right, node.x + 170);
}
}
ruleNodes.originX = left + (right-left)/2;
ruleNodes.originY = top + (bottom-top)/2;
for (i=0;i<connections.length;i++) {
var connection = connections[i];
ruleNodes.connections.push(connection);