Finish research read logic and add docs 📚

Author: Freymaurer

README.md

@@ -40,4 +40,23 @@ alumni: 2020-Master Student
 phone: +49 000 111 4242 # this is only an example 
 email: [email protected]
 ---
-```
+```
+
+### Research
+
+Create a `.md` file in `src/content/research`. All fields without an `#!` are optional.
+
+Images must be places in `src/content/images/research`.
+
+Without `index` slides are sorted to the end.
+
+```yaml
+---
+index: <int>
+img: <image_name_in_folder>
+img_url: <url_to_image>
+---
+# My cool research
+
+Any content in **markdown**!
+```

src/config.fsx

@@ -18,6 +18,8 @@ let staticPredicate (projectRoot: string, page: string) =
     let fileShouldBeExcluded =
         ext = ".fsx" ||
         ext = ".md"  ||
+        ext = ".p" ||
+        ext = ".bib" ||
         page.Contains "_public" ||
         page.Contains "_bin" ||
         page.Contains "_lib" ||

src/content/images/research/SharingisCaring.svg

@@ -0,0 +1,8 @@
+---
+img_url: https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTA8xW91n5FW9fiEs9GLr6Zw3nCuwXJTKF68XU1OkStYr8VKd1ylTYi70pITgnI_Zk_ayg&usqp=CAU
+index: 2
+--- 
+
+# Machine Learning Models in Bioscience
+
+Machine learning (ML) models revolutionize bioscience by analyzing complex biological data, predicting outcomes, and discovering patterns. They accelerate drug discovery, enhance disease diagnosis, and personalize treatments. By handling vast datasets efficiently, ML models drive innovative research and advance our understanding of biological systems.

src/content/research/ml_models.md

@@ -0,0 +1,8 @@
+---
+img: SharingisCaring.svg
+index: 1
+--- 
+
+# Research Data Management
+
+Effective research data management ensures data integrity, reproducibility, and accessibility. It enhances reliability, facilitates collaboration, and meets funding and regulatory requirements. Good RDM practices support scientific transparency, protect sensitive information, and maximize research impact, making it a vital component of successful research projects.

src/content/research/rdf.md

