-
Notifications
You must be signed in to change notification settings - Fork 857
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
RAP-896: Added missing docs/tests (#332)
- Loading branch information
Showing
107 changed files
with
2,062 additions
and
921 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta http-equiv="x-ua-compatible" content="IE=Edge"> | ||
| <meta charset="utf-8"> | ||
| <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> | ||
| <title>Rappid - Demo - layout.DirectedGraph - Clusters</title> | ||
| <link rel="stylesheet" type="text/css" href="../../../css/lib/joint.min.css"> | ||
| </head> | ||
| <body> | ||
|
|
||
| <div id="paper"></div> | ||
|
|
||
| <!-- JointJS/Rappid dependencies: --> | ||
| <script src="../../../js/lib/jquery.min.js"></script> | ||
| <script src="../../../js/lib/lodash.min.js"></script> | ||
| <script src="../../../js/lib/backbone.min.js"></script> | ||
|
|
||
| <!-- DirectedGraph dependencies: --> | ||
| <script src="../../../js/lib/graphlib.min.js"></script> | ||
| <script src="../../../js/lib/dagre.min.js"></script> | ||
|
|
||
| <script src="../../../js/lib/joint.min.js"></script> | ||
|
|
||
| <script src="js/clusters.js"></script> | ||
|
|
||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,44 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta http-equiv="x-ua-compatible" content="IE=Edge"> | ||
| <meta charset="utf-8"> | ||
| <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> | ||
| <title>Rappid - Demo - layout.DirectedGraph</title> | ||
| <link rel="stylesheet" type="text/css" href="../../../css/lib/joint.min.css"> | ||
| </head> | ||
| <body> | ||
|
|
||
| <div> | ||
| <textarea id="adjacency-list" cols="50" rows="10">{ | ||
| "My element": ["b", "c"], | ||
| "b": ["f"], | ||
| "c": ["e", "d"], | ||
| "d": [], | ||
| "e": [], | ||
| "f": ["g"], | ||
| "g": [] | ||
| }</textarea> | ||
| <br> | ||
| <br> | ||
| <button id="btn-layout">layout</button> | ||
| <br> | ||
| <br> | ||
| <div id="paper"></div> | ||
| </div> | ||
|
|
||
| <!-- JointJS/Rappid dependencies: --> | ||
| <script src="../../../js/lib/jquery.min.js"></script> | ||
| <script src="../../../js/lib/lodash.min.js"></script> | ||
| <script src="../../../js/lib/backbone.min.js"></script> | ||
|
|
||
| <!-- DirectedGraph dependencies: --> | ||
| <script src="../../../js/lib/graphlib.min.js"></script> | ||
| <script src="../../../js/lib/dagre.min.js"></script> | ||
|
|
||
| <script src="../../../js/lib/joint.min.js"></script> | ||
|
|
||
| <script src="js/index.js"></script> | ||
|
|
||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,69 @@ | ||
| 'use strict'; | ||
|
|
||
| (function() { | ||
|
|
||
| var graph = new joint.dia.Graph; | ||
| var paper = new joint.dia.Paper({ | ||
| el: $('#paper'), | ||
| width: 600, | ||
| height: 400, | ||
| gridSize: 1, | ||
| model: graph | ||
| }); | ||
|
|
||
| function makeLink(el1, el2) { | ||
| var l = new joint.dia.Link({ | ||
| source: { id: el1.id }, | ||
| target: { id: el2.id }, | ||
| attrs: { | ||
| '.connection': { stroke: 'gray' } | ||
| } | ||
| }); | ||
| return l; | ||
| } | ||
|
|
||
| function makeElement(attrs) { | ||
| var el = new joint.shapes.basic.Rect({ | ||
| size: { width: 30, height: 30 }, | ||
| attrs: { rect: { rx: 2, ry: 2, fill: '#31D0C6', stroke: '#4B4A67', 'stroke-width': 2 }, text: { text: 'rect', fill: 'white' } } | ||
| }); | ||
| el.attr(attrs); | ||
| return el; | ||
| } | ||
|
|
||
| var topGroup = makeElement({ text: { text: 'TopGroup', 'ref-y': 15 }}); | ||
| var bottomGroup = makeElement({ text: { text: 'Bottom Group', 'ref-y': 15 }}); | ||
| var group = makeElement({ text: { text: 'Group', 'ref-y': 15 }}); | ||
|
|
||
| var ea = makeElement({ text: { text: 'a' }, rect: { fill: '#FE854F' }}); | ||
| var eb = makeElement({ text: { text: 'b' }, rect: { fill: '#FE854F' }}); | ||
| var ec = makeElement({ text: { text: 'c' }, rect: { fill: '#FE854F' }}); | ||
| var ed = makeElement({ text: { text: 'd' }, rect: { fill: '#FE854F' }}); | ||
| var ee = makeElement({ text: { text: 'e' }, rect: { fill: '#FE854F' }}); | ||
| var ef = makeElement({ text: { text: 'f' }, rect: { fill: '#FE854F' }}); | ||
| var eg = makeElement({ text: { text: 'g' }, rect: { fill: '#FE854F' }}); | ||
| var eh = makeElement({ text: { text: 'h' }, rect: { fill: '#FE854F' }}); | ||
|
|
||
| var lab = makeLink(ea, eb); | ||
| var lbc = makeLink(eb, ec); | ||
| var lbd = makeLink(eb, ed); | ||
| var lbe = makeLink(eb, ee); | ||
| var lbf = makeLink(eb, ef); | ||
| var lbg = makeLink(eb, eg); | ||
| var lhg = makeLink(eh, eg); | ||
|
|
||
| group.embed(topGroup).embed(bottomGroup); | ||
| topGroup.embed(eb).embed(eh); | ||
| bottomGroup.embed(ec).embed(ed).embed(ee).embed(ef); | ||
|
|
||
| graph.addCell([group, topGroup, bottomGroup, ea, eb, ec, ed, ed, ee, ef, eg, eh, lab, lbc, lbd, lbe, lbf, lbg, lhg]); | ||
|
|
||
| joint.layout.DirectedGraph.layout(graph, { | ||
| setLinkVertices: false, | ||
| rankDir: 'TB', | ||
| marginX: 50, | ||
| marginY: 50, | ||
| clusterPadding: { top: 30, left: 10, right: 10, bottom: 10 } | ||
| }); | ||
|
|
||
| })(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,101 @@ | ||
| 'use strict'; | ||
|
|
||
| (function() { | ||
|
|
||
| var graph = new joint.dia.Graph; | ||
| var paper = new joint.dia.Paper({ | ||
| el: $('#paper'), | ||
| width: 400, | ||
| height: 400, | ||
| gridSize: 1, | ||
| model: graph | ||
| }); | ||
|
|
||
| $('#btn-layout').on('click', layout); | ||
|
|
||
| function layout() { | ||
|
|
||
| try { | ||
| var adjacencyList = JSON.parse($('#adjacency-list').val()); | ||
| } catch (error) { | ||
| console.log(error); | ||
| } | ||
|
|
||
| var cells = adjacencyListToCells(adjacencyList); | ||
|
|
||
| graph.resetCells(cells); | ||
|
|
||
| joint.layout.DirectedGraph.layout(graph, { | ||
| setLinkVertices: false | ||
| }); | ||
| } | ||
|
|
||
| // Helpers. | ||
| // -------- | ||
|
|
||
| function adjacencyListToCells(adjacencyList) { | ||
|
|
||
| var elements = []; | ||
| var links = []; | ||
|
|
||
| _.each(adjacencyList, function(edges, parentElementLabel) { | ||
| elements.push(makeElement(parentElementLabel)); | ||
|
|
||
| _.each(edges, function(childElementLabel) { | ||
| links.push(makeLink(parentElementLabel, childElementLabel)); | ||
| }); | ||
| }); | ||
|
|
||
| // Links must be added after all the elements. This is because when the links | ||
| // are added to the graph, link source/target | ||
| // elements must be in the graph already. | ||
| var cells = elements.concat(links); | ||
|
|
||
| return cells; | ||
| } | ||
|
|
||
| function makeLink(parentElementLabel, childElementLabel) { | ||
|
|
||
| return new joint.dia.Link({ | ||
| source: { id: parentElementLabel }, | ||
| target: { id: childElementLabel }, | ||
| attrs: { | ||
| '.marker-target': { d: 'M 4 0 L 0 2 L 4 4 z' } | ||
| }, | ||
| smooth: true | ||
| }); | ||
| } | ||
|
|
||
| function makeElement(label) { | ||
|
|
||
| var maxLineLength = _.max(label.split('\n'), function(l) { | ||
| return l.length; | ||
| }).length; | ||
|
|
||
| // Compute width/height of the rectangle based on the number | ||
| // of lines in the label and the letter size. 0.6 * letterSize is | ||
| // an approximation of the monospace font letter width. | ||
| var letterSize = 10; | ||
| var width = 2 * (letterSize * (0.6 * maxLineLength + 1)); | ||
| var height = 2 * ((label.split('\n').length + 1) * letterSize); | ||
|
|
||
| return new joint.shapes.basic.Rect({ | ||
| id: label, | ||
| size: { width: width, height: height }, | ||
| attrs: { | ||
| text: { text: label, 'font-size': letterSize, 'font-family': 'monospace', fill: 'white' }, | ||
| rect: { | ||
| fill: '#FE854F', | ||
| width: width, | ||
| height: height, | ||
| rx: 5, | ||
| ry: 5, | ||
| stroke: 'none' | ||
| } | ||
| } | ||
| }); | ||
| } | ||
|
|
||
| layout(); | ||
|
|
||
| })(); |
Oops, something went wrong.