Skip to content
This repository was archived by the owner on Dec 30, 2024. It is now read-only.

Commit e912915

Browse files
authored
Merge pull request #257 from aws-solutions/jim-v1.10.0
Diagram edits lock/unlock
2 parents c892912 + 906b978 commit e912915

File tree

2 files changed

+168
-57
lines changed

2 files changed

+168
-57
lines changed

Diff for: source/html/js/app/ui/diagram_factory.js

+69-42
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/*! Copyright 2018 Amazon.com, Inc. or its affiliates. All Rights Reserved.
22
SPDX-License-Identifier: Apache-2.0 */
33
define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui/diagram_statemachine_factory", "app/ui/alert", "app/settings", "app/ui/vis_options"],
4-
function($, _, ui_util, model, layout, diagram_statemachine_factory, alert, settings, vis_options) {
4+
function ($, _, ui_util, model, layout, diagram_statemachine_factory, alert, settings, vis_options) {
55
class Diagram {
66

77
constructor(name, view_id) {
@@ -33,11 +33,13 @@ define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui
3333
// this.drawingSurfaceImageData;
3434
// other state
3535
this.first_fit = false;
36+
// locking some functions (move, add, delete)
37+
this.locked = false;
3638
// This FSM manages the startup and state restoration
3739
this.statemachine = diagram_statemachine_factory.create(this);
3840
// development logging
39-
this.statemachine.on("transition", (function() {
40-
return function(data) {
41+
this.statemachine.on("transition", (function () {
42+
return function (data) {
4143
// log the state transitions of the FSMs
4244
console.log(data);
4345
};
@@ -54,12 +56,12 @@ define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui
5456

5557
layout_vertical(save) {
5658
var my_diagram = this;
57-
settings.get("layout-method").then(function(response) {
59+
settings.get("layout-method").then(function (response) {
5860
var method = response.method;
5961
var options = vis_options.vertical_layout;
6062
options.layout.hierarchical.sortMethod = method;
61-
my_diagram.network.once("afterDrawing", (function() {
62-
return function() {
63+
my_diagram.network.once("afterDrawing", (function () {
64+
return function () {
6365
console.log("layout finished");
6466
my_diagram.network.setOptions(vis_options.without_layout);
6567
my_diagram.layout_isolated(false);
@@ -76,12 +78,12 @@ define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui
7678

7779
layout_horizontal(save) {
7880
var my_diagram = this;
79-
settings.get("layout-method").then(function(response) {
81+
settings.get("layout-method").then(function (response) {
8082
var method = response.method;
8183
var options = vis_options.horizontal_layout;
8284
options.layout.hierarchical.sortMethod = method;
83-
my_diagram.network.once("afterDrawing", (function() {
84-
return function() {
85+
my_diagram.network.once("afterDrawing", (function () {
86+
return function () {
8587
console.log("layout finished");
8688
my_diagram.network.setOptions(vis_options.without_layout);
8789
my_diagram.layout_isolated(false);
@@ -200,13 +202,13 @@ define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui
200202

201203
restore_nodes() {
202204
var diagram = this;
203-
return new Promise(function(resolve, reject) {
204-
layout.retrieve_layout(diagram).then(function(layout_items) {
205+
return new Promise(function (resolve, reject) {
206+
layout.retrieve_layout(diagram).then(function (layout_items) {
205207
var node_ids = _.map(layout_items, "id");
206208
var nodes = _.compact(model.nodes.get(node_ids));
207209
diagram.nodes.update(nodes);
208210
resolve(layout_items);
209-
}).catch(function(error) {
211+
}).catch(function (error) {
210212
console.log(error);
211213
reject(error);
212214
});
@@ -215,22 +217,22 @@ define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui
215217

216218
restore_layout(layout_items) {
217219
var diagram = this;
218-
return new Promise(function(resolve, reject) {
220+
return new Promise(function (resolve, reject) {
219221
var inner_promise;
220222
if (!layout_items) {
221223
inner_promise = layout.retrieve_layout(diagram);
222224
} else {
223225
inner_promise = Promise.resolve(layout_items);
224226
}
225-
inner_promise.then(function(layout_items) {
227+
inner_promise.then(function (layout_items) {
226228
for (let item of layout_items) {
227229
var node = diagram.nodes.get(item.id);
228230
if (node) {
229231
diagram.network.moveNode(item.id, item.x, item.y);
230232
}
231233
}
232234
resolve(layout_items);
233-
}).catch(function(error) {
235+
}).catch(function (error) {
234236
console.log(error);
235237
reject(error);
236238
});
@@ -241,8 +243,8 @@ define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui
241243
for (let node_id of this.nodes.getIds()) {
242244
// find all edges connected to this node
243245
var matches = model.edges.get({
244-
filter: (function(local_node_id) {
245-
return function(edge) {
246+
filter: (function (local_node_id) {
247+
return function (edge) {
246248
return (edge.to == local_node_id || edge.from == local_node_id);
247249
};
248250
})(node_id)
@@ -267,8 +269,8 @@ define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui
267269
for (let id of node_ids) {
268270
// query all edges from the model with this node
269271
let filtered = _.filter(model.edges.get(),
270-
(function(local_id) {
271-
return function(edge) { return edge.to == local_id || edge.from == local_id; };
272+
(function (local_id) {
273+
return function (edge) { return edge.to == local_id || edge.from == local_id; };
272274
})(id)
273275
);
274276
for (let edge of filtered) {
@@ -279,30 +281,30 @@ define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui
279281
diagram.edges.update(edge);
280282
}
281283
} else
282-
if (edge.from == id) {
283-
// check 'to' node is on diagram
284-
if (diagram.nodes.get(edge.to)) {
285-
// console.log(`${diagram.name} diagram connecting nodes ${edge.from} ${edge.to}`);
286-
diagram.edges.update(edge);
284+
if (edge.from == id) {
285+
// check 'to' node is on diagram
286+
if (diagram.nodes.get(edge.to)) {
287+
// console.log(`${diagram.name} diagram connecting nodes ${edge.from} ${edge.to}`);
288+
diagram.edges.update(edge);
289+
}
287290
}
288-
}
289291
}
290292
}
291293
} else
292-
if (event == "remove") {
293-
for (let id of node_ids) {
294-
// query all edges on the diagram
295-
let filtered = _.filter(model.edges.get(),
296-
(function(local_id) {
297-
return function(edge) { return edge.to == local_id || edge.from == local_id; };
298-
})(id)
299-
);
300-
for (let edge of filtered) {
301-
console.log("removing unneeded edge");
302-
diagram.edges.remove(edge.id);
294+
if (event == "remove") {
295+
for (let id of node_ids) {
296+
// query all edges on the diagram
297+
let filtered = _.filter(model.edges.get(),
298+
(function (local_id) {
299+
return function (edge) { return edge.to == local_id || edge.from == local_id; };
300+
})(id)
301+
);
302+
for (let edge of filtered) {
303+
console.log("removing unneeded edge");
304+
diagram.edges.remove(edge.id);
305+
}
303306
}
304307
}
305-
}
306308
}
307309

308310
synchronize_content(event, node_ids) {
@@ -311,9 +313,9 @@ define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui
311313
if (event == "add") {
312314
layout.save_layout(diagram, node_ids);
313315
} else
314-
if (event == "remove") {
315-
layout.delete_layout(diagram, node_ids);
316-
}
316+
if (event == "remove") {
317+
layout.delete_layout(diagram, node_ids);
318+
}
317319
}
318320

319321
hide_div() {
@@ -473,7 +475,7 @@ define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui
473475
var diagram = this;
474476
if (blinks > 0) {
475477
setTimeout(
476-
function() {
478+
function () {
477479
if (blinks % 2 == 0) {
478480
diagram.network.selectNodes(ids, false);
479481
} else {
@@ -493,14 +495,39 @@ define(["jquery", "lodash", "app/ui/util", "app/model", "app/ui/layout", "app/ui
493495
$("#" + this.tab_icon_id).text("image_aspect_ratio");
494496
}
495497
}
498+
499+
lock(state) {
500+
const key = `diagram-lock-${window.btoa(this.name)}`;
501+
this.locked = Boolean(state).valueOf();
502+
const promise = settings.put(key, { "name": this.name, "locked": this.locked });
503+
return promise;
504+
}
505+
506+
isLocked() {
507+
const key = `diagram-lock-${window.btoa(this.name)}`;
508+
return new Promise((resolve, reject) => {
509+
const my_diagram = this;
510+
settings.get(key).then(function (value) {
511+
if (value) {
512+
my_diagram.locked = value.locked;
513+
}
514+
else {
515+
my_diagram.locked = false;
516+
}
517+
resolve(my_diagram.locked);
518+
}).catch((error) => {
519+
reject(error);
520+
});
521+
});
522+
}
496523
}
497524

498525
function create(name, view_id) {
499526
return new Diagram(name, view_id);
500527
}
501528

502529
// this shuts down the browser's context menu
503-
document.body.oncontextmenu = function() {
530+
document.body.oncontextmenu = function () {
504531
return false;
505532
};
506533

0 commit comments

Comments
 (0)