[Web] Use YAML file to generate a file tree in the documentation

doc-generator/markdown/en/docs/latest/index.yaml

@@ -0,0 +1,13 @@
+path: ""
+name: ""
+has_index: true
+children:
+- path: index
+
+- path: flow-control
+  name: Flow control
+  has_index: true
+  children:
+  - path: arrays
+  - path: conditionals
+

doc-generator/markdown/en/stdlib/latest/index.toml

@@ -1 +1,7 @@
-entry-point = "index"
+entry-point = "index"
+
+[prelude]
+section-name = "Prelude"
+children = [
+    "String"
+]

doc-generator/markdown/en/stdlib/latest/index.yaml

@@ -0,0 +1 @@
+path: ""

doc-generator/src/pages/mod.rs

@@ -1,4 +1,4 @@
-use std::{path::Path, fs};
+use std::{fs, path::Path};
 
 use yaml_rust::{Yaml, YamlLoader};
 
@@ -61,12 +61,10 @@ fn generate_pages_tree(values: &Yaml) -> Node {
 
             let children_nodes: Vec<Node> = children
                 .into_iter()
-                .map(|values| {
-                    generate_pages_tree(values)
-                })
+                .map(|values| generate_pages_tree(values))
                 .collect();
 
-            Node::Folder(Folder { 
+            Node::Folder(Folder {
                 path,
                 name,
                 has_index,
@@ -79,27 +77,71 @@ fn generate_pages_tree(values: &Yaml) -> Node {
     }
 }
 
-fn generate_pages_html(file_tree: &Node) -> String {
+fn generate_pages_html(file_tree: &Node, current_path: &Path) -> String {
     match file_tree {
         Node::File(file) => {
-            String::from("File :D")
+            if file.path == "index" {
+                format!(
+                    "<li class=\"my-2\">
+                        <a class=\"inline-block w-full hover:text-c2-primary\" href=\"/{}\">Index</a>
+                    </li>",
+                    current_path.to_str().unwrap()
+                )
+            } else if file.path == "" {
+                String::from("")
+            } else {
+                format!(
+                    "<li class=\"my-2\">
+                        <a class=\"inline-block w-full hover:text-c2-primary\" href=\"/{}/{}.html\">{}</a>
+                    </li>",
+                    current_path.to_str().unwrap(),
+                    file.path,
+                    file.path
+                )
+            }
         }
         Node::Folder(folder) => {
-            String::from("Folder :D")
+            let mut new_path = current_path.to_path_buf();
+            new_path.push(folder.path);
+
+            let sub_nodes_html: Vec<String> = folder
+                .children
+                .iter()
+                .map(|n| generate_pages_html(n, &new_path))
+                .collect();
+
+            // This is true for the root of the YAML file
+            if folder.path == "" {
+                format!("<ul>{}</ul>", sub_nodes_html.join(""))
+            } else {
+                format!(
+                    "<li class=\"my-2\">
+                    <div class=\"uppercase opacity-80 mt-6 font-semibold\">{}</div>
+                    <ul>{}</ul>
+                </li>",
+                    folder.name,
+                    sub_nodes_html.join("")
+                )
+            }
         }
     }
 }
 
-pub fn generate_pages(yaml_folder: &Path) -> String {
-    let mut yaml_path =  yaml_folder.canonicalize().unwrap();
+pub fn generate_pages(yaml_folder: &Path, input_folder: &Path) -> String {
+    let mut yaml_path = yaml_folder.canonicalize().unwrap();
     yaml_path.push("index.yaml");
 
     let yaml_bytes = fs::read(yaml_path).expect("File index.yaml MUST exist");
     let yaml = String::from_utf8(yaml_bytes).expect("YAML index file MUST be valid UTF-8");
 
-    let yaml_docs = YamlLoader::load_from_str(yaml.as_str()).expect("YAML file MUST contain valid YAML");
+    let yaml_docs =
+        YamlLoader::load_from_str(yaml.as_str()).expect("YAML file MUST contain valid YAML");
     let yaml = &yaml_docs[0];
 
+    let input_folder = input_folder.canonicalize().unwrap();
+    let yaml_folder_2 = yaml_folder.canonicalize().unwrap();
+    let web_absolute_path = yaml_folder_2.strip_prefix(input_folder).unwrap();
+
     let root_node = generate_pages_tree(yaml);
-    generate_pages_html(&root_node)
+    generate_pages_html(&root_node, web_absolute_path)
 }

doc-generator/src/processor.rs

@@ -59,7 +59,8 @@ pub fn search_config_file(current_path: &Path, input_folder: &Path, output_folde
 }
 
 fn process_toml(current_path: &Path, input_folder: &Path, output_folder: &Path) {
-    println!("YAML:{}", crate::pages::generate_pages(current_path));
+    let file_tree_html = crate::pages::generate_pages(current_path, input_folder);
+
     let mut toml_file_path = current_path.canonicalize().unwrap();
     toml_file_path.push("index.toml");
 
@@ -81,7 +82,7 @@ fn process_toml(current_path: &Path, input_folder: &Path, output_folder: &Path)
     let mut file = current_path.canonicalize().unwrap();
     file.push(format!("{}.md", entry_point));
 
-    compile_md_file(&file, input_folder, output_folder)
+    compile_md_file(&file, input_folder, output_folder, &file_tree_html)
         .expect("FS: entry-point file MUST point to a valid file");
 
     //  Subsequent keys should have schema:
@@ -114,7 +115,7 @@ fn process_toml(current_path: &Path, input_folder: &Path, output_folder: &Path)
                     file.push(key.clone());
                     file.push(format!("{}.md", file_name));
 
-                    compile_md_file(&file, input_folder, output_folder)
+                    compile_md_file(&file, input_folder, output_folder, &file_tree_html)
                         .expect(format!("Error compiling file {}", file.display()).as_str());
                 }
             }
@@ -127,6 +128,7 @@ fn compile_md_file(
     file: &PathBuf,
     input_folder: &Path,
     output_folder: &Path,
+    file_tree_html: &String,
 ) -> Result<(), String> {
     // /home/fernando/misti/docs/markdown
     let input_folder = input_folder.canonicalize().unwrap();
@@ -164,7 +166,8 @@ fn compile_md_file(
 
     let final_output = template_contents
         .replace("{{markdown}}", &html_text)
-        .replace("{{sidebar}}", &sidebar_html);
+        .replace("{{sidebar}}", &sidebar_html)
+        .replace("{{pages}}", &file_tree_html);
 
     //
     // Write to disk

doc-generator/static/template.html

@@ -24,7 +24,7 @@
         <div class="text-sm p-4 h-screen py-8 sticky top-0 overflow-y-scroll overflow-x-hidden border-r border-border-color">
             <a
                 href="/" 
-                class="inline-block border border-transparent 
+                class="inline-block border border-transparent mb-8
                 hover:border-c2-primary hover:text-c2-primary transition-colors rounded-md"
             >
                 <svg style="width: 100%" viewBox="0 0 10240 10240">
@@ -39,9 +39,12 @@
                 <p class="font-extrabold text-6xl text-center">Misti</p>
             </a>
 
-            {{pages}}
+            <nav id="secondary-nav">
+                {{pages}}
+            </nav>
+
         </div>
-        <nav class="text-sm p-4 h-screen py-12 sticky top-0 overflow-y-scroll overflow-x-hidden border-r border-border-color">
+        <nav id="primary-nav" class="text-sm p-4 h-screen py-12 sticky top-0 overflow-y-scroll overflow-x-hidden border-r border-border-color">
             {{sidebar}}
         </nav>
         <div class="marked px-8 max-w-screen-lg">
@@ -59,7 +62,7 @@
     </script>
     <script>
         const anchors = document.querySelectorAll('h2, h3');
-        const links = document.querySelectorAll('nav > ul > li a');
+        const links = document.querySelectorAll('nav#primary-nav > ul > li a');
 
         window.addEventListener("DOMContentLoaded", () => {
             window.addEventListener('scroll', (event) => {