| @@ -147,13 +147,13 @@ | ||
| 147 | 147 | |
| 148 | 148 | const spinner = tag( 'span' ); |
| 149 | 149 | spinner.className = 'frm-wait frm_spinner'; |
| 150 | 150 | spinner.style.visibility = 'visible'; |
| 151 | - content.append( spinner ); | |
| 151 | + content.appendChild( spinner ); | |
| 152 | 152 | |
| 153 | 153 | const gap = div(); |
| 154 | 154 | gap.style.height = '20px'; |
| 155 | - content.append( gap ); | |
| 155 | + content.appendChild( gap ); | |
| 156 | 156 | |
| 157 | 157 | content.classList.add( 'frm-loading-page-options' ); |
| 158 | 158 | |
| 159 | 159 | jQuery.ajax( { |
| @@ -181,13 +181,13 @@ | ||
| 181 | 181 | const titleText = sprintf( __( 'Select the page you want to embed your %s into.', 'formidable' ), typeDescription ); |
| 182 | 182 | |
| 183 | 183 | const title = getLabel( titleText ); |
| 184 | 184 | title.setAttribute( 'for', 'frm_page_dropdown' ); |
| 185 | - content.append( title ); | |
| 185 | + content.appendChild( title ); | |
| 186 | 186 | |
| 187 | 187 | let editPageUrl; |
| 188 | 188 | |
| 189 | - const doneButton = modal.querySelector( '.frm_modal_footer .button-primary' ); | |
| 189 | + doneButton = modal.querySelector( '.frm_modal_footer .button-primary' ); | |
| 190 | 190 | doneButton.classList.remove( 'dismiss' ); |
| 191 | 191 | /* translators: %s: type (ie. view, form). */ |
| 192 | 192 | doneButton.textContent = sprintf( __( 'Insert %s', 'formidable' ), typeDescription ); |
| 193 | 193 | doneButton.addEventListener( 'click', redirectToExistingPageWithInjectedShortcode ); |
| @@ -193,9 +193,9 @@ | ||
| 193 | 193 | doneButton.addEventListener( 'click', redirectToExistingPageWithInjectedShortcode ); |
| 194 | 194 | |
| 195 | 195 | const dropdownWrapper = div(); |
| 196 | 196 | dropdownWrapper.innerHTML = response.html; |
| 197 | - content.append( dropdownWrapper ); | |
| 197 | + content.appendChild( dropdownWrapper ); | |
| 198 | 198 | |
| 199 | 199 | if ( 'form' === state.type ) { |
| 200 | 200 | editPageUrl = response.edit_page_url + '&frmForm=' + state.objectId; |
| 201 | 201 | } else { |
| @@ -280,22 +280,22 @@ | ||
| 280 | 280 | ); |
| 281 | 281 | |
| 282 | 282 | const title = getLabel( __( 'What will you call the new page?', 'formidable' ) ); |
| 283 | 283 | title.setAttribute( 'for', 'frm_name_your_page' ); |
| 284 | - form.append( title ); | |
| 284 | + form.appendChild( title ); | |
| 285 | 285 | |
| 286 | 286 | const input = tag( 'input' ); |
| 287 | 287 | input.id = 'frm_name_your_page'; |
| 288 | 288 | input.placeholder = __( 'Name your page', 'formidable' ); |
| 289 | - form.append( input ); | |
| 289 | + form.appendChild( input ); | |
| 290 | 290 | |
| 291 | - wrapper.append( form ); | |
| 292 | - content.append( wrapper ); | |
| 291 | + wrapper.appendChild( form ); | |
| 292 | + content.appendChild( wrapper ); | |
| 293 | 293 | |
| 294 | 294 | input.type = 'text'; |
| 295 | 295 | input.focus(); |
| 296 | 296 | |
| 297 | - const doneButton = modal.querySelector( '.frm_modal_footer .button-primary' ); | |
| 297 | + doneButton = modal.querySelector( '.frm_modal_footer .button-primary' ); | |
| 298 | 298 | doneButton.textContent = __( 'Create page', 'formidable' ); |
| 299 | 299 | doneButton.addEventListener( |
| 300 | 300 | 'click', |
| 301 | 301 | function( event ) { |
| @@ -312,9 +312,9 @@ | ||
| 312 | 312 | callback: () => { |
| 313 | 313 | content.innerHTML = ''; |
| 314 | 314 | |
| 315 | 315 | if ( 'form' === state.type ) { |
| 316 | - getEmbedFormManualExamples().forEach( example => content.append( getEmbedExample( example ) ) ); | |
| 316 | + getEmbedFormManualExamples().forEach( example => content.appendChild( getEmbedExample( example ) ) ); | |
| 317 | 317 | } else { |
| 318 | 318 | const hookName = 'frm_embed_examples'; |
| 319 | 319 | const hookArgs = { |
| 320 | 320 | type: state.type, |
| @@ -321,9 +321,9 @@ | ||
| 321 | 321 | objectId: state.objectId, |
| 322 | 322 | objectKey: state.objectKey |
| 323 | 323 | }; |
| 324 | 324 | wp.hooks.applyFilters( hookName, [], hookArgs ).forEach( |
| 325 | - example => content.append( getEmbedExample( example ) ) | |
| 325 | + example => content.appendChild( getEmbedExample( example ) ) | |
| 326 | 326 | ); |
| 327 | 327 | } |
| 328 | 328 | } |
| 329 | 329 | } |
| @@ -329,9 +329,9 @@ | ||
| 329 | 329 | } |
| 330 | 330 | ]; |
| 331 | 331 | |
| 332 | 332 | options.forEach( |
| 333 | - option => content.append( getModalOption( option ) ) | |
| 333 | + option => content.appendChild( getModalOption( option ) ) | |
| 334 | 334 | ); |
| 335 | 335 | |
| 336 | 336 | return content; |
| 337 | 337 | } |
| @@ -347,19 +347,19 @@ | ||
| 347 | 347 | } |
| 348 | 348 | |
| 349 | 349 | function getModalOption( { icon, label, description, callback } ) { |
| 350 | 350 | const output = div(); |
| 351 | - output.append( wrapModalOptionIcon( icon ) ); | |
| 351 | + output.appendChild( wrapModalOptionIcon( icon ) ); | |
| 352 | 352 | output.className = 'frm-embed-modal-option'; |
| 353 | 353 | output.setAttribute( 'tabindex', 0 ); |
| 354 | 354 | output.setAttribute( 'role', 'button' ); |
| 355 | 355 | |
| 356 | 356 | const textWrapper = div(); |
| 357 | - textWrapper.append( getLabel( label ) ); | |
| 358 | - textWrapper.append( div( description ) ); | |
| 359 | - output.append( textWrapper ); | |
| 357 | + textWrapper.appendChild( getLabel( label ) ); | |
| 358 | + textWrapper.appendChild( div( description ) ); | |
| 359 | + output.appendChild( textWrapper ); | |
| 360 | 360 | |
| 361 | - output.append( div( { className: 'caret' } ) ); | |
| 361 | + output.appendChild( div( { className: 'caret' } ) ); | |
| 362 | 362 | |
| 363 | 363 | output.addEventListener( |
| 364 | 364 | 'click', |
| 365 | 365 | function() { |
| @@ -406,9 +406,9 @@ | ||
| 406 | 406 | const labelElement = getLabel( label ); |
| 407 | 407 | labelElement.id = 'frm_embed_example_label_' + unique; |
| 408 | 408 | |
| 409 | 409 | const element = div(); |
| 410 | - element.append( labelElement ); | |
| 410 | + element.appendChild( labelElement ); | |
| 411 | 411 | |
| 412 | 412 | let exampleElement; |
| 413 | 413 | if ( example.length > 80 ) { |
| 414 | 414 | exampleElement = tag( 'textarea' ); |
| @@ -427,13 +427,13 @@ | ||
| 427 | 427 | const linkElement = tag( 'a' ); |
| 428 | 428 | linkElement.href = link; |
| 429 | 429 | linkElement.textContent = linkLabel; |
| 430 | 430 | linkElement.setAttribute( 'target', '_blank' ); |
| 431 | - element.append( linkElement ); | |
| 431 | + element.appendChild( linkElement ); | |
| 432 | 432 | } |
| 433 | 433 | |
| 434 | - element.append( exampleElement ); | |
| 435 | - element.append( getCopyIcon( label ) ); | |
| 434 | + element.appendChild( exampleElement ); | |
| 435 | + element.appendChild( getCopyIcon( label ) ); | |
| 436 | 436 | |
| 437 | 437 | return element; |
| 438 | 438 | } |
| 439 | 439 | |
| @@ -492,11 +492,11 @@ | ||
| 492 | 492 | element.setAttribute( 'aria-live', 'assertive' ); |
| 493 | 493 | element.setAttribute( 'id', id ); |
| 494 | 494 | element.className = 'frm_screen_reader frm_hidden'; |
| 495 | 495 | element.textContent = message; |
| 496 | - document.body.append( element ); | |
| 496 | + document.body.appendChild( element ); | |
| 497 | 497 | |
| 498 | - setTimeout( () => element.remove(), 1000 ); | |
| 498 | + setTimeout( () => document.body.removeChild( element ), 1000 ); | |
| 499 | 499 | } |
| 500 | 500 | |
| 501 | 501 | /** |
| 502 | 502 | * Get a unique id that automatically increments with every function call. |