diff --git a/js/headfootLogout.js b/js/headfootLogout.js
new file mode 100644
index 0000000000000000000000000000000000000000..3de579214613513c5927401173ee0ee46dd9a573
--- /dev/null
+++ b/js/headfootLogout.js
@@ -0,0 +1,241 @@
+var menu = [{'name':'Informationen', 'combos':[{'name':'Projekte', 'link':'/project'}, {'name':'Über das M4_LAB', 'link':'/projectoverview?projectID=1'}], 'type':'dropdown', 'link':'#'},{'name':'Zusammenarbeit', 'combos':[{'name':'Mailinglisten', 'link':'/mailinglists'},{'name':'Videokonferenzen', 'link':'/videoconference.html'},/* {'name':'...', 'link':'#'}*/], 'type':'dropdown', 'link':'#'},{'name':'Events', 'combos':[{'name':'Veranstaltungen der HfT', 'link':'http://www.hft-stuttgart.de/Aktuell/Veranstaltungen/'}/*,{'name':'...', 'link':'#'}*/], 'type':'dropdown', 'link':'#'},/*{'name':'Bürgerbeteiligung', 'combos':[{'name':'...', 'link':'#'}, {'name':'...', 'link':'#'}], 'type':'dropdown', 'link':'#'},*/{'name':'Logout', 'combos':[], 'type':'logoutbutton', 'link':'/logout'}];
+
+
+var hft_links = [{'url':'http://www.hft-stuttgart.de/Forschung/M4-Lab/Team/index.html/de', 'name':'Kontakt'},{'url':'http://www.hft-stuttgart.de/Hochschule/Impressum.html/de', 'name':'Impressum'},{'url':'http://www.hft-stuttgart.de/Einrichtungen/Datenschutz/Datenschutz-Homepage', 'name':'Datenschutz'}]
+
+var socialmedias = [{'url':'https://twitter.com/InnolabM4', 'name': 'fa-twitter'}, {'url':'https://www.facebook.com/HfTStuttgart/', 'name': 'fa-facebook-square'}, {'url':'https://www.instagram.com/m4_lab/', 'name': 'fa-instagram'}, {'url':'https://de.linkedin.com/school/hochschule-f%C3%BCr-technik-stuttgart-%E2%80%93-university-of-applied-sciences/', 'name': 'fa-linkedin'}, {'url':'https://www.youtube.com/channel/UCi0_JfF2qMZbOhOnNH5PyHA', 'name': 'fa-youtube'}];
+
+var footer_images = [/*{'src':'/images/demo/bbf_logo.png', 'alt':'BMBF'},*/ {'src':'/images/demo/Innovative_Hochschule_Initiative_BMBF_GWK_RGB.jpg', 'alt':'Innovative Hochschule'}]
+
+function prependChild(parent,child){
+ parent.insertBefore(child, parent.childNodes[0]);
+}
+
+function userAuthenticated(){
+ let params = new URLSearchParams(window.location.search);
+ if(params.get('isAuthenticatedUser')){
+ return true;
+ }else if(document.getElementById('loginswitch')){ //relikt login via OAuth
+ if(document.getElementById('loginswitch').getAttribute('authenticated') == '1'){
+ return true;
+ }
+ }else{
+ return false;
+ }
+}
+
+
+function readCookie(cname) {
+ var name = cname + "=";
+ var decodedCookie = decodeURIComponent(document.cookie);
+ var ca = decodedCookie.split(';');
+ for(var i = 0; i <ca.length; i++) {
+ var c = ca[i];
+ while (c.charAt(0) == ' ') {
+ c = c.substring(1);
+ }
+ if (c.indexOf(name) == 0) {
+ return c.substring(name.length, c.length);
+ }
+ }
+ return "";
+}
+
+function sendRequest(URL){
+ console.log(document.cookie);
+ let xhr = new XMLHttpRequest();
+ xhr.open("POST", URL, true);
+ let token = readCookie("XSRF-TOKEN");
+ //Send the proper header information along with the request
+ xhr.setRequestHeader('X-CSRF-TOKEN', token);
+ xhr.send();
+}
+
+
+/* function head()
+ * creates header and prepends it to the documents body
+ */
+
+function head(){
+ let headerdiv = document.createElement('div');
+ let alertdiv = document.createElement('div');
+ headerdiv.classList.add("wrapper","row1");
+ let navheader = document.createElement('header');
+ navheader.id = "header";
+ navheader.classList.add("clear");
+ let alertbutton = document.createElement('button');
+ alertbutton.type = "button";
+ alertbutton.classList.add("close");
+ alertbutton.setAttribute("data-dismiss", "alert");
+ alertbutton.innerHTML = "×";
+ alertdiv.innerHTML="<strong>Disclaimer</strong> This website is under construction and in prototype-phase. It is not for public use."
+ prependChild(alertdiv, alertbutton);
+ alertdiv.classList.add('alert','alert-danger', 'alert-dismissible', 'fade','show');
+ alertdiv.style = "text-align:center;";
+ navheader.appendChild(alertdiv);
+ let navbar = document.createElement('nav');
+ navbar.classList.add("navbar", "navbar-default");
+ let fluiddiv = document.createElement('div');
+ fluiddiv.classList.add("container-fluid");
+ let navbardiv = document.createElement('div');
+ navbardiv.classList.add("navbar-header");
+ let navelements = document.createElement('ul');
+ navelements.id="navelemente";
+ let logos = document.createElement('li');
+ let link_m4lab = document.createElement('a');
+ link_m4lab.href = "/";
+ link_m4lab.innerHTML = "<img src='/images/demo/m4lab_logo.jpg' alt='Logo Innovationslabor M4_LAB'>";
+ logos.appendChild(link_m4lab);
+ navelements.appendChild(logos);
+ for(let j = 0; j<menu.length; j++){
+ let headitem = document.createElement('li');
+ let itemtype = menu[j].type;
+ headitem.classList.add("nav-item")
+ let headlink = document.createElement('a');
+ headlink.href=menu[j].link;
+ headlink.id="navbarDropdown" + j;
+ headlink.classList.add('nav-link');
+ headlink.setAttribute("role", "button");
+ if(itemtype=='dropdown'){
+ headitem.classList.add("dropdown");
+ headlink.classList.add('dropdown-toggle');
+ headlink.setAttribute("data-toggle", "dropdown");
+ headlink.setAttribute("aria-haspopup", "true");
+ headlink.setAttribute("aria-expanded", "false");
+ }
+ headlink.innerHTML=menu[j].name;
+ if(itemtype=='dropdown'){
+ let combodiv = document.createElement('div');
+ combodiv.id=headlink.id+"_par";
+ combodiv.setAttribute("aria-labelledby",headlink.id);
+ combodiv.classList.add("dropdown-menu");
+ for(let k = 0; k< menu[j].combos.length; k++){
+ let combolink = document.createElement('a');
+ combolink.classList.add("dropdown-item");
+ if(userAuthenticated() || typeof user !== 'undefined'){ //either logged in the old way or logged in using SAML
+ if(menu[j].combos[k].link.includes('?')){
+ combolink.href = menu[j].combos[k].link + "&isAuthenticatedUser=true";
+ }else{
+ combolink.href = menu[j].combos[k].link + "?isAuthenticatedUser=true";
+ }
+ }else{
+ combolink.href = menu[j].combos[k].link;
+ }
+ combolink.innerHTML = menu[j].combos[k].name;
+ combodiv.appendChild(combolink);
+ }
+ headitem.appendChild(combodiv);
+ }else if(itemtype=='logoutbutton'){
+ /* if(userAuthenticated()){
+ headlink.innerHTML="Account";
+ headlink.href="/account/";
+ } */
+ headlink.innerHTML="Logout";
+ headlink.href="/logout";
+ headlink.classList.remove("nav-link");
+ headlink.classList.add("btn");
+ headlink.classList.add("btn-outline-danger");
+ }
+ headitem.appendChild(headlink);
+ navelements.appendChild(headitem);
+ }
+/* let searchitem = document.createElement('li');
+ searchitem.classList.add("nav-item");
+ let searchinput = document.createElement('input');
+ searchinput.value='Suche...'
+ searchinput.type="text";
+ searchinput.classList.add("nav-item-suchfeld");
+ searchinput.setAttribute('onFocus', "this.value=(this.value=='search...')? '' : this.value");
+ searchitem.appendChild(searchinput);
+ let magnifier = document.createElement('input');
+ magnifier.type="image"
+ magnifier.src="/images/Lupe_grau.png";
+ magnifier.width="25";
+ magnifier.height="25";
+ magnifier.alt="";
+ magnifier.id="sf_submit";
+ magnifier.value="search";
+ searchitem.appendChild(magnifier);
+ navelements.appendChild(searchitem);*/
+ navbardiv.appendChild(navelements);
+ fluiddiv.appendChild(navbardiv);
+ navbar.appendChild(fluiddiv);
+ navheader.appendChild(navbar);
+ headerdiv.appendChild(navheader);
+ prependChild(document.body, headerdiv);
+};
+
+/* function foot()
+ * creates footer and appends it to the documents body
+ */
+
+function foot(){
+ let footerdiv = document.createElement('div');
+ footerdiv.id="homepage";
+ footerdiv.classList.add("last", "clear");
+ footerdiv.innerHTML = "<hr>";
+ let containerdiv = document.createElement('div');
+ containerdiv.classList.add('flex-container');
+ let hftlink = document.createElement('a');
+ hftlink.classList.add("col-md-3");
+ hftlink.setAttribute('style','flex-basis: 400px;');
+ hftlink.href="https://www.hft-stuttgart.de";
+ let hftimage = document.createElement('img');
+ hftimage.src="/images/demo/hft_logo.jpg";
+ hftimage.alt="Logo der Hochschule für Technik Stuttgart";
+ hftimage.height= '75';
+ hftlink.appendChild(hftimage);
+ containerdiv.appendChild(hftlink);
+ let contactdiv = document.createElement('div');
+ contactdiv.classList.add("col-md-3", "footer-unten")
+ contactdiv.setAttribute('style',"flex-basis:400px");
+ contactdiv.innerHTML="Hochschule für Technik Stuttgart";
+ let rowdiv = document.createElement('div');
+ rowdiv.classList.add("row");
+ for(let i = 0; i<hft_links.length; i++){
+ let coldiv = document.createElement('div');
+ coldiv.classList.add("contactrow", "footer-unten");
+ let collink = document.createElement('a');
+ collink.innerHTML = hft_links[i].name;
+ collink.classList.add("contact-lower")
+ collink.href = hft_links[i].url;
+ coldiv.appendChild(collink)
+ rowdiv.appendChild(coldiv);
+ }
+ contactdiv.appendChild(rowdiv);
+ containerdiv.appendChild(contactdiv);
+ let socialdiv = document.createElement('div');
+ socialdiv.classList.add("col-md-3");
+ socialdiv.setAttribute('style','flex-basis: 400px;');
+ let socialrow = document.createElement('div');
+ socialrow.id="socialmediabuttons";
+ for(let j = 0; j< socialmedias.length; j++){
+ let sociallink = document.createElement('a');
+ sociallink.href = socialmedias[j].url;
+ let socialcontent = document.createElement('i');
+ socialcontent.classList.add("fab", socialmedias[j].name);
+ sociallink.appendChild(socialcontent);
+ socialrow.appendChild(sociallink);
+ socialrow.innerHTML+=" ";
+ }
+ socialdiv.appendChild(socialrow);
+ containerdiv.appendChild(socialdiv);
+ let imagediv = document.createElement('div');
+ imagediv.classList.add("col-md-3");
+ imagediv.setAttribute("style", "flex-basis:400px;");
+ for (let k = 0; k< footer_images.length; k++){
+ let image = document.createElement('img');
+ image.src = footer_images[k].src;
+ image.width="300";
+ image.height= "73";
+ image.alt = footer_images[k].alt;
+ imagediv.appendChild(image);
+ }
+ containerdiv.appendChild(imagediv);
+ footerdiv.appendChild(containerdiv);
+ document.body.appendChild(footerdiv);
+};
+
+
+head();
+foot();
\ No newline at end of file