Merge pull request #101 from PhilippSalvisberg/feature/issue-99-version-selector

Feature/issue 99 version selector

Author: PhilippSalvisberg

docker/Dockerfile

@@ -1,32 +1,28 @@
-FROM centos:8
+FROM oraclelinux:8
 
 LABEL maintainer="philipp.salvisberg@trivadis.com"
 LABEL description="Tools to generate HTML and PDF using Materials for MkDocs and wkhtmltopdf."
 LABEL build.command="docker build . --tag trivadis/mktools:latest"
 
-# install python, not part of centos
-# see https://computingforgeeks.com/how-to-install-python-on-3-on-centos/
-RUN yum -y update
-RUN yum -y groupinstall "Development Tools"
-RUN yum -y install openssl-devel bzip2-devel libffi-devel
-RUN yum -y install wget
-RUN wget https://www.python.org/ftp/python/3.8.3/Python-3.8.3.tgz
-RUN tar xvf Python-3.8.3.tgz
-RUN /bin/bash -c 'cd Python-3.8*/; ./configure --enable-optimizations; make altinstall'
+# install python
+RUN dnf -y update
+RUN dnf -y install python38 python38-pip
 
 # install git
-RUN yum install -y git
-
-# install python modules (most recent versions)
-RUN pip3.8 install --upgrade pip
-RUN pip3.8 install mkdocs \
-                   mkdocs-material \
-                   mkdocs-awesome-pages-plugin \
-                   pymdown-extensions \
-                   mike 
+RUN dnf -y install git
+
+# install python modules
+# using "--root" should suppress "WARNING: Running pip install with root privileges is generally not a good idea." in future releases
+RUN python3 -m pip install --upgrade pip --root /
+RUN python3 -m pip install --root / \
+        'mkdocs==1.1.2' \
+        'mkdocs-material==6.2.8' \
+        'mkdocs-awesome-pages-plugin==2.5.0' \
+        'pymdown-extensions==8.1.1' \
+        'mike==0.5.5' 
 
 # install wkhtmltox 0.12.6
-RUN yum install -y https://github.com/wkhtmltopdf/packaging/releases/download/0.12.6-1/wkhtmltox-0.12.6-1.centos8.x86_64.rpm
+RUN dnf -y install https://github.com/wkhtmltopdf/packaging/releases/download/0.12.6-1/wkhtmltox-0.12.6-1.centos8.x86_64.rpm
 
 # set environment
 ENV LANG=en_US.utf8

docs/css/version-select.css

@@ -0,0 +1,5 @@
+@media only screen and (max-width:76.1875em) {
+  #version-selector {
+    padding: .6rem .8rem;
+  }
+}

docs/js/version-select.js

@@ -0,0 +1,49 @@
+window.addEventListener("DOMContentLoaded", function() {
+  // This is a bit hacky. Figure out the base URL from a known CSS file the
+  // template refers to...
+  var ex = new RegExp("/?css/version-select.css$");
+  var sheet = document.querySelector('link[href$="version-select.css"]');
+
+  var ABS_BASE_URL = sheet.href.replace(ex, "");
+  var CURRENT_VERSION = ABS_BASE_URL.split("/").pop();
+
+  function makeSelect(options, selected) {
+    var select = document.createElement("select");
+    select.classList.add("form-control");
+
+    options.forEach(function(i) {
+      var option = new Option(i.text, i.value, undefined,
+                              i.value === selected);
+      select.add(option);
+    });
+
+    return select;
+  }
+
+  var xhr = new XMLHttpRequest();
+  xhr.open("GET", ABS_BASE_URL + "/../versions.json");
+  xhr.onload = function() {
+    var versions = JSON.parse(this.responseText);
+
+    var realVersion = versions.find(function(i) {
+      return i.version === CURRENT_VERSION ||
+             i.aliases.includes(CURRENT_VERSION);
+    }).version;
+
+    var select = makeSelect(versions.map(function(i) {
+      return {text: i.title, value: i.version};
+    }), realVersion);
+    select.addEventListener("change", function(event) {
+      window.location.href = ABS_BASE_URL + "/../" + this.value;
+    });
+
+    var container = document.createElement("div");
+    container.id = "version-selector";
+    container.className = "md-nav__item";
+    container.appendChild(select);
+
+    var sidebar = document.querySelector(".md-nav--primary > .md-nav__list");
+    sidebar.parentNode.insertBefore(container, sidebar);
+  };
+  xhr.send();
+});

mkdocs.yml

@@ -18,10 +18,10 @@ theme:
 
 extra_css:
   - 'stylesheets/extra.css'
-
+  - 'css/version-select.css'
 extra_javascript:
   - 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=TeX-MML-AM_CHTML'
-
+  - 'js/version-select.js'
 markdown_extensions:
   - admonition
   - pymdownx.highlight:

tools/serve-ghpages.sh

@@ -0,0 +1,5 @@
+#!/bin/bash
+
+# serves local gh-pages - use to verify deployed sites with version selector before pushing gh-pages branch
+DATA_DIR="$(cd "$(dirname "${0}")/.." && pwd)"
+docker run -v ${DATA_DIR}:/data -p 8000:8000 --rm -it trivadis/mktools bash -c "cd /data; mike serve -a 0.0.0.0:8000"

tools/serve.sh

@@ -1,4 +1,5 @@
 #!/bin/bash
 
+# serves from temporary site directory - use during development for live preview of changes in docs directory
 DATA_DIR="$(cd "$(dirname "${0}")/.." && pwd)"
 docker run -v ${DATA_DIR}:/data -p 8000:8000 --rm -it trivadis/mktools bash -c "cd /data; mkdocs serve -a 0.0.0.0:8000"