https://traderfox.de/lib/tf-consent-banner.js?time=1790254735

1class TFConsentBanner {
2	constructor(id,options) {
3		// check input options
4		if (!options || typeof options != 'object') {
5			options = {};
6		}
7
8		if( !options.hasOwnProperty('prefix') || typeof options.prefix != 'string' ){
9			options.prefix = 'tf_consent_';
10		}
11
12		if( !options.hasOwnProperty('domain') || typeof options.domain != 'string' ){
13			options.domain = window.location.hostname;
14		}
15
16		if (!options.hasOwnProperty('types') || !Array.isArray(options.types) || options.types.length < 1) {
17			options.types = [];
18			if( !options.types.length ){
19				options.types.push({
20					'id' : 'required',
21					'default' : 1,
22					'title' : 'Notwendig',
23					'description' : 'Notwendig, damit die Grundfunktionalität unserer Webseite technisch gewährleistet ist.',
24					'details' : '',
25					'disabled' : true
26				});
27			}
28		}
29		if( !options.hasOwnProperty('title') || typeof options.title != 'string' ){
30			options.title = '';
31		}
32		if( !options.hasOwnProperty('message') || typeof options.message != 'string' ){
33			options.message = '<p>Diese Webseite verwendet Cookies</p>';
34		}
35		if( !options.hasOwnProperty('inline') || typeof options.inline != 'boolean' ){
36			options.inline = false;
37		}
38		if( !options.hasOwnProperty('acceptAll') || typeof options.acceptAll != 'string' ){
39			options.acceptAll = 'Alle akzeptieren';
40		}
41		if( !options.hasOwnProperty('acceptSelected') || typeof options.acceptSelected != 'string' ){
42			options.acceptSelected = 'Auswahl bestätigen';
43		}
44		if( !options.hasOwnProperty('openSettings') || typeof options.openSettings != 'string' ){
45			options.openSettings = 'Einstellungen';
46		}
47		if( !options.hasOwnProperty('rejectAll') || typeof options.rejectAll != 'string' ){
48			options.rejectAll = 'Nur Notwendige';
49		}else if( !options.hasOwnProperty('denyAll') || typeof options.denyAll != 'string' ){
50			options.rejectAll = 'Nur Notwendige';
51		}
52
53		this._toggleDetailsBind = this._toggleDetails.bind(this);
54		this._acceptSelectedBind = this._acceptSelected.bind(this);
55		this._acceptAllBind = this._acceptAll.bind(this);
56		this._showSettingsBind = this._showSettings.bind(this);
57		this._rejectAllBind = this._rejectAll.bind(this);
58
59		this.id = id;
60		this.domain = options.domain;
61		this.prefix = options.prefix;
62		this._expires = 90;
63		this._modal = null;
64		this._backdrop = null;
65		this._onSave = null;
66		this._details = null;
67		this._detail_togglers = null;
68		this._inputs = null;
69		this._accept_all = null;
70		this._accept_selected = null;
71		this._show_settings = null;
72		this._reject_all = null;
73		this._container1 = null;
74		this._container2 = null;
75
76		this._options = {};
77
78		if (!options.hasOwnProperty('enforce') || !options.enforce) {
79			let is_set = this._getCookie(this.prefix+'set');
80			if (is_set) {
81				return;
82			}
83		}
84
85		if ( options.hasOwnProperty('onSave') && typeof options.onSave == 'function' ) {
86			this._onSave = options.onSave;
87		}
88
89		// create modal
90		let modal_header_html = '';
91		if( options.title ){
92			modal_header_html =
93				'<div class="modal-header">'+options.title+'</div>';
94		}
95		let modal_body_html = '';
96		if( options.message ){
97			modal_body_html =
98				'<div class="modal-body">'+options.message+'</div>';
99		}
100		let details_html = '';
101		let container2_body_html = '<div class="modal-body tfcookie-options"><div class="row g-3">';
102		for( let i = 0; i < options.types.length; i++ ){
103			if (!options.types[i].hasOwnProperty('title') || !options.types[i].hasOwnProperty('id')) {
104				continue;
105			}
106			if( options.types[i].hasOwnProperty('details') && options.types[i].details ){
107				details_html = details_html+
108					'<div class="tfcookie-details" data-id="'+options.types[i].id+'" style="display:none;">'+options.types[i].details+'</div>';
109			}
110			let checked = (options.types[i].hasOwnProperty('init') && options.types[i].init)? ' checked="checked" ' : '';
111			let current_val = this._getCookie(this.prefix+options.types[i].id);
112			if( current_val && current_val == "1" ){
113				checked = ' checked="checked" ';
114			}
115			this._options[options.types[i].id] = current_val;
116			let disabled = (options.types[i].hasOwnProperty('disabled') && options.types[i].disabled)? ' disabled="disabled" ' : '';
117			let description = options.types[i].hasOwnProperty('description')? '<div class="tfcookie-description">'+options.types[i].description+'</div>' : '';
118			let details_link = (options.types[i].hasOwnProperty('details') && options.types[i].details)? '<div><button type="button" data-id="'+options.types[i].id+'" class="btn btn-link tfcookie-details-toggle">&raquo; Details</button></div>' : '';

119			container2_body_html = container2_body_html+
120				'<div class="col">'+
121					'<div>'+
122						'<div class="form-check">'+
123							'<input type="checkbox" class="form-check-input tfcookie-control" data-id="'+options.types[i].id+'" id="'+this.id+'-'+options.types[i].id+'"'+checked+disabled+'>'+
124							'<label for="'+this.id+'-'+options.types[i].id+'" class="form-check-label">'+options.types[i].title+'</label>'+
125						'</div>'+
126						description+
127					'</div>'+
128					details_link+
129				'</div>';
130		}
131		container2_body_html = container2_body_html+
132			'</div><div>'+details_html+'</div></div>';
133
134		let container1_html =
135			'<div id="'+this.id+'-container-1">'+
136				modal_body_html+
137				'<div class="modal-footer"><div class="btn-group">'+
138					'<button type="button" id="'+this.id+'-show-settings" class="btn btn-outline-secondary">'+options.openSettings+'</button>'+
139					'<button type="button" id="'+this.id+'-reject-all" class="btn btn-outline-secondary">'+options.rejectAll+'</button>'+
140					'<button type="button" class="btn btn-success tfcookie-accept-all">'+options.acceptAll+'</button>'+
141				'</div></div>'+
142			'</div>';
143
144		let container2_html =
145			'<div id="'+this.id+'-container-2" class="d-none">'+
146				container2_body_html+
147				'<div class="modal-footer"><div class="btn-group">'+
148					'<button type="button" id="'+this.id+'-accept-selected" class="btn btn-outline-secondary">'+options.acceptSelected+'</button>'+
149					'<button type="button" class="btn btn-success tfcookie-accept-all">'+options.acceptAll+'</button>'+
150				'</div></div>'+
151			'</div>';
152
153		let parent = null;
154		if( options.hasOwnProperty('parent') && options.parent ){
155			parent = document.getElementById(options.parent);
156		}
157		if( !parent ){
158			parent = document.body;
159		}
160
161		if( !options.inline ){
162			this._backdrop = document.createElement('div');
163			this._backdrop.className = 'backdrop fade show';
164
165			parent.appendChild(this._backdrop);
166		}
167
168		this._modal = document.createElement('div');
169		this._modal.id = this.id;
170		this._modal.className = 'tfcookie-modal modal';
171		if( options.inline ){
172			this._modal.classList.add('position-static')
173		}
174		this._modal.innerHTML =
175			'<div class="modal-dialog modal-lg">'+
176				'<div class="modal-content">'+modal_header_html+container1_html+container2_html+
177				'</div>'+
178			'</div>';
179
180		parent.appendChild(this._modal);
181
182		this._details = this._modal.querySelectorAll('.tfcookie-details');
183		this._detail_togglers = this._modal.querySelectorAll('.tfcookie-details-toggle');
184		this._inputs = this._modal.querySelectorAll('.tfcookie-control');
185		this._accept_all = this._modal.querySelectorAll('.tfcookie-accept-all');
186		this._accept_selected = document.getElementById(this.id+'-accept-selected');
187		this._show_settings = document.getElementById(this.id+'-show-settings');
188		this._reject_all = document.getElementById(this.id+'-reject-all');
189		this._container1 = document.getElementById(this.id+'-container-1');
190		this._container2 = document.getElementById(this.id+'-container-2');
191
192		for( let i = 0; i < this._detail_togglers.length; i++ ){
193			this._detail_togglers[i].addEventListener("click", this._toggleDetailsBind );
194		}
195		this._accept_all.forEach(btn => btn.addEventListener("click", this._acceptAllBind));
196		this._accept_selected.addEventListener("click", this._acceptSelectedBind );
197		this._show_settings.addEventListener("click", this._showSettingsBind );
198		this._reject_all.addEventListener("click", this._rejectAllBind );
199	}
200
201	destroy() {
202		for( let i = 0; i < this._detail_togglers.length; i++ ){
203			this._detail_togglers[i].removeEventListener("click", this._toggleDetailsBind );
204		}
205		this._accept_all.forEach(btn => btn.removeEventListener("click", this._acceptAllBind));
206		this._accept_selected.removeEventListener("click", this._acceptSelectedBind );
207		this._show_settings.removeEventListener("click", this._showSettingsBind );
208		this._reject_all.removeEventListener("click", this._rejectAllBind );
209	}
210
211	close() {
212		if ( this._onSave != null ) {
213			this._onSave(this._options);
214		}
215
216		if( this._modal.className.indexOf('position-static') > -1 ){
217			createToast({
218				'header' : 'Einstellungen gespeichert',
219				'message' : 'Ihre Einstellungenzu Cookies und Tracking wurden gespeichert',
220				'className' : 'toast-success',
221				'fa' : 'fas fa-check-circle'
222			});
223			return;
224		}
225
226		if( this._backdrop != null ){
227			this._backdrop.parentNode.removeChild(this._backdrop);
228			this._backdrop = null;
229		}
230
231		this._modal.parentNode.removeChild(this._modal);
232		this._modal = null;
233
234		this.destroy();
235	}
236
237	_getCookie(name) {
238		let nameEQ = name + "=";
239		let ca = document.cookie.split(';');
240		for(let i=0;i < ca.length;i++) {
241			let c = ca[i];
242			while (c.charAt(0)==' ') c = c.substring(1,c.length);
243			if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
244		}
245		return null;
246	}
247	_setCookie(name,value,days) {
248		let expires = "";
249		if (days) {
250			var date = new Date();
251			date.setTime(date.getTime() + (days*24*60*60*1000));
252			expires = "; expires=" + date.toUTCString();
253		}
254		document.cookie = 
255			name + "=" + (value || "")  + 
256			expires + 
257			"; path=/" + 
258			"; domain=" + this.domain + 
259			"; SameSite=Lax";
260	}
261	_eraseCookie(name) {
262		document.cookie = name+'=; Max-Age=-99999999;';

263	} 
264
265	_toggleDetails(event){
266		let button_id = event.target.getAttribute('data-id');
267		for( var i = 0; i < this._details.length; i++ ){
268			let text_id = this._details[i].getAttribute('data-id');
269			if( text_id == button_id && this._details[i].style.display == 'none' ){
270				this._details[i].style.display = 'block';
271			}else{
272				this._details[i].style.display = 'none';
273			}
274		}
275	}
276	_acceptSelected(event){
277		for( let i = 0; i < this._inputs.length; i++ ){
278			var input_id = this._inputs[i].getAttribute('data-id');
279			if( this._inputs[i].checked == true ){
280				this._options[input_id] = '1';
281				this._setCookie(this.prefix+input_id,"1",this._expires);
282			}else{
283				this._options[input_id] = '0';
284				this._setCookie(this.prefix+input_id,"0",this._expires);
285			}
286		}
287		this._setCookie(this.prefix+"set","1",this._expires);
288
289		this.close();
290	}
291	_acceptAll(event){
292		for( let i = 0; i < this._inputs.length; i++ ){
293			this._inputs[i].checked = true;
294			var input_id = this._inputs[i].getAttribute('data-id');
295			this._options[input_id] = '1';
296			this._setCookie(this.prefix+input_id,"1",this._expires);
297		}
298		this._setCookie(this.prefix+"set","1",this._expires);
299
300		this.close();
301	}
302	_showSettings() {
303		this._container1.classList.add('d-none');
304		this._container2.classList.remove('d-none');
305	}
306	_rejectAll(event) {
307		for( let i = 0; i < this._inputs.length; i++ ){
308			let input_id = this._inputs[i].getAttribute('data-id');
309			if( !this._inputs[i].disabled ){
310				this._inputs[i].checked = false;
311				this._options[input_id] = '0';
312				this._setCookie(this.prefix+input_id,"0",this._expires);
313			}
314		}
315		this._setCookie(this.prefix+"set","1",this._expires);
316		this.close();
317	}
318}