summaryrefslogtreecommitdiff
path: root/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'index.html')
-rw-r--r--index.html162
1 files changed, 118 insertions, 44 deletions
diff --git a/index.html b/index.html
index d0fe017..08be9d7 100644
--- a/index.html
+++ b/index.html
@@ -365,9 +365,6 @@
// Source edge is replaced with first edge and futureSource edges
cell.name = 'SPLIT_f';
- var firstEdge = graph.insertEdge(parent, null, '', cell.getChildAt(1), sourceTarget);
- var thirdEdge = graph.insertEdge(parent, null, '', cell.getChildAt(2), target);
- var futureSource = graph.insertEdge(parent, null, '', source.source, cell.getChildAt(0));
// Hide all the ports of a split-block
cell.getChildAt(0).setVisible(false);
@@ -377,9 +374,6 @@
// Remove the current source
graph.removeCells([source], true);
- // Set the newly made futureSource as the source
- source = futureSource;
-
/*
* If there are any waypoints, divide them for the two newly created edges.
* The two newly created edges are inherited from the source edge
@@ -394,9 +388,6 @@
for(var i = seg; i < waypoints.length; i++) {
waypoints2.push(waypoints[i]);
}
-
- source.geometry.points = waypoints1;
- firstEdge.geometry.points = waypoints2;
}
// Find the waypoints of the current edge, and set the waypoints for the new thirdEdge
@@ -406,7 +397,13 @@
waypoints3.pop();
}
- thirdEdge.geometry.points = waypoints3;
+ // Create three edges associated with the split-block
+ var firstEdge = createEdgeObject(graph, cell.getChildAt(1), sourceTarget, waypoints2);
+ var thirdEdge = createEdgeObject(graph, cell.getChildAt(2), target, waypoints3);
+ var futureSource = createEdgeObject(graph, source.source, cell.getChildAt(0), waypoints1);
+
+ // Set the newly made futureSource as the source
+ source = futureSource;
// Connectable for the ports and the split-block should be false
cell.getChildAt(0).setConnectable(false);
@@ -515,9 +512,6 @@
// Source edge is replaced with first edge and futureSource edges
cell.name = 'SPLIT_f';
- var firstEdge = graph.insertEdge(parent, null, '', cell.getChildAt(1), sourceTarget);
- var thirdEdge = graph.insertEdge(parent, null, '', cell.getChildAt(2), source);
- var futureSource = graph.insertEdge(parent, null, '', target.source, cell.getChildAt(0));
// Hide all the ports of a split-block
cell.getChildAt(0).setVisible(false);
@@ -526,7 +520,6 @@
// Remove the current source
graph.removeCells([target], true);
- target = futureSource;
/*
* If there are any waypoints, divide them for the two newly created edges.
@@ -542,9 +535,6 @@
for(var i = seg; i < waypoints.length; i++) {
waypoints2.push(waypoints[i]);
}
-
- target.geometry.points = waypoints1;
- firstEdge.geometry.points = waypoints2;
}
// Find the waypoints of the current edge, and set the waypoints for the new thirdEdge
@@ -552,8 +542,15 @@
if(waypoints3 != null && waypoints3.length > 1) {
waypoints3.pop();
}
- waypoints3.reverse();
- thirdEdge.geometry.points = waypoints3;
+ waypoints3.reverse();
+
+ // Create three edges associated with the split-block
+ var firstEdge = createEdgeObject(graph, cell.getChildAt(1), sourceTarget, waypoints2);
+ var thirdEdge = createEdgeObject(graph, cell.getChildAt(2), source, waypoints3);
+ var futureSource = createEdgeObject(graph, target.source, cell.getChildAt(0), waypoints1);
+
+ // Set the newly made futureSource as the source
+ target = futureSource;
// Connectable for the ports and the split-block should be false
cell.getChildAt(0).setConnectable(false);
@@ -640,26 +637,14 @@
if((source.value.indexOf('Input') != -1 && target.value.indexOf('Output') != -1)
|| (target.value == 'CommandPort' && source.value == 'ControlPort')) {
- // Begin graph DOM update
- graph.getModel().beginUpdate();
-
- try {
+ // Get points for the current edge from the global edgeState object
+ var waypoints = edgeState.absolutePoints;
- // Insert new edge in place of current edge
- var newEdge = graph.insertEdge(parent, null, '', target, source);
+ // Reverse waypoint array
+ waypoints.reverse();
- // Get points for the current edge from the global edgeState object
- var waypoints = edgeState.absolutePoints;
-
- // Reverse waypoint array
- waypoints.reverse();
-
- // Set the points for the new edge
- newEdge.geometry.points = waypoints;
- }
- finally {
- graph.getModel().endUpdate();
- }
+ // Create a new edge
+ var newEdge = createEdgeObject(graph, target, source, waypoints);
// Return null for the current edge,
@@ -1571,6 +1556,53 @@
};
/*
+ * @jiteshjha
+ * createEdgeObject(@parameters) creates an edge on the graph DOM
+ * @Parameters :
+ * source -> source object for the edge
+ * target -> destination object for the edge
+ * points -> waypoints to be inserted in the geometry
+ */
+ function createEdgeObject(graph, source, target, points) {
+
+ // Start the update on the graph
+ graph.getModel().beginUpdate();
+
+ try {
+
+ // Create an edge from the given source object and target object
+ var edge = graph.insertEdge(graph.getDefaultParent(), null, '', source, target);
+
+ // Get geometry of the edge
+ var geometry = graph.getModel().getGeometry(edge);
+
+ /*
+ * Clone the geometry object
+ * NOTE: Direct manipulation of the geometry object may not be
+ * registered as an action for some cases, hence we clone the
+ * geometry, manipulate it and set the geometry.
+ */
+ var cloneGeometry = geometry.clone();
+
+ // Add points in the cloned geometry
+ cloneGeometry.points = points;
+
+ // Set the changed geometry for the edge
+ graph.getModel().setGeometry(edge, cloneGeometry);
+
+ // Refresh to reflect changes made
+ graph.refresh();
+ }
+ finally {
+
+ // End the update
+ graph.getModel().endUpdate();
+ }
+
+ return edge;
+ }
+
+ /*
@jiteshjha
Creates a dialog box related to the edge label properties.
The properties implemented are : edge label, label fontStyle,
@@ -2151,6 +2183,55 @@
var enc = new mxCodec(mxUtils.createXmlDocument());
var node = enc.encode(details);
var temp = enc.encode(parent);
+
+ /*
+ * @jiteshjha
+ */
+
+ // Get the stylesheet for the graph
+ var stylesheet = graph.getStylesheet();
+
+ // From the stylesheet, get the style of the particular block
+ var style = stylesheet.styles[name];
+
+ /*
+ * When a particular block is loaded for the first time,
+ * the image in the style of the block will be a path to the image.
+ * Set the label in the style property of the block has a html image,
+ * and set the image in the style property as null
+ *
+ * NOTE: Since the image of any block need not be changed for
+ * for every movement of that block, the image must be
+ * set only once.
+ */
+ if(style != null && style['image'] != null) {
+
+ // Make label as a image html element
+ var label = '<img src="' + style['image'] + '" height="80" width="80">';
+
+ // Set label
+ style['label'] = label;
+
+ // Set image as null
+ style['image'] = null;
+
+ // Add the label as a part of node
+ node.setAttribute('label', label);
+ }
+
+ /*
+ * If a particular block with image tag in it's style property
+ * has been invoked already, the image tag would be null for any
+ * successive instances of the same block. Hence, set the label
+ * from the label tag in style which was set when that blockModel
+ * was invoked on the first time.
+ */
+ if(style!= null && style['label'] != null) {
+
+ // Set label from the label field in the style property
+ node.setAttribute('label', style['label']);
+ }
+
node.setAttribute('parent', temp.getAttribute('id'));
var i, arr = [];
var blockModel = details_instance.x.model;
@@ -2321,13 +2402,6 @@
var root = req.getDocumentElement();
var dec = new mxCodec(root.ownerDocument);
dec.decode(root, graph.stylesheet);
-
- // Set the width and height of image for all blocks to 80 (height) x 80 (width)
- var style = new Object();
- style[mxConstants.STYLE_IMAGE_WIDTH] = '80';
- style[mxConstants.STYLE_IMAGE_HEIGHT] = '80';
- style['imageAlign'] = 'center';
- graph.getStylesheet().putDefaultVertexStyle(style);
};
</script>
<!--
generated by cgit (git 2.34.1) at 2025-03-22 19:19:14 +0000