WordPress.org

Make WordPress Core

Changeset 20013


Ignore:
Timestamp:
02/28/2012 08:03:40 AM (8 years ago)
Author:
azaozz
Message:

HTML in image captions: improve converting the caption html elements to a shortcode, catch some rare cases where image with a caption is pasted in the visual editor, see #18311

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-includes/js/tinymce/plugins/wpeditimage/editor_plugin_src.js

    r19984 r20013  
    142142                var id, cls, w, cap, div_cls;
    143143
    144                 id = b.match(/id=['"]([^'"]+)['"] ?/);
     144                id = b.match(/id=['"]([^'"]*)['"] ?/);
    145145                b = b.replace(id[0], '');
    146146
    147                 cls = b.match(/align=['"]([^'"]+)['"] ?/);
     147                cls = b.match(/align=['"]([^'"]*)['"] ?/);
    148148                b = b.replace(cls[0], '');
    149149
    150                 w = b.match(/width=['"]([0-9]+)['"] ?/);
     150                w = b.match(/width=['"]([0-9]*)['"] ?/);
    151151                b = b.replace(w[0], '');
    152152
     
    160160                    return c;
    161161
    162                 div_cls = (cls == 'aligncenter') ? 'mceTemp mceIEcenter' : 'mceTemp';
    163 
    164                 return '<div class="'+div_cls+'" draggable="true"><dl id="'+id+'" class="wp-caption '+cls+'" style="width: '+( 10 + parseInt(w) )+
     162                div_cls = 'mceTemp';
     163                if ( cls == 'aligncenter' )
     164                    div_cls += ' mceIEcenter';
     165
     166                return '<div class="'+div_cls+'"><dl id="'+id+'" class="wp-caption '+cls+'" style="width: '+( 10 + parseInt(w) )+
    165167                'px"><dt class="wp-caption-dt">'+c+'</dt><dd class="wp-caption-dd">'+cap+'</dd></dl></div>';
    166168            });
     
    168170
    169171        _get_shcode : function(content) {
    170             return content.replace(/<div class="mceTemp[^"]*">\s*<dl ([^>]+)>\s*<dt [^>]+>([\s\S]+?)<\/dt>\s*<dd [^>]+>([\s\S]+?)<\/dd>\s*<\/dl>\s*<\/div>/gi, function(a,b,c,cap){
    171                 var id, cls, w;
    172 
    173                 w = c.match(/width="([0-9]+)"/);
    174                 w = ( w && w[1] ) ? w[1] : '';
    175 
    176                 if ( !w || !cap )
    177                     return c;
    178 
    179                 id = b.match(/id="([^"]+)"/);
    180                 id = ( id && id[1] ) ? id[1] : '';
    181 
    182                 cls = b.match(/class="([^"]+)"/);
    183                 cls = ( cls && cls[1] ) ? cls[1] : '';
    184                 cls = cls.match(/align[a-z]+/) || 'alignnone';
    185 
    186                 cap = cap.replace(/<[a-z][^<>]+>/g, function(a){
    187                     return a.replace(/"/g, "'");
     172            return content.replace(/<div (?:id="attachment_|class="mceTemp)[^>]*>([\s\S]+?)<\/div>/g, function(a, b){
     173                var ret = b.replace(/<dl ([^>]+)>\s*<dt [^>]+>([\s\S]+?)<\/dt>\s*<dd [^>]+>([\s\S]*?)<\/dd>\s*<\/dl>/gi, function(a,b,c,cap){
     174                    var id, cls, w;
     175
     176                    w = c.match(/width="([0-9]*)"/);
     177                    w = ( w && w[1] ) ? w[1] : '';
     178
     179                    if ( !w || !cap )
     180                        return c;
     181
     182                    id = b.match(/id="([^"]*)"/);
     183                    id = ( id && id[1] ) ? id[1] : '';
     184
     185                    cls = b.match(/class="([^"]*)"/);
     186                    cls = ( cls && cls[1] ) ? cls[1] : '';
     187                    cls = cls.match(/align[a-z]+/) || 'alignnone';
     188
     189                    cap = cap.replace(/<[a-z][^<>]+>/g, function(a){
     190                        a = a.replace(/="[^"]+"/, function(b){
     191                            return b.replace(/'/g, '&#39;');
     192                        });
     193                        return a.replace(/"/g, "'");
     194                    });
     195
     196                    cap = cap.replace(/"/g, '&quot;');
     197
     198                    return '[caption id="'+id+'" align="'+cls+'" width="'+w+'" caption="'+cap+'"]'+c+'[/caption]';
    188199                });
    189200
    190                 cap = cap.replace(/"/g, '&quot;');
    191 
    192                 return '[caption id="'+id+'" align="'+cls+'" width="'+w+'" caption="'+cap+'"]'+c+'[/caption]';
     201                if ( ret.indexOf('[caption') !== 0 ) {
     202                    // the caption html seems brocken, try to find the image that may be wrapped in a link
     203                    // and may be followed by <p> with the caption text.
     204                    ret = b.replace(/[\s\S]*?((?:<a [^>]+>)?<img [^>]+>(?:<\/a>)?)(<p>[\s\S]*<\/p>)?[\s\S]*/gi, '<p>$1</p>$2');
     205                }
     206
     207                return ret;
    193208            });
    194209        },
Note: See TracChangeset for help on using the changeset viewer.