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.

Built from https://develop.svn.wordpress.org/trunk@41957


git-svn-id: http://core.svn.wordpress.org/trunk@41791 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Weston Ruter 2017-10-20 16:39:48 +00:00
parent 33012ad740
commit 81c87e7d5e
7 changed files with 43 additions and 13 deletions

View File

@ -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' )

File diff suppressed because one or more lines are too long

View File

@ -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 );
}
});

File diff suppressed because one or more lines are too long

View File

@ -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 ) { #>
<label for="{{ elementIdPrefix }}_editor">
<span class="customize-control-title">{{ data.label }}</span>
<label for="{{ elementIdPrefix }}_editor" class="customize-control-title">
{{ data.label }}
</label>
<# } #>
<# if ( data.description ) { #>

View File

@ -720,7 +720,7 @@ function wp_default_scripts( &$scripts ) {
$scripts->add( 'media-gallery-widget', "/wp-admin/js/widgets/media-gallery-widget$suffix.js", array( 'media-widgets' ) );
$scripts->add( 'media-video-widget', "/wp-admin/js/widgets/media-video-widget$suffix.js", array( 'media-widgets', 'media-audiovideo', 'wp-api-request' ) );
$scripts->add( 'text-widgets', "/wp-admin/js/widgets/text-widgets$suffix.js", array( 'jquery', 'backbone', 'editor', 'wp-util', 'wp-a11y' ) );
$scripts->add( 'custom-html-widgets', "/wp-admin/js/widgets/custom-html-widgets$suffix.js", array( 'code-editor', 'jquery', 'backbone', 'wp-util', 'jquery-ui-core', 'wp-a11y' ) );
$scripts->add( 'custom-html-widgets', "/wp-admin/js/widgets/custom-html-widgets$suffix.js", array( 'jquery', 'backbone', 'wp-util', 'jquery-ui-core', 'wp-a11y' ) );
$scripts->add( 'theme', "/wp-admin/js/theme$suffix.js", array( 'wp-backbone', 'wp-a11y', 'customize-base' ), false, 1 );

View File

@ -4,7 +4,7 @@
*
* @global string $wp_version
*/
$wp_version = '4.9-beta3-41956';
$wp_version = '4.9-beta3-41957';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.