diagrams - npm Package Compare versions

Comparing version 0.5.3 to 0.6.0

bin/diagrams.js

@@ -8,6 +8,6 @@ #!/usr/bin/env node
   .version(version)
-  .command('railroad [inputFilePath] [outputFilePath.svg]', 'Generate a railroad diagram in svg')
+  .command('flowchart [inputFilePath] [outputFilePath.svg]', 'Generate a flowchart in svg')
+  .command('sequence [inputFilePath] [outputFilePath.svg]', 'Generate a network sequence diagram in svg')
   .command('dot [inputFilePath] [outputFilePath.svg]', 'Generate a dot in svg')
-  .command('sequence [inputFilePath] [outputFilePath.svg]', 'Generate a network sequence diagram in svg')
-  .command('flowchart [inputFilePath] [outputFilePath.svg]', 'Generate a flowchart in svg')
+  .command('railroad [inputFilePath] [outputFilePath.svg]', 'Generate a railroad diagram in svg') 
   .parse(process.argv);
@@ -14,0 +14,0 @@

package.json

 {
   "name": "diagrams",
-  "version": "0.5.3",
+  "version": "0.6.0",
   "description": "Generate Flowcharts, Network Sequence, Dot, and Railroad Diagrams",
@@ -5,0 +5,0 @@ "main": "src/diagrams.js",

README.md

 # Overview
-A suite of text DSLs for generating various types of diagrams. Currently supported are railroad, flowchart, graphviz's dot format, and network sequence diagrams.
+A suite of text DSLs for generating various types of diagrams. Currently supported are flowcharts, graphviz's dot, network sequence, and railroad diagrams.
 
 <table>
   <tr>
-    <td><img src="http://francoislaberge.github.io/diagrams/docs/railroad.png"/></td>
     <td><img src="http://francoislaberge.github.io/diagrams/docs/flowchart.png"/></td>
+    <td><img src="http://francoislaberge.github.io/diagrams/docs/sequence.png"/></td>
   </tr>
   <tr>
     <td><img src="http://francoislaberge.github.io/diagrams/docs/dot.png"/></td>
-    <td><img src="http://francoislaberge.github.io/diagrams/docs/sequence.png"/></td>
+    <td><img src="http://francoislaberge.github.io/diagrams/docs/railroad.png"/></td>
   </tr>
@@ -23,34 +23,57 @@ </table>
 
-## Railroad Diagrams (.railroad)
+## flowchart
+To generate flowcharts:
 
   1. Run the following command from your terminal
 
-          diagrams railroad input.railroad railroad.svg
+          diagrams flowchart input.flowchart flowchart.svg
 
   2. If your inputTextFile's content was this:
 
-          Diagram(
-            Optional('+', 'skip'),
-              Choice(0,
-                NonTerminal('name-start char'),
-                NonTerminal('escape')),
-                ZeroOrMore(
-                  Choice(0,
-                    NonTerminal('name char'),
-                    NonTerminal('escape'))))
+          st=>start: Start|past:>http://www.google.com[blank]
+          e=>end: Ende:>http://www.google.com
+          op1=>operation: My Operation|past
+          op2=>operation: Stuff|current
+          sub1=>subroutine: My Subroutine|invalid
+          cond=>condition: Yes
+          or No?|approved:>http://www.google.com
+          c2=>condition: Good idea|rejected
+          io=>inputoutput: catch something...|request
 
-  3. ...then your ```output.svg``` should look like this:
+          st->op1(right)->cond
+          cond(yes, right)->c2
+          cond(no)->sub1(left)->op1
+          c2(yes)->io->e
+          c2(no)->op2->e
 
-  <img src="http://francoislaberge.github.io/diagrams/docs/railroad.png"  width="400px" />
+  3. ...then your ```flowchart.svg``` should look like this:
 
-  4. For more Documentation see [railroad-diagrams](http://npmjs.org/railroad-diagrams)'s documentation':
-    - **NOTE:** There is no real documentation for the input file syntax (PRs welcome), but the examples
-      should help you figure it out a bit
-    - [Examples](http://www.xanthir.com/etc/railroad-diagrams/example.html)
-    - [Online Generator](http://www.xanthir.com/etc/railroad-diagrams/generator.html)
+  <img src="http://francoislaberge.github.io/diagrams/docs/flowchart.png" width="600px" />
 
-## Dot Diagrams (.dot)
+  4. Documentation: [Flowchart.js ](http://flowchart.js.org/)
 
+## sequence
+To generate Network Sequence Diagrams:
+
   1. Run the following command from your terminal
 
+          diagrams sequence input.sequence sequence.svg
+
+  2. If your inputTextFile's content was this:
+
+          Alice->Bob: Hello Bob, how are you?
+          Note right of Bob: Bob thinks
+          Bob-->Alice: I am good thanks!
+
+  3. ...then your ```sequence.svg``` should look like this:
+
+  <img src="http://francoislaberge.github.io/diagrams/docs/sequence.png" width="350px" />
+
+  4. Documentation: [Network Sequence Diagram Syntax ](https://bramp.github.io/js-sequence-diagrams/)
+
+## dot
+To generate diagrams from Graphviz's .dot file format:
+
+  1. Run the following command from your terminal
+
           diagrams dot input.dot dot.svg
@@ -77,50 +100,31 @@
 
-## Network Sequence Diagrams (.sequence)
+## railroad
+To generate Railroad Diagrams:
 
   1. Run the following command from your terminal
 
-          diagrams sequence input.sequence sequence.svg
+          diagrams railroad input.railroad railroad.svg
 
   2. If your inputTextFile's content was this:
 
-          Alice->Bob: Hello Bob, how are you?
-          Note right of Bob: Bob thinks
-          Bob-->Alice: I am good thanks!
+          Diagram(
+            Optional('+', 'skip'),
+              Choice(0,
+                NonTerminal('name-start char'),
+                NonTerminal('escape')),
+                ZeroOrMore(
+                  Choice(0,
+                    NonTerminal('name char'),
+                    NonTerminal('escape'))))
 
-  3. ...then your ```sequence.svg``` should look like this:
+  3. ...then your ```output.svg``` should look like this:
 
-  <img src="http://francoislaberge.github.io/diagrams/docs/sequence.png" width="350px" />
+  <img src="http://francoislaberge.github.io/diagrams/docs/railroad.png"  width="400px" />
 
-  4. Documentation: [Network Sequence Diagram Syntax ](https://bramp.github.io/js-sequence-diagrams/)
+  4. For more Documentation see [railroad-diagrams](http://npmjs.org/railroad-diagrams)'s documentation':
+    - **NOTE:** There is no real documentation for the input file syntax (PRs welcome), but the examples
+      should help you figure it out a bit
+    - [Examples](http://www.xanthir.com/etc/railroad-diagrams/example.html)
+    - [Online Generator](http://www.xanthir.com/etc/railroad-diagrams/generator.html)
 
-## Flowchart Diagrams (.flowchart)
-
-  1. Run the following command from your terminal
-
-          diagrams flowchart input.flowchart flowchart.svg
-
-  2. If your inputTextFile's content was this:
-
-          st=>start: Start|past:>http://www.google.com[blank]
-          e=>end: Ende:>http://www.google.com
-          op1=>operation: My Operation|past
-          op2=>operation: Stuff|current
-          sub1=>subroutine: My Subroutine|invalid
-          cond=>condition: Yes
-          or No?|approved:>http://www.google.com
-          c2=>condition: Good idea|rejected
-          io=>inputoutput: catch something...|request
-
-          st->op1(right)->cond
-          cond(yes, right)->c2
-          cond(no)->sub1(left)->op1
-          c2(yes)->io->e
-          c2(no)->op2->e
-
-  3. ...then your ```flowchart.svg``` should look like this:
-
-  <img src="http://francoislaberge.github.io/diagrams/docs/flowchart.png" width="600px" />
-
-  4. Documentation: [Flowchart.js ](http://flowchart.js.org/)
-
 ## Credits
@@ -127,0 +131,0 @@

No alert changes

Improved metrics

Total package byte prevSize

871229

increased by0.01%

Number of lines in readme file

134

increased by3.08%

No dependency changes