@@ -0,0 +1,9 @@
+---
+img_url: https://fslab.org/FSharp.Stats/img/logo.png
+--- 
+
+# Statistic
+
+Statistics in bioscience is essential for analyzing biological data, validating experimental results, and drawing reliable conclusions. It aids in understanding biological processes, designing experiments, and making informed decisions. Statistical methods ensure the accuracy and reproducibility of research, driving advancements in health, genetics, and environmental studies.
+
+🔗 [F# Stats](https://fslab.org/FSharp.Stats/#FSharp-Stats)

src/content/research/statistics.md

@@ -1,44 +1,12 @@
 #r "../../_lib/Fornax.Core.dll"
+#if !FORNAX
+#load "../../loaders/researchloader.fsx"
+#endif
 
 open Html
 
-type FrameSlide = {
-    Content: string
-    Image: string
-}
 
-let Example1 = {
-  Content = """<ul>
-  <li>Main content categories, which describe common rules shared by many elements.</li>
-  <li>Form-related content categories, which describe rules common to form-related elements.</li>
-  <li>Specific content categories, which describe rare categories shared only by a few elements, sometimes only in a specific context.</li>
-</ul>"""
-  Image = "https://picsum.photos/200/300"
-}
-
-let Example2 = {
-  Content = """<p>Flow content is a broad category that encompasses most elements that can go inside the <a href="/en-US/docs/Web/HTML/Element/body"><code>&lt;body&gt;</code></a> element, including heading elements, sectioning elements, phrasing elements, embedding elements, interactive elements, and form-related elements. It also includes text nodes (but not those that only consist of white space characters).</p>"""
-  Image = "https://picsum.photos/200/300"
-}
-let Example3 = {
-  Content = """<section aria-labelledby="sectioning_content"><h3 id="sectioning_content"><a href="#sectioning_content">Sectioning content</a></h3><div class="section-content"><p>Sectioning content, a subset of flow content, creates a <a href="/en-US/docs/Web/HTML/Element/Heading_Elements">section in the current outline</a> defining the scope of <a href="/en-US/docs/Web/HTML/Element/header"><code>&lt;header&gt;</code></a> and <a href="/en-US/docs/Web/HTML/Element/footer"><code>&lt;footer&gt;</code></a> elements.</p>
-<p>Elements belonging to this category are <a href="/en-US/docs/Web/HTML/Element/article"><code>&lt;article&gt;</code></a>, <a href="/en-US/docs/Web/HTML/Element/aside"><code>&lt;aside&gt;</code></a>, <a href="/en-US/docs/Web/HTML/Element/nav"><code>&lt;nav&gt;</code></a>, and <a href="/en-US/docs/Web/HTML/Element/section"><code>&lt;section&gt;</code></a>.</p></div></section>"""
-  Image = "https://picsum.photos/200/300"
-}
-let Example4 = {
-  Content = """<ul>
-  <li><a href="/en-US/docs/Web/HTML/Element/a"><code>&lt;a&gt;</code></a>, if the <a href="/en-US/docs/Web/HTML/Element/a#href"><code>href</code></a> attribute is present</li>
-  <li><a href="/en-US/docs/Web/HTML/Element/audio"><code>&lt;audio&gt;</code></a>, if the <a href="/en-US/docs/Web/HTML/Element/audio#controls"><code>controls</code></a> attribute is present</li>
-  <li><a href="/en-US/docs/Web/HTML/Element/img"><code>&lt;img&gt;</code></a>, if the <a href="/en-US/docs/Web/HTML/Element/img#usemap"><code>usemap</code></a> attribute is present</li>
-  <li><a href="/en-US/docs/Web/HTML/Element/input"><code>&lt;input&gt;</code></a>, if the <a href="/en-US/docs/Web/HTML/Element/input#type">type</a> attribute is not in the hidden state</li>
-  <li><a href="/en-US/docs/Web/HTML/Element/object"><code>&lt;object&gt;</code></a>, if the <a href="/en-US/docs/Web/HTML/Element/object#usemap"><code>usemap</code></a> attribute is present</li>
-  <li><a href="/en-US/docs/Web/HTML/Element/video"><code>&lt;video&gt;</code></a>, if the <a href="/en-US/docs/Web/HTML/Element/video#controls"><code>controls</code></a> attribute is present</li>
-</ul>"""
-  Image = "https://picsum.photos/200/300"
-}
-
-
-let private createFrameSlide (slide: FrameSlide) =
+let private createFrameSlide (slide: Researchloader.FrameSlide) =
   let innerFlexBoxContainer = HtmlProperties.Style [Display "flex"; CSSProperties.Height "100%"; AlignItems "center"]
   li [Class "splide__slide"] [
       // container
@@ -47,7 +15,13 @@ let private createFrameSlide (slide: FrameSlide) =
               div [Class "cell research__cell"] [
                 div [innerFlexBoxContainer] [
                   div [] [
-                    img [Src slide.Image]
+                    img [
+                      match slide with
+                      | { Image = Some i} -> Src i
+                      | { ImageUrl = Some i} -> Src i
+                      | _ -> ()
+                      HtmlProperties.Style [MaxWidth "100%"]
+                    ]
                   ]
                 ]
               ]
@@ -61,18 +35,17 @@ let private createFrameSlide (slide: FrameSlide) =
   ]
 
 let generate (ctx : SiteContents) (_: string) =
-    // section [Class "section research"; Id "research"] [
-    //     // createFrame [|ExampleBase; Example2; Example3; Example4|]
-        
-    // ]
-    let slides = [Example1; Example2; Example3; Example4]
+    let researchList: Researchloader.FrameSlide list =
+        ctx.TryGetValues<Researchloader.FrameSlide> ()
+        |> Option.defaultValue Seq.empty
+        |> Seq.toList
     div [HtmlProperties.Style [CSSProperties.Height "400px"]] [
         section [Class "splide"; HtmlProperties.Custom("aria-label","current research information")] [
             // div [Class "splide__slider"] [
             // ]
             div [Class "splide__track"] [
                 ul [Class "splide__list"] [
-                    for slide in slides do
+                    for slide in researchList do
                       createFrameSlide slide
                 ]
             ]

src/generators/sections/research.fsx

@@ -80,7 +80,6 @@ let loadFile (featured:bool) (bibFile: string) =
 
 let loader (projectRoot: string) (siteContent: SiteContents) =
     let postsPath = Path.Combine(projectRoot, contentDir)
-    printfn "%s" postsPath
     let options = EnumerationOptions(RecurseSubdirectories = false)
     let files = Directory.GetFiles(postsPath, "*", options)
     files

src/loaders/bibloader.fsx

@@ -0,0 +1,84 @@
+#r "../_lib/Fornax.Core.dll"
+#r "../_lib/Markdig.dll"
+
+open System.IO
+open Markdig
+
+let key_image = "img"
+let key_image_url: string = "img_url"
+
+let contentDir = "content/research/"
+
+let imgDir = "content/images/research/"
+
+
+module ContentReader =
+
+    let pipeline = 
+      let n = new MarkdownPipelineBuilder()
+      n
+        .UseAdvancedExtensions()
+        .Build();
+
+    let isSeparator (input : string) =
+      input.StartsWith "---"
+
+    ///`fileContent` - content of page to parse. Usually whole content of `.md` file
+    /// Returns map<string,string> with frontmatter and everything else as "content".
+    let getData (fileContent : string []) =
+        let fileContent = fileContent |> Array.skip 1 //First line must be ---
+        let indexOfSeperator = fileContent |> Array.findIndex isSeparator
+        let splitKey (line: string) =
+            let seperatorIndex = line.IndexOf(':')
+            if seperatorIndex > 0 then
+                let key = line.[.. seperatorIndex - 1].Trim().ToLower()
+                let value = line.[seperatorIndex + 1 ..].Trim()
+                Some(key, value)
+            else
+                None
+        let frontmatter, content =
+            fileContent
+            |> Array.splitAt indexOfSeperator
+        frontmatter
+        |> Seq.choose splitKey
+        |> Map.ofSeq
+        |> fun x -> x.Add(
+            "content", 
+            content.[1..] //skip closing ---
+            |> String.concat "\n"
+        )
+
+type FrameSlide = {
+    Content: string
+    Image: string option
+    ImageUrl: string option
+} with
+  static member create(content: string, ?image, ?imageurl) =
+    { Content = content; Image = image; ImageUrl = imageurl }
+
+let getImageUrl (imageName: string) =
+    imgDir + imageName
+
+open Markdig
+
+let loadFile (filePath: string) =
+    let lines = File.ReadAllLines(filePath)
+    let metadata = ContentReader.getData lines
+    let content = metadata.["content"] |> fun c -> Markdown.ToHtml(c, ContentReader.pipeline)
+    let image = metadata |> Map.tryFind key_image |> Option.map getImageUrl
+    let imageUrl = metadata |> Map.tryFind key_image_url
+    let index = metadata |> Map.tryFind "index" |> Option.map int |> Option.defaultValue System.Int32.MaxValue
+    index, FrameSlide.create(content, ?image=image, ?imageurl=imageUrl)
+
+let loader (projectRoot: string) (siteContent: SiteContents) =
+    let postsPath = Path.Combine(projectRoot, contentDir)
+    let options = EnumerationOptions(RecurseSubdirectories = true)
+    let files = Directory.GetFiles(postsPath, "*", options)
+    files
+    |> Array.filter (fun n -> n.EndsWith ".md")
+    |> Array.map (loadFile)
+    |> Array.sortBy fst
+    |> Array.map snd
+    |> Array.iter siteContent.Add
+    // siteContent.Add({disableLiveRefresh = false})
+    siteContent

src/loaders/researchloader.fsx

@@ -2,8 +2,9 @@
   background-color: white;
   padding: 1rem;
   max-height: 100%;
-
+  
   &:first-child {
+    max-width: 50%;
     border-top-left-radius: 8px;
     border-bottom-left-radius: 8px;
   }