convert to parcel

.gitignore

@@ -0,0 +1,3 @@
+node_modules
+.cache
+dist

nprogress.min.css

@@ -1 +0,0 @@
-#nprogress{pointer-events:none}#nprogress .bar{background:#fff;position:fixed;z-index:1031;top:0;left:0;width:100%;height:2px}#nprogress .peg{display:block;position:absolute;right:0;width:100px;height:100%;box-shadow:0 0 10px #fff,0 0 5px #fff;opacity:1;-webkit-transform:rotate(3deg) translate(0,-4px);-ms-transform:rotate(3deg) translate(0,-4px);transform:rotate(3deg) translate(0,-4px)}#nprogress .spinner{display:block;position:fixed;z-index:1031;top:15px;right:15px}#nprogress .spinner-icon{width:18px;height:18px;box-sizing:border-box;border:solid 2px transparent;border-top-color:#fff;border-left-color:#fff;border-radius:50%;-webkit-animation:nprogress-spinner .4s linear infinite;animation:nprogress-spinner .4s linear infinite}.nprogress-custom-parent{overflow:hidden;position:relative}.nprogress-custom-parent #nprogress .bar,.nprogress-custom-parent #nprogress .spinner{position:absolute}@-webkit-keyframes nprogress-spinner{0%{-webkit-transform:rotate(0)}100%{-webkit-transform:rotate(360deg)}}@keyframes nprogress-spinner{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}

nprogress.min.js

