add graphs to git docs

raamcosta · Feb 28, 2024 · 524256a · 524256a
1 parent f3d943d
commit 524256a
Show file tree

Hide file tree

Showing 11 changed files with 432 additions and 7 deletions.
diff --git a/...egen/src/main/java/com/ramcosta/composedestinations/codegen/writers/MermaidGraphWriter.kt b/...egen/src/main/java/com/ramcosta/composedestinations/codegen/writers/MermaidGraphWriter.kt
@@ -55,7 +55,7 @@ internal class MermaidGraphWriter(
             File(codeGenConfig.mermaidGraph, "${tree.rawNavGraphGenParams.name}.mmd")
                 .writeText(
                     mermaidGraph
-                        .replace("@clicksPlaceholder@", externalNavGraphClicks(tree, null))
+                        .replace("@clicksPlaceholder@", externalNavGraphClicks(tree, null, "mmd"))
                 )
         } else {
             codeGenerator.makeFile(
@@ -64,30 +64,31 @@ internal class MermaidGraphWriter(
                 extensionName = "mmd",
             ).use {
                 it += mermaidGraph
-                    .replace("@clicksPlaceholder@", externalNavGraphClicks(tree, submodules))
+                    .replace("@clicksPlaceholder@", externalNavGraphClicks(tree, submodules, "mmd"))
             }
         }
 
         val htmlMermaid = html(title, mermaidGraph)
         if (codeGenConfig.htmlMermaidGraph != null) {
             File(codeGenConfig.htmlMermaidGraph, "${tree.rawNavGraphGenParams.name}.html")
                 .writeText(
-                    htmlMermaid.replace("@clicksPlaceholder@", externalNavGraphClicks(tree, null))
+                    htmlMermaid.replace("@clicksPlaceholder@", externalNavGraphClicks(tree, null, "html"))
                 )
         } else {
             codeGenerator.makeFile(
                 name = tree.rawNavGraphGenParams.name,
                 packageName = "$DEFAULT_GEN_PACKAGE_NAME.mermaid",
                 extensionName = "html",
             ).use {
-                it += htmlMermaid.replace("@clicksPlaceholder@", externalNavGraphClicks(tree, submodules))
+                it += htmlMermaid.replace("@clicksPlaceholder@", externalNavGraphClicks(tree, submodules, "html"))
             }
         }
     }
 
     private fun externalNavGraphClicks(
         tree: RawNavGraphTree,
-        submodules: List<SubModuleInfo>?
+        submodules: List<SubModuleInfo>?,
+        fileExtension: String
     ): String {
         val sb = StringBuilder()
         tree.findAllExternalNavGraphs().forEach { externalGraph ->
@@ -102,10 +103,10 @@ internal class MermaidGraphWriter(
                     .dropLast(splits.size - kotlinIndex) // drop after kotlin folder (included)
                     .joinToString("/")
 
-                val path = "/$pathWithoutUserDirs/resources/${DEFAULT_GEN_PACKAGE_NAME.replace(".", "/")}/mermaid/${externalGraph.generatedType.simpleName}.html"
+                val path = "/$pathWithoutUserDirs/resources/${DEFAULT_GEN_PACKAGE_NAME.replace(".", "/")}/mermaid/${externalGraph.generatedType.simpleName}.$fileExtension"
                 sb.appendLine("click ${externalGraph.mermaidId} \"$path\" \"See ${externalGraph.mermaidVisualName} details\" _blank")
             } else {
-                sb.appendLine("click ${externalGraph.mermaidId} \"${externalGraph.generatedType.simpleName}.html\" \"See ${externalGraph.mermaidVisualName} details\" _blank")
+                sb.appendLine("click ${externalGraph.mermaidId} \"${externalGraph.generatedType.simpleName}.$fileExtension\" \"See ${externalGraph.mermaidVisualName} details\" _blank")
             }
         }
 

diff --git a/docs/FeatureXNavGraph.html b/docs/FeatureXNavGraph.html
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>FeatureX Navigation Graph</title>
+</head>
+<body>
+<pre id='scene' class="mermaid">
+---
+title: FeatureX Navigation Graph
+---
+%%{init: {'theme':'base', 'themeVariables': { 'primaryTextColor': '#fff' }}%%
+graph TD
+feature_x(["FeatureXGraph"]) -- "start" --- feature_x_home("FeatureXHome")
+feature_x(["FeatureXGraph"]) --- internal_args_screen("InternalArgsScreen")
+
+
+classDef destination fill:#5383EC,stroke:#ffffff;
+class feature_x_home,internal_args_screen destination;
+classDef navgraph fill:#63BC76,stroke:#ffffff;
+class feature_x navgraph;
+
+</pre>
+<script src='https://unpkg.com/[email protected]/dist/panzoom.min.js'></script>
+<script type="module">import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs';</script>
+<script>
+var element = document.getElementById('scene')
+var pz = panzoom(element, {
+  minZoom: 0.5
+});
+
+function reset(e) {
+   pz.moveTo(0, 0); 
+   pz.zoomAbs(0, 0, 1);
+}
+
+function zoomIn(e) {
+   pz.smoothZoom(0, 0, 1.25);
+}
+
+function zoomOut(e) {
+   pz.smoothZoom(0, 0, 0.75);
+}
+
+document.addEventListener('keydown', function(event) {
+    const keycode = event.keyCode;
+    const key = event.key;
+
+    switch(keycode) {
+        case 82: // R key
+            reset(event);
+            break;
+        case 187: // + key
+            zoomIn(event);
+            break;
+        case 189: // - key
+            zoomOut(event);
+            break;
+    }
+});
+</script>
+</body>
+</html>
diff --git a/docs/FeatureXNavGraph.mmd b/docs/FeatureXNavGraph.mmd
@@ -0,0 +1,13 @@
+---
+title: FeatureX Navigation Graph
+---
+%%{init: {'theme':'base', 'themeVariables': { 'primaryTextColor': '#fff' }}%%
+graph TD
+feature_x(["FeatureXGraph"]) -- "start" --- feature_x_home("FeatureXHome")
+feature_x(["FeatureXGraph"]) --- internal_args_screen("InternalArgsScreen")
+
+
+classDef destination fill:#5383EC,stroke:#ffffff;
+class feature_x_home,internal_args_screen destination;
+classDef navgraph fill:#63BC76,stroke:#ffffff;
+class feature_x navgraph;
diff --git a/docs/FeatureYNavGraph.html b/docs/FeatureYNavGraph.html
@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>FeatureY Navigation Graph</title>
+</head>
+<body>
+<pre id='scene' class="mermaid">
+---
+title: FeatureY Navigation Graph
+---
+%%{init: {'theme':'base', 'themeVariables': { 'primaryTextColor': '#fff' }}%%
+graph TD
+feature_y(["FeatureYGraph"]) -- "start" --- feature_y_home("FeatureYHome")
+feature_y(["FeatureYGraph"]) --- feature_y_internal_args_screen("FeatureYInternalArgsScreen")
+feature_y(["FeatureYGraph"]) --- sub_feature_y_nav_g(["SubFeatureYGraph 🧩"])
+
+click sub_feature_y_nav_g "SubFeatureYNavGraph.html" "See SubFeatureYGraph details" _blank
+
+classDef destination fill:#5383EC,stroke:#ffffff;
+class feature_y_home,feature_y_internal_args_screen destination;
+classDef navgraph fill:#63BC76,stroke:#ffffff;
+class feature_y,sub_feature_y_nav_g navgraph;
+
+</pre>
+<script src='https://unpkg.com/[email protected]/dist/panzoom.min.js'></script>
+<script type="module">import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs';</script>
+<script>
+var element = document.getElementById('scene')
+var pz = panzoom(element, {
+  minZoom: 0.5
+});
+
+function reset(e) {
+   pz.moveTo(0, 0); 
+   pz.zoomAbs(0, 0, 1);
+}
+
+function zoomIn(e) {
+   pz.smoothZoom(0, 0, 1.25);
+}
+
+function zoomOut(e) {
+   pz.smoothZoom(0, 0, 0.75);
+}
+
+document.addEventListener('keydown', function(event) {
+    const keycode = event.keyCode;
+    const key = event.key;
+
+    switch(keycode) {
+        case 82: // R key
+            reset(event);
+            break;
+        case 187: // + key
+            zoomIn(event);
+            break;
+        case 189: // - key
+            zoomOut(event);
+            break;
+    }
+});
+</script>
+</body>
+</html>
diff --git a/docs/FeatureYNavGraph.mmd b/docs/FeatureYNavGraph.mmd
@@ -0,0 +1,15 @@
+---
+title: FeatureY Navigation Graph
+---
+%%{init: {'theme':'base', 'themeVariables': { 'primaryTextColor': '#fff' }}%%
+graph TD
+feature_y(["FeatureYGraph"]) -- "start" --- feature_y_home("FeatureYHome")
+feature_y(["FeatureYGraph"]) --- feature_y_internal_args_screen("FeatureYInternalArgsScreen")
+feature_y(["FeatureYGraph"]) --- sub_feature_y_nav_g(["SubFeatureYGraph 🧩"])
+
+click sub_feature_y_nav_g "SubFeatureYNavGraph.mmd" "See SubFeatureYGraph details" _blank
+
+classDef destination fill:#5383EC,stroke:#ffffff;
+class feature_y_home,feature_y_internal_args_screen destination;
+classDef navgraph fill:#63BC76,stroke:#ffffff;
+class feature_y,sub_feature_y_nav_g navgraph;
diff --git a/docs/MyTopLevelNavGraph.html b/docs/MyTopLevelNavGraph.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>MyTopLevel Navigation Graph</title>
+</head>
+<body>
+<pre id='scene' class="mermaid">
+---
+title: MyTopLevel Navigation Graph
+---
+%%{init: {'theme':'base', 'themeVariables': { 'primaryTextColor': '#fff' }}%%
+graph TD
+my_top_level(["MyTopLevelGraph"]) -- "start" --- asd("Asd")
+
+
+classDef destination fill:#5383EC,stroke:#ffffff;
+class asd destination;
+classDef navgraph fill:#63BC76,stroke:#ffffff;
+class my_top_level navgraph;
+
+</pre>
+<script src='https://unpkg.com/[email protected]/dist/panzoom.min.js'></script>
+<script type="module">import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs';</script>
+<script>
+var element = document.getElementById('scene')
+var pz = panzoom(element, {
+  minZoom: 0.5
+});
+
+function reset(e) {
+   pz.moveTo(0, 0); 
+   pz.zoomAbs(0, 0, 1);
+}
+
+function zoomIn(e) {
+   pz.smoothZoom(0, 0, 1.25);
+}
+
+function zoomOut(e) {
+   pz.smoothZoom(0, 0, 0.75);
+}
+
+document.addEventListener('keydown', function(event) {
+    const keycode = event.keyCode;
+    const key = event.key;
+
+    switch(keycode) {
+        case 82: // R key
+            reset(event);
+            break;
+        case 187: // + key
+            zoomIn(event);
+            break;
+        case 189: // - key
+            zoomOut(event);
+            break;
+    }
+});
+</script>
+</body>
+</html>
diff --git a/docs/MyTopLevelNavGraph.mmd b/docs/MyTopLevelNavGraph.mmd
@@ -0,0 +1,12 @@
+---
+title: MyTopLevel Navigation Graph
+---
+%%{init: {'theme':'base', 'themeVariables': { 'primaryTextColor': '#fff' }}%%
+graph TD
+my_top_level(["MyTopLevelGraph"]) -- "start" --- asd("Asd")
+
+
+classDef destination fill:#5383EC,stroke:#ffffff;
+class asd destination;
+classDef navgraph fill:#63BC76,stroke:#ffffff;
+class my_top_level navgraph;
diff --git a/docs/RootNavGraph.html b/docs/RootNavGraph.html
@@ -0,0 +1,84 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Root Navigation Graph</title>
+</head>
+<body>
+<pre id='scene' class="mermaid">
+---
+title: Root Navigation Graph
+---
+%%{init: {'theme':'base', 'themeVariables': { 'primaryTextColor': '#fff' }}%%
+graph TD
+root(["RootGraph"]) -- "start" --- greeting_screen("GreetingScreen")
+root(["RootGraph"]) --- root/stats_screen("StatsScreen")
+root(["RootGraph"]) --- root/profile_settings_screen("ProfileSettingsScreen")
+root(["RootGraph"]) --- feed("Feed")
+root(["RootGraph"]) --- go_to_profile_confirmation("GoToProfileConfirmation")
+root(["RootGraph"]) --- test_screen("TestScreen")
+root(["RootGraph"]) --- test_screen2("TestScreen2")
+root(["RootGraph"]) --- test_screen3("TestScreen3")
+root(["RootGraph"]) --- settings(["SettingsGraph"])
+root(["RootGraph"]) --- profile(["ProfileGraph"])
+settings(["SettingsGraph"]) -- "start" --- settings_screen("SettingsScreen")
+settings(["SettingsGraph"]) --- settings/stats_screen("StatsScreen")
+settings(["SettingsGraph"]) --- another_test_screen("AnotherTestScreen")
+settings(["SettingsGraph"]) --- theme_settings("ThemeSettings")
+settings(["SettingsGraph"]) --- other_activity("OtherActivity")
+profile(["ProfileGraph"]) -- "start" --- profile_settings(["ProfileSettingsGraph"])
+profile(["ProfileGraph"]) --- profile_screen("ProfileScreen")
+profile(["ProfileGraph"]) --- public_feature_y_side_screen_destination("PublicFeatureYSideScreen 🧩")
+profile(["ProfileGraph"]) --- feature_x_nav_g(["FeatureXGraph 🧩"])
+profile(["ProfileGraph"]) --- feature_y_nav_g(["FeatureYGraph 🧩"])
+profile_settings(["ProfileSettingsGraph"]) -- "start" --- profile_settings/profile_settings_screen("ProfileSettingsScreen")
+
+click feature_x_nav_g "FeatureXNavGraph.html" "See FeatureXGraph details" _blank
+click feature_y_nav_g "FeatureYNavGraph.html" "See FeatureYGraph details" _blank
+
+classDef destination fill:#5383EC,stroke:#ffffff;
+class root/stats_screen,root/profile_settings_screen,feed,go_to_profile_confirmation,test_screen,test_screen2,test_screen3,greeting_screen,settings/stats_screen,another_test_screen,settings_screen,theme_settings,other_activity,profile_screen,public_feature_y_side_screen_destination,profile_settings/profile_settings_screen destination;
+classDef navgraph fill:#63BC76,stroke:#ffffff;
+class settings,profile,root,settings,profile_settings,profile,feature_x_nav_g,feature_y_nav_g,profile_settings navgraph;
+
+</pre>
+<script src='https://unpkg.com/[email protected]/dist/panzoom.min.js'></script>
+<script type="module">import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs';</script>
+<script>
+var element = document.getElementById('scene')
+var pz = panzoom(element, {
+  minZoom: 0.5
+});
+
+function reset(e) {
+   pz.moveTo(0, 0); 
+   pz.zoomAbs(0, 0, 1);
+}
+
+function zoomIn(e) {
+   pz.smoothZoom(0, 0, 1.25);
+}
+
+function zoomOut(e) {
+   pz.smoothZoom(0, 0, 0.75);
+}
+
+document.addEventListener('keydown', function(event) {
+    const keycode = event.keyCode;
+    const key = event.key;
+
+    switch(keycode) {
+        case 82: // R key
+            reset(event);
+            break;
+        case 187: // + key
+            zoomIn(event);
+            break;
+        case 189: // - key
+            zoomOut(event);
+            break;
+    }
+});
+</script>
+</body>
+</html>