← All changes | modules/subscriptions/subscribe-overlay/subscribe-overlay.js +73 -0 16.2-beta → 16.3 View file →

		@@ -1,0 +1,73 @@
	1	+const { domReady } = wp;
	2	+
	3	+domReady( function () {
	4	+ const overlay = document.querySelector( '.jetpack-subscribe-overlay' );
	5	+ const overlayDismissedCookie = 'jetpack_post_subscribe_overlay_dismissed';
	6	+ const skipUrlParam = 'jetpack_skip_subscription_popup';
	7	+ const hasOverlayDismissedCookie =
	8	+ document.cookie && document.cookie.indexOf( overlayDismissedCookie ) > -1;
	9	+
	10	+ // Subscriber ended up here e.g. from emails:
	11	+ // we won't show the overlay to them in future since they most likely are already a subscriber.
	12	+ function skipOverlay() {
	13	+ const url = new URL( window.location.href );
	14	+ if ( url.searchParams.has( skipUrlParam ) ) {
	15	+ url.searchParams.delete( skipUrlParam );
	16	+ window.history.replaceState( {}, '', url );
	17	+ setOverlayDismissedCookie();
	18	+ return true;
	19	+ }
	20	+
	21	+ return false;
	22	+ }
	23	+
	24	+ if ( ! overlay || hasOverlayDismissedCookie || skipOverlay() ) {
	25	+ return;
	26	+ }
	27	+
	28	+ const close = overlay.querySelector( '.jetpack-subscribe-overlay__close' );
	29	+ close.onclick = function ( event ) {
	30	+ event.preventDefault();
	31	+ closeOverlay();
	32	+ };
	33	+
	34	+ const toContent = overlay.querySelector( '.jetpack-subscribe-overlay__to-content' );
	35	+ // User can edit overlay, and could remove to content link.
	36	+ if ( toContent ) {
	37	+ toContent.onclick = function ( event ) {
	38	+ event.preventDefault();
	39	+ closeOverlay();
	40	+ };
	41	+ }
	42	+
	43	+ // When the form is submitted, and next modal loads, it'll fire "subscription-modal-loaded" signalling that this form can be hidden.
	44	+ const form = overlay.querySelector( 'form' );
	45	+ if ( form ) {
	46	+ form.addEventListener( 'subscription-modal-loaded', closeOverlay );
	47	+ }
	48	+
	49	+ function closeOverlayOnEscapeKeydown( event ) {
	50	+ if ( event.key === 'Escape' ) {
	51	+ closeOverlay();
	52	+ }
	53	+ }
	54	+
	55	+ function openOverlay() {
	56	+ overlay.classList.add( 'open' );
	57	+ document.body.classList.add( 'jetpack-subscribe-overlay-open' );
	58	+ setOverlayDismissedCookie();
	59	+ window.addEventListener( 'keydown', closeOverlayOnEscapeKeydown );
	60	+ }
	61	+
	62	+ function closeOverlay() {
	63	+ overlay.classList.remove( 'open' );
	64	+ document.body.classList.remove( 'jetpack-subscribe-overlay-open' );
	65	+ window.removeEventListener( 'keydown', closeOverlayOnEscapeKeydown );
	66	+ }
	67	+
	68	+ function setOverlayDismissedCookie() {
	69	+ document.cookie = `${ overlayDismissedCookie }=true; path=/;`;
	70	+ }
	71	+
	72	+ openOverlay();
	73	+} );