drawio_dsl 0.5.1 → 0.5.4
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/.builders/.data/shapes.json +93 -0
- data/.builders/.templates/basic/configuration_shapes.rb +3 -3
- data/.builders/.templates/basic/schema_require.rb +1 -0
- data/.builders/blueprint/shapes.rb +39 -31
- data/.builders/boot.rb +1 -0
- data/.builders/generators/02-generate-app.rb +2 -0
- data/.builders/generators/project_plans/drawio_dsl.rb +56 -0
- data/.builders/generators/sample_diagrams/50-willoughby-council.rb +52 -0
- data/.rubocop.yml +3 -0
- data/CHANGELOG.md +21 -0
- data/docs/project-plan.md +24 -0
- data/docs/project_done.svg +3 -0
- data/docs/project_in_progress.svg +3 -0
- data/docs/project_todo.svg +3 -0
- data/lib/drawio_dsl/configuration_shapes.rb +46 -34
- data/lib/drawio_dsl/dom_builder_shapes.rb +35 -0
- data/lib/drawio_dsl/drawio.rb +31 -0
- data/lib/drawio_dsl/drawio_shapes.rb +72 -30
- data/lib/drawio_dsl/schema/_.rb +7 -0
- data/lib/drawio_dsl/schema/layouts/grid_layout.rb +17 -10
- data/lib/drawio_dsl/schema/node.rb +29 -24
- data/lib/drawio_dsl/schema/shapes/h1.rb +9 -0
- data/lib/drawio_dsl/schema/shapes/h2.rb +9 -0
- data/lib/drawio_dsl/schema/shapes/h3.rb +9 -0
- data/lib/drawio_dsl/schema/shapes/h4.rb +9 -0
- data/lib/drawio_dsl/schema/shapes/h5.rb +9 -0
- data/lib/drawio_dsl/schema/shapes/h6.rb +9 -0
- data/lib/drawio_dsl/schema/shapes/p.rb +9 -0
- data/lib/drawio_dsl/schema/shapes/shape.rb +9 -4
- data/lib/drawio_dsl/version.rb +1 -1
- data/package-lock.json +2 -2
- data/package.json +1 -1
- metadata +15 -2
@@ -0,0 +1,3 @@
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
2
|
+
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
3
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="942px" height="392px" viewBox="-0.5 -0.5 942 392"><defs><linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="mx-gradient-ffffff-0.9-ffffff-0.1-s-0"><stop offset="0%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.9;"/><stop offset="100%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.1;"/></linearGradient></defs><g><rect x="290" y="0" width="400" height="80" rx="12" ry="12" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 398px; height: 1px; padding-top: 7px; margin-left: 292px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 28px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">DrawIO DSL</div></div></div></foreignObject><text x="292" y="35" fill="#333333" font-family="Helvetica" font-size="28px" font-weight="bold">DrawIO DSL</text></switch></g><rect x="340" y="40" width="400" height="80" rx="12" ry="12" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 398px; height: 1px; padding-top: 47px; margin-left: 342px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 16px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">Project plan</div></div></div></foreignObject><text x="342" y="63" fill="#333333" font-family="Helvetica" font-size="16px" font-weight="bold">Project plan</text></switch></g><rect x="0" y="10" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 9 Q -1 9 -1 20.15 L -1 34 Q 150 52 301 34 L 301 20.15 Q 301 9 289.85 9 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 40px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">First level child nodes need to hang of node 1</div></div></div></foreignObject><text x="150" y="44" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">First level child nodes need to hang of node 1</text></switch></g><rect x="320" y="10" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 9 Q 319 9 319 20.15 L 319 34 Q 470 52 621 34 L 621 20.15 Q 621 9 609.85 9 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 40px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Add page background to theme, use it whenever the theme is set at a diagram/page level</div></div></div></foreignObject><text x="470" y="44" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Add page background to theme, use it whenever the...</text></switch></g><rect x="640" y="10" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 9 Q 639 9 639 20.15 L 639 34 Q 790 52 941 34 L 941 20.15 Q 941 9 929.85 9 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 40px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Nodes need to support child nodes</div></div></div></foreignObject><text x="790" y="44" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Nodes need to support child nodes</text></switch></g><rect x="0" y="90" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 89 Q -1 89 -1 100.15 L -1 114 Q 150 132 301 114 L 301 100.15 Q 301 89 289.85 89 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 120px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Grid layout does no position itself in relation to the last element</div></div></div></foreignObject><text x="150" y="124" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Grid layout does no position itself in relation to...</text></switch></g><rect x="320" y="90" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 89 Q 319 89 319 100.15 L 319 114 Q 470 132 621 114 L 621 100.15 Q 621 89 609.85 89 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 120px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Dynamic sized shapes that expand to the size of their text</div></div></div></foreignObject><text x="470" y="124" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Dynamic sized shapes that expand to the size of th...</text></switch></g><rect x="640" y="90" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 89 Q 639 89 639 100.15 L 639 114 Q 790 132 941 114 L 941 100.15 Q 941 89 929.85 89 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 120px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Control of text padding left, right, top and bottom</div></div></div></foreignObject><text x="790" y="124" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Control of text padding left, right, top and bottom</text></switch></g><rect x="0" y="170" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 169 Q -1 169 -1 180.15 L -1 194 Q 150 212 301 194 L 301 180.15 Q 301 169 289.85 169 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 200px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Improve the theme control over text-only shapes</div></div></div></foreignObject><text x="150" y="204" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Improve the theme control over text-only shapes</text></switch></g><rect x="320" y="170" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 169 Q 319 169 319 180.15 L 319 194 Q 470 212 621 194 L 621 180.15 Q 621 169 609.85 169 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 200px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">x,y settings do not work for shapes within a grid layout</div></div></div></foreignObject><text x="470" y="204" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">x,y settings do not work for shapes within a grid...</text></switch></g><rect x="640" y="170" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 169 Q 639 169 639 180.15 L 639 194 Q 790 212 941 194 L 941 180.15 Q 941 169 929.85 169 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 200px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">background color does not work from the diagram object</div></div></div></foreignObject><text x="790" y="204" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">background color does not work from the diagram ob...</text></switch></g><rect x="0" y="250" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 249 Q -1 249 -1 260.15 L -1 274 Q 150 292 301 274 L 301 260.15 Q 301 249 289.85 249 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 280px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">settings style attributes need to de-duplicate</div></div></div></foreignObject><text x="150" y="284" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">settings style attributes need to de-duplicate</text></switch></g><rect x="320" y="250" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 249 Q 319 249 319 260.15 L 319 274 Q 470 292 621 274 L 621 260.15 Q 621 249 609.85 249 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 280px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">need to setup new project plans</div></div></div></foreignObject><text x="470" y="284" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">need to setup new project plans</text></switch></g><rect x="640" y="250" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 249 Q 639 249 639 260.15 L 639 274 Q 790 292 941 274 L 941 260.15 Q 941 249 929.85 249 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 280px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">write SVG directly into other projects</div></div></div></foreignObject><text x="790" y="284" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">write SVG directly into other projects</text></switch></g><rect x="0" y="330" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 329 Q -1 329 -1 340.15 L -1 354 Q 150 372 301 354 L 301 340.15 Q 301 329 289.85 329 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 360px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">page layout so that you drop elements on and they are positioned correctly, e.g centered, left, right, etc, maybe a grid layout with a wrap of 1 and a width of the page is sufficient</div></div></div></foreignObject><text x="150" y="364" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">page layout so that you drop elements on and they...</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>
|
@@ -5,9 +5,16 @@
|
|
5
5
|
module DrawioDsl
|
6
6
|
# Used to attach configuration to KConfig module
|
7
7
|
module ConfigurationShapes
|
8
|
-
ShapeDefaults = Struct.new(:type, :x, :y, :w, :h, :style_modifiers, keyword_init: true)
|
8
|
+
ShapeDefaults = Struct.new(:type, :text_only, :x, :y, :w, :h, :style_modifiers, keyword_init: true)
|
9
9
|
Shapes = Struct.new(
|
10
10
|
:shape,
|
11
|
+
:h1,
|
12
|
+
:h2,
|
13
|
+
:h3,
|
14
|
+
:h4,
|
15
|
+
:h5,
|
16
|
+
:h6,
|
17
|
+
:p,
|
11
18
|
:actor,
|
12
19
|
:actor2,
|
13
20
|
:callout,
|
@@ -43,39 +50,44 @@ module DrawioDsl
|
|
43
50
|
|
44
51
|
def add_shapes
|
45
52
|
@shapes = Shapes.new(
|
46
|
-
shape: ShapeDefaults.new(type: :shape, x: 0, y: 0, w: 20, h: 20, style_modifiers: ''),
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
53
|
+
shape: ShapeDefaults.new(type: :shape, text_only: false, x: 0, y: 0, w: 20, h: 20, style_modifiers: ''),
|
54
|
+
h1: ShapeDefaults.new(type: :h1, x: 0, text_only: true, y: 0, w: 100, h: 50, style_modifiers: 'text;fontSize=89;fontColor=#ffffff;fontStyle=1;fillColor=none'),
|
55
|
+
h2: ShapeDefaults.new(type: :h2, x: 0, text_only: true, y: 0, w: 100, h: 50, style_modifiers: 'text;fontSize=67;fontColor=#ffffff;fontStyle=1;fillColor=none'),
|
56
|
+
h3: ShapeDefaults.new(type: :h3, x: 0, text_only: true, y: 0, w: 100, h: 50, style_modifiers: 'text;fontSize=50;fontColor=#ffffff;fontStyle=1;fillColor=none'),
|
57
|
+
h4: ShapeDefaults.new(type: :h4, x: 0, text_only: true, y: 0, w: 100, h: 50, style_modifiers: 'text;fontSize=37;fontColor=#ffffff;fontStyle=1;fillColor=none'),
|
58
|
+
h5: ShapeDefaults.new(type: :h5, x: 0, text_only: true, y: 0, w: 100, h: 50, style_modifiers: 'text;fontSize=28;fontColor=#ffffff;fontStyle=1;fillColor=none'),
|
59
|
+
h6: ShapeDefaults.new(type: :h6, x: 0, text_only: true, y: 0, w: 100, h: 50, style_modifiers: 'text;fontSize=21;fontColor=#ffffff;fontStyle=1;fillColor=none'),
|
60
|
+
p: ShapeDefaults.new(type: :p, x: 0, text_only: true, y: 0, w: 100, h: 50, style_modifiers: 'text;fontSize=16;fontColor=#ffffff;fontStyle=1;fillColor=none'),
|
61
|
+
actor: ShapeDefaults.new(type: :actor, x: 0, text_only: false, y: 0, w: 40, h: 50, style_modifiers: 'shape=actor'),
|
62
|
+
actor2: ShapeDefaults.new(type: :actor2, x: 0, text_only: false, y: 0, w: 30, h: 50, style_modifiers: 'shape=umlActor;verticalLabelPosition=bottom;outlineConnect=1'),
|
63
|
+
callout: ShapeDefaults.new(type: :callout, x: 0, text_only: false, y: 0, w: 160, h: 120, style_modifiers: 'shape=callout'),
|
64
|
+
callout2: ShapeDefaults.new(type: :callout2, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'shape=mxgraph.basic.oval_callout'),
|
65
|
+
callout3: ShapeDefaults.new(type: :callout3, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'shape=mxgraph.basic.cloud_callout'),
|
66
|
+
callout4: ShapeDefaults.new(type: :callout4, x: 0, text_only: false, y: 0, w: 160, h: 120, style_modifiers: 'shape=mxgraph.basic.roundRectCallout;dx=30;dy=15;size=5;boundedLbl=1;'),
|
67
|
+
circle: ShapeDefaults.new(type: :circle, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'ellipse'),
|
68
|
+
cloud: ShapeDefaults.new(type: :cloud, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'shape=cloud'),
|
69
|
+
cross: ShapeDefaults.new(type: :cross, x: 0, text_only: false, y: 0, w: 50, h: 50, style_modifiers: 'verticalLabelPosition=bottom;verticalAlign=top;html=1;shape=mxgraph.basic.x'),
|
70
|
+
envelop: ShapeDefaults.new(type: :envelop, x: 0, text_only: false, y: 0, w: 160, h: 100, style_modifiers: 'shape=message'),
|
71
|
+
diamond: ShapeDefaults.new(type: :diamond, x: 0, text_only: false, y: 0, w: 100, h: 100, style_modifiers: 'rhombus'),
|
72
|
+
document: ShapeDefaults.new(type: :document, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'shape=mxgraph.basic.document'),
|
73
|
+
ellipse: ShapeDefaults.new(type: :ellipse, x: 0, text_only: false, y: 0, w: 200, h: 120, style_modifiers: 'ellipse'),
|
74
|
+
hexagon: ShapeDefaults.new(type: :hexagon, x: 0, text_only: false, y: 0, w: 200, h: 120, style_modifiers: 'shape=hexagon'),
|
75
|
+
container: ShapeDefaults.new(type: :container, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'swimlane'),
|
76
|
+
container2: ShapeDefaults.new(type: :container2, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'swimlane;horizontal=0'),
|
77
|
+
container3: ShapeDefaults.new(type: :container3, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'swimlane;startSize=50'),
|
78
|
+
container4: ShapeDefaults.new(type: :container4, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'swimlane;resizable=0'),
|
79
|
+
note: ShapeDefaults.new(type: :note, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'shape=note'),
|
80
|
+
process: ShapeDefaults.new(type: :process, x: 0, text_only: false, y: 0, w: 200, h: 120, style_modifiers: 'shape=process'),
|
81
|
+
rectangle: ShapeDefaults.new(type: :rectangle, x: 0, text_only: false, y: 0, w: 200, h: 120, style_modifiers: ''),
|
82
|
+
rectangle2: ShapeDefaults.new(type: :rectangle2, x: 0, text_only: false, y: 0, w: 200, h: 120, style_modifiers: 'shape=mxgraph.basic.cloud_rect'),
|
83
|
+
square: ShapeDefaults.new(type: :square, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: ''),
|
84
|
+
step: ShapeDefaults.new(type: :step, x: 0, text_only: false, y: 0, w: 120, h: 80, style_modifiers: 'shape=step;perimeter=stepPerimeter;fixedSize=1'),
|
85
|
+
tick: ShapeDefaults.new(type: :tick, x: 0, text_only: false, y: 0, w: 50, h: 50, style_modifiers: 'verticalLabelPosition=bottom;verticalAlign=top;shape=mxgraph.basic.tick'),
|
86
|
+
face: ShapeDefaults.new(type: :face, x: 0, text_only: false, y: 0, w: 100, h: 100, style_modifiers: 'verticalLabelPosition=bottom;verticalAlign=top;shape=mxgraph.basic.smiley'),
|
87
|
+
triangle: ShapeDefaults.new(type: :triangle, x: 0, text_only: false, y: 0, w: 100, h: 100, style_modifiers: 'triangle'),
|
88
|
+
embed_row: ShapeDefaults.new(type: :embed_row, x: 0, text_only: false, y: 0, w: 200, h: 40, style_modifiers: 'shape=partialRectangle;collapsible=0;dropTarget=0;pointerEvents=0;top=0;left=0;bottom=1;right=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest'),
|
89
|
+
embed_col50: ShapeDefaults.new(type: :embed_col50, x: 0, text_only: false, y: 0, w: 50, h: 40, style_modifiers: 'shape=partialRectangle;connectable=0;top=0;left=0;bottom=0;right=0;fontStyle=1;overflow=hidden'),
|
90
|
+
embed_col200: ShapeDefaults.new(type: :embed_col200, x: 0, text_only: false, y: 0, w: 150, h: 40, style_modifiers: 'shape=partialRectangle;connectable=0;top=0;left=0;bottom=0;right=0;align=left;spacingLeft=6;overflow=hidden')
|
79
91
|
)
|
80
92
|
end
|
81
93
|
end
|
@@ -4,6 +4,41 @@
|
|
4
4
|
module DrawioDsl
|
5
5
|
# DrawioDsl is a DSL for draw-io diagrams.
|
6
6
|
module DomBuilderShapes
|
7
|
+
def add_h1(**opts)
|
8
|
+
h1 = DrawioDsl::Schema::H1.new(current_page, **opts)
|
9
|
+
add_shape(h1)
|
10
|
+
end
|
11
|
+
|
12
|
+
def add_h2(**opts)
|
13
|
+
h2 = DrawioDsl::Schema::H2.new(current_page, **opts)
|
14
|
+
add_shape(h2)
|
15
|
+
end
|
16
|
+
|
17
|
+
def add_h3(**opts)
|
18
|
+
h3 = DrawioDsl::Schema::H3.new(current_page, **opts)
|
19
|
+
add_shape(h3)
|
20
|
+
end
|
21
|
+
|
22
|
+
def add_h4(**opts)
|
23
|
+
h4 = DrawioDsl::Schema::H4.new(current_page, **opts)
|
24
|
+
add_shape(h4)
|
25
|
+
end
|
26
|
+
|
27
|
+
def add_h5(**opts)
|
28
|
+
h5 = DrawioDsl::Schema::H5.new(current_page, **opts)
|
29
|
+
add_shape(h5)
|
30
|
+
end
|
31
|
+
|
32
|
+
def add_h6(**opts)
|
33
|
+
h6 = DrawioDsl::Schema::H6.new(current_page, **opts)
|
34
|
+
add_shape(h6)
|
35
|
+
end
|
36
|
+
|
37
|
+
def add_p(**opts)
|
38
|
+
p = DrawioDsl::Schema::P.new(current_page, **opts)
|
39
|
+
add_shape(p)
|
40
|
+
end
|
41
|
+
|
7
42
|
def add_actor(**opts)
|
8
43
|
actor = DrawioDsl::Schema::Actor.new(current_page, **opts)
|
9
44
|
add_shape(actor)
|
data/lib/drawio_dsl/drawio.rb
CHANGED
@@ -5,6 +5,8 @@ module DrawioDsl
|
|
5
5
|
class Drawio < KDirector::Directors::BaseDirector
|
6
6
|
default_builder_type(DrawioDsl::DomBuilder)
|
7
7
|
|
8
|
+
attr_reader :last_save_file_name
|
9
|
+
|
8
10
|
def diagram(**opts)
|
9
11
|
builder.set_diagram(**opts)
|
10
12
|
|
@@ -19,6 +21,35 @@ module DrawioDsl
|
|
19
21
|
layout.call
|
20
22
|
self
|
21
23
|
end
|
24
|
+
|
25
|
+
def save(file_name, **opts)
|
26
|
+
diagram = DrawioDsl::XmlBuilder.new(builder.diagram)
|
27
|
+
|
28
|
+
add(file_name, content: diagram.build, **opts)
|
29
|
+
|
30
|
+
@last_save_file_name = k_builder.last_output_file
|
31
|
+
|
32
|
+
self
|
33
|
+
end
|
34
|
+
|
35
|
+
def osave(file_name, **opts)
|
36
|
+
save(file_name, **{ open: :write }.merge(opts))
|
37
|
+
end
|
38
|
+
|
39
|
+
def export_svg(output_file_name, page: 1)
|
40
|
+
return unless last_save_file_name
|
41
|
+
return unless File.exist?(last_save_file_name)
|
42
|
+
|
43
|
+
page -= 1 # use zero based index
|
44
|
+
|
45
|
+
output_file_name = "#{output_file_name}.svg" unless output_file_name.end_with?('.svg')
|
46
|
+
|
47
|
+
command = "/Applications/draw.io.app/Contents/MacOS/draw.io '#{last_save_file_name}' -p #{page} -x -o #{output_file_name}"
|
48
|
+
|
49
|
+
run_command(command)
|
50
|
+
|
51
|
+
self
|
52
|
+
end
|
22
53
|
end
|
23
54
|
|
24
55
|
# DrawioDsl::DrawioPage is created when you call .page on the draw-io DSL.
|
@@ -5,70 +5,112 @@ module DrawioDsl
|
|
5
5
|
# :nocov:
|
6
6
|
module DrawioShapes
|
7
7
|
def random(**opts)
|
8
|
-
case rand(
|
8
|
+
case rand(37)
|
9
9
|
when 0
|
10
|
-
|
10
|
+
h1(**opts)
|
11
11
|
when 1
|
12
|
-
|
12
|
+
h2(**opts)
|
13
13
|
when 2
|
14
|
-
|
14
|
+
h3(**opts)
|
15
15
|
when 3
|
16
|
-
|
16
|
+
h4(**opts)
|
17
17
|
when 4
|
18
|
-
|
18
|
+
h5(**opts)
|
19
19
|
when 5
|
20
|
-
|
20
|
+
h6(**opts)
|
21
21
|
when 6
|
22
|
-
|
22
|
+
p(**opts)
|
23
23
|
when 7
|
24
|
-
|
24
|
+
actor(**opts)
|
25
25
|
when 8
|
26
|
-
|
26
|
+
actor2(**opts)
|
27
27
|
when 9
|
28
|
-
|
28
|
+
callout(**opts)
|
29
29
|
when 10
|
30
|
-
|
30
|
+
callout2(**opts)
|
31
31
|
when 11
|
32
|
-
|
32
|
+
callout3(**opts)
|
33
33
|
when 12
|
34
|
-
|
34
|
+
callout4(**opts)
|
35
35
|
when 13
|
36
|
-
|
36
|
+
circle(**opts)
|
37
37
|
when 14
|
38
|
-
|
38
|
+
cloud(**opts)
|
39
39
|
when 15
|
40
|
-
|
40
|
+
cross(**opts)
|
41
41
|
when 16
|
42
|
-
|
42
|
+
envelop(**opts)
|
43
43
|
when 17
|
44
|
-
|
44
|
+
diamond(**opts)
|
45
45
|
when 18
|
46
|
-
|
46
|
+
document(**opts)
|
47
47
|
when 19
|
48
|
-
|
48
|
+
ellipse(**opts)
|
49
49
|
when 20
|
50
|
-
|
50
|
+
hexagon(**opts)
|
51
51
|
when 21
|
52
|
-
|
52
|
+
container(**opts)
|
53
53
|
when 22
|
54
|
-
|
54
|
+
container2(**opts)
|
55
55
|
when 23
|
56
|
-
|
56
|
+
container3(**opts)
|
57
57
|
when 24
|
58
|
-
|
58
|
+
container4(**opts)
|
59
59
|
when 25
|
60
|
-
|
60
|
+
note(**opts)
|
61
61
|
when 26
|
62
|
-
|
62
|
+
process(**opts)
|
63
63
|
when 27
|
64
|
-
|
64
|
+
rectangle(**opts)
|
65
65
|
when 28
|
66
|
-
|
66
|
+
rectangle2(**opts)
|
67
67
|
when 29
|
68
|
+
square(**opts)
|
69
|
+
when 30
|
70
|
+
step(**opts)
|
71
|
+
when 31
|
72
|
+
tick(**opts)
|
73
|
+
when 32
|
74
|
+
face(**opts)
|
75
|
+
when 33
|
76
|
+
triangle(**opts)
|
77
|
+
when 34
|
78
|
+
embed_row(**opts)
|
79
|
+
when 35
|
80
|
+
embed_col50(**opts)
|
81
|
+
when 36
|
68
82
|
embed_col200(**opts)
|
69
83
|
end
|
70
84
|
end
|
71
85
|
|
86
|
+
def h1(**opts)
|
87
|
+
builder.add_h1(**opts)
|
88
|
+
end
|
89
|
+
|
90
|
+
def h2(**opts)
|
91
|
+
builder.add_h2(**opts)
|
92
|
+
end
|
93
|
+
|
94
|
+
def h3(**opts)
|
95
|
+
builder.add_h3(**opts)
|
96
|
+
end
|
97
|
+
|
98
|
+
def h4(**opts)
|
99
|
+
builder.add_h4(**opts)
|
100
|
+
end
|
101
|
+
|
102
|
+
def h5(**opts)
|
103
|
+
builder.add_h5(**opts)
|
104
|
+
end
|
105
|
+
|
106
|
+
def h6(**opts)
|
107
|
+
builder.add_h6(**opts)
|
108
|
+
end
|
109
|
+
|
110
|
+
def p(**opts)
|
111
|
+
builder.add_p(**opts)
|
112
|
+
end
|
113
|
+
|
72
114
|
def actor(**opts)
|
73
115
|
builder.add_actor(**opts)
|
74
116
|
end
|
data/lib/drawio_dsl/schema/_.rb
CHANGED
@@ -12,6 +12,13 @@ require_relative 'layouts/flex_layout'
|
|
12
12
|
require_relative 'layouts/grid_layout'
|
13
13
|
|
14
14
|
require_relative 'shapes/shape'
|
15
|
+
require_relative 'shapes/h1'
|
16
|
+
require_relative 'shapes/h2'
|
17
|
+
require_relative 'shapes/h3'
|
18
|
+
require_relative 'shapes/h4'
|
19
|
+
require_relative 'shapes/h5'
|
20
|
+
require_relative 'shapes/h6'
|
21
|
+
require_relative 'shapes/p'
|
15
22
|
require_relative 'shapes/actor'
|
16
23
|
require_relative 'shapes/actor2'
|
17
24
|
require_relative 'shapes/callout'
|
@@ -6,22 +6,28 @@ module DrawioDsl
|
|
6
6
|
class GridLayout < Layout
|
7
7
|
attr_accessor :direction
|
8
8
|
attr_accessor :wrap_at
|
9
|
-
attr_accessor :grid_size
|
9
|
+
attr_accessor :grid_size # this is an alternative to grid_w/grid_h
|
10
|
+
attr_accessor :grid_w
|
11
|
+
attr_accessor :grid_h
|
10
12
|
attr_accessor :cell_no
|
11
13
|
attr_accessor :h_align
|
12
14
|
attr_accessor :v_align
|
13
15
|
|
16
|
+
# rubocop:disable Metrics/CyclomaticComplexity
|
14
17
|
def initialize(page, **args)
|
15
18
|
@type = :grid_layout
|
16
19
|
@direction = args[:direction] || :horizontal
|
17
20
|
@wrap_at = args[:wrap_at] || 5
|
18
21
|
@grid_size = args[:grid_size] || 220
|
22
|
+
@grid_w = args[:grid_w] || grid_size
|
23
|
+
@grid_h = args[:grid_h] || grid_size
|
19
24
|
@h_align = args[:h_align] || :center
|
20
25
|
@v_align = args[:v_align] || :center
|
21
26
|
@cell_no = 1
|
22
27
|
|
23
28
|
super(page, **args)
|
24
29
|
end
|
30
|
+
# rubocop:enable Metrics/CyclomaticComplexity
|
25
31
|
|
26
32
|
def position_shape(shape)
|
27
33
|
fire_after_init
|
@@ -47,7 +53,8 @@ module DrawioDsl
|
|
47
53
|
super.merge(
|
48
54
|
direction: direction,
|
49
55
|
wrap_at: wrap_at,
|
50
|
-
|
56
|
+
grid_w: grid_w,
|
57
|
+
grid_h: grid_h,
|
51
58
|
cell_no: cell_no
|
52
59
|
)
|
53
60
|
end
|
@@ -56,8 +63,8 @@ module DrawioDsl
|
|
56
63
|
|
57
64
|
# rubocop:disable Metrics/AbcSize
|
58
65
|
def horizontal_shape_alignment(shape)
|
59
|
-
return page.position_x + ((
|
60
|
-
return page.position_x + (
|
66
|
+
return page.position_x + ((grid_w - shape.w) / 2) if h_align == :center
|
67
|
+
return page.position_x + (grid_w - shape.w) if h_align == :right
|
61
68
|
|
62
69
|
page.position_x
|
63
70
|
end
|
@@ -65,8 +72,8 @@ module DrawioDsl
|
|
65
72
|
|
66
73
|
# rubocop:disable Metrics/AbcSize
|
67
74
|
def vertical_shape_alignment(shape)
|
68
|
-
return page.position_y + ((
|
69
|
-
return page.position_y + (
|
75
|
+
return page.position_y + ((grid_h - shape.h) / 2) if v_align == :center || v_align == :middle
|
76
|
+
return page.position_y + (grid_h - shape.h) if v_align == :bottom
|
70
77
|
|
71
78
|
page.position_y
|
72
79
|
end
|
@@ -74,27 +81,27 @@ module DrawioDsl
|
|
74
81
|
|
75
82
|
def move_cell_horizontally
|
76
83
|
if cell_no < wrap_at
|
77
|
-
page.position_x +=
|
84
|
+
page.position_x += grid_w
|
78
85
|
@cell_no += 1
|
79
86
|
return
|
80
87
|
end
|
81
88
|
|
82
89
|
# Flow down to the next row
|
83
90
|
page.position_x = anchor_x
|
84
|
-
page.position_y +=
|
91
|
+
page.position_y += grid_h
|
85
92
|
@cell_no = 1
|
86
93
|
end
|
87
94
|
|
88
95
|
def move_cell_vertically
|
89
96
|
if cell_no < wrap_at
|
90
|
-
page.position_y +=
|
97
|
+
page.position_y += grid_h
|
91
98
|
@cell_no += 1
|
92
99
|
return
|
93
100
|
end
|
94
101
|
|
95
102
|
# Flow right to the next column
|
96
103
|
page.position_y = anchor_y
|
97
|
-
page.position_x +=
|
104
|
+
page.position_x += grid_w
|
98
105
|
@cell_no = 1
|
99
106
|
end
|
100
107
|
end
|
@@ -22,32 +22,37 @@ module DrawioDsl
|
|
22
22
|
}
|
23
23
|
end
|
24
24
|
|
25
|
-
#
|
26
|
-
#
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
25
|
+
# :nocov:
|
26
|
+
# rubocop:disable Metrics/AbcSize
|
27
|
+
def debug(format: :detail)
|
28
|
+
if format == :detail
|
29
|
+
debug_detail(to_h)
|
30
|
+
else
|
31
|
+
debug_row(classification, id)
|
32
|
+
end
|
33
|
+
end
|
32
34
|
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
35
|
+
def debug_detail(**key_values)
|
36
|
+
key_values.each do |key, value|
|
37
|
+
puts "#{key.to_s.ljust(15)}: #{value}"
|
38
|
+
end
|
39
|
+
end
|
38
40
|
|
39
|
-
#
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
41
|
+
# rubocop:disable Metrics/ParameterLists
|
42
|
+
def debug_row(classification, id, type = nil, x = nil, y = nil, width = nil, height = nil)
|
43
|
+
row = []
|
44
|
+
row << classification.to_s.ljust(11)
|
45
|
+
row << id.to_s.ljust(6)
|
46
|
+
row << (type.nil? ? '' : type).to_s.ljust(15)
|
47
|
+
row << (x.nil? ? '' : x).to_s.rjust(5)
|
48
|
+
row << (y.nil? ? '' : y).to_s.rjust(5)
|
49
|
+
row << (width.nil? ? '' : width).to_s.rjust(5)
|
50
|
+
row << (height.nil? ? '' : height).to_s.rjust(5)
|
51
|
+
puts row.join(' | ')
|
52
|
+
end
|
53
|
+
# rubocop:enable Metrics/ParameterLists
|
54
|
+
# :nocov:
|
51
55
|
end
|
56
|
+
# rubocop:enable Metrics/AbcSize
|
52
57
|
end
|
53
58
|
end
|