/* global grunionEditorView, tinyMCE, QTags */ ( function ( $, wp, grunionEditorView ) { wp.mce = wp.mce || {}; if ( 'undefined' === typeof wp.mce.views ) { return; } wp.mce.grunion_wp_view_renderer = { shortcode_string: 'contact-form', template: wp.template( 'grunion-contact-form' ), field_templates: { email: wp.template( 'grunion-field-email' ), telephone: wp.template( 'grunion-field-telephone' ), textarea: wp.template( 'grunion-field-textarea' ), radio: wp.template( 'grunion-field-radio' ), checkbox: wp.template( 'grunion-field-checkbox' ), 'checkbox-multiple': wp.template( 'grunion-field-checkbox-multiple' ), select: wp.template( 'grunion-field-select' ), date: wp.template( 'grunion-field-date' ), text: wp.template( 'grunion-field-text' ), name: wp.template( 'grunion-field-text' ), url: wp.template( 'grunion-field-url' ), }, edit_template: wp.template( 'grunion-field-edit' ), editor_inline: wp.template( 'grunion-editor-inline' ), editor_option: wp.template( 'grunion-field-edit-option' ), getContent: function () { let content = this.shortcode.content, index = 0, field, named, body = ''; // If it's the legacy `[contact-form /]` syntax, populate default fields. if ( ! content ) { content = grunionEditorView.default_form; } // Render the fields. while ( ( field = wp.shortcode.next( 'contact-field', content, index ) ) ) { index = field.index + field.content.length; named = field.shortcode.attrs.named; if ( ! named.type || ! this.field_templates[ named.type ] ) { named.type = 'text'; } if ( named.required ) { named.required = grunionEditorView.labels.required_field_text; } if ( named.options && 'string' === typeof named.options ) { named.options = named.options.split( ',' ); } body += this.field_templates[ named.type ]( named ); } const options = { body: body, submit_button_text: grunionEditorView.labels.submit_button_text, }; return this.template( options ); }, edit: function ( data, update_callback ) { let shortcode_data = wp.shortcode.next( this.shortcode_string, data ), shortcode = shortcode_data.shortcode, $tinyMCE_document = $( tinyMCE.activeEditor.getDoc() ), $view = $tinyMCE_document.find( '.wpview.wpview-wrap' ).filter( function () { return $( this ).attr( 'data-mce-selected' ); } ), $editframe = $( '