WordPress.org
Get WordPress

Make WordPress Core


Ignore:
Timestamp:
10/05/2017 02:55:11 AM (7 years ago)
Author:
westonruter
Message:

Customize: Add default control template for standard input types.

Re-use default template instead of introducing custom one for the Discard Changes button.

See #30738.

File:
1 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-includes/class-wp-customize-manager.php

    r41768 r41771  
    36013601            $control->print_template();
    36023602        }
    3603 
    36043603        ?>
     3604
     3605        <script type="text/html" id="tmpl-customize-control-default-content">
     3606            <#
     3607            var inputId = _.uniqueId( 'customize-control-default-input-' );
     3608            var descriptionId = _.uniqueId( 'customize-control-default-description-' );
     3609            var describedByAttr = data.description ? ' aria-describedby="' + descriptionId + '" ' : '';
     3610            #>
     3611            <# switch ( data.type ) {
     3612                case 'checkbox': #>
     3613                    <span class="customize-inside-control-row">
     3614                        <input
     3615                            id="{{ inputId }}"
     3616                            {{{ describedByAttr }}}
     3617                            type="checkbox"
     3618                            value="{{ data.value }}"
     3619                            data-customize-setting-key-link="default"
     3620                        >
     3621                        <label for="{{ inputId }}">
     3622                            {{ data.label }}
     3623                        </label>
     3624                        <# if ( data.description ) { #>
     3625                            <span id="{{ descriptionId }}" class="description customize-control-description">{{{ data.description }}}</span>
     3626                        <# } #>
     3627                    </span>
     3628                    <#
     3629                    break;
     3630                case 'radio':
     3631                    if ( ! data.choices ) {
     3632                        return;
     3633                    }
     3634                    #>
     3635                    <# if ( data.label ) { #>
     3636                        <label for="{{ inputId }}" class="customize-control-title">
     3637                            {{ data.label }}
     3638                        </label>
     3639                    <# } #>
     3640                    <# if ( data.description ) { #>
     3641                        <span id="{{ descriptionId }}" class="description customize-control-description">{{{ data.description }}}</span>
     3642                    <# } #>
     3643                    <# _.each( data.choices, function( val, key ) { #>
     3644                        <span class="customize-inside-control-row">
     3645                            <#
     3646                            var value, text;
     3647                            if ( _.isObject( val ) ) {
     3648                                value = val.value;
     3649                                text = val.text;
     3650                            } else {
     3651                                value = key;
     3652                                text = val;
     3653                            }
     3654                            #>
     3655                            <input
     3656                                id="{{ inputId + '-' + value }}"
     3657                                type="radio"
     3658                                value="{{ value }}"
     3659                                name="{{ inputId }}"
     3660                                data-customize-setting-key-link="default"
     3661                                {{{ describedByAttr }}}
     3662                            >
     3663                            <label for="{{ inputId + '-' + value }}">{{ text }}</label>
     3664                        </span>
     3665                    <# } ); #>
     3666                    <#
     3667                    break;
     3668                default:
     3669                    #>
     3670                    <# if ( data.label ) { #>
     3671                        <label for="{{ inputId }}" class="customize-control-title">
     3672                            {{ data.label }}
     3673                        </label>
     3674                    <# } #>
     3675                    <# if ( data.description ) { #>
     3676                        <span id="{{ descriptionId }}" class="description customize-control-description">{{{ data.description }}}</span>
     3677                    <# } #>
     3678
     3679                    <#
     3680                    var inputAttrs = {
     3681                        id: inputId,
     3682                        'data-customize-setting-key-link': 'default'
     3683                    };
     3684                    if ( 'textarea' === data.type ) {
     3685                        inputAttrs.rows = '5';
     3686                    } else if ( 'button' === data.type ) {
     3687                        inputAttrs['class'] = 'button button-secondary';
     3688                        inputAttrs.type = 'button';
     3689                    } else {
     3690                        inputAttrs.type = data.type;
     3691                    }
     3692                    if ( data.description ) {
     3693                        inputAttrs['aria-describedby'] = descriptionId;
     3694                    }
     3695                    _.extend( inputAttrs, data.inputAttrs );
     3696                    #>
     3697
     3698                    <# if ( 'button' === data.type ) { #>
     3699                        <button
     3700                            <# _.each( _.extend( inputAttrs ), function( value, key ) { #>
     3701                                {{{ key }}}="{{ value }}"
     3702                            <# } ); #>
     3703                        >{{ inputAttrs.value }}</button>
     3704                    <# } else if ( 'textarea' === data.type ) { #>
     3705                        <textarea
     3706                            <# _.each( _.extend( inputAttrs ), function( value, key ) { #>
     3707                                {{{ key }}}="{{ value }}"
     3708                            <# }); #>
     3709                        >{{ inputAttrs.value }}</textarea>
     3710                    <# } else if ( 'select' === data.type ) { #>
     3711                        <select
     3712                            <# _.each( _.extend( inputAttrs ), function( value, key ) { #>
     3713                                {{{ key }}}="{{ value }}"
     3714                            <# }); #>
     3715                            >
     3716                            <# _.each( data.choices, function( val, key ) { #>
     3717                                <#
     3718                                var value, text;
     3719                                if ( _.isObject( val ) ) {
     3720                                    value = val.value;
     3721                                    text = val.text;
     3722                                } else {
     3723                                    value = key;
     3724                                    text = val;
     3725                                }
     3726                                #>
     3727                                <option value="{{ value }}">{{ text }}</option>
     3728                            <# } ); #>
     3729                        </select>
     3730                    <# } else { #>
     3731                        <input
     3732                            <# _.each( _.extend( inputAttrs ), function( value, key ) { #>
     3733                                {{{ key }}}="{{ value }}"
     3734                            <# }); #>
     3735                            >
     3736                    <# } #>
     3737            <# } #>
     3738        </script>
     3739
    36053740        <script type="text/html" id="tmpl-customize-notification">
    36063741            <li class="notice notice-{{ data.type || 'info' }} {{ data.alt ? 'notice-alt' : '' }} {{ data.dismissible ? 'is-dismissible' : '' }} {{ data.containerClasses || '' }}" data-code="{{ data.code }}" data-type="{{ data.type }}">
    … …  
    36223757            </ul>
    36233758        </script>
     3759
    36243760        <script type="text/html" id="tmpl-customize-preview-link-control" >
    36253761            <# var elementPrefix = _.uniqueId( 'el' ) + '-' #>
    … …  
    36383774                <button class="customize-copy-preview-link preview-control-element button button-secondary" data-component="button" data-copy-text="<?php esc_attr_e( 'Copy' ); ?>" data-copied-text="<?php esc_attr_e( 'Copied' ); ?>" ><?php esc_html_e( 'Copy' ); ?></button>
    36393775            </div>
    3640         </script>
    3641         <script type="text/html" id="tmpl-customize-trash-changeset-control">
    3642             <button type="button" class="button-link button-link-delete"><?php _e( 'Discard changes' ); ?></button>
    36433776        </script>
    36443777        <script type="text/html" id="tmpl-customize-selected-changeset-status-control">
Note: See TracChangeset for help on using the changeset viewer.