← All changes | assets/js/embed-privacy.js +28 -321 1.10.5 → 0.1 View file →

		@@ -1,337 +1,44 @@
1	1	/**
2	2	* Embed Privacy JavaScript functions.
3	3	*
4		- * @author Epiphyt
5		- * @license GPL2
6		- * @package epiphyt\Embed_Privacy
	4	+ * @author Epiphyt
	5	+ * @license GPL2
	6	+ * @package epiphyt\Embed_Privacy
	7	+ * @version 0.1
7	8	*/
8	9	document.addEventListener( 'DOMContentLoaded', function() {
9		- var checkboxes = document.querySelectorAll( '.embed-privacy-inner .embed-privacy-input' );
10		- var labels = document.querySelectorAll( '.embed-privacy-inner .embed-privacy-label' );
11		- var overlays = document.querySelectorAll( '.embed-privacy-overlay' );
12		- var overlayLinks = document.querySelectorAll( '.embed-privacy-overlay a' );
	10	+ var overlays = document.querySelectorAll( '.embed-overlay' );
13	11
14	12	for ( var i = 0; i < overlays.length; i++ ) {
15	13	overlays[ i ].addEventListener( 'click', function( event ) {
16		- if ( event.currentTarget.tagName !== 'INPUT' ) {
17		- overlayClick( event.currentTarget );
18		- }
19		- } );
20		-
21		- var button = overlays[ i ].parentNode.querySelector( '.embed-privacy-enable' );
22		-
23		- if ( ! button ) {
24		- continue;
25		- }
26		-
27		- button.addEventListener( 'click', function( event ) {
28		- overlayClick( event.currentTarget.parentNode.querySelector( '.embed-privacy-overlay' ) );
29		- event.currentTarget.parentNode.removeChild( event.currentTarget ); // IE11 doesn't support .remove()
30		- } );
31		- button.addEventListener( 'keypress', function( event ) {
32		- if ( event.code === 'Enter' || event.code === 'Space' ) {
33		- event.preventDefault(); // prevent space from scrolling the page
34		- overlayClick( event.currentTarget.parentNode.querySelector( '.embed-privacy-overlay' ) );
35		- event.currentTarget.parentNode.removeChild( event.currentTarget ); // IE11 doesn't support .remove()
36		- }
37		- } );
38		- }
39		-
40		- if ( embedPrivacy.javascriptDetection === 'yes' ) {
41		- enableAlwaysActiveProviders();
42		- }
43		-
44		- optOut();
45		- setMinHeight();
46		-
47		- window.addEventListener( 'resize', function() {
48		- setMinHeight();
49		- } );
50		-
51		- for ( var i = 0; i < overlayLinks.length; i++ ) {
52		- overlayLinks[ i ].addEventListener( 'click', function( event ) {
53		- // don't trigger the overlays click
54		- event.stopPropagation();
55		- } );
56		- }
57		-
58		- for ( var i = 0; i < checkboxes.length; i++ ) {
59		- checkboxes[ i ].addEventListener( 'click', function( event ) {
60		- // don't trigger the overlays click
61		- event.stopPropagation();
	14	+ var current_target = event.currentTarget;
	15	+ var embed_content = current_target.nextElementSibling;
62	16
63		- checkboxActivation( event.currentTarget );
64		- } );
65		- }
66		-
67		- for ( var i = 0; i < labels.length; i++ ) {
68		- labels[ i ].addEventListener( 'click', function( event ) {
69		- // don't trigger the overlays click
70		- event.stopPropagation();
71		- } );
72		- }
73		-
74		- /**
75		- * Clicking on a checkbox to always enable/disable an embed provider.
76		- *
77		- * @since 1.2.0
78		- *
79		- * @param {element} target Target element
80		- */
81		- function checkboxActivation( target ) {
82		- var embedProvider = target.getAttribute( 'data-embed-provider' );
83		- var cookie = ( get_cookie( 'embed-privacy' ) ? JSON.parse( get_cookie( 'embed-privacy' ) ) : '' );
84		-
85		- if ( target.checked ) {
86		- // add|update the cookie's value
87		- if ( cookie !== null && Object.keys( cookie ).length !== 0 && cookie.constructor === Object ) {
88		- cookie[ embedProvider ] = true;
89		-
90		- set_cookie( 'embed-privacy', JSON.stringify( cookie ), 365 );
91		- }
92		- else {
93		- set_cookie( 'embed-privacy', '{"' + embedProvider + '":true}', 365 );
94		- }
	17	+ // hide the embed overlay
	18	+ current_target.style.display = 'none';
	19	+ // remove the HTML comments from the embed content
	20	+ embed_content.innerHTML = embed_content.innerHTML.replace( /<!--/, '' ).replace( /-->/, '' );
95	21
96		- enableAlwaysActiveProviders();
97		- }
98		- else if ( cookie !== null ) {
99		- delete cookie[ embedProvider ];
	22	+ // get all script tags inside the embed
	23	+ var script_tags = embed_content.querySelectorAll( 'script' );
100	24
101		- if ( Object.keys( cookie ).length !== 0 ) {
102		- set_cookie( 'embed-privacy', JSON.stringify( cookie ), 365 );
103		- }
104		- else {
105		- remove_cookie( 'embed-privacy' );
106		- }
107		- }
108		- }
109		-
110		- /**
111		- * Check whether to enable an always active provider by default.
112		- *
113		- * @since 1.2.0
114		- */
115		- function enableAlwaysActiveProviders() {
116		- var cookie = ( get_cookie( 'embed-privacy' ) ? JSON.parse( get_cookie( 'embed-privacy' ) ) : '' );
117		-
118		- if ( cookie === null || ! Object.keys( cookie ).length ) {
119		- return;
120		- }
121		-
122		- var providers = Object.keys( cookie );
123		-
124		- for ( var i = 0; i < overlays.length; i++ ) {
125		- var provider = overlays[ i ].parentNode.getAttribute( 'data-embed-provider' );
126		-
127		- if ( providers.includes( provider ) ) {
128		- overlays[ i ].click();
129		- }
130		- }
131		- }
132		-
133		- /**
134		- * Get always active providers from cookie.
135		- *
136		- * @since 1.4.8
137		- *
138		- * @return {string[]} List of always active providers
139		- */
140		- function getAlwaysActiveProviders() {
141		- const cookie = ( get_cookie( 'embed-privacy' ) ? JSON.parse( get_cookie( 'embed-privacy' ) ) : '' );
142		-
143		- if ( ! cookie ) {
144		- return [];
145		- }
146		-
147		- return Object.keys( cookie );
148		- }
149		-
150		- /**
151		- * Opting in/out for embed providers.
152		- *
153		- * @since 1.2.0
154		- */
155		- function optOut() {
156		- const optOutContainer = document.querySelector( '.embed-privacy-opt-out' );
157		-
158		- if ( ! optOutContainer ) {
159		- return;
160		- }
161		-
162		- var optOutCheckboxes = optOutContainer.querySelectorAll( '.embed-privacy-opt-out-input' );
163		- const showAll = optOutContainer.getAttribute( 'data-show-all' ) === '1';
164		-
165		- if ( ! optOutCheckboxes ) {
166		- return;
167		- }
168		-
169		- const alwaysActiveProviders = getAlwaysActiveProviders();
170		-
171		- for ( var i = 0; i < optOutCheckboxes.length; i++ ) {
172		- if ( embedPrivacy.javascriptDetection === 'yes' && alwaysActiveProviders.indexOf( optOutCheckboxes[ i ].getAttribute( 'data-embed-provider' ) ) !== -1 ) {
173		- optOutCheckboxes[ i ].checked = true;
174		- }
175		- else if ( ! showAll ) {
176		- optOutCheckboxes[ i ].parentNode.parentNode.classList.add( 'is-hidden' );
	25	+ // insert every script tag inside the embed as a new script
	26	+ // to execute it
	27	+ for ( var n = 0; n < script_tags.length; n++ ) {
	28	+ var element = document.createElement( 'script' );
177	29
178		- continue;
179		- }
180		-
181		- optOutCheckboxes[ i ].addEventListener( 'click', function( event ) {
182		- var currentTarget = event.currentTarget;
183		-
184		- if ( ! currentTarget ) {
185		- return;
	30	+ if ( script_tags[ n ].src ) {
	31	+ // if script tag has a src attribute
	32	+ element.src = script_tags[ n ].src;
186	33	}
	34	+ else {
	35	+ // if script tag has content
	36	+ element.innerHTML = script_tags[ n ].innerHTML;
	37	+ }
187	38
188		- checkboxActivation( currentTarget );
189		- } );
190		- }
191		-
192		- const nonHiddenProviders = optOutContainer.querySelectorAll( '.embed-privacy-provider:not(.is-hidden)' );
193		-
194		- // remove the container completely if there is no provider to display
195		- if ( ! showAll && ! nonHiddenProviders.length ) {
196		- optOutContainer.remove();
197		- }
198		- }
199		-
200		- /**
201		- * Clicking on an overlay.
202		- *
203		- * @since 1.2.0
204		- *
205		- * @param {element} target Target element
206		- */
207		- function overlayClick( target ) {
208		- var embedContainer = target.parentNode;
209		- var embedContent = target.nextElementSibling;
210		-
211		- embedContainer.classList.remove( 'is-disabled' );
212		- embedContainer.classList.add( 'is-enabled' );
213		- // hide the embed overlay
214		- target.style.display = 'none';
215		- // get stored content from JavaScript
216		- var embedObject = JSON.parse( window[ '_' + target.parentNode.getAttribute( 'data-embed-id' ) ] );
217		-
218		- embedContent.innerHTML = htmlentities_decode( embedObject.embed );
219		-
220		- // reset wrapper inline CSS set in setMinHeight()
221		- var wrapper = embedContainer.parentNode;
222		-
223		- if ( wrapper.classList.contains( 'wp-block-embed__wrapper' ) ) {
224		- wrapper.style.removeProperty( 'height' );
225		- }
226		-
227		- // get all script tags inside the embed
228		- var scriptTags = embedContent.querySelectorAll( 'script' );
229		-
230		- // insert every script tag inside the embed as a new script
231		- // to execute it
232		- for ( var n = 0; n < scriptTags.length; n++ ) {
233		- var element = document.createElement( 'script' );
234		-
235		- if ( scriptTags[ n ].src ) {
236		- // if script tag has a src attribute
237		- element.src = scriptTags[ n ].src;
	39	+ // append it to body
	40	+ embed_content.appendChild( element );
238	41	}
239		- else {
240		- // if script tag has content
241		- element.innerHTML = scriptTags[ n ].innerHTML;
242		- }
243		-
244		- // append it to body
245		- embedContent.appendChild( element );
246		- }
247		-
248		- if ( typeof jQuery !== 'undefined' ) {
249		- const videoShortcode = jQuery( '.wp-video-shortcode' );
250		-
251		- if ( videoShortcode.length ) {
252		- videoShortcode.mediaelementplayer();
253		- }
254		- }
	42	+ } )
255	43	}
256		-
257		- /**
258		- * Calculate min height of the embed wrapper depending of the overlay content.
259		- */
260		- function setMinHeight() {
261		- for ( var i = 0; i < overlays.length; i++ ) {
262		- var wrapper = overlays[ i ].parentNode.parentNode;
263		-
264		- if ( ! wrapper.classList.contains( 'wp-block-embed__wrapper' ) ) {
265		- continue;
266		- }
267		-
268		- wrapper.style.removeProperty( 'height' );
269		-
270		- if ( wrapper.offsetHeight < overlays[ i ].offsetHeight ) {
271		- wrapper.style.height = overlays[ i ].offsetHeight + 'px';
272		- }
273		- }
274		- }
275		-} );
276		-
277		-/**
278		- * Get a cookie.
279		- *
280		- * @link https://stackoverflow.com/a/24103596/3461955
281		- *
282		- * @param {string} name The name of the cookie
283		- */
284		-function get_cookie( name ) {
285		- var nameEQ = name + '=';
286		- var ca = document.cookie.split( ';' );
287		- for ( var i = 0; i < ca.length; i++ ) {
288		- var c = ca[ i ];
289		- while ( c.charAt( 0 ) == ' ' ) c = c.substring( 1, c.length );
290		- if ( c.indexOf( nameEQ ) == 0 ) return c.substring( nameEQ.length, c.length );
291		- }
292		- return null;
293		-}
294		-
295		-/**
296		- * Decode a string with HTML entities.
297		- *
298		- * @param {string} content The content to decode
299		- * @return {string} The decoded content
300		- */
301		-function htmlentities_decode( content ) {
302		- var textarea = document.createElement( 'textarea' );
303		-
304		- textarea.innerHTML = content;
305		-
306		- return textarea.value;
307		-}
308		-
309		-/**
310		- * Remove a cookie.
311		- *
312		- * @link https://stackoverflow.com/a/24103596/3461955
313		- *
314		- * @param {string} name The name of the cookie
315		- */
316		-function remove_cookie( name ) {
317		- document.cookie = name + '=; expires=0; path=/';
318		-}
319		-
320		-/**
321		- * Set a cookie.
322		- *
323		- * @link https://stackoverflow.com/a/24103596/3461955
324		- *
325		- * @param {string} name The name of the cookie
326		- * @param {string} value The value of the cookie
327		- * @param {number} days The expiration in days
328		- */
329		-function set_cookie( name, value, days ) {
330		- var expires = '';
331		- if ( days ) {
332		- var date = new Date();
333		- date.setTime( date.getTime() + ( days * 24 * 60 * 60 * 1000 ) );
334		- expires = '; expires=' + date.toUTCString();
335		- }
336		- document.cookie = name + '=' + ( value || '' ) + expires + '; path=/';
337		-}
	44	+} );