eerste commit - basis structuur

Author: justb4

.gitignore

@@ -0,0 +1 @@
+docs/site

CNAME

@@ -0,0 +1 @@
+osmws.osgeo.n

README.md

@@ -1,2 +1,59 @@
-# osmws
-OpenStreetMap Workshop - FOSS4GNL 2023
+# osmws.osgeo.nl website
+
+The files and dirs below are content for an OpenStreetMap Workshop.
+
+This workshop was initially provided at the [FOSS4GNL 2023](https://foss4g.nl) but
+is also intended to be reused and expanded for other/future events.
+
+The documentation is powered by [MkDocs](https://www.mkdocs.org) 
+which facilitates easy management
+of content and publishing. Content is written in Markdown.
+
+Using [GitHub Workflows](.github/workflows/deploy.docs.yml) the website is automatically rebuilt and deployed
+(to the `gh-pages` branch on GitHub) on commit/pushes to the `main` branch. 
+The site is hosted as a static html website at [osmws.osgeo.nl](https://osmws.osgeo.nl) 
+on GitHub using GitHub Pages.
+
+## Build/test locally
+
+```bash
+# build a virtual Python environment in isolation
+# For example, or use pyenv.
+python3 -m venv .
+. bin/activate
+
+# fork or clone from GitHub
+git clone https://github.com/osgeonl/osmws.osgeo.nl.git
+cd docs
+
+# install required dependencies
+
+# Optional: install lxml quickly using package
+apt-get install -y python3-lxml
+
+# install Python libs 
+pip install -r requirements.txt
+
+# build the website
+mkdocs build
+
+# serve locally
+mkdocs serve  # website is made available on http://localhost:8000
+
+# or locally on specific port
+mkdocs serve -a localhost:8001
+
+```
+
+## Deploying to live site
+
+Website updates are automatically published 
+via [GitHub Actions](.github/workflows/deploy.docs.yml).
+
+Or to publish manually, but this is in general not needed:
+
+```bash
+# NOTE: you require access privileges to the GitHub repository
+# to publish live updates
+mkdocs gh-deploy -m 'add new page on topic x'
+```

docs/README.md

@@ -0,0 +1,20 @@
+# Guidelines
+
+## Video
+
+We use https://pypi.org/project/mkdocs-video/.  A YoutTube video can be 
+embedded as follows; 
+
+`![type:video](https://www.youtube.com/embed/S_Sp7dRDbW0)`
+
+## Gallery
+
+Uses GLightbox https://blueswen.github.io/mkdocs-glightbox/.
+
+After install need to copy JS and CSS:
+
+```
+cp (path-to)/site-packages/mkdocs_glightbox/glightbox/glightbox.min.js src/assets/javascripts/
+cp (path-to)/site-packages/mkdocs_glightbox/glightbox/glightbox.min.css src/assets/stylesheets/
+
+```

docs/mkdocs.yml

@@ -0,0 +1,65 @@
+site_name: OSM Workshop
+site_description: "Deze site bevat materiaal voor een OpenStreetMap Workshop"
+site_author: Just van den Broecke Casper Kersten
+copyright: "© 2023 osgeo.nl"
+site_url: https://osmws.osgeo.nl
+repo_url: https://github.com/osgeonl/osmws.osgeo.nl
+edit_uri: '/docs/src'
+docs_dir: src
+nav:
+    - Thuis: index.md
+#    - Intro:
+#        - Specification: design/spec.md
+#        - Architecture: design/architecture.md
+#        - Data: design/data.md
+#        - Deployment: design/gitops.md
+
+use_directory_urls: true
+
+theme:
+    name: material
+    palette:
+        # See https://squidfunk.github.io/mkdocs-material/setup/changing-the-colors/#color-scheme
+        # Default is indigo (blue)
+        scheme: default
+        primary: green
+    features:
+        - navigation.sections
+    favicon: assets/favicon.ico
+    logo: assets/images/osmnl-logo.png
+
+plugins:
+    - search
+    - mkdocs-video
+    - glightbox:
+        touchNavigation: true
+        loop: false
+        effect: zoom
+        slide_effect: slide
+        width: 100%
+        height: auto
+        zoomable: true
+        draggable: true
+        skip_classes:
+          - skip-lightbox
+        auto_caption: false
+        caption_position: bottom
+
+markdown_extensions:
+    - meta # option to add some meta tags on top, title, author, date, etc
+    - admonition # adds the note, question, tip boxes, eg: !!! tip "my tip"
+    - pymdownx.details # advanced collapsible panels
+    - pymdownx.superfences # advanced features; such as line number, flow chart, python shell
+    - footnotes # notes bottom of page
+    - attr_list # used to size images
+    - md_in_html # used to size images
+
+extra_css:
+    # light and dark variations from material.io
+    # https://material.io/resources/color/#!/?view.left=0&view.right=1
+    - assets/stylesheets/termynal.css
+    - assets/stylesheets/custom.css
+
+extra_javascript:
+    - assets/javascripts/termynal.js
+    - assets/javascripts/custom.js

docs/requirements.txt

@@ -0,0 +1,4 @@
+mkdocs
+mkdocs-material
+mkdocs-video
+mkdocs-glightbox

docs/src/CNAME

@@ -0,0 +1 @@
+map5topo.nl

docs/src/assets/favicon.ico

@@ -0,0 +1,105 @@
+document.querySelectorAll(".use-termynal").forEach(node => {
+    node.style.display = "block";
+    new Termynal(node, {
+        lineDelay: 500
+    });
+});
+const progressLiteralStart = "---> 100%";
+const promptLiteralStart = "$ ";
+const customPromptLiteralStart = "# ";
+const termynalActivateClass = "termy";
+let termynals = [];
+
+function createTermynals() {
+    document
+        .querySelectorAll(`.${termynalActivateClass} .highlight`)
+        .forEach(node => {
+            const text = node.textContent;
+            const lines = text.split("\n");
+            const useLines = [];
+            let buffer = [];
+            function saveBuffer() {
+                if (buffer.length) {
+                    let isBlankSpace = true;
+                    buffer.forEach(line => {
+                        if (line) {
+                            isBlankSpace = false;
+                        }
+                    });
+                    dataValue = {};
+                    if (isBlankSpace) {
+                        dataValue["delay"] = 0;
+                    }
+                    if (buffer[buffer.length - 1] === "") {
+                        // A last single <br> won't have effect
+                        // so put an additional one
+                        buffer.push("");
+                    }
+                    const bufferValue = buffer.join("<br>");
+                    dataValue["value"] = bufferValue;
+                    useLines.push(dataValue);
+                    buffer = [];
+                }
+            }
+            for (let line of lines) {
+                if (line === progressLiteralStart) {
+                    saveBuffer();
+                    useLines.push({
+                        type: "progress"
+                    });
+                } else if (line.startsWith(promptLiteralStart)) {
+                    saveBuffer();
+                    const value = line.replace(promptLiteralStart, "").trimEnd();
+                    useLines.push({
+                        type: "input",
+                        value: value
+                    });
+                } else if (line.startsWith("// ")) {
+                    saveBuffer();
+                    const value = "💬 " + line.replace("// ", "").trimEnd();
+                    useLines.push({
+                        value: value,
+                        class: "termynal-comment",
+                        delay: 0
+                    });
+                } else if (line.startsWith(customPromptLiteralStart)) {
+                    saveBuffer();
+                    const promptStart = line.indexOf(promptLiteralStart);
+                    if (promptStart === -1) {
+                        console.error("Custom prompt found but no end delimiter", line)
+                    }
+                    const prompt = line.slice(0, promptStart).replace(customPromptLiteralStart, "")
+                    let value = line.slice(promptStart + promptLiteralStart.length);
+                    useLines.push({
+                        type: "input",
+                        value: value,
+                        prompt: prompt
+                    });
+                } else {
+                    buffer.push(line);
+                }
+            }
+            saveBuffer();
+            const div = document.createElement("div");
+            node.replaceWith(div);
+            const termynal = new Termynal(div, {
+                lineData: useLines,
+                noInit: true,
+                lineDelay: 500
+            });
+            termynals.push(termynal);
+        });
+}
+
+function loadVisibleTermynals() {
+    termynals = termynals.filter(termynal => {
+        if (termynal.container.getBoundingClientRect().top - innerHeight <= 0) {
+            termynal.init();
+            return false;
+        }
+        return true;
+    });
+}
+window.addEventListener("scroll", loadVisibleTermynals);
+createTermynals();
+loadVisibleTermynals();