WordPress.org

Make WordPress Core

Ticket #27366: 27366-04.patch

File 27366-04.patch, 4.5 KB (added by gcorne, 6 years ago)
  • src/wp-includes/css/media-views.css

    diff --git src/wp-includes/css/media-views.css src/wp-includes/css/media-views.css
    index cccf307..f52aee9 100644
     
    16691669        margin: 10px 0;
    16701670}
    16711671
     1672.image-details .hidden {
     1673        display: none;
     1674}
     1675
    16721676.media-embed .setting input[type="text"],
    16731677.media-embed .setting textarea {
    16741678        display: block;
     
    17091713        margin-top: 10px;
    17101714}
    17111715
    1712 .advanced .hidden {
    1713         display: none;
    1714 }
    1715 
    17161716/* Drag & drop on the editor upload */
    17171717#wp-fullscreen-body .uploader-editor,
    17181718.wp-editor-wrap .uploader-editor {
  • src/wp-includes/js/media-views.js

    diff --git src/wp-includes/js/media-views.js src/wp-includes/js/media-views.js
    index 80db8d2..f2e033f 100644
     
    60646064                initialize: function() {
    60656065                        // used in AttachmentDisplay.prototype.updateLinkTo
    60666066                        this.options.attachment = this.model.attachment;
    6067                         if ( this.model.attachment ) {
    6068                                 this.listenTo( this.model, 'change:url', this.updateUrl );
    6069                                 this.listenTo( this.model, 'change:link', this.toggleLinkSettings );
    6070                         }
     6067                        this.listenTo( this.model, 'change:url', this.updateUrl );
     6068                        this.listenTo( this.model, 'change:link', this.toggleLinkSettings );
    60716069                        media.view.Settings.AttachmentDisplay.prototype.initialize.apply( this, arguments );
    60726070                },
    60736071
     
    61136111                },
    61146112
    61156113                updateUrl: function() {
    6116                         this.$( '.image img' ).attr( 'src', this.model.get('url' ) );
    6117                         this.$( '.url' ).val( this.model.get('url' ) );
     6114                        this.$( '.image img' ).attr( 'src', this.model.get( 'url' ) );
     6115                        this.$( '.url' ).val( this.model.get( 'url' ) );
    61186116                },
    61196117
    61206118                toggleLinkSettings: function() {
  • src/wp-includes/js/tinymce/plugins/wpeditimage/plugin.js

    diff --git src/wp-includes/js/tinymce/plugins/wpeditimage/plugin.js src/wp-includes/js/tinymce/plugins/wpeditimage/plugin.js
    index 9f76d4c..c00583f 100644
    tinymce.PluginManager.add( 'wpeditimage', function( editor ) { 
    114114        }
    115115
    116116        function extractImageData( imageNode ) {
    117                 var classes, metadata, captionBlock, caption, link,
     117                var classes, extraClasses, metadata, captionBlock, caption, link,
    118118                        dom = editor.dom;
    119119
    120120                // default attributes
    tinymce.PluginManager.add( 'wpeditimage', function( editor ) { 
    127127                        caption: '',
    128128                        alt: '',
    129129                        align: 'none',
     130                        extraClasses: '',
    130131                        link: false,
    131132                        linkUrl: '',
    132133                        linkClassName: '',
    133134                        linkTargetBlank: false,
    134135                        linkRel: '',
    135                         title: '',
    136                         className: ''
     136                        title: ''
    137137                };
    138138
    139139                metadata.url = dom.getAttrib( imageNode, 'src' );
    tinymce.PluginManager.add( 'wpeditimage', function( editor ) { 
    141141                metadata.title = dom.getAttrib( imageNode, 'title' );
    142142                metadata.width = parseInt( dom.getAttrib( imageNode, 'width' ), 10 );
    143143                metadata.height = parseInt( dom.getAttrib( imageNode, 'height' ), 10 );
    144                 metadata.className = imageNode.className;
    145144
    146                 classes = metadata.className.split( ' ' );
     145                classes = tinymce.explode( imageNode.className, ' ' );
     146                extraClasses = [];
     147
    147148                tinymce.each( classes, function( name ) {
    148149
    149150                        if ( /^wp-image/.test( name ) ) {
    150151                                metadata.attachment_id = parseInt( name.replace( 'wp-image-', '' ), 10 );
    151                         }
    152 
    153                         if ( /^align/.test( name ) ) {
     152                        } else if ( /^align/.test( name ) ) {
    154153                                metadata.align = name.replace( 'align', '' );
    155                         }
    156 
    157                         if ( /^size/.test( name ) ) {
     154                        } else if ( /^size/.test( name ) ) {
    158155                                metadata.size = name.replace( 'size-', '' );
     156                        } else {
     157                                extraClasses.push( name );
    159158                        }
     159
    160160                } );
    161161
     162                metadata.extraClasses = extraClasses.join( ' ' );
     163
    162164                // Extract caption
    163165                captionBlock = dom.getParents( imageNode, '.wp-caption' );
    164166
    tinymce.PluginManager.add( 'wpeditimage', function( editor ) { 
    251253        }
    252254
    253255        function createImageAndLink( imageData, mode ) {
    254                 var classes = [],
     256                var classes = tinymce.explode( imageData.extraClasses, ' ' ),
    255257                        attrs, linkAttrs;
    256258
    257259                mode = mode ? mode : 'node';
  • src/wp-includes/media-template.php

    diff --git src/wp-includes/media-template.php src/wp-includes/media-template.php
    index 76e595c..4908f43 100644
    function wp_print_media_templates() { 
    663663                                                                <span><?php _e('Title Attribute'); ?></span>
    664664                                                                <input type="text" data-setting="title" value="{{ data.model.title }}" />
    665665                                                        </label>
     666                                                        <label class="setting extra-classes">
     667                                                                <span><?php _e('CSS Class'); ?></span>
     668                                                                <input type="text" data-setting="extraClasses" value="{{ data.model.extraClasses }}" />
     669                                                        </label>
    666670                                                </div>
    667671                                        </div>
    668672