@@ -1 +0,0 @@
-(function(n,e){"function"==typeof define&&define.amd?define(e):"object"==typeof exports?module.exports=e():n.NProgress=e()})(this,function(){function n(n,e,t){return n<e?e:n>t?t:n}function e(n){return 100*(-1+n)}function t(n,t,r){var i;return i="translate3d"===f.positionUsing?{transform:"translate3d("+e(n)+"%,0,0)"}:"translate"===f.positionUsing?{transform:"translate("+e(n)+"%,0)"}:{"margin-left":e(n)+"%"},i.transition="all "+t+"ms "+r,i}function r(n,e){var t="string"==typeof n?n:o(n);return t.indexOf(" "+e+" ")>=0}function i(n,e){var t=o(n),i=t+e;r(t,e)||(n.className=i.substring(1))}function s(n,e){var t,i=o(n);r(n,e)&&(t=i.replace(" "+e+" "," "),n.className=t.substring(1,t.length-1))}function o(n){return(" "+(n&&n.className||"")+" ").replace(/\s+/gi," ")}function a(n){n&&n.parentNode&&n.parentNode.removeChild(n)}var u,c,l={version:"0.2.0"},f=l.settings={minimum:.08,easing:"linear",positionUsing:"",speed:200,trickle:!0,trickleSpeed:200,showSpinner:!0,barSelector:'[role="bar"]',spinnerSelector:'[role="spinner"]',parent:"body",template:'<div class="bar" role="bar"><div class="peg"></div></div><div class="spinner" role="spinner"><div class="spinner-icon"></div></div>'};l.configure=function(n){var e,t;for(e in n)t=n[e],void 0!==t&&n.hasOwnProperty(e)&&(f[e]=t);return this},l.status=null,l.set=function(e){var r=l.isStarted();e=n(e,f.minimum,1),l.status=1===e?null:e;var i=l.render(!r),s=i.querySelector(f.barSelector),o=f.speed,a=f.easing;return i.offsetWidth,d(function(n){""===f.positionUsing&&(f.positionUsing=l.getPositioningCSS()),m(s,t(e,o,a)),1===e?(m(i,{transition:"none",opacity:1}),i.offsetWidth,setTimeout(function(){m(i,{transition:"all "+o+"ms linear",opacity:0}),setTimeout(function(){l.remove(),n()},o)},o)):setTimeout(n,o)}),this},l.isStarted=function(){return"number"==typeof l.status},l.start=function(){l.status||l.set(0);var n=function(){setTimeout(function(){l.status&&(l.trickle(),n())},f.trickleSpeed)};return f.trickle&&n(),this},l.done=function(n){return n||l.status?l.inc(.3+.5*Math.random()).set(1):this},l.inc=function(e){var t=l.status;return t?t>1?void 0:("number"!=typeof e&&(e=t>=0&&t<.2?.1:t>=.2&&t<.5?.04:t>=.5&&t<.8?.02:t>=.8&&t<.99?.005:0),t=n(t+e,0,.994),l.set(t)):l.start()},l.trickle=function(){return l.inc()},u=0,c=0,l.promise=function(n){return n&&"resolved"!==n.state()?(0===c&&l.start(),u++,c++,n.always(function(){c--,0===c?(u=0,l.done()):l.set((u-c)/u)}),this):this},l.render=function(n){if(l.isRendered())return document.getElementById("nprogress");i(document.documentElement,"nprogress-busy");var t=document.createElement("div");t.id="nprogress",t.innerHTML=f.template;var r,s=t.querySelector(f.barSelector),o=n?"-100":e(l.status||0),u=document.querySelector(f.parent);return m(s,{transition:"all 0 linear",transform:"translate3d("+o+"%,0,0)"}),f.showSpinner||(r=t.querySelector(f.spinnerSelector),r&&a(r)),u!=document.body&&i(u,"nprogress-custom-parent"),u.appendChild(t),t},l.remove=function(){s(document.documentElement,"nprogress-busy"),s(document.querySelector(f.parent),"nprogress-custom-parent");var n=document.getElementById("nprogress");n&&a(n)},l.isRendered=function(){return!!document.getElementById("nprogress")},l.getPositioningCSS=function(){var n=document.body.style,e="WebkitTransform"in n?"Webkit":"MozTransform"in n?"Moz":"msTransform"in n?"ms":"OTransform"in n?"O":"";return e+"Perspective"in n?"translate3d":e+"Transform"in n?"translate":"margin"};var d=function(){function n(){var t=e.shift();t&&t(n)}var e=[];return function(t){e.push(t),1==e.length&&n()}}(),m=function(){function n(n){return n.replace(/^-ms-/,"ms-").replace(/-([\da-z])/gi,function(n,e){return e.toUpperCase()})}function e(n){var e=document.body.style;if(n in e)return n;for(var t,r=i.length,s=n.charAt(0).toUpperCase()+n.slice(1);r--;)if(t=i[r]+s,t in e)return t;return n}function t(t){return t=n(t),s[t]||(s[t]=e(t))}function r(n,e,r){e=t(e),n.style[e]=r}var i=["Webkit","O","Moz","ms"],s={};return function(n,e){var t,i,s=arguments;if(2==s.length)for(t in e)i=e[t],void 0!==i&&e.hasOwnProperty(t)&&r(n,t,i);else r(n,s[1],s[2])}}();return l});

package.json

@@ -0,0 +1,20 @@
+{
+  "name": "hsarch",
+  "version": "1.0.0",
+  "repository": "https://github.com/maltejur/hsarch.git",
+  "author": "maltejur <48161361+maltejur@users.noreply.github.com>",
+  "license": "MIT",
+  "devDependencies": {
+    "parcel-bundler": "^1.12.4"
+  },
+  "scripts": {
+    "dev": "parcel src/index.html",
+    "build": "parcel build src/index.html"
+  },
+  "dependencies": {
+    "nprogress": "^0.2.0"
+  },
+  "browserslist": [
+    "since 2017-06"
+  ]
+}

src/index.html

@@ -6,19 +6,18 @@
       content="min-width=400px, width=device-width, initial-scale = 1.0, maximum-scale=1.0"
       charset="utf-8"
     />
-    <link rel="stylesheet" href="style.css" />
+    <link rel="stylesheet" href="./style.css" />
     <script
       src="https://kit.fontawesome.com/c6918a20c8.js"
       crossorigin="anonymous"
     ></script>
