Move minifying and bundling JS and CSS to compile.php, add header

Close #17

public/assets/js/csvxmlV2.js

@@ -502,6 +502,8 @@ class CsvxmlPage {
 
     listValidationErrors(validator) {
 
+        console.log("Listing validation errors");
+
         const dialogueContent = document.createElement("div");
 
         const headline = document.createElement("h3");
@@ -571,17 +573,21 @@ class CsvxmlPage {
 
         let app = this;
 
+        document.body.classList.add("loading");
+
         reader.onload = function() {
 
             // On loading success, check if the upload is valid JSON
             console.log("Read file");
             // Validate the file
             let validator = new CsvxmlValidator(app.fieldListFlat, reader.result);
+            document.body.classList.remove("loading");
             if (validator.isValid() === true) {
                 alert("Document is valid. Press ok to download.");
                 app.zipUploadToXml(validator);
             }
             else {
+                console.log("Identified invalid upload document");
                 app.listValidationErrors(validator);
             }
 
@@ -592,9 +598,69 @@ class CsvxmlPage {
 
     }
 
-    renderHeader() {
+    renderGenHeader() {
 
         const header = document.createElement("header");
+        header.id = "mainHeader";
+
+        const logoArea = document.createElement("a");
+        logoArea.id = "logoArea";
+        logoArea.href = "https://www.museum-digital.org/";
+
+        const logoImg = document.createElement("img");
+        logoImg.src = "assets/img/mdlogo-code-128px.png";
+        logoImg.alt = "Logo of museum-digital";
+        logoArea.appendChild(logoImg);
+
+        const h2 = document.createElement("h2");
+        h2.textContent = "museum-digital";
+        logoArea.appendChild(h2);
+
+        header.appendChild(logoArea);
+
+        // Right side of the header
+        const nav = document.createElement("nav");
+
+        const lAbout = document.createElement("a");
+        lAbout.href = "https://en.about.museum-digital.org/about";
+        lAbout.textContent = this.tls.about;
+        nav.appendChild(lAbout);
+
+        const lContactList = document.createElement("div");
+
+        const lContact = document.createElement("a");
+        lContact.textContent = this.tls.contact;
+        lContact.href = "https://en.about.museum-digital.org/contact/";
+        lContactList.appendChild(lContact);
+
+        const lContactDiv = document.createElement("div");
+
+        const lImprint = document.createElement("a");
+        lImprint.textContent = this.tls.imprint;
+        lImprint.href = "https://en.about.museum-digital.org/impressum";
+        lContactDiv.appendChild(lImprint);
+
+        const lPrivacy = document.createElement("a");
+        lPrivacy.textContent = this.tls.privacy_policy;
+        lPrivacy.href = "https://en.about.museum-digital.org/privacy/";
+        lContactDiv.appendChild(lPrivacy);
+
+        lContactList.appendChild(lContactDiv);
+        nav.appendChild(lContactList);
+
+        const lNews = document.createElement("a")
+        lNews.textContent = this.tls.news;
+        lNews.href = "https://blog.museum-digital.org/";
+        nav.appendChild(lNews);
+
+        header.appendChild(nav);
+        document.body.appendChild(header);
+
+    }
+
+    renderHeader() {
+
+        const appHeader = document.createElement("header");
 
         const h1 = document.createElement("h1");
 
@@ -609,9 +675,9 @@ class CsvxmlPage {
         h1Span.textContent = "museum-digital:csvxml";
         h1.appendChild(h1Span);
 
-        header.appendChild(h1);
+        appHeader.appendChild(h1);
 
-        document.body.appendChild(header);
+        document.body.appendChild(appHeader);
 
     }
 
@@ -919,6 +985,7 @@ class CsvxmlPage {
         document.body.classList.remove("loading");
 
         const page = new CsvxmlPage(fieldList, tls);
+        page.renderGenHeader();
         page.renderHeader();
         page.renderUploader();
         page.renderMain();