Skip to content

GitLab

Commit 2598cda0 authored by Rosanny Sihombing's avatar Rosanny Sihombing
Browse files

MLAB-205

parent aacee851
Hide whitespace changes
Inline Side-by-side
js/headfoot.js
View file @ 2598cda0
......@@ -43,37 +43,51 @@ function sendRequest(URL){
* 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');
function head() {
let navheader = document.createElement("header");
navheader.id = "header";
navheader.classList.add("clear");
let alertbutton = document.createElement('button');
// disclaimer
let alertdiv = document.createElement("div");
alertdiv.classList.add("alert", "alert-danger", "alert-dismissible", "fade", "show");
alertdiv.style = "text-align:center;";
alertdiv.innerHTML="<strong>Disclaimer</strong> This website is under construction and in prototype-phase. It is not for public use."
let alertbutton = document.createElement("button");
alertbutton.type = "button";
alertbutton.classList.add("close");
alertbutton.setAttribute("data-dismiss", "alert");
alertbutton.innerHTML = "&times;";
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');
// navigation header
let navbar = document.createElement("nav");
navbar.classList.add("navbar", "navbar-expand-md", "navbar-light");
navbar.style = "background-color: #ffffff;";
let fluiddiv = document.createElement("div");
fluiddiv.classList.add("container-fluid", "navbar-header");
// navigation header - logo
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);
link_m4lab.classList.add("navbar-brand");
link_m4lab.innerHTML = "<img src='images/demo/m4lab_logo.jpg' alt='Logo Innovationslabor M4_LAB'>";
// navigation header - toggle button menu for mobile devices
let togglebutton = document.createElement('button');
togglebutton.classList.add("navbar-toggler")
togglebutton.type = "button";
togglebutton.setAttribute("data-toggle", "collapse");
togglebutton.setAttribute("data-target", "#navbarCollapse");
togglebutton.setAttribute("aria-controls", "navbarCollapse");
togglebutton.setAttribute("aria-expanded", "false");
togglebutton.setAttribute("aria-label", "Toggle navigation");
togglebutton.innerHTML = "<span class='navbar-toggler-icon'></span>";
// navigation header - menu
let navbardiv = document.createElement("div");
navbardiv.classList.add("collapse", "navbar-collapse");
navbardiv.id = "navbarCollapse"
let navelements = document.createElement('ul');
navelements.id="navelemente";
navelements.classList.add("navbar-nav", "mr-auto");
for(let j = 0; j<menu.length; j++){
let headitem = document.createElement('li');
let itemtype = menu[j].type;
......@@ -105,34 +119,20 @@ function head(){
}
headitem.appendChild(combodiv);
}
headitem.appendChild(headlink);
prependChild(headitem, 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(link_m4lab);
fluiddiv.appendChild(togglebutton);
fluiddiv.appendChild(navbardiv);
navbar.appendChild(fluiddiv);
navheader.appendChild(alertdiv);
navheader.appendChild(navbar);
headerdiv.appendChild(navheader);
prependChild(document.body, headerdiv);
};
prependChild(document.body, navheader);
}
/* function foot()
* creates footer and appends it to the documents body
......@@ -144,20 +144,20 @@ function foot(){
footerdiv.classList.add("last", "clear");
footerdiv.innerHTML = "<hr>";
let containerdiv = document.createElement('div');
containerdiv.classList.add('flex-container');
containerdiv.classList.add('container-fluid');
let containerdivrow = document.createElement('div');
containerdivrow.classList.add('row');
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.src="images/demo/hft_logo.jpg";
hftimage.alt="Logo der Hochschule für Technik Stuttgart";
hftimage.height= '75';
hftlink.appendChild(hftimage);
containerdiv.appendChild(hftlink);
containerdivrow.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");
......@@ -172,10 +172,9 @@ function foot(){
rowdiv.appendChild(coldiv);
}
contactdiv.appendChild(rowdiv);
containerdiv.appendChild(contactdiv);
containerdivrow.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++){
......@@ -188,10 +187,9 @@ function foot(){
socialrow.innerHTML+="&nbsp;";
}
socialdiv.appendChild(socialrow);
containerdiv.appendChild(socialdiv);
containerdivrow.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;
......@@ -200,7 +198,8 @@ function foot(){
image.alt = footer_images[k].alt;
imagediv.appendChild(image);
}
containerdiv.appendChild(imagediv);
containerdivrow.appendChild(imagediv);
containerdiv.appendChild(containerdivrow);
footerdiv.appendChild(containerdiv);
document.body.appendChild(footerdiv);
};
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Dies ist die Gitlab-Instanz des Transferportals der Hochschule für Technik Stuttgart. Hier geht es zurück zum Portal