drakon-renderer

Reasonably portable drakon diagrams renderer. Development, compilation and execution are intended to take place in containers.

Important:

this is work in progress and, while progress is being made every week, the renderer is not yet guaraneed to render drakon-correct diagrams. Current focus is to render primitive diagrams according to drakon rules.

terminology

• Title - first step of a diagram
• End - last step of a diagram
• Action - "do X" non-branching action, basic building block of a diagram
• Question - branching step with two possible outcomes:
  • yes
  • no
• Headline
• Address
• Cap
• Primitive
• Silhouette

source 1 - wikipedia

source 2 - wikipedia

source 3 - drakon.su

input syntax

[
    {
        "iconDescription": "hello world title",
        "iconKind": "Title",
        "iconName": "1",
        "iconNamesOfDependentIcons": [
            "2"
        ]
    },
    {
        "iconDescription": "hello world icon 2",
        "iconKind": "Action",
        "iconName": "2",
        "iconNamesOfDependentIcons": [
            "3",
            "4"
        ]
    },
    ...
]

output

• a serialized list of PositionedIcon which are regular Icon supplemented with their post-layout cartesian coordinates:

[
    {
        "icon": {
            "iconDescription": "hello world title",
            "iconKind": "Title",
            "iconName": "1",
            "iconNamesOfDependentIcons": [
                "2"
            ]
        },
        "iconPositionX": 0,
        "iconPositionY": 0
    },
    {
        "icon": {
            "iconDescription": "hello world icon 2",
            "iconKind": "Action",
            "iconName": "2",
            "iconNamesOfDependentIcons": [
                "3",
                "4"
            ]
        },
        "iconPositionX": 0,
        "iconPositionY": -1
    },
    ...
]

• an svg diagram:

method

1. read serialized collection of Icons & deserialize

2. validate Icons (only one title icon per diagram, correct numbers of dependencies, etc.) - sample validation:

   Input validation did not succeed for following reasons:
   * Error: Icons identified with following names contain incorrect number of dependencies: "8", "3", "2". Hint: Make sure your icons have the expected number of dependencies. For reference: "Title" and "Action" icons should have 1 depdenency, "Question" icon should have 2 dependencies and "End" should have no dependencies.
   * Error: Diagram is required to have exactly one icon of kind "End". Hint: Make sure your input diagram contains an icon of kind "End" and that it is the only icon of that kind.
   * Error: Diagram is required to have exactly one icon of kind "Title". Hint: Make sure your input diagram contains an icon of kind "Title" and that it is the only icon of that kind.
   

3. if validation is successful, attempt to position the directed graph's nodes on a cartesian plane:

   • positive integer x coordinates only

   • negative integer y coordinates only

4. serialize the product ([PositionedIcon]) to a file where:

   • input: file.json

   • output: file-drakon-layout.json

5. Render the collection of PositionedIcons into the final svg diagram.

6. Render the connections between the collection of PositionedIcons into the final svg diagram.

development environment

command	description
./start-development-environment.sh or .\start-development-environment.ps1	starts a fully dockerized development environment
./build.sh	builds and lints code - preferrably while development environment docker container is running, otherwise local installation of cabal and hlint is required)
./run.sh	runs code - just like the build script, the preferred way to use it is while the development environment is running
./format.sh	formats all *.hs files located in the ./app directory using hindent
exit	terminates development environment

project status

You can see into the bigger ideas I have for the project (past, present, future) here: dev-log.md.

community

• youtube

• discord

resources

• drakon whitepaper

• drakon wiki

• drakon

• diagrams

• diagrams - user manual

• colours

• colorkit

  • default palette

• useful haskell modules:

  • GHC.Data.Graph.Directed

  • GHC.Utils.Outputable

• if you struggle with .git permissions, try:

  sudo chown -R yourusername .git