headfoot.js 11.6 KB
Newer Older
Athanasios's avatar
Athanasios committed
1
var menu = [{'name':'Informationen', 'combos':[{'name':'Über das M4_LAB', 'link':'/projectoverview?projectID=1'},{'name':'Kontakt', 'link':'/account/contact'}], 'type':'dropdown', 'link':'#'},{'name':'Projekte', 'combos':[{'name':'Projektinformationen', 'link':'/projektinformationen'},{'name':'Projektcode und -daten', 'link':'/projektdaten'},{'name':'High-Performance Computing', 'link':'/info_hpc.html'}], 'type':'dropdown', 'link':'#'},{'name':'Zusammenarbeit', 'combos':[{'name':'Mailinglisten', 'link':'/mailinglists'},{'name':'Videokonferenzen', 'link':'/videoconference.html'},{'name':'Wissensaustausch', 'link':'/confluence.html'},{'name':'Aufgabenmanagement', 'link':'/jira.html'},{'name':'Dateibearbeitung', 'link':'/bwcloud.html'}], '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':'Beteiligungsplattform', 'combos':[{'name':'Informationen', 'link':'/info_partizipation.html'},{'name':'Zum M4_Lab Showcase', 'link':'/partizipation/'}], 'type':'dropdown', 'link':'#'},{'name':'<i class="fa fa-question-circle" aria-hidden="true"></i>', 'combos': [], 'type':'', 'link':'/help/'},{'name':'<i class="fa fa-user-circle" aria-hidden="true"></i>', 'combos': [], 'type':'', 'link':'/account/'}];
2
3


Varun Srivastava's avatar
Varun Srivastava committed
4
var 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'}]
5

Wolfgang Knopki's avatar
Wolfgang Knopki committed
6
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'}];
7

Wolfgang Knopki's avatar
Wolfgang Knopki committed
8
var footer_images = [/*{'src':'/images/demo/bbf_logo.png', 'alt':'BMBF'},*/ {'src':'/images/demo/Innovative_Hochschule_Initiative_BMBF_GWK_RGB.jpg', 'alt':'Innovative Hochschule'}]
9
10
11
12
13

function prependChild(parent,child){
    parent.insertBefore(child, parent.childNodes[0]);
}

Wolfgang Knopki's avatar
Wolfgang Knopki committed
14

Wolfgang Knopki's avatar
Wolfgang Knopki committed
15
16
17
18
19
20
21
22
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);
Wolfgang Knopki's avatar
Wolfgang Knopki committed
23
    }
Wolfgang Knopki's avatar
Wolfgang Knopki committed
24
25
26
27
28
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
    }
  }
  return "";
Wolfgang Knopki's avatar
Wolfgang Knopki committed
29
30
}

Wolfgang Knopki's avatar
Wolfgang Knopki committed
31
function sendRequest(URL){
Wolfgang Knopki's avatar
Wolfgang Knopki committed
32
    console.log(document.cookie);
Wolfgang Knopki's avatar
Wolfgang Knopki committed
33
34
    let xhr = new XMLHttpRequest();
    xhr.open("POST", URL, true);
Wolfgang Knopki's avatar
Wolfgang Knopki committed
35
    let token = readCookie("XSRF-TOKEN");
Wolfgang Knopki's avatar
Wolfgang Knopki committed
36
37
38
39
40
41
    //Send the proper header information along with the request
    xhr.setRequestHeader('X-CSRF-TOKEN', token);
    xhr.send();
}


42
43
44
45
/* function head()
 * creates header and prepends it to the documents body
 */

Rosanny Sihombing's avatar
Rosanny Sihombing committed
46
47
function head() {
    let navheader = document.createElement("header");
48
49
    navheader.id = "header";
    navheader.classList.add("clear");
Rosanny Sihombing's avatar
Rosanny Sihombing committed
50
51
52
53
54
55
56

    // 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");
57
58
59
60
61
    alertbutton.type = "button";
    alertbutton.classList.add("close");
    alertbutton.setAttribute("data-dismiss", "alert");
    alertbutton.innerHTML = "&times;";
    prependChild(alertdiv, alertbutton);
62

Rosanny Sihombing's avatar
Rosanny Sihombing committed
63
64
65
66
    // navigation header
    let navbar = document.createElement("nav");
    navbar.classList.add("navbar", "navbar-expand-md", "navbar-light");
    navbar.style = "background-color: #ffffff;";
67
68
69
70
71
72

    let navbarcontainer = document.createElement("div");
    navbarcontainer.classList.add("container");

    let navbarheader = document.createElement("div");
    navbarheader.classList.add("navbar-header");
Rosanny Sihombing's avatar
Rosanny Sihombing committed
73
    // navigation header - logo
74
    let link_m4lab = document.createElement('a');
75
    link_m4lab.href = "/";
Rosanny Sihombing's avatar
Rosanny Sihombing committed
76
    link_m4lab.classList.add("navbar-brand");
77
    link_m4lab.innerHTML = "<img src='/img/header/Logozeile_Header.png' alt='Logo Innovationslabor M4_LAB'>";
78
    navbarheader.appendChild(link_m4lab);
Rosanny Sihombing's avatar
Rosanny Sihombing committed
79
80
81
82
83
84
85
86
87
88
    // 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>";
89
    // nav menu
Rosanny Sihombing's avatar
Rosanny Sihombing committed
90
    let navelements = document.createElement('ul');
91
92
    navelements.id="navbarCollapse";
    navelements.classList.add("collapse", "nav", "navbar-collapse", "navbar-nav", "justify-content-end");
93
94
95
96
97
98
99
100
101
    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");
102
103
104
        if(menu[j].link =="/help/"){ // if help open in new tab
            headlink.setAttribute("target", "_blank");
        }
105
106
107
108
109
110
111
112
113
114
        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');
115
            combodiv.id=headlink.id+"_par";
116
117
118
119
120
            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");
Wolfgang Knopki's avatar
Wolfgang Knopki committed
121
                combolink.href = menu[j].combos[k].link;
122
123
124
                combolink.innerHTML = menu[j].combos[k].name;
                combodiv.appendChild(combolink);
            }
