← All changes | js/admin/embed.js +35 -35 6.25 → 6.13 View file →

		@@ -4,9 +4,9 @@
4	4	if ( 'undefined' === typeof ajaxurl || 'undefined' === typeof wp || 'undefined' === typeof frmDom ) {
5	5	return;
6	6	}
7	7
8		- const { __, sprintf } = wp.i18n;
	8	+ const __ = wp.i18n.__;
9	9	const { div, tag, svg } = frmDom;
10	10	const { maybeCreateModal, footerButton } = frmDom.modal;
11	11
12	12	let autoId = 0;
		@@ -73,9 +73,9 @@
73	73	}
74	74
75	75	function openEmbedModal() {
76	76	/* translators: %s type: ie form, view. */
77		- const title = sprintf( __( 'Embed %s', 'formidable' ), getTypeDescription() );
	77	+ const title = __( 'Embed %s', 'formidable' ).replace( '%s', getTypeDescription() );
78	78
79	79	modal = maybeCreateModal(
80	80	'frm_embed_modal',
81	81	{
		@@ -92,17 +92,17 @@
92	92	$modal.parent().addClass( 'frm-embed-modal-wrapper' );
93	93	}
94	94
95	95	function getModalFooter() {
96		- const doneButton = footerButton( {
	96	+ const doneButton = footerButton({
97	97	text: __( 'Done', 'formidable' ),
98	98	buttonType: 'primary'
99		- } );
	99	+ });
100	100
101		- const cancelButton = footerButton( {
	101	+ const cancelButton = footerButton({
102	102	text: __( 'Back', 'formidable' ),
103	103	buttonType: 'cancel'
104		- } );
	104	+ });
105	105	cancelButton.addEventListener(
106	106	'click',
107	107	function( event ) {
108	108	event.preventDefault();
		@@ -109,11 +109,11 @@
109	109	openEmbedModal();
110	110	}
111	111	);
112	112
113		- return div( {
	113	+ return div({
114	114	children: [ doneButton, cancelButton ]
115		- } );
	115	+ });
116	116	}
117	117
118	118	function offsetModalY( $modal, amount ) {
119	119	const position = {
		@@ -124,19 +124,19 @@
124	124	$modal.dialog( 'option', 'position', position );
125	125	}
126	126
127	127	function getModalOptions() {
128		- const content = div( { className: 'frm-embed-modal-content frm_wrap' } );
	128	+ const content = div({ className: 'frm-embed-modal-content frm_wrap' });
129	129	const typeDescription = getTypeDescription();
130	130
131	131	/* translators: %s type: ie form, view. */
132		- const existingPageDescription = sprintf( __( 'Embed your %s into an existing page.', 'formidable' ), typeDescription );
	132	+ const existingPageDescription = __( 'Embed your %s into an existing page.', 'formidable' ).replace( '%s', typeDescription );
133	133
134	134	/* translators: %s type: ie form, view. */
135		- const newPageDescription = sprintf( __( 'Put your %s on a newly created page.', 'formidable' ), typeDescription );
	135	+ const newPageDescription = __( 'Put your %s on a newly created page.', 'formidable' ).replace( '%s', typeDescription );
136	136
137	137	/* translators: %s type: ie form, view. */
138		- const insertManuallyDescription = sprintf( __( 'Use shortcodes or PHP code to put the %s anywhere.', 'formidable' ), typeDescription );
	138	+ const insertManuallyDescription = __( 'Use shortcodes or PHP code to put the %s anywhere.', 'formidable' ).replace( '%s', typeDescription );
139	139
140	140	const options = [
141	141	{
142	142	icon: '#frm_file_icon',
		@@ -155,9 +155,9 @@
155	155	content.appendChild( gap );
156	156
157	157	content.classList.add( 'frm-loading-page-options' );
158	158
159		- jQuery.ajax( {
	159	+ jQuery.ajax({
160	160	type: 'POST',
161	161	url: ajaxurl,
162	162	data: {
163	163	action: 'get_page_dropdown',
		@@ -164,9 +164,9 @@
164	164	nonce: frmGlobal.nonce
165	165	},
166	166	dataType: 'json',
167	167	success: addExistingPageDropdown
168		- } );
	168	+ });
169	169
170	170	function addExistingPageDropdown( response ) {
171	171	if ( 'object' !== typeof response || 'string' !== typeof response.html ) {
172	172	return;
		@@ -177,9 +177,9 @@
177	177
178	178	const typeDescription = getTypeDescription();
179	179
180	180	/* translators: %s: type (ie. view, form). */
181		- const titleText = sprintf( __( 'Select the page you want to embed your %s into.', 'formidable' ), typeDescription );
	181	+ const titleText = __( 'Select the page you want to embed your %s into.', 'formidable' ).replace( '%s', typeDescription );
182	182
183	183	const title = getLabel( titleText );
184	184	title.setAttribute( 'for', 'frm_page_dropdown' );
185	185	content.appendChild( title );
		@@ -188,9 +188,9 @@
188	188
189	189	doneButton = modal.querySelector( '.frm_modal_footer .button-primary' );
190	190	doneButton.classList.remove( 'dismiss' );
191	191	/* translators: %s: type (ie. view, form). */
192		- doneButton.textContent = sprintf( __( 'Insert %s', 'formidable' ), typeDescription );
	192	+ doneButton.textContent = __( 'Insert %s', 'formidable' ).replace( '%s', typeDescription );
193	193	doneButton.addEventListener( 'click', redirectToExistingPageWithInjectedShortcode );
194	194
195	195	const dropdownWrapper = div();
196	196	dropdownWrapper.innerHTML = response.html;
		@@ -221,9 +221,9 @@
221	221
222	222	const pageId = pageDropdown.value;
223	223
224	224	if ( '0' === pageId || '' === pageId ) {
225		- const error = div( { className: 'frm_error_style' } );
	225	+ const error = div({ className: 'frm_error_style' });
226	226	error.setAttribute( 'role', 'alert' );
227	227	error.textContent = __( 'Please select a page', 'formidable' );
228	228	content.insertBefore( error, title.nextElementSibling );
229	229	return;
		@@ -240,9 +240,9 @@
240	240	description: newPageDescription,
241	241	callback: () => {
242	242	content.innerHTML = '';
243	243
244		- const wrapper = div( { className: 'field-group' } );
	244	+ const wrapper = div({ className: 'field-group' });
245	245	const form = tag( 'form' );
246	246
247	247	const createPageWithShortcode = () => {
248	248	const hookName = 'frm_create_page_with_shortcode_data';
		@@ -255,9 +255,9 @@
255	255	name: input.value,
256	256	nonce: frmGlobal.nonce
257	257	}
258	258	);
259		- jQuery.ajax( {
	259	+ jQuery.ajax({
260	260	type: 'POST',
261	261	url: ajaxurl,
262	262	data,
263	263	dataType: 'json',
		@@ -265,9 +265,9 @@
265	265	if ( 'object' === typeof response && 'string' === typeof response.redirect ) {
266	266	window.location.href = response.redirect;
267	267	}
268	268	}
269		- } );
	269	+ });
270	270	};
271	271
272	272	form.addEventListener(
273	273	'submit',
		@@ -345,9 +345,9 @@
345	345	return __( 'form', 'formidable' );
346	346	}
347	347	}
348	348
349		- function getModalOption( { icon, label, description, callback } ) {
	349	+ function getModalOption({ icon, label, description, callback }) {
350	350	const output = div();
351	351	output.appendChild( wrapModalOptionIcon( icon ) );
352	352	output.className = 'frm-embed-modal-option';
353	353	output.setAttribute( 'tabindex', 0 );
		@@ -357,9 +357,9 @@
357	357	textWrapper.appendChild( getLabel( label ) );
358	358	textWrapper.appendChild( div( description ) );
359	359	output.appendChild( textWrapper );
360	360
361		- output.appendChild( div( { className: 'caret' } ) );
	361	+ output.appendChild( div({ className: 'caret' }) );
362	362
363	363	output.addEventListener(
364	364	'click',
365	365	function() {
		@@ -370,12 +370,12 @@
370	370	return output;
371	371	}
372	372
373	373	function wrapModalOptionIcon( iconHref ) {
374		- return div( {
	374	+ return div({
375	375	className: 'frm-icon-wrapper',
376		- child: svg( { href: iconHref } )
377		- } );
	376	+ child: svg({ href: iconHref })
	377	+ });
378	378	}
379	379
380	380	function getEmbedFormManualExamples() {
381	381	const formId = state.objectId;
		@@ -399,18 +399,18 @@
399	399
400	400	return examples;
401	401	}
402	402
403		- function getEmbedExample( { label, example, link, linkLabel } ) {
404		- const unique = getAutoId();
	403	+ function getEmbedExample({ label, example, link, linkLabel }) {
	404	+ let unique, element, labelElement, exampleElement, linkElement;
405	405
406		- const labelElement = getLabel( label );
	406	+ unique = getAutoId();
	407	+ element = div();
	408	+
	409	+ labelElement = getLabel( label );
407	410	labelElement.id = 'frm_embed_example_label_' + unique;
408		-
409		- const element = div();
410	411	element.appendChild( labelElement );
411	412
412		- let exampleElement;
413	413	if ( example.length > 80 ) {
414	414	exampleElement = tag( 'textarea' );
415	415	} else {
416	416	exampleElement = tag( 'input' );
		@@ -423,9 +423,9 @@
423	423	exampleElement.readOnly = true;
424	424	exampleElement.setAttribute( 'tabindex', -1 );
425	425
426	426	if ( 'undefined' !== typeof link && 'undefined' !== typeof linkLabel ) {
427		- const linkElement = tag( 'a' );
	427	+ linkElement = tag( 'a' );
428	428	linkElement.href = link;
429	429	linkElement.textContent = linkLabel;
430	430	linkElement.setAttribute( 'target', '_blank' );
431	431	element.appendChild( linkElement );
		@@ -442,14 +442,14 @@
442	442	return tag( 'label', args );
443	443	}
444	444
445	445	function getCopyIcon( label ) {
446		- const icon = svg( { href: '#frm_clone_icon' } );
	446	+ const icon = svg({ href: '#frm_clone_icon' });
447	447	icon.id = 'frm_copy_embed_' + getAutoId();
448	448	icon.setAttribute( 'tabindex', 0 );
449	449	icon.setAttribute( 'role', 'button' );
450	450	/* translators: %s: Example type (ie. WordPress shortcode, API Form script) */
451		- icon.setAttribute( 'aria-label', sprintf( __( 'Copy %s', 'formidable' ), label ) );
	451	+ icon.setAttribute( 'aria-label', __( 'Copy %s', 'formidable' ).replace( '%s', label ) );
452	452	icon.addEventListener(
453	453	'click',
454	454	() => copyExampleToClipboard( icon.parentNode.querySelector( '.frm_embed_example' ) )
455	455	);
		@@ -502,9 +502,9 @@
502	502	* Get a unique id that automatically increments with every function call.
503	503	* Can be used for any UI that requires a unique id.
504	504	* Not to be used in data.
505	505	*
506		- * @return {number} The unique id.
	506	+ * @returns {integer}
507	507	*/
508	508	function getAutoId() {
509	509	return ++autoId;
510	510	}