https://www.samenspender-gesucht.de/datenschutz.js

1/** --------------------------------------------------------------------------------
2 * Scriptname:  HM-CookieHinweise
3 * Description: Ein Script für die Ein- und Ausblendung von Cookie-Hinweisen.
4 * Autor:       Horst Mueller
5 * Autor URI:   http://www.coder-welten.com/
6 * Version:     1.03 Release Candidate
7 * Datum:       18. August 2015
8 * Lizenz:      GNU General Public License v2 oder hoeher
9 * Lizenz URI:  http://www.gnu.org/licenses/gpl-2.0.html
10 * Copyright:   © 2006/2015 - Verlag Horst Mueller - Stendal
11 * ---------------------------------------------------------------------------------
12 */
13"use strict";
14/*----------------------------------------------------------------------------------
15 * Globale Variablen, wobei nur die Zeit bis zur verkleinerten Ausblendung
16 * gegebenenfalls angepasst werden sollte und die Einstellung, ob die verkleinerte
17 * Darstellung als seitlicher Tab "Fahne" oder als größerer "Button" eingeblendet
18 * werden soll.
19 * ---------------------------------------------------------------------------------
20 */
21var hm_oldbrowser = false;
22var hm_auswahlein = "Fahne"; // Auswahl für verkleinerte Darstellung
23var hm_ausblenden = 60000;   // Ausblenden in 60000 Millisekunde o. nach Einstellung
24/*----------------------------------------------------------------------------------
25 * Funktionen nur aufrufen und Hinweise nur einblenden, falls der Browser nicht
26 * false für die Annahme von Cookies übermittelt.
27 * ---------------------------------------------------------------------------------
28 */
29if (navigator.cookieEnabled != false) {
30    if (window.addEventListener) {
31        window.addEventListener("load", blendeHinweiseEin, false);
32    }
33    else if (window.attachEvent) {
34        window.attachEvent("onload", blendeHinweiseEin);
35        hm_oldbrowser = true;
36    }
37}
38function blendeHinweiseEin() {
39    var pruefeTag = /hinweise=einenTag/;
40    var pruefeMon = /hinweise=einenMon/;
41    // Die CSS Styles
42    var elstyle = "width:82%;"                +
43                  "max-width:600px;"          +
44                  "font-family:Verdana;"      +
45                  "font-size:14px;"           +
46                  "color: #blue;"           +
47                  "font-style:italic;"        +
48                  "line-height:normal;"       +
49                  "background-color:#f2e5b0;" +
50                  "border:2px solid #98671a;" +
51                  "border-radius:12px;"       +
52                  "padding:12px;"             +
53                  "position:fixed;"           +
54                  "right:10px;"               +
55                  "z-index:1000;"             +
56                  "display:block;"            +
57                  "box-shadow:0px 4px 6px #d3b7a9;";
58
59    // Prüfe ob noch kein Cookie mit Namen "hinweise" für einen Tag oder Monat vorhanden ist.
60    if (pruefeTag.test(document.cookie) != true && pruefeMon.test(document.cookie) != true) {
61        // Hier ist eine Beräumung bei Wiedereinblendung erforderlich
62        helfeBeraeumen();
63        /*--------------------------------------------------------------------------
64         * Erzeugung des DIV-Bereiches für die Einblendung. Die CSS-Eigenschaften
65         * sowie Texte können angepasst werden, die URLs müssen angepasst werden.
66         * -------------------------------------------------------------------------
67         */
68        var element = document.createElement("div");
69        var hinweis = document.createTextNode("Unsere Website " +
70                                              "verwendet Cookies: ");
71        var lkstyle = "text-decoration:none;" +
72                      "font-family:Verdana;"  +
73                      "font-size:14px;"       +
74                      "font-weight:bold;"     +
75                      "color:#98671a";
76
77        element.setAttribute("id", "hinweise");
78
79        var einlink = document.createElement("a");
80        einlink.setAttribute("href", "http://www.frank-karau.de/");
81        einlink.setAttribute("target", "_blank");
82        einlink.style.cssText = lkstyle;
83        //einlink.appendChild(document.createTextNode(" » Weitere Infos « "));

84
85        var umbruch = document.createElement("br");
86        var einoder = document.createTextNode("Mit der Nutzung unserer " +
87        "Website erklären Sie sich mit dem Setzen von Cookies einverstanden. ");
88
89        var einbutton = document.createElement("button");
90        einbutton.setAttribute("id", "klickmich");
91        einbutton.appendChild(document.createTextNode("OK"));
92
93        // Abfrage ob addEventListener oder attachEvent für IE kleiner 9
94        if (hm_oldbrowser  == false) {
95            einbutton.addEventListener("click", blendeMonatsHinweiseAus, false);
96        }
97        else if (hm_oldbrowser == true) {
98            einbutton.attachEvent("onclick", blendeMonatsHinweiseAus);
99        }
100        einbutton.style.cssText = "font-style:normal;"        +
101                                  "color:#5d402f;"            +
102                                  "border:2px solid #c0c0c0;" +
103                                  "border-radius:3px;"        +
104                                  "margin-top:2px;"           +
105                                  "padding-top:0px;"          +
106                                  "padding-bottom:0px;"       +
107                                  "vertical-align:-3px;"      +
108                                  "cursor:pointer;";
109
110        element.appendChild(hinweis);
111        element.appendChild(einlink);
112        element.appendChild(umbruch);
113        element.appendChild(einoder);
114        element.appendChild(einbutton);
115
116        element.style.cssText = elstyle;
117        document.body.appendChild(element);
118        // Ausblendung nach 60 Sekunden oder je nach Einstellung
119        window.setTimeout(blendeTagesHinweiseAus, hm_ausblenden);
120        /*--------------------------------------------------------------------------
121         * Benötigte Funktionen nur aufrufen wenn die Hinweise eingeblendet sind, da
122         * ansonsten kein Element mit der ID hinweise oder mit der ID klickmich
123         * vorhanden ist. Das gildet auch für den Else-Zweig.
124         * -------------------------------------------------------------------------
125         */
126        ueberwacheButton("starten");
127        ueberwacheScreen("cookie_nein");
128    }
129    else if (pruefeTag.test(document.cookie) == true) {
130        // Für kleinen DIV-Bereich als seitliche Fahne oder Button
131        var element = document.createElement("div");
132        element.setAttribute("id", "hinweise");
133        element.style.cssText = elstyle;
134        document.body.appendChild(element);
135
136        // Benötigte Funktionen aufrufen und Auswertung von Cookie-Test übergeben
137        ueberwacheButton("beenden");
138        blendeTagesHinweiseAus();
139        ueberwacheScreen("cookie_tag");
140    }
141}
142// Verändert bei Hover das Aussehen des Buttons
143function ueberwacheButton(was) {
144    var ok_button;
145
146    if (document.getElementById("klickmich") && was == "starten") {
147        ok_button = document.getElementById("klickmich");
148        // Starte Überwachung addEventListener
149        if (hm_oldbrowser  == false) {
150            ok_button.addEventListener("mouseover", schwebeStellung, false);
151            ok_button.addEventListener("mouseout", normalStellung,  false);
152        }
153        else if (hm_oldbrowser == true) {
154            ok_button.attachEvent("onmouseover", schwebeStellung);
155            ok_button.attachEvent("onmouseout", normalStellung);
156        }
157    }
158    else if (document.getElementById("klickmich") && was == "beenden") {
159        ok_button = document.getElementById("klickmich");
160        // Beende Überwachung addEventListener
161        if (hm_oldbrowser  == false) {
162            ok_button.removeEventListener("mouseover", schwebeStellung, false);
163            ok_button.removeEventListener("mouseout", normalStellung,  false);
164        }
165        // Beende Überwachung attachEvent
166        else if (hm_oldbrowser == true) {
167            ok_button.detachEvent("onmouseover", schwebeStellung);
168            ok_button.detachEvent("onmouseout", normalStellung);
169        }
170    }
171    function schwebeStellung() {
172        ok_button.style.color = "#800000";
173        ok_button.style.border = "2px solid #989898";
174    }
175    function normalStellung() {
176        ok_button.style.color = "#5d402f";
177        ok_button.style.border = "2px solid #c0c0c0";
178    }
179}
180/*----------------------------------------------------------------------------------
181 * Überwachung von Screen mit Fallunterscheidungen für mobile Endgeräte und
182 * ältere Browser. Die Liste kann bei Bedarf erweitert werden.
183 * ---------------------------------------------------------------------------------
184 */
185function ueberwacheScreen(abfrage) {
186    var mobile = /iPhone|iPad|iPod|Android|Windows Phone|BlackBerry/i.test(navigator.userAgent);
187    var ismobi = (mobile) ? "Mobile" : "Nein";
188    var istest = /hinweise=einenTag/.test(document.cookie);
189    var rechts;
190
191    if (document.getElementById("hinweise")) {
192        var blende = document.getElementById("hinweise");
193        var ihoehe = blende.offsetHeight;
194        /*----------------------------------------------------------------------------------
195         * if: Abstand vom rechten Rand bei Verkleinerung als Fahne liegt im Minusbereich
196         * else if: Abstand vom rechten Rand je nach Screen-Weite liegt im Plusbereich
197         * 40: Abstand in Pixel vom unteren Rand
198         * ---------------------------------------------------------------------------------
199         */
200         if (ihoehe > 1) {
201            if (hm_auswahlein == "Fahne" && (abfrage == "cookie_tag" || istest == true)) {
202                rechts = -28;
203                blende.style.cssText += "background-image:linear-gradient(to left, #b48220, #f2e5b0);" +
204                                        "border-right:none;"         +
205                                        "border-top-right-radius:0;" +
206                                        "border-bottom-right-radius:0;";
207            }
208            else if (hm_auswahlein == "Button" || abfrage == "cookie_nein") {

209                var iweite = (screen.availWidth < 1440) ? 4 : 20;
210                rechts = Math.round((screen.availWidth / 100) + iweite);
211                blende.style.cssText += "background-image:linear-gradient(to top, #eed6a1, #f2e5b0)";
212            }
213            if (window.innerHeight && screen.width > 800 && ismobi == "Nein") {
214                var bistop = window.innerHeight - ihoehe - 40;
215
216                blende.style.position = "fixed";
217                blende.style.top      = bistop + "px";
218                blende.style.right    = rechts + "px";
219                window.setTimeout(ueberwacheScreen, 500);
220            }
221            else if (window.innerHeight && (screen.width <= 800 || ismobi == "Mobile")) {
222                var bistop = (window.innerHeight - ihoehe - 40) + window.pageYOffset;
223
224                blende.style.position = "absolute";
225                blende.style.top      = bistop + "px";
226                blende.style.right    = rechts + "px";
227                window.setTimeout(ueberwacheScreen, 500);
228            }
229            else {
230                blende.style.position = "fixed";
231                blende.style.top = "40px";
232            }
233        }
234    }
235}
236/*----------------------------------------------------------------------------------
237 * Speichere Cookie bei Verkleinerung nach x Sekunden wegen fehlender Bestätigung
238 * nur für einen Tag mit 24 x 60 x 60000 Millisekunden. Wird trotz Klick auf "OK"
239 * noch einmal entsprechend der eingestellten Zeit aufgerufen.
240 * ---------------------------------------------------------------------------------
241 */
242function blendeTagesHinweiseAus() {
243    // Abfrage ob noch "hinweise" existent sind
244    if (document.getElementById("hinweise")) {
245        var object = document.getElementById("hinweise");
246

247        // Bestehenden Inhalt löschen, falls vorhanden
248        while (object.hasChildNodes()) {
249            object.removeChild(object.firstChild);
250        }
251        // Einen neuen Link einfügen und DIV-Bereich verkleinern
252        var absatz = document.createElement("p");
253        absatz.style.cssText = "text-align:center; margin:2px";
254
255        var neulink = document.createElement("a");
256        neulink.setAttribute("href", "javascript:reaktiviereAnsicht()");
257        neulink.appendChild(document.createTextNode("Cookie"));
258        neulink.appendChild(document.createElement("br"));
259        neulink.appendChild(document.createTextNode("» Hinweise « "));
260        neulink.style.cssText = "text-decoration:none;" +
261                                "font-family:Verdana;"  +
262                                "font-size:14px;"       +
263                                "font-weight:normal;"   +
264                                "color:#98671a";
265
266        absatz.appendChild(neulink);
267        object.appendChild(absatz);
268        object.style.maxWidth = "100px";
269
270        if (hm_auswahlein == "Fahne") {
271            object.style.paddingRight = "32px";
272            object.style.paddingLeft  =  "8px";
273        }
274        var einTag = new Date();
275        einTag.setTime(einTag.getTime() + (24 * 60 * 60000));
276        document.cookie = "hinweise=einenTag; expires=" + einTag.toGMTString() + "; path=/";
277    }
278}
279/*----------------------------------------------------------------------------------
280 * Kleine Helferfunktion zur Beräumung bei Ausblendung in diesem Script nur bei "OK"
281 * ---------------------------------------------------------------------------------
282 */
283function helfeBeraeumen() {
284    if (document.getElementById("klickmich")) ueberwacheButton("beenden");
285    if (document.getElementById("hinweise")) {
286        var beraeumung = document.getElementById("hinweise");
287        beraeumung.parentNode.removeChild(beraeumung);
288    }
289}
290/*----------------------------------------------------------------------------------
291 * Speichere Cookie bei Bestätigung mit Klick auf "OK" für 90 Tage mit
292 * 90 x 24 x 60 x 60000 Millisekunden.
293 * ---------------------------------------------------------------------------------
294 */
295function blendeMonatsHinweiseAus() {
296    var einMon = new Date();
297    einMon.setTime(einMon.getTime() + (90 * 24 * 60 * 60000));
298    document.cookie = "hinweise=einenMon; expires=" + einMon.toGMTString() + "; path=/";
299    // Ausblendung bei "OK"
300    helfeBeraeumen();
301}
302/*----------------------------------------------------------------------------------
303 * Falls die Hinweise bereits wegen Zeitüberschreitung verkleinert wurden, diese
304 * zur Ansicht reaktivieren, dazu das Cookie überschreiben und die Seite reloaden.
305 * ---------------------------------------------------------------------------------
306 */
307function reaktiviereAnsicht() {
308    var weniger = new Date();
309    weniger.setTime(weniger.getTime() + (-60000));
310
311    if (/hinweise=einenTag/.test(document.cookie) == true) {
312        document.cookie = "hinweise=einenTag; expires=" + weniger.toGMTString() + "; path=/";
313        blendeHinweiseEin();
314    }
315}