-    <link rel="stylesheet" href="nprogress.min.css" />
     <title>HertzSCHLAG Archiv</title>
   </head>
 
   <body>
     <div id="header">
-      <img src="./hertzlinie_l.svg" alt="" srcset="" class="welle-l" />
-      <img src="./hertzlinie_r.svg" alt="" srcset="" class="welle-r" />
+      <img src="../assets/hertzlinie_l.svg" alt="" srcset="" class="welle-l" />
+      <img src="../assets/hertzlinie_r.svg" alt="" srcset="" class="welle-r" />
       <a href="#">
         <h1>HertzSCHLAG Archiv</h1>
       </a>
@@ -33,7 +32,6 @@
         <a href="#" id="back"></a>
       </div>
     </div>
-    <script src="nprogress.min.js"></script>
-    <script type="module" src="script.js"></script>
+    <script src="./script.js"></script>
   </body>
 </html>

src/modules/ausgabe.js

@@ -1,11 +1,10 @@
 import { checkFile } from "./utils.js";
+import json from "../../assets/data.json";
 
-export default async function Ausgabe(params) {
+export default function Ausgabe(params) {
   const ret = document.createElement("div");
   ret.classList.add("page");
 
-  const response = await fetch("data.json");
-  const json = await response.json();
   const ausg = json.hertzschlag.find((i) => i["Ausgabe"] == params.id);
 
   ausg["Cover"] = ausg["Ausgabe"] + ".jpg";

src/modules/home.js

@@ -1,11 +1,10 @@
-export default async function Home() {
+import json from "../../assets/data.json";
+
+export default function Home() {
   const ret = document.createElement("div");
   ret.classList.add("grid");
   let html = "";
 
-  const response = await fetch("data.json");
-  const json = await response.json();
-
   json.hertzschlag.forEach((i) => {
     html += `
       <a class="module" href="#ausgabe/${i.Ausgabe}">

src/modules/liste.js

@@ -1,10 +1,9 @@
+import json from "../../assets/data.json";
+
 export default async function Liste() {
   const ret = document.createElement("div");
   ret.classList.add("page");
 
-  const response = await fetch("data.json");
-  const json = await response.json();
-
   let listehtml =
     "<a class='back' onclick='window.history.back()'><i class='fas fa-arrow-left'></i></a><h1>Artikelliste</h1><table><tr><th>Ausgabe</th><th>Thema</th></tr>";
   json.hertzschlag.forEach((i) => {

src/modules/pdf.js

@@ -1,7 +1,6 @@
-export default async function Pdf(params) {
-  const response = await fetch("data.json");
-  const json = await response.json();
+import json from "../../assets/data.json";
 
+export default function Pdf(params) {
   const ret = document.createElement("div");
   ret.classList.add("iframe");
 

src/modules/router.js

@@ -27,7 +27,7 @@ export default class Router {
 
       if (rigthRoute) {
         if (this.routes[route]) {
-          let neww = await this.routes[route](params);
+          let neww = this.routes[route](params);
           this.el.innerHTML = "";
           this.el.appendChild(neww);
         }

src/script.js

@@ -4,10 +4,10 @@ import Router from "./modules/router.js";
 import Impressum from "./modules/impressum.js";
 import Liste from "./modules/liste.js";
 import Pdf from "./modules/pdf.js";
+import NProgress from "nprogress/nprogress";
+import "nprogress/nprogress.css";
 
-Home().then((home) => {
-  document.getElementById("home").appendChild(home);
-});
+document.getElementById("home").appendChild(Home());
 
 new Router(
   "#contentinner",

src/style.css

@@ -14,6 +14,14 @@ body {
   width: 100%;
 }
 
+.bar {
+  background-color: white !important;
+}
+
+.peg {
+  box-shadow: none !important;
+}
+
 /* 
 ::-webkit-scrollbar {
   margin-top: 5em;