[Rt-commit] rt branch, 4.6/lifecycle-ui-dev, repushed
Craig Kaiser
craig at bestpractical.com
Fri Nov 8 16:28:08 EST 2019
The branch 4.6/lifecycle-ui-dev was deleted and repushed:
was 94f88d59dbc3362c030dc6aba95db60378bc97d6
now 975a3a746295869ac85df22c1d8325fb578d8966
1: 94f88d59db ! 1: a3322439cb Core Lifecycle-UI
@@ -932,13 +932,11 @@
+
+ <script type="text/javascript">
+ jQuery(function () {
-+ jQuery(".lifecycle-ui#lifecycle-<% $id %>").each(function () {
-+ var container = this;
-+ var config = <% JSON($config) |n %>;
-+ var name = <% $Lifecycle | j%>;
-+
-+ var editor = new RT.NewEditor( container, config );
-+ });
++ var container = document.getElementById('lifecycle-<% $id %>'),
++ config = <% JSON($config) |n %>,
++ name = <% $Lifecycle | j%>;
++
++ var editor = new RT.NewEditor( container, config );
+ });
+ </script>
+</div>
@@ -1318,7 +1316,7 @@
+path.link {
+ fill: none;
+ stroke: #000;
-+ stroke-width: 3px;
++ stroke-width: 2px;
+ cursor: pointer;
+}
+
@@ -1333,7 +1331,7 @@
+.dragline {
+ fill: none;
+ stroke: #000;
-+ stroke-width: 3px;
++ stroke-width: 2px;
+ cursor: pointer;
+}
@@ -1392,17 +1390,17 @@
+ var target = self.nodes.filter(source => { return source.name === targetName; })[0];
+
+ if ( source.id < target.id ) {
-+ self.links.push({id: ++self.links_seq, source: source, target: target, right: true, left: false});
++ self.links.push({id: ++self.links_seq, source: source, target: target, start: false, end: true});
+ return;
+ }
+ var link = self.links.filter(function(l) { return (l.source === target && l.target === source); })[0];
-+ if(link) link.left = true;
-+ else self.links.push({id: ++self.links_seq, source: source, target: target, right: true, left: false});
++ if(link) link.start = true;
++ else self.links.push({id: ++self.links_seq, source: source, target: target, start: false, end: true});
+ });
+ });
+
+ self.simulation = d3.forceSimulation()
-+ .force("link", d3.forceLink().distance(320).strength(0.5))
++ .force("link", d3.forceLink().distance(220).strength(0.2))
+ .force("charge", d3.forceManyBody())
+ .force("center", d3.forceCenter(self.width / 2, self.height / 2));
+
@@ -1415,10 +1413,10 @@
+ .on("tick", ( t => {
+ this.node.attr("transform", (d => {
+ var x = d.x, y = d.y;
-+ if ( d.x > self.width ) x = self.width - self.node_radius;
-+ if ( d.x <= 0 ) x = self.node_radius;
-+ if ( d.y > self.height ) y = self.height - self.node_radius;
-+ if ( d.y <= 0 ) y = self.node_radius;
++ if ( d.x + self.node_radius / 2 > self.width ) x = self.width - self.node_radius;
++ if ( d.x - self.node_radius / 2 <= 0 ) x = self.node_radius;
++ if ( d.y + self.node_radius / 2 > self.height ) y = self.height - self.node_radius;
++ if ( d.y - self.node_radius / 2 <= 0 ) y = self.node_radius;
+
+ return "translate(" + x + "," + y + ")";
+ }));
@@ -1429,14 +1427,14 @@
+ tx = d.target.x,
+ ty = d.target.y;
+
-+ if ( sx > self.width ) sx = self.width - self.node_radius;
-+ if ( sx <= 0 ) sx = self.node_radius;
-+ if ( sy > self.height ) sy = self.height - self.node_radius;
-+ if ( sy <= 0 ) sy = self.node_radius;
-+ if ( tx > self.width ) tx = self.width - self.node_radius;
-+ if ( tx <= 0 ) tx = self.node_radius;
-+ if ( ty > self.height ) ty = self.height - self.node_radius;
-+ if ( ty <= 0 ) ty = self.node_radius;
++ if ( sx + self.node_radius / 2 > self.width ) sx = self.width - self.node_radius;
++ if ( sx - self.node_radius / 2 <= 0 ) sx = self.node_radius;
++ if ( sy + self.node_radius / 2 > self.height ) sy = self.height - self.node_radius;
++ if ( sy - self.node_radius / 2 <= 0 ) sy = self.node_radius;
++ if ( tx + self.node_radius / 2 > self.width ) tx = self.width - self.node_radius;
++ if ( tx - self.node_radius / 2 <= 0 ) tx = self.node_radius;
++ if ( ty + self.node_radius / 2 > self.height ) ty = self.height - self.node_radius;
++ if ( ty - self.node_radius / 2 <= 0 ) ty = self.node_radius;
+
+ var deltaX = tx - sx,
+ deltaY = ty - sy,
@@ -1472,8 +1470,8 @@
+ .attr('id', 'end-arrow')
+ .attr('viewBox', '0 -5 10 10')
+ .attr('refX', 6)
-+ .attr('markerWidth', 6)
-+ .attr('markerHeight', 6)
++ .attr('markerWidth', 5)
++ .attr('markerHeight', 5)
+ .attr('orient', 'auto')
+ .append('svg:path')
+ .attr('d', 'M0,-5L10,0L0,5')
@@ -1482,9 +1480,9 @@
+ self.svg.append('svg:defs').append('svg:marker')
+ .attr('id', 'start-arrow')
+ .attr('viewBox', '0 -5 10 10')
-+ .attr('refX', 4)
-+ .attr('markerWidth', 6)
-+ .attr('markerHeight', 6)
++ .attr('refX', 6)
++ .attr('markerWidth', 5)
++ .attr('markerHeight', 5)
+ .attr('orient', 'auto')
+ .append('svg:path')
+ .attr('d', 'M10,-5L0,0L10,5')
@@ -1523,7 +1521,7 @@
+ .on('mousedown', function() { self.Mousedown(this); });
+
+ d3.select("body").on("keydown", function (d) {
-+ if ( d3.event.keyCode == 68 || d3.event.keyCode == 46 && d ) {
++ if ( self.selected_node && ( d3.event.keyCode == 68 || d3.event.keyCode == 46 ) ) {
+ d3.event.preventDefault();
+ d3.event.stopPropagation();
+
@@ -1579,6 +1577,8 @@
+ .attr("fill", '#547CCC' )
+ .on("click", function() {
+ d3.event.stopPropagation();
++ d3.event.preventDefault();
++
+ self.SelectNode(this);
+ })
+ .on('mousedown', function(d) {
@@ -1588,7 +1588,7 @@
+
+ // select node
+ self.mousedown_node = d;
-+ if ( !self.mousedown_node ) return;
++ if ( !self.mousedown_node ) { self.mousedown_node = null; return; }
+
+ // reposition drag line
+ self.drag_line
@@ -1598,21 +1598,21 @@
+
+ self.Refresh();
+ })
-+ .on('mouseup', function(d) {
++ .on('mouseup', function(d) {
+ self.mouseup_node = d;
+ // needed by FF
+ self.drag_line
-+ .classed('hidden', true)
-+ .style('marker-end', '');
++ .classed('hidden', true)
++ .style('marker-end', '');
+
+ self.simulation.stop();
+ // add link to model
+ self.AddLink(self.mousedown_node, self.mouseup_node);
+
+ self.ExportAsConfiguration();
++ self.Refresh();
+
+ self.ResetMouseVars();
-+ self.Refresh();
+ });
+
+ self.node.select("text")
@@ -1621,7 +1621,11 @@
+ .attr("x", -self.node_radius/2)
+ .attr("y", 0)
+ .style("font-size", "10px")
-+ .on("click", function(d) {self.RenderNodeInput(this, d)});
++ .on("click", function(d) {
++ d3.event.stopPropagation();
++ d3.event.preventDefault();
++ self.RenderNodeInput(this, d)
++ });
+
+ self.node.select("title")
+ .text(function(d) { return d.type; });
@@ -1648,7 +1652,7 @@
+ .style("font-size", "10px")
+ .append("xhtml:form")
+ .append("input")
-+ .on("click", d => d3.event.stopPropagation())
++ .on("click", d => {d3.event.stopPropagation(); d3.event.preventDefault();})
+ .attr("value", d => original_value)
+ .attr("style", "width: 35px; background: transparent; border: none;")
+ .on("blur", function(d) {
@@ -1657,10 +1661,9 @@
+ self.UpdateNodeStatus(self.nodes[index], text);
+ el.text(text);
+ }
-+ else {
-+ el.text(original_value);
-+ }
++ self.TruncateLabel(elem);
+ p_el.select("foreignObject").remove();
++ self.Deselect();
+ self.Refresh();
+ })
+ .on("keypress", function(d) {
@@ -1685,7 +1688,9 @@
+ else {
+ el.text(original_value);
+ }
++ self.TruncateLabel(elem);
+ p_el.select("foreignObject").remove();
++ self.Deselect();
+ self.Refresh();
+ }
+ });
@@ -1714,8 +1719,8 @@
+ var linkEnter = self.link.enter().append("g")
+ .append("path")
+ .attr("class", 'link')
-+ .style("marker-start", (d => d.right ? 'url(#start-arrow)' : '' ))
-+ .style("marker-end", (d => d.left ? 'url(#end-arrow)' : '' ))
++ .style("marker-start", (d => d.start ? 'url(#start-arrow)' : '' ))
++ .style("marker-end", (d => d.end ? 'url(#end-arrow)' : '' ))
+ .attr("transform", "translate(0,0)")
+ .on("click", d => {
+ d3.event.stopPropagation();
@@ -1728,8 +1733,8 @@
+ });
+ self.link = linkEnter.merge(self.link);
+ self.link
-+ .style("marker-start", (d => d.right ? 'url(#start-arrow)' : '' ))
-+ .style("marker-end", (d => d.left ? 'url(#end-arrow)' : '' ));
++ .style("marker-start", (d => d.start ? 'url(#start-arrow)' : '' ))
++ .style("marker-end", (d => d.end ? 'url(#end-arrow)' : '' ));
+ }
+
+ Refresh() {
@@ -1755,7 +1760,10 @@
+ }
+
+ Deselect() {
++ if (!this.selected_node) return;
+ this.selected_node = null;
++
++ this.svg.selectAll("foreignObject").remove();
+
+ this.svg.selectAll('.node-selected')
+ .classed('node-selected', false);
@@ -1862,8 +1870,10 @@
+ if (!source || !target) return;
+
+ var link = self.links.filter(function(l) { return (l.source === target && l.target === source); })[0];
-+ if(link) link.right = true;
-+ else self.links.push({id: ++self.links_seq, source: source, target: target, right: false, left: true});
++ if(link) link.start = true;
++ else {
++ self.links.push({id: ++self.links_seq, source: source, target: target, start: false, end: true});
++ }
+ }
+
+ ToggleLink(d) {
@@ -1872,14 +1882,14 @@
+
+ var link = self.links[index];
+ // delete link if we have both transitions already
-+ if ( link.right && link.left ) {
++ if ( link.start && link.end ) {
+ self.links.splice(index, 1);
+ }
-+ else if( link.right ) {
-+ link.left = true;
++ else if( link.start ) {
++ link.end = true;
+ }
+ else {
-+ link.right = true;
++ link.start = true;
+ }
+ }
+
@@ -1905,7 +1915,7 @@
+ if ( link.source.id === node.id ) {
+ return true;
+ }
-+ else if ( link.target.id === node.id && link.left ) {
++ else if ( link.target.id === node.id && link.start ) {
+ return true;
+ }
+ else {
@@ -1956,24 +1966,33 @@
+ active: [],
+ inactive: [],
+ actions: [],
-+ rights: {},
-+ transitions: [],
++ starts: {},
++ transitions: {},
+ };
+
+ // Grab our status nodes
+ ['initial', 'active', 'inactive'].forEach(type => {
-+ config[type] = self.nodes.filter(n => n.type == type);
++ config[type] = self.nodes.filter(n => n.type == type).map(n => n.name);
+ });
+
+ // Grab our links
+ config.transitions[""] = self.config.transitions[""];
+
+ self.nodes.forEach(source => {
-+ config.transitions.push({ [source.name] : self.LinksForNode(source).forEach(l => {return l.target.name;}) });
++ var links = self.LinksForNode(source);
++ var targets = links.map(link => {
++ if ( link.source.id === source.id ) {
++ return link.target.name;
++ }
++ else {
++ return link.source.name;
++ }
++ });
++ config.transitions[source.name] = targets;
+ });
+ self.config = config;
+
-+ var field = jQuery('<input type="hidden" name="Config">');
++ var field = jQuery('input[name="Config"]');
+ field.val(JSON.stringify(self.config));
+ };
+}
@@ -2562,3 +2581,4 @@
+ RT.LifecycleViewer = Viewer;
+});
+
+
-: ------- > 2: 975a3a7462 Temp
More information about the rt-commit
mailing list