1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
|
/* global tb_show, tb_remove */
/**
* Internal dependencies
*/
import './view.scss';
const name = 'membership-button';
const blockClassName = 'wp-block-jetpack-' + name;
/**
* Since "close" button is inside our checkout iframe, in order to close it, it has to pass a message to higher scope to close the modal.
*
* @param {event} eventFromIframe - message event that gets emmited in the checkout iframe.
* @listens message
*/
function handleIframeResult( eventFromIframe ) {
if ( eventFromIframe.origin === 'https://subscribe.wordpress.com' && eventFromIframe.data ) {
const data = JSON.parse( eventFromIframe.data );
if ( data && data.action === 'close' ) {
window.removeEventListener( 'message', handleIframeResult );
tb_remove();
}
}
}
function activateSubscription( block, blogId, planId, poweredText, lang ) {
block.addEventListener( 'click', () => {
tb_show(
null,
'https://subscribe.wordpress.com/memberships/?blog=' +
blogId +
'&plan=' +
planId +
'&lang=' +
lang +
'TB_iframe=true&height=600&width=400',
null
);
window.addEventListener( 'message', handleIframeResult, false );
const tbWindow = document.querySelector( '#TB_window' );
tbWindow.classList.add( 'jetpack-memberships-modal' );
const footer = document.createElement( 'DIV' );
footer.classList.add( 'TB_footer' );
footer.innerHTML = poweredText;
tbWindow.appendChild( footer );
} );
}
const initializeMembershipButtonBlocks = () => {
const membershipButtonBlocks = Array.prototype.slice.call(
document.querySelectorAll( '.' + blockClassName )
);
membershipButtonBlocks.forEach( block => {
const blogId = block.getAttribute( 'data-blog-id' );
const planId = block.getAttribute( 'data-plan-id' );
const lang = block.getAttribute( 'data-lang' );
const poweredText = block
.getAttribute( 'data-powered-text' )
.replace(
'WordPress.com',
'<a href="https://wordpress.com" target="_blank" rel="noreferrer noopener">WordPress.com</a>'
);
try {
activateSubscription( block, blogId, planId, poweredText, lang );
} catch ( err ) {
// eslint-disable-next-line no-console
console.error( 'Problem activating Membership Button ' + planId, err );
}
} );
};
if ( typeof window !== 'undefined' && typeof document !== 'undefined' ) {
// `DOMContentLoaded` may fire before the script has a chance to run
if ( document.readyState === 'loading' ) {
document.addEventListener( 'DOMContentLoaded', initializeMembershipButtonBlocks );
} else {
initializeMembershipButtonBlocks();
}
}
|