An error occurred while loading the file. Please try again.
headfoot.js 9.17 KiB
const menu = [{ name: 'Informationen', combos: [{ name: 'Projekte', link: '/project' }, { name: 'Über das M4_LAB', link: '/projectoverview?projectID=1' }, { name: 'Kontakt', link: '/account/contact' }], 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: 'Veranstaltungen der HfT Forschung', link: 'https://www.hft-stuttgart.de/forschung/veranstaltungen' }], type: 'dropdown', link: '#' }, { name: 'Benutzerkonto', combos: [], type: '', link: '/account/' }]
const hft_links = [{ url: '/account/contact', name: 'Kontakt' }, { url: 'https://www.hft-stuttgart.de/impressum', name: 'Impressum' }, { url: 'https://www.hft-stuttgart.de/datenschutz', name: 'Datenschutz' }]
const 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' }]
const footer_images = [{ src: '/images/demo/Innovative_Hochschule_Initiative_BMBF_GWK_RGB.jpg', alt: 'Innovative Hochschule' }]
function prependChild (parent, child) {
  parent.insertBefore(child, parent.childNodes[0])
function readCookie (cname) {
  const name = cname + '='
  const decodedCookie = decodeURIComponent(document.cookie)
  const ca = decodedCookie.split(';')
  for (let i = 0; i < ca.length; i++) {
    let 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)
  const xhr = new XMLHttpRequest()
  xhr.open('POST', URL, true)
  const 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 () {
  const navheader = document.createElement('header')
  navheader.id = 'header'
  navheader.classList.add('clear')
  // disclaimer
  const 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.'
  const alertbutton = document.createElement('button')
  alertbutton.type = 'button'
  alertbutton.classList.add('close')
  alertbutton.setAttribute('data-dismiss', 'alert')
  alertbutton.innerHTML = '&times;'
  prependChild(alertdiv, alertbutton)
  // navigation header
  const navbar = document.createElement('nav')
  navbar.classList.add('navbar', 'navbar-expand-md', 'navbar-light')
  navbar.style = 'background-color: #ffffff;'
  const navbarcontainer = document.createElement('div')
  navbarcontainer.classList.add('container')
  const navbarheader = document.createElement('div')
  navbarheader.classList.add('navbar-header')
  // navigation header - logo
const link_m4lab = document.createElement('a') link_m4lab.href = '/' link_m4lab.classList.add('navbar-brand') link_m4lab.innerHTML = "<img src='/img/header/Logozeile_Header.png' alt='Logo Innovationslabor M4_LAB'>" navbarheader.appendChild(link_m4lab) // navigation header - toggle button menu for mobile devices const 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>" // nav menu const navelements = document.createElement('ul') navelements.id = 'navbarCollapse' navelements.classList.add('collapse', 'nav', 'navbar-collapse', 'navbar-nav', 'justify-content-end') for (let j = 0; j < menu.length; j++) { const headitem = document.createElement('li') const itemtype = menu[j].type headitem.classList.add('nav-item') const 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') { const 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++) { const combolink = document.createElement('a') combolink.classList.add('dropdown-item') combolink.href = menu[j].combos[k].link combolink.innerHTML = menu[j].combos[k].name combodiv.appendChild(combolink) } headitem.appendChild(combodiv) } prependChild(headitem, headlink) navelements.appendChild(headitem) } navbarcontainer.appendChild(navbarheader) navbarcontainer.appendChild(togglebutton) navbarcontainer.appendChild(navelements) navbar.appendChild(navbarcontainer) navheader.appendChild(alertdiv) navheader.appendChild(navbar) prependChild(document.body, navheader) } /* function foot() * creates footer and appends it to the documents body */ function foot () { // add styles to <head> to manage sticky footer
const styles = ` @media only screen and (min-width: 768px) { html { position: relative; min-height: 100%; } body { margin-bottom: 120px; /* Margin bottom by footer height */ } #homepage { position: absolute; bottom: 0; width: 100%; text-align: center; } } ` const styleSheet = document.createElement('style') styleSheet.type = 'text/css' styleSheet.innerText = styles document.head.appendChild(styleSheet) const footerdiv = document.createElement('div') footerdiv.id = 'homepage' // footerdiv.classList.add("last", "clear"); footerdiv.innerHTML = '<hr>' const containerdiv = document.createElement('div') containerdiv.classList.add('container') const containerdivrow = document.createElement('div') containerdivrow.classList.add('row') // bmbf const bmbf = document.createElement('div') bmbf.classList.add('col-md-auto') bmbf.innerHTML = "<img src='/img/footer/Innovative_Hochschule_Initiative_BMBF_GWK_RGB.png' alt='Innovative Hochschule' style='height:90px'/>" // m4labgrau const m4labgrau = document.createElement('div') m4labgrau.classList.add('col-md-auto') m4labgrau.innerHTML = "<img src='/img/footer/M4_LAB_LOGO_Graustufen.png' alt='M4_LAB' style='height:80px'/>" // socmed const socialdiv = document.createElement('div') socialdiv.classList.add('col-md-auto') const socialrow = document.createElement('div') socialrow.id = 'socialmediabuttons' for (let j = 0; j < socialmedias.length; j++) { const sociallink = document.createElement('a') sociallink.href = socialmedias[j].url const socialcontent = document.createElement('i') socialcontent.classList.add('fab', socialmedias[j].name) sociallink.appendChild(socialcontent) socialrow.appendChild(sociallink) socialrow.innerHTML += '&nbsp;' } socialdiv.appendChild(socialrow) // contact const contactdiv = document.createElement('div') contactdiv.classList.add('col-md-auto', 'footer-unten') contactdiv.innerHTML = 'Hochschule für Technik Stuttgart' const rowdiv = document.createElement('div') rowdiv.classList.add('row') for (let i = 0; i < hft_links.length; i++) { const coldiv = document.createElement('div') coldiv.classList.add('contactrow', 'footer-unten') const 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) containerdivrow.appendChild(bmbf) containerdivrow.appendChild(m4labgrau) containerdivrow.appendChild(socialdiv) containerdivrow.appendChild(contactdiv) containerdiv.appendChild(containerdivrow) footerdiv.appendChild(containerdiv) document.body.appendChild(footerdiv) } head() foot()