CodesqueUML is a TypeScript library packaged for npm which converts scribbly bits of pseudocode into extremely ugly PlantUML source code, then into lovely SVG diagrams.
"What is CodesqueUML?" you must be wondering.
Let's not go over THAT again.
Now you're asking "WHY?" Well, because I have to read a lot of complicated code and, when I do, I like to make notes about the classes and methods called and add bits of information to help me understand what everything is doing. Then at some point I end up wanting a diagram for reference or to share with others, but by the time I'm done taking notes, I really want to move on to other things.
- Scribbly code
- Generates PlantUML from scribbly code
- Generates SVG and PNG diagrams from PlantUML
- Hyperlinks in SVG so you can "surf your diagrams"
- COMING SOON: A build script which parses all code files in one directory and outputs SVG diagrams to another directory, automatically generating hyperlinks between them
See the scribbly code first, then see the lovely sequence diagram after.
Application#main(): run queued commands and log all events and status
Helper#config(): initialize config < config file
Helper#startHeartbeat() : start heartbeating thread
performMainRoutine()
loop over an array of commands
executeCommand() : execute command < command status
Utility#logStatus() : log command status < success / failure
Utility#finishCommand()
logOverallStatus() : log success / failure and status of all commands
if heartbeat thread still running
Helper#stopHeartBeat() : stop heartbeat thread
Helper#heartBeatThread() : heartbeat in the background so system knows we're working
loop until we're told to stop
heartbeat() : send heartbeat to server
if call to server failed
reconnect()
else
sleep() : sleep for 15 minutes
import * as codesqueuml from 'codesqueuml';
Create a parser and give it a smidgen of code to parse:
let parser = new codesqueulm.Parser(`
ClassOne#functionOne(): start functionOne process
ClassTwo#functionTwo(): call functionTwo < returns void
`);
Parse into one or more top-level calls:
let rootNodes = parser.parse();
Generate PlantUML and print to the screen:
if (rootNodes) {
let plantUML = codesqueulm.renderPlantUML(rootNodes);
console.log(plantUML);
}
Simplify things a bit and generate an SVG file:
let firstCodeNodes = new codesqueulm.Parser(`
ClassOne#functionOne(): start functionOne process
ClassTwo#functionTwo(): call functionTwo < returns void
`).parse();
if (!firstCodeNodes) throw new Error("Darn.");
let firstPlantUML = codesqueulm.renderPlantUML(firstCodeNodes);
codesqueulm.renderPlantUMLDiagram(firstPlantUML, "first.svg", codesqueulm.Format.SVG);
Now a big fancy example that creates two SVG files, both of which link to each other:
let firstCodeNodes = new codesqueulm.Parser(`
ClassOne#functionOne(): start functionOne process
ClassTwo#functionTwo(): call functionTwo < returns void
`).parse();
let secondCodeNodes = new codesqueulm.Parser(`
ClassTwo#functionTwo(): start functionTwo process
ClassOne#functionOne(): call functionOne < returns void
`).parse();
if (!firstCodeNodes || !secondCodeNodes) throw new Error("Darn.");
let codeNodeIdMap = new Map<string, string>([
["ClassOne#functionOne", "first.svg"],
["ClassTwo#functionTwo", "second.svg"]]);
let firstPlantUML = codesqueulm.renderPlantUML(firstCodeNodes, codeNodeIdMap);
codesqueulm.renderPlantUMLDiagram(firstPlantUML, "first.svg", codesqueulm.Format.SVG);
let secondPlantUML = codesqueulm.renderPlantUML(secondCodeNodes, codeNodeIdMap);
codesqueulm.renderPlantUMLDiagram(secondPlantUML, "second.svg", codesqueulm.Format.SVG);
Go open first.svg in a browser. Now.