125
            headitem.appendChild(combodiv);
126
        }
Rosanny Sihombing's avatar
Rosanny Sihombing committed
127
        prependChild(headitem, headlink)
128
129
        navelements.appendChild(headitem);
    }
Rosanny Sihombing's avatar
Rosanny Sihombing committed
130

131
132
133
134
    navbarcontainer.appendChild(navbarheader);
    navbarcontainer.appendChild(togglebutton);
    navbarcontainer.appendChild(navelements);
    navbar.appendChild(navbarcontainer)
Rosanny Sihombing's avatar
Rosanny Sihombing committed
135
136

    navheader.appendChild(alertdiv);
137
    navheader.appendChild(navbar);
Rosanny Sihombing's avatar
Rosanny Sihombing committed
138
139
    prependChild(document.body, navheader);
}
140
141
142
143
144

/* function foot()
 * creates footer and appends it to the documents body
 */

145
function foot() {
Rosanny Sihombing's avatar
Rosanny Sihombing committed
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
    // add styles to <head> to manage sticky footer
    var 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;
            }
        }
    `
    var styleSheet = document.createElement("style")
    styleSheet.type = "text/css"
    styleSheet.innerText = styles
    document.head.appendChild(styleSheet)
    
169
170
171
172
    let footerdiv = document.createElement('div');
    footerdiv.id="homepage";
    footerdiv.innerHTML = "<hr>";
    let containerdiv = document.createElement('div');
173
    containerdiv.classList.add('container');
Rosanny Sihombing's avatar
Rosanny Sihombing committed
174
175
    let containerdivrow = document.createElement('div');
    containerdivrow.classList.add('row');
176
177
178
179

    //bmbf
    let bmbf = document.createElement('div');
    bmbf.classList.add("col-md-auto");
Varun Srivastava's avatar
Varun Srivastava committed
180
    bmbf.innerHTML = "<img src='/img/footer/Innovative_Hochschule_Initiative_BMBF_GWK_RGB.png' alt='Innovative Hochschule' height='90'/>"
181
182
183
    //m4labgrau
    let m4labgrau = document.createElement('div');
    m4labgrau.classList.add("col-md-auto");
Varun Srivastava's avatar
Varun Srivastava committed
184
    m4labgrau.innerHTML = "<img src='/img/footer/M4_LAB_LOGO_Graustufen.png' alt='M4_LAB' height='80' />"
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
    // socmed
    let socialdiv = document.createElement('div');
    socialdiv.classList.add("col-md-auto");
    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+="&nbsp;";
    }
    socialdiv.appendChild(socialrow);
    // contact
201
    let contactdiv = document.createElement('div');
202
    contactdiv.classList.add("col-md-auto", "footer-unten")
203
204
205
206
207
    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');
Wolfgang Knopki's avatar
Wolfgang Knopki committed
208
        coldiv.classList.add("contactrow", "footer-unten");
209
210
        let collink = document.createElement('a');
        collink.innerHTML = hft_links[i].name;
Wolfgang Knopki's avatar
Wolfgang Knopki committed
211
        collink.classList.add("contact-lower")
212
213
214
215
216
        collink.href = hft_links[i].url;
        coldiv.appendChild(collink)
        rowdiv.appendChild(coldiv);
    }
    contactdiv.appendChild(rowdiv);
217
218
219

    containerdivrow.appendChild(bmbf);
    containerdivrow.appendChild(m4labgrau);
Rosanny Sihombing's avatar
Rosanny Sihombing committed
220
    containerdivrow.appendChild(socialdiv);
221
    containerdivrow.appendChild(contactdiv);
222
    
Rosanny Sihombing's avatar
Rosanny Sihombing committed
223
    containerdiv.appendChild(containerdivrow);
224
    footerdiv.appendChild(containerdiv);
225
226
227
    
    // cookiebanner
    let cookiediv = document.createElement("div");
228
    cookiediv.classList.add("alert", "alert-info", "alert-dismissible", "hidden", "cookie-banner" );
229
230
231
232
233
234
235
236
237
238
239
240
    cookiediv.style = "text-align:center;";
    cookiediv.id="cookiediv";
    cookiediv.innerHTML="<strong>Cookie-Benachrichtigung</strong><br/> Diese Webseite nutzt technisch notwendige Session-Cookies und gegebenenfalls Cookies zur Authentifizierung. Mit der Benutzung der Webseite erklären Sie sich damit einverstanden. <br/> Weitere Informationen finden Sie in unserer <a href='https://www.hft-stuttgart.de/datenschutz'> Datenschutzerklärung </a>"
    let cookiebutton = document.createElement("button");
    cookiebutton.type = "button";
    cookiebutton.classList.add("close");
    cookiebutton.setAttribute("data-dismiss", "alert");
    cookiebutton.innerHTML = "&times;";
    prependChild(cookiediv, cookiebutton);

    footerdiv.appendChild(cookiediv);
    
241
    document.body.appendChild(footerdiv);
242
}
243

244
245
function setCookieSeen(){
    if (localStorage.getItem("cookieSeen") != "shown") {
246
        document.getElementById("cookiediv").classList.remove("hidden");
247
248
249
250
251
        document.getElementById("cookiediv").classList.add("show");
        localStorage.setItem("cookieSeen","shown")
    };
}

252
253
head();
foot();
254
setCookieSeen();