← All changes | js/admin/applications.js +28 -26 6.26 → trunk View file →

		@@ -67,13 +67,13 @@
67	67
68	68	container.innerHTML = '';
69	69
70	70	const contentWrapper = div( { className: 'frm-applications-index-content' } );
71		- container.appendChild( contentWrapper );
	71	+ container.append( contentWrapper );
72	72
73	73	const customTemplatesNav = getCustomTemplatesNav();
74	74
75		- contentWrapper.appendChild( customTemplatesNav );
	75	+ contentWrapper.append( customTemplatesNav );
76	76	renderFormidableTemplates( contentWrapper, data.templates );
77	77
78	78	const hookName = 'frm_application_render_templates';
79	79	const args = { data, customTemplatesNav };
		@@ -108,9 +108,9 @@
108	108	children: [
109	109	div( {
110	110	className: 'frm10 frm_clearfix',
111	111	children: [
112		- img( { src: getUrlToApplicationsImages() + 'folder.svg' } ),
	112	+ img( { src: `${ getUrlToApplicationsImages() }folder.svg` } ),
113	113	tag( 'h3', __( 'Improve your workflow with applications', 'formidable' ) ),
114	114	div( __( 'Applications help to organize your workspace by combining forms, Views, and pages into a full solution.', 'formidable' ) ),
115	115	]
116	116	} ),
		@@ -128,9 +128,9 @@
128	128	customTemplatesNav.parentNode.insertBefore( placeholder, customTemplatesNav.nextElementSibling );
129	129	}
130	130
131	131	function getUrlToApplicationsImages() {
132		- return frmGlobal.url + '/images/applications/';
	132	+ return `${ frmGlobal.url }/images/applications/`;
133	133	}
134	134
135	135	function renderFormidableTemplates( contentWrapper, templates ) {
136	136	elements.templatesGrid = div( {
		@@ -137,15 +137,15 @@
137	137	id: 'frm_application_templates_grid',
138	138	className: 'frm_grid_container frm-application-cards-grid'
139	139	} );
140	140	addTemplatesToGrid( templates );
141		- contentWrapper.appendChild( getTemplatesNav() );
142		- contentWrapper.appendChild( elements.templatesGrid );
	141	+ contentWrapper.append( getTemplatesNav() );
	142	+ contentWrapper.append( elements.templatesGrid );
143	143	}
144	144
145	145	function addTemplatesToGrid( templates ) {
146	146	templates.forEach(
147		- application => elements.templatesGrid.appendChild( createApplicationCard( application ) )
	147	+ application => elements.templatesGrid.append( createApplicationCard( application ) )
148	148	);
149	149	maybeTriggerSearch();
150	150	}
151	151
		@@ -186,9 +186,9 @@
186	186
187	187	categories.forEach( addCategoryToWrapper );
188	188	function addCategoryToWrapper( category, index ) {
189	189	if ( 0 !== index ) {
190		- wrapper.appendChild( document.createTextNode( '|' ) );
	190	+ wrapper.append( document.createTextNode( '|' ) );
191	191	}
192	192	const anchor = a( category );
193	193	if ( 0 === index ) {
194	194	anchor.classList.add( 'current' );
		@@ -205,9 +205,9 @@
205	205	anchor.classList.add( 'current' );
206	206	elements.activeCategoryAnchor = anchor;
207	207	}
208	208	);
209		- wrapper.appendChild( anchor );
	209	+ wrapper.append( anchor );
210	210	}
211	211
212	212	return wrapper;
213	213	}
		@@ -230,9 +230,9 @@
230	230	}
231	231
232	232	addTemplatesToGrid(
233	233	state.templates.filter(
234		- template => -1 !== template.categories.indexOf( category )
	234	+ template => template.categories.includes( category )
235	235	)
236	236	);
237	237	}
238	238
		@@ -246,9 +246,9 @@
246	246
247	247	function handleTemplateSearch( { foundSomething, notEmptySearchText } ) {
248	248	if ( false === elements.noTemplateSearchResultsPlaceholder ) {
249	249	elements.noTemplateSearchResultsPlaceholder = getNoResultsPlaceholder();
250		- elements.templatesGrid.appendChild( elements.noTemplateSearchResultsPlaceholder );
	250	+ elements.templatesGrid.append( elements.noTemplateSearchResultsPlaceholder );
251	251	}
252	252	elements.noTemplateSearchResultsPlaceholder.classList.toggle( 'frm_hidden', ! notEmptySearchText || foundSomething );
253	253	}
254	254
		@@ -272,10 +272,10 @@
