From f5534ec8d5941da29920e09a652164d2de556eac Mon Sep 17 00:00:00 2001 From: Weston Ruter Date: Fri, 20 Oct 2017 16:38:35 +0000 Subject: [PATCH] Code Editor: Improve ability to create Customizer `CodeEditorControl` instances in JS, lessening PHP dependencies. Allow `CodeEditorControl` to be instantiated with a `editor_settings` param which is merged with `wp.codeEditor.defaultSettings`. Also: * Turn redundant "CSS Code" control label into screen reader text for Additional CSS. * Remove `code-editor` as script dependency for `custom-html-widgets` since enqueueing is determined by `wp_enqueue_code_editor()`. * Remove useless exporting of `code_type` param to JS in `WP_Customize_Code_Editor_Control`. * Add `disabled` class to Custom HTML widget's Save button when linting errors are present. * Remove redundant `span` inside CodeEditorControl's `label`. See #41897, #12423, #41872. git-svn-id: https://develop.svn.wordpress.org/trunk@41957 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-admin/js/customize-controls.js | 37 +++++++++++++++++-- .../js/widgets/custom-html-widgets.js | 2 +- ...class-wp-customize-code-editor-control.php | 5 +-- src/wp-includes/script-loader.php | 2 +- .../tests/widgets/custom-html-widget.php | 4 +- 5 files changed, 40 insertions(+), 10 deletions(-) diff --git a/src/wp-admin/js/customize-controls.js b/src/wp-admin/js/customize-controls.js index 3faa76cc7a..ca9aadbd82 100644 --- a/src/wp-admin/js/customize-controls.js +++ b/src/wp-admin/js/customize-controls.js @@ -5152,15 +5152,43 @@ * @returns {void} */ initEditor: function() { - var control = this, element; + var control = this, element, editorSettings = false; + + // Obtain editorSettings for instantiation. + if ( wp.codeEditor && ( _.isUndefined( control.params.editor_settings ) || false !== control.params.editor_settings ) ) { + + // Obtain default editor settings. + editorSettings = wp.codeEditor.defaultSettings ? _.clone( wp.codeEditor.defaultSettings ) : {}; + editorSettings.codemirror = _.extend( + {}, + editorSettings.codemirror, + { + indentUnit: 2, + tabSize: 2 + } + ); + + // Merge editor_settings param on top of defaults. + if ( _.isObject( control.params.editor_settings ) ) { + _.each( control.params.editor_settings, function( value, key ) { + if ( _.isObject( value ) ) { + editorSettings[ key ] = _.extend( + {}, + editorSettings[ key ], + value + ); + } + } ); + } + } element = new api.Element( control.container.find( 'textarea' ) ); control.elements.push( element ); element.sync( control.setting ); element.set( control.setting() ); - if ( control.params.editor_settings ) { - control.initSyntaxHighlightingEditor( control.params.editor_settings ); + if ( editorSettings ) { + control.initSyntaxHighlightingEditor( editorSettings ); } else { control.initPlainTextareaEditor(); } @@ -8839,6 +8867,9 @@ sectionReady.done( function setupSectionDescription( section ) { var control = api.control( 'custom_css' ); + // Hide redundant label for visual users. + control.container.find( '.customize-control-title:first' ).addClass( 'screen-reader-text' ); + // Close the section description when clicking the close button. section.container.find( '.section-description-buttons .section-description-close' ).on( 'click', function() { section.container.find( '.section-meta .customize-section-description:first' ) diff --git a/src/wp-admin/js/widgets/custom-html-widgets.js b/src/wp-admin/js/widgets/custom-html-widgets.js index 53be441eda..6fd6421111 100644 --- a/src/wp-admin/js/widgets/custom-html-widgets.js +++ b/src/wp-admin/js/widgets/custom-html-widgets.js @@ -204,7 +204,7 @@ wp.customHtmlWidgets = ( function( $ ) { * @returns {void} */ onUpdateErrorNotice: function onUpdateErrorNotice( errorAnnotations ) { - control.saveButton.toggleClass( 'validation-blocked', errorAnnotations.length ); + control.saveButton.toggleClass( 'validation-blocked disabled', errorAnnotations.length ); control.updateErrorNotice( errorAnnotations ); } }); diff --git a/src/wp-includes/customize/class-wp-customize-code-editor-control.php b/src/wp-includes/customize/class-wp-customize-code-editor-control.php index 1b2be4d57d..32fd10962b 100644 --- a/src/wp-includes/customize/class-wp-customize-code-editor-control.php +++ b/src/wp-includes/customize/class-wp-customize-code-editor-control.php @@ -69,7 +69,6 @@ class WP_Customize_Code_Editor_Control extends WP_Customize_Control { */ public function json() { $json = parent::json(); - $json['code_type'] = $this->code_type; $json['editor_settings'] = $this->editor_settings; $json['input_attrs'] = $this->input_attrs; return $json; @@ -91,8 +90,8 @@ class WP_Customize_Code_Editor_Control extends WP_Customize_Control { ?> <# var elementIdPrefix = 'el' + String( Math.random() ); #> <# if ( data.label ) { #> -