component/static: Seperate out static file handling

internal/component/static/out/control/autolink.css

@@ -0,0 +1,20 @@
+.header-link {
+    position: relative;
+    left: 0.5em;
+    opacity: 0;
+    font-size: 0.8em;
+
+    -webkit-transition: opacity 0.2s ease-in-out 0.1s;
+    -moz-transition: opacity 0.2s ease-in-out 0.1s;
+    -ms-transition: opacity 0.2s ease-in-out 0.1s;
+
+    text-decoration: none;
+}
+
+h2:hover .header-link,
+h3:hover .header-link,
+h4:hover .header-link,
+h5:hover .header-link,
+h6:hover .header-link {
+    opacity: 1;
+}

internal/component/static/out/control/autolink.js

@@ -0,0 +1,19 @@
+/** Adapted from http://blog.parkermoore.de/2014/08/01/header-anchor-links-in-vanilla-javascript-for-github-pages-and-jekyll/ */
+const anchorForId = (id) => {
+    const anchor = document.createElement("a")
+    anchor.className = "header-link"
+    anchor.href = "#" + id
+    anchor.innerHTML = "#"
+    return anchor
+}
+
+const linkifyAnchors = (level) => {
+    const headers = document.getElementsByTagName("h" + level);
+    Array.from(headers).forEach((header) => {
+        if (typeof header.id === "undefined" || header.id === "") return
+        header.appendChild(anchorForId(header.id))
+    })
+}
+
+// linkify all the anchors from 1 ... 6
+Array(6).forEach((_, i) => linkifyAnchors(i + 1))

internal/component/static/out/control/dis.css

@@ -0,0 +1,67 @@
+html {
+    line-height: 1.5;
+    font-family: Roboto;
+    font-size: 20px;
+    color: #1a1a1a;
+    background-color: #fdfdfd;
+}
+body {
+    margin: 0 auto;
+    max-width: 36em;
+    padding-left: 50px;
+    padding-right: 50px;
+    padding-top: 50px;
+    padding-bottom: 50px;
+    hyphens: auto;
+    overflow-wrap: break-word;
+    text-rendering: optimizeLegibility;
+    font-kerning: normal;
+}
+
+@media (max-width: 600px) {
+    body {
+        font-size: 0.9em;
+        padding: 1em;
+    }
+}
+
+h1 {
+    margin-top: 1.4em;
+}
+
+h2,h3 {
+    margin-top: 1em;    
+}
+
+code {
+    font-family: Roboto Mono;
+    color: blue;
+}
+
+p {
+    margin: 1em 0;
+    text-align: justify;
+}
+
+a, a:visited {
+    color: #1a1a1a;
+}
+
+footer {
+    border-top: 1px solid #1a1a1a;
+    font-size: small;
+    text-align: center;
+}
+
+.wisski {
+    padding-left: 5px;
+}
+
+.wisski.running {
+    background-color: #9ADA07;
+}
+
+.wisski.stopped {
+    background-color: #ff7a7a;
+}
+

internal/component/static/out/control/instance.js

@@ -0,0 +1,64 @@
+const types = {
+    "date": (element) => {
+        return (new Date(element.innerText)).toISOString()
+    },
+    "path": (element) => {
+        const text = element.innerText.split("/");
+        return text[text.length - 1];
+    },
+    "pathbuilders": (element) => {
+        const pathbuilders = window.pathbuilders; // read from context!
+        const wrapper = document.createElement("span");
+
+        let found_one = false
+        Object.keys(pathbuilders).forEach(name => {
+            found_one = true
+
+            const filename = name + ".xml"
+            const data = pathbuilders[name]
+            const mime = "application/xml"
+            wrapper.append(make_download_link(filename, name, data, mime))
+            wrapper.append(document.createTextNode(" "))
+        })
+
+        if (!found_one) return '(none)';
+
+        const small = document.createElement('small')
+        small.append(document.createTextNode("(click to download)"))
+        wrapper.append(small)
+        
+        return wrapper
+    }
+}
+
+const make_download_link = (filename, title, content, type) => {
+    const blob = new Blob(
+        [content],
+        {
+            type: type ?? "text/plain"
+        }
+    );
+
+    const link = document.createElement("a")
+    link.target = "_blank"
+    link.download = filename
+    link.href = URL.createObjectURL(blob)
+    link.append(document.createTextNode(title))
+
+    return link
+}
+
+Object.keys(types).forEach(key => {
+    const f = types[key];
+    const elements = document.querySelectorAll("code." + key)
+    elements.forEach(element => {
+        const newElement = f(element)
+        if (typeof newElement === 'string') {
+            element.innerHTML = ""
+            element.appendChild(document.createTextNode(newElement))
+            return
+        }
+
+        element.parentNode.replaceChild(newElement, element)
+    })
+})

internal/component/static/static.go

@@ -0,0 +1,32 @@
+// Package static implements serving of fully static resources
+package static
+
+import (
+	"context"
+	"embed"
+	"io/fs"
+	"net/http"
+
+	"github.com/FAU-CDI/wisski-distillery/internal/component"
+	"github.com/tkw1536/goprogram/stream"
+)
+
+type Static struct {
+	component.ComponentBase
+}
+
+func (*Static) Name() string { return "static" }
+
+func (*Static) Routes() []string { return []string{"/static/"} }
+
+func (static *Static) Handler(route string, context context.Context, io stream.IOStream) (http.Handler, error) {
+	fs, err := fs.Sub(htmlStaticFS, "out")
+	if err != nil {
+		return nil, err
+	}
+
+	return http.StripPrefix(route, http.FileServer(http.FS(fs))), nil
+}
+
+//go:embed out
+var htmlStaticFS embed.FS