diff --git a/about.html b/about.html
index 5fba2d3e322db6f572c005f2bea13a09a5464efa..2af342725c511ac76749dee2b0a49790956b72b7 100644
--- a/about.html
+++ b/about.html
@@ -10,20 +10,18 @@
body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</style>
<link rel="shortcut icon" href="favicon.ico">
-<script src="includeHTML.js"></script>
-<script src="sidebar_functions.js"></script>
<body class="w3-light-grey w3-content" style="max-width:1600px">
<!-- Sidebar/menu and -->
<!-- Overlay effect when opening sidebar on small screens -->
-<div w3-include-html="sidebar.html"></div>
+<script src='sidebar.js'></script>
<!-- !PAGE CONTENT! -->
<div class="w3-main" style="margin-left:300px">
<!-- Header -->
- <div w3-include-html="header.html"></div>
+ <script src='header.js'></script>
<!-- START OF INDIVIDUAL PAGE CONTENT -->
@@ -94,14 +92,10 @@ body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</div>
<!-- Footer -->
- <div w3-include-html="footer.html"></div>
+ <script src='footer.js'></script>
<!-- End page content -->
</div>
-<script>
- includeHTML();
-</script>
-
</body>
</html>
diff --git a/example1.html b/example1.html
index dd2bb15c4ec741b2b0fd6f78fda68482688d9665..d1e0b9e011edea3200a950e88e0cf4d41566dafd 100644
--- a/example1.html
+++ b/example1.html
@@ -10,20 +10,18 @@
body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</style>
<link rel="shortcut icon" href="favicon.ico">
-<script src="includeHTML.js"></script>
-<script src="sidebar_functions.js"></script>
<body class="w3-light-grey w3-content" style="max-width:1600px">
<!-- Sidebar/menu and -->
<!-- Overlay effect when opening sidebar on small screens -->
-<div w3-include-html="sidebar.html"></div>
+<script src='sidebar.js'></script>
<!-- !PAGE CONTENT! -->
<div class="w3-main" style="margin-left:300px">
<!-- Header -->
- <div w3-include-html="header.html"></div>
+ <script src='header.js'></script>
<!-- START OF INDIVIDUAL PAGE CONTENT -->
@@ -91,14 +89,10 @@ body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</div>
<!-- Footer -->
- <div w3-include-html="footer.html"></div>
+ <script src='footer.js'></script>
<!-- End page content -->
</div>
-<script>
- includeHTML();
-</script>
-
</body>
</html>
diff --git a/example2.html b/example2.html
index 88e2ed28617e37f4a3a09238093456148ff9ee2d..fd8f05b4d04e585eb64f2c960879ba68598fa03e 100644
--- a/example2.html
+++ b/example2.html
@@ -10,20 +10,18 @@
body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</style>
<link rel="shortcut icon" href="favicon.ico">
-<script src="includeHTML.js"></script>
-<script src="sidebar_functions.js"></script>
<body class="w3-light-grey w3-content" style="max-width:1600px">
<!-- Sidebar/menu and -->
<!-- Overlay effect when opening sidebar on small screens -->
-<div w3-include-html="sidebar.html"></div>
+<script src='sidebar.js'></script>
<!-- !PAGE CONTENT! -->
<div class="w3-main" style="margin-left:300px">
<!-- Header -->
- <div w3-include-html="header.html"></div>
+ <script src='header.js'></script>
<!-- START OF INDIVIDUAL PAGE CONTENT -->
@@ -71,14 +69,10 @@ body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</div>
<!-- Footer -->
- <div w3-include-html="footer.html"></div>
+ <script src='footer.js'></script>
<!-- End page content -->
</div>
-<script>
- includeHTML();
-</script>
-
</body>
</html>
diff --git a/example3.html b/example3.html
index b7ded1a9ed1a8096ca063afcb22eaf4d8da74947..f588182380ebc9037f561702ad03f87f4b29eb8e 100644
--- a/example3.html
+++ b/example3.html
@@ -10,20 +10,18 @@
body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</style>
<link rel="shortcut icon" href="favicon.ico">
-<script src="includeHTML.js"></script>
-<script src="sidebar_functions.js"></script>
<body class="w3-light-grey w3-content" style="max-width:1600px">
<!-- Sidebar/menu and -->
<!-- Overlay effect when opening sidebar on small screens -->
-<div w3-include-html="sidebar.html"></div>
+<script src='sidebar.js'></script>
<!-- !PAGE CONTENT! -->
<div class="w3-main" style="margin-left:300px">
<!-- Header -->
- <div w3-include-html="header.html"></div>
+ <script src='header.js'></script>
<!-- START OF INDIVIDUAL PAGE CONTENT -->
@@ -76,14 +74,10 @@ body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</div>
<!-- Footer -->
- <div w3-include-html="footer.html"></div>
+ <script src='footer.js'></script>
<!-- End page content -->
</div>
-<script>
- includeHTML();
-</script>
-
</body>
</html>
diff --git a/footer.js b/footer.js
new file mode 100644
index 0000000000000000000000000000000000000000..c365c927d0fc98da5728ec2fa38c39c1d1f878a3
--- /dev/null
+++ b/footer.js
@@ -0,0 +1,30 @@
+document.write('\
+<footer class="w3-container w3-padding-32 w3-dark-grey">\
+ <div class="w3-row-padding">\
+ <div class="w3-third">\
+ <h3>3D DATA REPOSITORY</h3>\
+ <p>QIM, October 2020.<br>\
+ Powered by <a href="https://www.w3schools.com/w3css/default.asp">w3.css</a>.</p>\
+ </div>\
+ <div class="w3-third">\
+ <h3>GET INVOLVED</h3>\
+ <p>Contribute with data, tool or result.\
+ Stay updated.<br>\
+ Send us a mail at <a href="mailto:info@qim.dk">info@qim.dk</a>.</p>\
+ </div>\
+ <div class="w3-third">\
+ <h3>LINKS</h3>\
+ <p>\
+ <span class="w3-tag w3-grey w3-small w3-margin-bottom">\
+ <a style="text-decoration: none;" href="http://qim.dk/sciencecases/" target="_blank">QIM science</a></span>\
+ <span class="w3-tag w3-grey w3-small w3-margin-bottom">\
+ <a style="text-decoration: none;" href="http://qim.dk/software-tools/" target="_blank">QIM tools</a></span>\
+ <span class="w3-tag w3-grey w3-small w3-margin-bottom">\
+ <a style="text-decoration: none;" href="https://imaging.dtu.dk/" target="_blank">3DIM@DTU</a></span>\
+ <span class="w3-tag w3-grey w3-small w3-margin-bottom">\
+ <a style="text-decoration: none;" href="https://www.maxiv.lu.se/" target="_blank">MAX IV</a></span>\
+ </p>\
+ </div>\
+ </div>\
+</footer>\
+');
diff --git a/header.html b/header.html
deleted file mode 100644
index 654a2fcb8773a5c3df9262d5c40a7ef7bc7e17ce..0000000000000000000000000000000000000000
--- a/header.html
+++ /dev/null
@@ -1,8 +0,0 @@
-<!-- Header -->
-<header>
- <a href="http://qim.dk/"><img src="common/logo_square.png" style="width:65px;" class="w3-circle w3-right w3-margin w3-hide-large w3-hover-opacity"></a>
- <span class="w3-button w3-hide-large w3-xxlarge w3-hover-text-grey" onclick="w3_open()"><i class="fa fa-bars"></i></span>
- <div class="w3-container w3-bottombar w3-padding-16">
- <h1><b>3D DATA REPOSITORY</b></h1>
- </div>
-</header>
diff --git a/header.js b/header.js
new file mode 100644
index 0000000000000000000000000000000000000000..209f4b3010598c41a9f9f739ec3a6bd775fcaa32
--- /dev/null
+++ b/header.js
@@ -0,0 +1,9 @@
+document.write('\
+<header>\
+ <a href="http://qim.dk/"><img src="common/logo_square.png" style="width:65px;" class="w3-circle w3-right w3-margin w3-hide-large w3-hover-opacity"></a>\
+ <span class="w3-button w3-hide-large w3-xxlarge w3-hover-text-grey" onclick="w3_open()"><i class="fa fa-bars"></i></span>\
+ <div class="w3-container w3-bottombar w3-padding-16">\
+ <h1><b>3D DATA REPOSITORY</b></h1>\
+ </div>\
+</header>\
+');
diff --git a/includeHTML.js b/includeHTML.js
deleted file mode 100644
index 822855c0744f751d8dede6604b0cd23d69830e00..0000000000000000000000000000000000000000
--- a/includeHTML.js
+++ /dev/null
@@ -1,27 +0,0 @@
-function includeHTML() {
- var z, i, elmnt, file, xhttp;
- /*loop through a collection of all HTML elements:*/
- z = document.getElementsByTagName("*");
- for (i = 0; i < z.length; i++) {
- elmnt = z[i];
- /*search for elements with a certain atrribute:*/
- file = elmnt.getAttribute("w3-include-html");
- if (file) {
- /*make an HTTP request using the attribute value as the file name:*/
- xhttp = new XMLHttpRequest();
- xhttp.onreadystatechange = function() {
- if (this.readyState == 4) {
- if (this.status == 200) {elmnt.innerHTML = this.responseText;}
- if (this.status == 404) {elmnt.innerHTML = "Page not found.";}
- /*remove the attribute, and call this function once more:*/
- elmnt.removeAttribute("w3-include-html");
- includeHTML();
- }
- }
- xhttp.open("GET", file, true);
- xhttp.send();
- /*exit the function:*/
- return;
- }
- }
-};
diff --git a/index.html b/index.html
index cb2c158fa71a27d03f19b5b39d6e116890ce3d90..46d552f34327aacbfcca549da43ac76167698096 100644
--- a/index.html
+++ b/index.html
@@ -10,21 +10,19 @@
body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</style>
<link rel="shortcut icon" href="favicon.ico">
-<script src="includeHTML.js"></script>
-<script src="sidebar_functions.js"></script>
<body class="w3-light-grey w3-content" style="max-width:1600px">
<!-- Sidebar/menu and -->
<!-- Overlay effect when opening sidebar on small screens -->
<!-- Sidebar/menu -->
-<div w3-include-html="sidebar.html"></div>
+<script src='sidebar.js'></script>
<!-- !PAGE CONTENT! -->
<div class="w3-main" style="margin-left:300px">
<!-- Header -->
- <div w3-include-html="header.html"></div>
+ <script src='header.js'></script>
<!-- START OF INDIVIDUAL PAGE CONTENT -->
@@ -85,14 +83,10 @@ body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</div>
<!-- Footer -->
- <div w3-include-html="footer.html"></div>
+ <script src='footer.js'></script>
<!-- End page content -->
</div>
-<script>
- includeHTML();
-</script>
-
</body>
</html>
diff --git a/qim_repository_template.html b/qim_repository_template.html
index 535ed87d981d8eb0bfb6e08c04bd9b6e7d8cd8c6..b6a44e39117295d1ad128d72f4eb29a5876f77f1 100644
--- a/qim_repository_template.html
+++ b/qim_repository_template.html
@@ -10,20 +10,18 @@
body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</style>
<link rel="shortcut icon" href="favicon.ico">
-<script src="includeHTML.js"></script>
-<script src="sidebar_functions.js"></script>
<body class="w3-light-grey w3-content" style="max-width:1600px">
<!-- Sidebar/menu and -->
<!-- Overlay effect when opening sidebar on small screens -->
-<div w3-include-html="sidebar.html"></div>
+<script src='sidebar.js'></script>
<!-- !PAGE CONTENT! -->
<div class="w3-main" style="margin-left:300px">
<!-- Header -->
- <div w3-include-html="header.html"></div>
+ <script src='header.js'></script>
<!-- START OF INDIVIDUAL PAGE CONTENT -->
@@ -203,14 +201,10 @@ body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}
</div>
<!-- Footer -->
- <div w3-include-html="footer.html"></div>
+ <script src='footer.js'></script>
<!-- End page content -->
</div>
-<script>
- includeHTML();
-</script>
-
</body>
</html>
diff --git a/sidebar.html b/sidebar.html
deleted file mode 100644
index 79507e28d7be0b8ff5283d52f71648269248b6ce..0000000000000000000000000000000000000000
--- a/sidebar.html
+++ /dev/null
@@ -1,23 +0,0 @@
-<!-- Sidebar/menu -->
-<nav class="w3-sidebar w3-collapse w3-white w3-animate-left" style="z-index:3;width:300px;" id="mySidebar"><br>
- <div class="w3-container">
- <a href="#" onclick="w3_close()" class="w3-hide-large w3-right w3-jumbo w3-padding w3-hover-grey" title="close menu">
- <i class="fa fa-remove"></i></a>
- <a href="http://qim.dk/">
- <img src="common/logo_name.png" style="width:90%;" class="w3-round"></a>
- <br><br>
- </div>
-
- <div class="w3-bar-block w3-text-grey">
- <a href="index.html" onclick="w3_close()" class="w3-bar-item w3-button w3-padding" class="w3-text-grey"><i class="fa fa-home fa-fw w3-margin-right"></i>HOME</a>
- </div>
- <div class="w3-bar-block w3-text-grey">
- <a href="about.html" onclick="w3_close()" class="w3-bar-item w3-button w3-padding" class="w3-text-grey"><i class="fa fa-info fa-fw w3-margin-right"></i>ABOUT</a>
- </div>
- <!--div class="w3-bar-block w3-text-grey">
- <a href="about.html" onclick="w3_close()" class="w3-bar-item w3-button w3-padding" class="w3-text-grey"><i class="fa fa-exclamation fa-fw w3-margin-right"></i>USE</a>
- </div-->
-</nav>
-
-<!-- Overlay effect when opening sidebar on small screens -->
-<div class="w3-overlay w3-hide-large w3-animate-opacity" onclick="w3_close()" style="cursor:pointer" title="close side menu" id="myOverlay"></div>
diff --git a/sidebar.js b/sidebar.js
new file mode 100644
index 0000000000000000000000000000000000000000..25c1d13e76e95c880df5dd9f154729368ec6c9ad
--- /dev/null
+++ b/sidebar.js
@@ -0,0 +1,29 @@
+document.write('\
+<nav class="w3-sidebar w3-collapse w3-white w3-animate-left" style="z-index:3;width:300px;" id="mySidebar"><br>\
+ <div class="w3-container">\
+ <a href="#" onclick="w3_close()" class="w3-hide-large w3-right w3-jumbo w3-padding w3-hover-grey" title="close menu">\
+ <i class="fa fa-remove"></i></a>\
+ <a href="http://qim.dk/">\
+ <img src="common/logo_name.png" style="width:90%;" class="w3-round"></a>\
+ <br><br>\
+ </div>\
+ <div class="w3-bar-block w3-text-grey">\
+ <a href="index.html" onclick="w3_close()" class="w3-bar-item w3-button w3-padding" class="w3-text-grey"><i class="fa fa-home fa-fw w3-margin-right"></i>HOME</a>\
+ </div>\
+ <div class="w3-bar-block w3-text-grey">\
+ <a href="about.html" onclick="w3_close()" class="w3-bar-item w3-button w3-padding" class="w3-text-grey"><i class="fa fa-info fa-fw w3-margin-right"></i>ABOUT</a>\
+ </div>\
+</nav>\
+<div class="w3-overlay w3-hide-large w3-animate-opacity" onclick="w3_close()" style="cursor:pointer" title="close side menu" id="myOverlay"></div>\
+');
+
+// Script to open and close sidebar
+function w3_open() {
+ document.getElementById("mySidebar").style.display = "block";
+ document.getElementById("myOverlay").style.display = "block";
+}
+
+function w3_close() {
+ document.getElementById("mySidebar").style.display = "none";
+ document.getElementById("myOverlay").style.display = "none";
+}
diff --git a/sidebar_functions.js b/sidebar_functions.js
deleted file mode 100644
index a0221880fad779df1f21c852cd341e55a31a7ef1..0000000000000000000000000000000000000000
--- a/sidebar_functions.js
+++ /dev/null
@@ -1,10 +0,0 @@
-// Script to open and close sidebar
-function w3_open() {
- document.getElementById("mySidebar").style.display = "block";
- document.getElementById("myOverlay").style.display = "block";
-};
-
-function w3_close() {
- document.getElementById("mySidebar").style.display = "none";
- document.getElementById("myOverlay").style.display = "none";
-};