https://mainbogen-evangelisch.de/modules/custom/vk_mwsblocks/vk_mwsblocks.js?tmn6sh

1/*
2*/
3
4(function ($, Drupal, once) {
5
6  Drupal.behaviors.tagslosung = {
7    attach: function (context) {
8      /* Tageslosung */
9      $('.tageslosung_container', context).each(function () {
10
11        var data = {
12          bgcolor: $(this).data('bgcolor')
13        };
14//console.log('ready to get tageslosung!');
15        $(this).load("/vk-mwsblocks-tageslosung", data);
16
17      });
18
19      // Facebook fallback: hide message when Klaro placeholder is shown or FB iframe is present
20      once('vk-fb-embed', '[data-fb-embed]', context).forEach(function (wrapper) {
21        const fbPage = wrapper.querySelector('.fb-page');
22        if (!fbPage) return;
23
24        const placeholderSelector = '[data-type="placeholder"][data-name="facebook"]';
25
26        const updateState = () => {
27          // 1) If Klaro shows a consent placeholder for Facebook, hide our fallback.
28          const hasConsentPlaceholder = !!wrapper.querySelector(placeholderSelector);
29          wrapper.classList.toggle('has-consent', hasConsentPlaceholder);
30
31          // 2) If FB iframe exists, hide fallback (loaded).
32          if (fbPage.querySelector('iframe')) {
33            wrapper.classList.add('is-loaded');
34            return true;
35          }
36          return false;
37        };
38
39        // Initial state check
40        if (updateState()) return;
41
42        // Watch for Klaro inserting/removing placeholder and for FB SDK inserting iframe
43        const observer = new MutationObserver(() => {
44          if (updateState()) observer.disconnect();
45        });
46
47        observer.observe(wrapper, { childList: true, subtree: true });
48      });
49
50      // Video fallback: hide message when Klaro placeholder is shown or video iframe is active
51      once('vk-video-embed', '[data-video-embed]', context).forEach(function (wrapper) {
52        const klaroName = wrapper.getAttribute('data-klaro-name') || '';
53        const placeholderSelector = klaroName
54          ? `[data-type="placeholder"][data-name="${klaroName}"]`
55          : `[data-type="placeholder"]`;
56
57        const getIframe = () => wrapper.querySelector(`iframe[data-name="${klaroName}"]`) || wrapper.querySelector('iframe');
58
59        const isVisible = (el) => {
60          if (!el) return false;
61          const style = getComputedStyle(el);
62          return style.display !== 'none' && style.visibility !== 'hidden' && style.opacity !== '0';
63        };
64
65
66        const updateState = () => {
67          const placeholder = wrapper.querySelector(placeholderSelector);
68          const hasConsentPlaceholder = !!placeholder && isVisible(placeholder);
69          wrapper.classList.toggle('has-consent', hasConsentPlaceholder);
70
71          const iframe = getIframe();
72          const hasSrc = !!iframe && typeof iframe.getAttribute('src') === 'string' && iframe.getAttribute('src').trim() !== '';
73          const iframeVisible = !!iframe && isVisible(iframe);
74
75          if (hasSrc && iframeVisible) {
76            wrapper.classList.add('is-loaded');
77            return true;
78          }
79          return false;
80        };
81
82        // Initial state
83        if (updateState()) return;
84
85        // Listen for iframe load (nice-to-have)
86        const iframe = getIframe();
87        if (iframe) {
88          iframe.addEventListener('load', () => {
89            wrapper.classList.add('is-loaded');
90          }, { once: true });
91        }
92
93        // Observe Klaro changes: placeholder inserted/removed, iframe src/display changes
94        const observer = new MutationObserver(() => {
95          if (updateState()) observer.disconnect();
96        });
97
98        observer.observe(wrapper, { childList: true, subtree: true, attributes: true });
99
100      });
101
102      // iFrame fallback: hide message when Klaro placeholder is shown or iframe really loads
103      once('vk-iframe-embed', '[data-iframe-embed]', context).forEach(function (wrapper) {
104        const klaroName = wrapper.getAttribute('data-klaro-name') || '';
105
106        const placeholderSelector = klaroName
107          ? `[data-type="placeholder"][data-name="${klaroName}"]`
108          : `[data-type="placeholder"]`;
109
110        const getIframe = () =>
111          (klaroName ? wrapper.querySelector(`iframe[data-name="${klaroName}"]`) : null) ||
112          wrapper.querySelector('iframe');
113
114        const isVisible = (el) => {
115          if (!el) return false;

116          const style = getComputedStyle(el);
117          return style.display !== 'none' && style.visibility !== 'hidden' && style.opacity !== '0';
118        };
119
120        const updateConsentState = () => {
121          const placeholder = wrapper.querySelector(placeholderSelector);
122          const hasVisibleConsentPlaceholder = !!placeholder && isVisible(placeholder);
123          wrapper.classList.toggle('has-consent', hasVisibleConsentPlaceholder);
124        };
125
126        // Initial
127        updateConsentState();
128
129        const iframe = getIframe();
130        if (iframe) {
131          // If iframe actually loads, it's safe to hide fallback.
132          iframe.addEventListener('load', () => {
133            wrapper.classList.add('is-loaded');
134          }, { once: true });
135        }
136
137        // Observe Klaro changes (placeholder appears/disappears or gets hidden/shown)
138        const observer = new MutationObserver(() => {
139          updateConsentState();
140        });
141
142        observer.observe(wrapper, {
143          childList: true,
144          subtree: true,
145          attributes: true,
146          attributeFilter: ['style', 'class']
147        });
148      });
149
150
151
152
153
154
155      /* Facebook-Consent
156      var showfacebook = vk_mwsblocks_getCookie('showfacebook');
157      if (showfacebook == 1) {
158        $('.showfacebook').prop('checked', true);
159        vk_mwsblocks_showFacebook(document, 'script', 'facebook-jssdk');
160      } else {
161        $('.showfacebook_inside').prop('checked', false);
162        $('.showfacebookselection_outside').hide();
163      }
164
165      $('.showfacebook_inside').change(function () {
166        if ($(this).prop('checked') == true) {
167          vk_mwsblocks_setCookie('showfacebook', '1', 365)
168          vk_mwsblocks_showFacebook(document, 'script', 'facebook-jssdk');
169          $('.showfacebook').prop('checked', true);
170          $('.showfacebookselection_outside').show();
171        }
172      });
173      $('.showfacebook').change(function () {
174        if ($(this).prop('checked') == false) {
175          vk_mwsblocks_deleteCookie('showfacebook');
176          location.reload();
177        }
178      });
179
180       */
181      /* Twitter-Consent */
182      var showtwitter = vk_mwsblocks_getCookie('showtwitter');
183      if (showtwitter == 1) {
184        $('.showtwitter').prop('checked', true);
185        $('.twitterplaceholder').each(function () {
186          $(this).html($(this).data('code'));
187        });
188
189      } else {
190        $('.showtwitter_inside').prop('checked', false);
191        $('.showtwitterselection_outside').hide();
192      }
193
194      $('.showtwitter').change(function () {
195        if ($(this).prop('checked') == false) {
196          vk_mwsblocks_deleteCookie('showtwitter');
197          location.reload();
198        }
199      });
200
201      $('input.showtwitter_inside').on('change', function () {
202        if ($(this).prop('checked') == true) {
203          $('.twitterplaceholder').each(function () {
204            $(this).html($(this).data('code'));
205          });
206          vk_mwsblocks_setCookie('showtwitter', '1', 365);
207          $('.showtwitter').prop('checked', true);
208          $('.showtwitterselection_outside').show();
209        }
210      });
211
212      /* iFrame Consent */
213      $('.mwsiframewrapper').each(function () {
214        var domainid = $(this).data('domainid');
215        var showiframe = vk_mwsblocks_getCookie('showiframe' + domainid);
216        if (showiframe == 1) {
217          //console.log('YES');
218          $('.show' + domainid).each(function () {
219            //console.log($(this).html());
220            $(this).html($('<iframe>').attr('width', '100%')
221              .attr('height', $(this).data('height'))
222              .attr('src', $(this).data('src'))
223              .attr('frameborder', '0')
224              .attr('scrolling', $(this).data('scroll')));
225          });
226          $('.showiframe' + domainid).prop('checked', true);
227        } else {
228          $('.showiframe_inside' + domainid).prop('checked', false);
229          $('.showiframeselection_outside' + domainid).hide();
230        }
231
232      });
233
234
235      $('input.showiframe_inside').on('change', function () {
236        if ($(this).prop('checked') == true) {
237          var domainid = $(this).data('domainid');
238          $('.show' + domainid).each(function () {
239
240            $(this).html($('<iframe>').attr('width', '100%')
241              .attr('height', $(this).data('height'))
242              .attr('src', $(this).data('src'))
243              .attr('frameborder', '0')
244              .attr('scrolling', $(this).data('scroll')));
245          });
246
247          vk_mwsblocks_setCookie('showiframe' + domainid, '1', 365);
248          $('.showiframe' + domainid).prop('checked', true);
249          $('.showiframeselection_outside' + domainid).show();
250        }
251      });
252
253      $('.checkboxshowiframe').change(function () {
254        if ($(this).prop('checked') == false) {
255          var domainid = $(this).data('domainid');
256          vk_mwsblocks_deleteCookie('showiframe' + domainid);
257          location.reload();
258        }
259      });
260
261      /* Video Consent
262      $('.mwsvideowrapper').each(function () {
263        var domainid = $(this).data('domainid');
264        var showvideo = vk_mwsblocks_getCookie('showvideo' + domainid);
265        if (showvideo == 1) {
266          //console.log('YES');
267          $('.show' + domainid).each(function () {
268            createVideoIframe($(this));
269          });
270          $('.showvideo' + domainid).prop('checked', true);
271        } else {
272          $('.showvideo_inside' + domainid).prop('checked', false);
273          $('.showvideoselection_outside' + domainid).hide();
274        }
275
276      });
277      $('input.showvideo_inside').on('change', function () {
278        if ($(this).prop('checked') == true) {
279          var domainid = $(this).data('domainid');
280          $('.show' + domainid).each(function () {
281            createVideoIframe($(this));
282          });
283
284          vk_mwsblocks_setCookie('showvideo' + domainid, '1', 365);
285          $('.showvideo' + domainid).prop('checked', true);
286          $('.showvideoselection_outside' + domainid).show();
287        }
288      });
289      $('.checkboxshowvideo').change(function () {
290        if ($(this).prop('checked') == false) {
291          var domainid = $(this).data('domainid');
292          vk_mwsblocks_deleteCookie('showvideo' + domainid);
293          location.reload();
294        }
295      });
296
297       */
298
299    }
300  }
301
302  function createVideoIframe(obj){
303    obj.removeClass('mwsvideowrapperpreview');
304    // Add ability to play mp4 video
305    if (obj.data('src').match(/mp4$/)) {
306      //bgimg = obj.css('background').replace(/.*\s?url\([\'\"]?/, '').replace(/[\'\"]?\).*/, '');
307      poster = obj.parent().siblings('div').data('src');
308      obj.html('<video width=854 height=480 poster="'+poster+'" controls>' +
309        '<source src="'+obj.data('src')+'" type="video/mp4">' +
310        '</video>');
311    } else {
312      obj.html($('<iframe>').attr('width','854')
313        .attr('height','480')
314        .attr('src',obj.data('src'))
315        .attr('frameborder','0')
316        .attr('allowfullscreen','allowfullscreen'));
317      if(obj.data('domainid') == 'vimeo_com'){
318        obj.append('<script src="https://player.vimeo.com/api/player.js"></script>');
319      }
320    }
321
322  }
323
324  function vk_mwsblocks_showFacebook(d, s, id) {
325    var js, fjs = d.getElementsByTagName(s)[0];
326    if (d.getElementById(id)) return;
327    js = d.createElement(s); js.id = id;
328    js.src = "//connect.facebook.net/de_DE/sdk.js#xfbml=1&version=v2.9&appId=133868449965236";
329    fjs.parentNode.insertBefore(js, fjs);
330  }
331
332  function vk_mwsblocks_setCookie(cname, cvalue, exdays) {
333    var d = new Date();
334    d.setTime(d.getTime() + (exdays*24*60*60*1000));
335    var expires = "expires="+ d.toUTCString();
336    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
337  }
338  function vk_mwsblocks_getCookie(cname) {
339    var name = cname + "=";
340    var decodedCookie = decodeURIComponent(document.cookie);
341    var ca = decodedCookie.split(';');
342    for(var i = 0; i <ca.length; i++) {
343      var c = ca[i];
344      while (c.charAt(0) == ' ') {
345        c = c.substring(1);
346      }
347      if (c.indexOf(name) == 0) {
348        return c.substring(name.length, c.length);
349      }
350    }
351    return "";
352  }
353  function vk_mwsblocks_deleteCookie(cname) {
354    var expires = "expires=Thu, 01 Jan 1970 00:00:00 UTC";
355    document.cookie = cname + "=;" + expires + ";path=/";
356  }
357
358})(jQuery, Drupal, once);