From 86e92d05e5422d789e63d05417c112f4bdd0cad4 Mon Sep 17 00:00:00 2001
From: Pierre-Olivier Mercier <nemunaire@nemunai.re>
Date: Tue, 15 Mar 2022 01:05:23 +0100
Subject: [PATCH] CD: Publish index

---
 .drone.yml |  27 ++++++++++
 _list.html | 154 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 181 insertions(+)
 create mode 100644 _list.html
diff --git a/.drone.yml b/.drone.yml
index 4c5a25b..7117e16 100644
--- a/.drone.yml
+++ b/.drone.yml
@@ -1,3 +1,30 @@
+---
+kind: pipeline
+type: docker
+name: publish index
+
+platform:
+  os: linux
+  arch: arm64
+
+steps:
+- name: publish on s3
+  image: plugins/s3
+  settings:
+    endpoint: https://storage.nemunai.re
+    path_style: true
+    bucket: scores
+    access_key:
+      from_secret: s3_access_key
+    secret_key:
+      from_secret: s3_secret_key
+    source: _list.html
+    target: /
+
+trigger:
+  event:
+  - push
+
 ---
 kind: pipeline
 type: docker
diff --git a/_list.html b/_list.html
new file mode 100644
index 0000000..7da6f8e
--- /dev/null
+++ b/_list.html
@@ -0,0 +1,154 @@
+<!DOCTYPE html>
+<html lang="en" style="height:100%">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <title>nemunaire's scores downloads</title>
+  </head>
+  <body>
+    <h1>
+      Index of <span id="page_path"><script>document.write(window.location.pathname.replace(/_list.html$/, ''))</script></span>
+    </h1>
+    <hr>
+    <noscript>
+      Sorry, this page uses Javascript to display directory content.<br>
+      You can use the route <a href="/scores/">/scores/</a> to retrieve the list in XML format.
+    </noscript>
+    <pre id="bucket_list">Please wait&hellip;</pre>
+    <hr>
+    <script>
+      function getLastModified(subtree) {
+        let lastmodified = new Date(0);
+
+        for (const sub in subtree.dirs) {
+          const lm = getLastModified(subtree.dirs[sub]);
+          if (lm > lastmodified) {
+            lastmodified = lm;
+          }
+        }
+
+        for (const sub in subtree.files) {
+          const lm = new Date(subtree.files[sub].lastmodified)
+          if (lm > lastmodified) {
+            lastmodified = lm;
+          }
+        }
+
+        return lastmodified
+      }
+
+      async function getEntries() {
+        const tree = {
+          dirs: {},
+          files: {},
+        };
+
+        const res = await fetch(window.origin + '/scores/');
+        const data = new window.DOMParser().parseFromString(await res.text(), "text/xml");
+        for (const i of data.getElementsByTagName('Contents')) {
+          const path = i.getElementsByTagName('Key')[0].textContent.split('/');
+          const filename = path.pop();
+
+          if (filename === '_list.html') continue;
+
+          let ptree = tree;
+          for (const d of path) {
+            if (!ptree.dirs[d]) {
+              ptree.dirs[d] = {
+                dirs: {},
+                files: {},
+              };
+            }
+            ptree = ptree.dirs[d];
+          }
+
+          const owner = i.getElementsByTagName('Owner')[0];
+
+          ptree.files[filename] = {
+            lastmodified: i.getElementsByTagName('LastModified')[0].textContent,
+            etag: i.getElementsByTagName('ETag')[0].textContent,
+            size: i.getElementsByTagName('Size')[0].textContent,
+            owner: {
+              id: owner.getElementsByTagName('ID')[0].textContent,
+              displayname: owner.getElementsByTagName('DisplayName')[0].textContent,
+            },
+            storageclass: i.getElementsByTagName('StorageClass')[0].textContent,
+          };
+        }
+
+        return tree;
+      }
+
+      function displayEntries(tree, underpath) {
+        document.getElementById('bucket_list').innerHTML = '';
+        document.getElementById('page_path').innerText = underpath.join('/').replace(/_list.html$/, '');
+
+        underpath.shift();
+        underpath.pop();
+        let mtree = tree;
+        for (const p of underpath) {
+          if (mtree) {
+            mtree = mtree.dirs[p];
+          }
+        }
+
+        const table = document.getElementById('bucket_list');
+
+        if (underpath.length > 1) {
+          const link = document.createElement('a');
+          link.innerText = '../';
+          link.href = '../';
+          link.addEventListener('click', function (e) {
+            e.preventDefault();
+            history.pushState(null, document.title, '../')
+            underpath.pop();
+            displayEntries(tree, ('/' + underpath.join('/') + (underpath.length > 0?'/':'')).split('/'))
+          });
+          table.appendChild(link);
+          table.appendChild(document.createTextNode('\n'));
+        }
+
+        for (const dirname in mtree.dirs) {
+          const link = document.createElement('a');
+          link.innerText = dirname + '/';
+          link.href = dirname + '/';
+          link.addEventListener('click', function (e) {
+            e.preventDefault();
+            history.pushState(null, document.title, './' + dirname + '/')
+            underpath.push(dirname);
+            displayEntries(tree, ('/' + underpath.join('/') + '/').split('/'))
+          });
+          table.appendChild(link);
+          table.appendChild(document.createTextNode(' '.repeat(50 - dirname.length)));
+
+          const lastmod = getLastModified(mtree.dirs[dirname]);
+
+          table.appendChild(document.createTextNode(new Intl.DateTimeFormat('default', {year: 'numeric', month: 'short', day: 'numeric', hour: 'numeric', minute: 'numeric', hour12: false}).format(lastmod) + ' '.repeat(19)));
+
+          table.appendChild(document.createTextNode('-\n'));
+        }
+        for (const filename in mtree.files) {
+          const link = document.createElement('a');
+          link.innerText = filename;
+          link.href = filename;
+          table.appendChild(link);
+          table.appendChild(document.createTextNode(' '.repeat(51 - filename.length)));
+
+          const lastmod = new Date(mtree.files[filename].lastmodified)
+
+          table.appendChild(document.createTextNode(new Intl.DateTimeFormat('default', {year: 'numeric', month: 'short', day: 'numeric', hour: 'numeric', minute: 'numeric', hour12: false}).format(lastmod) + ' '.repeat(20 - mtree.files[filename].size.length)));
+          table.appendChild(document.createTextNode(mtree.files[filename].size));
+          table.appendChild(document.createTextNode('\n'));
+        }
+      }
+
+      getEntries().then(function (ents) {
+        displayEntries(ents, window.location.pathname.split('/').slice(1));
+        window.onpopstate = function(event) {
+          displayEntries(ents, window.location.pathname.split('/').slice(1));
+        }
+      });
+    </script>
+  </body>
+</html>