272	272
273	273	if ( isTemplate ) {
274	274	card.classList.add( 'frm-application-template-card' );
275	275	card.classList.add( 'frm-locked-application-template' );
276		- card.appendChild( tag( 'hr' ) );
277		- card.appendChild( getCardContent() );
	276	+ card.append( tag( 'hr' ) );
	277	+ card.append( getCardContent() );
278	278
279	279	card.addEventListener(
280	280	'click',
281	281	event => 'a' !== event.target.nodeName.toLowerCase() && card.querySelector( 'a' ).click()
		@@ -303,19 +303,19 @@
303	303	} );
304	304
305	305	const templateControl = getUseThisTemplateControl( data );
306	306	if ( templateControl.classList.contains( 'frm-delete-application-trigger' ) ) {
307		- header.appendChild( templateControl );
	307	+ header.append( templateControl );
308	308	} else {
309		- titleWrapper.appendChild( templateControl );
	309	+ titleWrapper.append( templateControl );
310	310	}
311	311	if ( data.isNew ) {
312		- titleWrapper.appendChild( span( { className: 'frm-new-pill frm-meta-tag frm-fadein', text: __( 'NEW', 'formidable' ) } ) );
	312	+ titleWrapper.append( span( { className: 'frm-new-pill frm-meta-tag frm-fadein', text: __( 'NEW', 'formidable' ) } ) );
313	313	}
314	314
315	315	const counter = getItemCounter();
316	316	if ( false !== counter ) {
317		- header.appendChild( counter );
	317	+ header.append( counter );
318	318	}
319	319
320	320	return header;
321	321	}
		@@ -326,9 +326,9 @@
326	326	return wp.hooks.applyFilters( hookName, false, args );
327	327	}
328	328
329	329	function getCardContent() {
330		- const thumbnailFolderUrl = getUrlToApplicationsImages() + 'thumbnails/';
	330	+ const thumbnailFolderUrl = `${ getUrlToApplicationsImages() }thumbnails/`;
331	331	const filenameToUse = data.hasLiteThumbnail ? data.key + ( data.isWebp ? '.webp' : '.png' ) : 'placeholder.svg';
332	332	return div( {
333	333	className: 'frm-application-card-image-wrapper',
334	334	child: img( { src: thumbnailFolderUrl + filenameToUse } )
		@@ -338,11 +338,11 @@
338	338	return card;
339	339	}
340	340
341	341	function filterItemCount( counter, { data } ) {
342		- const hasForms = 'undefined' !== typeof data.formCount && '0' !== data.formCount;
343		- const hasViews = 'undefined' !== typeof data.viewCount && '0' !== data.viewCount;
344		- const hasPages = 'undefined' !== typeof data.pageCount && '0' !== data.pageCount;
	342	+ const hasForms = data.formCount !== undefined && '0' !== data.formCount;
	343	+ const hasViews = data.viewCount !== undefined && '0' !== data.viewCount;
	344	+ const hasPages = data.pageCount !== undefined && '0' !== data.pageCount;
345	345
346	346	if ( ! hasForms && ! hasViews && ! hasPages ) {
347	347	return counter;
348	348	}
		@@ -362,14 +362,14 @@
362	362	}
363	363
364	364	function addCount( countValue, pluralDescriptor, singularDescriptor ) {
365	365	if ( counter.children.length ) {
366		- counter.appendChild( document.createTextNode( ' | ' ) );
	366	+ counter.append( document.createTextNode( ' | ' ) );
367	367	}
368	368
369	369	const descriptor = '1' === countValue ? singularDescriptor : pluralDescriptor;
370		- counter.appendChild(
371		- span( countValue + ' ' + descriptor )
	370	+ counter.append(
	371	+ span( `${ countValue } ${ descriptor }` )
372	372	);
373	373	}
374	374
375	375	return counter;
		@@ -438,9 +438,9 @@
438	438	} )
439	439	);
440	440	}
441	441
442		- const placeholderImage = img( { src: getUrlToApplicationsImages() + 'placeholder.png' } );
	442	+ const placeholderImage = img( { src: `${ getUrlToApplicationsImages() }placeholder.png` } );
443	443	if ( placeholderImage.complete ) {
444	444	setTimeout( maybeCenterViewApplicationModal, 0 );
445	445	} else {
446	446	placeholderImage.addEventListener( 'load', maybeCenterViewApplicationModal );
		@@ -453,9 +453,9 @@
453	453	} ),
454	454	div( data.description )
455	455	];
456	456
457		- if ( data.usedAddons && data.usedAddons.length ) {
	457	+ if ( data.usedAddons?.length ) {
458	458	detailsChildren.push(
459	459	div( {
460	460	className: 'frm-application-modal-label',
461	461	text: __( 'Required Add-ons', 'formidable-pro' )
		@@ -524,8 +524,10 @@
524	524
525	525	if ( data.upgradeUrl ) {
526	526	primaryActionButton.classList.remove( 'dismiss' );
527	527	primaryActionButton.setAttribute( 'href', data.upgradeUrl );
	528	+ primaryActionButton.target = '_blank';
	529	+ primaryActionButton.rel = 'noopener';
528	530	}
529	531
530	532	const hookName = 'frm_view_application_modal_primary_action_button';
531	533	const args = { data };