WordPress.org

Make WordPress Core

Ticket #21812: 21812-3.patch

File 21812-3.patch, 10.1 KB (added by azaozz, 6 years ago)
  • wp-includes/js/tinymce/plugins/wordpress/editor_plugin_src.js

     
    77
    88        tinymce.create('tinymce.plugins.WordPress', {
    99                mceTout : 0,
     10                previews : {i: 0},
     11                reg_previews : [],
    1012
    1113                init : function(ed, url) {
    1214                        var t = this, tbId = ed.getParam('wordpress_adv_toolbar', 'toolbar2'), last = 0, moreHTML, nextpageHTML, closeOnClick, mod_key;
     15
    1316                        moreHTML = '<img src="' + url + '/img/trans.gif" class="mceWPmore mceItemNoResize" title="'+ed.getLang('wordpress.wp_more_alt')+'" />';
    1417                        nextpageHTML = '<img src="' + url + '/img/trans.gif" class="mceWPnextpage mceItemNoResize" title="'+ed.getLang('wordpress.wp_page_alt')+'" />';
    1518
    16                         if ( getUserSetting('hidetb', '0') == '1' )
     19                        t.ed = ed;
     20
     21                        if ( typeof(getUserSetting) == 'function' && getUserSetting('hidetb', '0') == '1' )
    1722                                ed.settings.wordpress_adv_hidden = 0;
    1823
    1924                        // Hides the specified toolbar and resizes the iframe
     
    251256                        // Add custom shortcuts
    252257                        mod_key = 'alt+shift';
    253258
    254                 //      if ( tinymce.isGecko ) // disable for mow, too many shortcuts conflicts
    255                 //              mod_key = 'ctrl+alt';
    256 
    257259                        ed.addShortcut(mod_key + '+c', 'justifycenter_desc', 'JustifyCenter');
    258260                        ed.addShortcut(mod_key + '+r', 'justifyright_desc', 'JustifyRight');
    259261                        ed.addShortcut(mod_key + '+l', 'justifyleft_desc', 'JustifyLeft');
     
    313315                        // close popups when clicking on the background
    314316                        tinymce.dom.Event.remove(document.body, 'click', closeOnClick);
    315317                        tinymce.dom.Event.add(document.body, 'click', closeOnClick);
     318
     319
     320                        // previews
     321                        ed.onPreInit.add( function(ed){
     322                                ed.schema.addValidElements('div[*]'); // so we can set contenteditable=false
     323
     324                                // add custom jQuery event so plugins can do:
     325                                // jQuery(document).on( 'wp_add_mce_previews', function(e, ed){ ed.wpPreviewRegister(args) } );
     326                                if ( typeof(jQuery) != 'undefined' )
     327                                        jQuery(document).trigger( 'wp_add_mce_previews', ed );
     328                        });
     329
     330                        // scan on paste and on inserting nodes/html (on send_to_editor)
     331                        ed.onInit.add(function(ed) {
     332                                ed.selection.onSetContent.add(function(sel, o) {
     333                                        var node;
     334
     335                                        if ( o.context && t.reg_previews.length ) {
     336                                                node = sel.getNode();
     337
     338                                                if ( node.innerHTML ) {
     339                                                        node.innerHTML = t.previews_step_1(node.innerHTML);
     340                                                        t.previews_step_2( ed.dom.select('div.wp-preview-wrap', node) );
     341                                                }
     342                                        }
     343                                });
     344                        });
     345                       
     346                        // scan the last paragraph on enter
     347                        ed.onKeyDown.add(function(ed, e){
     348                                var node, html;
     349
     350                                if ( e.keyCode == 13 ) {
     351                                        node = ed.selection.getNode();
     352
     353                                        if ( node.innerHTML ) {
     354                                                html = t.previews_step_1(node.innerHTML);
     355
     356                                                setTimeout(function(){ // delay so all other keydown events run
     357                                                        node.innerHTML = html;
     358
     359                                                        if ( ed.dom.is(node.lastChild, 'br') )
     360                                                                ed.dom.remove(node.lastChild);
     361
     362                                                        t.previews_step_2( ed.dom.select('div.wp-preview-wrap', node) );
     363                                                }, 50);
     364                                        }
     365                                }
     366                        });
     367
     368                        // runs every time content (html string) is loaded in the editor
     369                        ed.onBeforeSetContent.add(function(ed, o) {
     370                                t.previews = {i: 0};
     371
     372                                if ( o.content )
     373                                        o.content = t.previews_step_1(o.content);
     374                        });
     375                       
     376                        // runs when the DOM is ready every time content is loaded in the editor
     377                        ed.onLoadContent.add(function(ed, o){
     378                                t.previews_step_2( ed.dom.select('div.wp-preview-wrap') );
     379                        });
     380
     381                        ed.onPostProcess.add(function(ed, o) {
     382                                if ( ( o.get || o.save ) && o.content.indexOf('data-wp-preview="') > -1 ) {
     383                                        o.content = o.content.replace(/(<div[^>]+data-wp-preview="([^"]+)"[^>]*>)[\s\S]+?<div data-wp-preview-blocker="1">.*?<\/div><\/div>/g, function(a, b, c){
     384                                                var previews = t.previews, str = '<p>'+ decodeURIComponent(c) +'</p>', div_id = b.replace(/.+id="([^"]+)".+/, '$1');
     385
     386                                                if ( previews[div_id] && previews[div_id].cleanup_callback )
     387                                                        str = previews[div_id].cleanup_callback.call( t, { ed: ed, original: str } );
     388
     389                                                return str;
     390                                        });
     391                                }
     392                        });
     393
     394                        /*
     395                        store all preview args
     396                        args = {
     397                                ref_name: 'my_preview',
     398                                preview_regexp: /\[gallery[^\]]*\]/,
     399                                str_callback: function(obj){ console.log('str_callback'); console.log(obj); return obj.original+' 123 ' },
     400                                node_callback: function(obj){ console.log('node_callback'); console.log(obj) },
     401                                cleanup_callback: function(obj){ console.log('cleanup_callback'); console.log(obj); return obj.original }
     402                        }
     403                        */
     404                        ed.wpPreviewRegister = function(args) {
     405                                t.reg_previews.push(args);
     406                        };
    316407                },
    317408
    318409                getInfo : function() {
     
    418509
    419510                        // Replace images with morebreak
    420511                        ed.onPostProcess.add(function(ed, o) {
    421                                 if (o.get)
     512                                if ( o.get ) {
    422513                                        o.content = o.content.replace(/<img[^>]+>/g, function(im) {
    423                                                 if (im.indexOf('class="mceWPmore') !== -1) {
    424                                                         var m, moretext = (m = im.match(/alt="(.*?)"/)) ? m[1] : '';
     514                                                if ( im.indexOf('class="mceWPmore') !== -1 ) {
     515                                                        var m, moretext = ( m = im.match(/alt="(.*?)"/) ) ? m[1] : '';
    425516                                                        im = '<!--more'+moretext+'-->';
    426517                                                }
    427                                                 if (im.indexOf('class="mceWPnextpage') !== -1)
     518                                                if ( im.indexOf('class="mceWPnextpage') !== -1 )
    428519                                                        im = '<!--nextpage-->';
    429520
    430521                                                return im;
    431522                                        });
     523                                }
    432524                        });
    433525
    434526                        // Set active buttons if user selected pagebreak or more break
     
    436528                                cm.setActive('wp_page', n.nodeName === 'IMG' && ed.dom.hasClass(n, 'mceWPnextpage'));
    437529                                cm.setActive('wp_more', n.nodeName === 'IMG' && ed.dom.hasClass(n, 'mceWPmore'));
    438530                        });
     531                },
     532               
     533                previews_step_1: function(content) {
     534                        var self = this, previews = self.previews;
     535
     536                        if ( self.reg_previews.length ) {
     537                                tinymce.each( self.reg_previews, function(args){
     538                                        if ( !args.preview_regexp )
     539                                                return;
     540
     541                                        var regex = new RegExp( '(?:<p>\\s*)?(' + args.preview_regexp.source + ')(?:\\s*</p>)?', 'g' );
     542
     543                                        content = content.replace(regex, function(a, orig_str){
     544                                                var html, div_id, new_str;
     545
     546                                                previews.i++;
     547                                                div_id = 'wp_mce_preview_' + previews.i;
     548                                                // ed, self or this?
     549                                                new_str = args.str_callback.call( self, { ed: self.ed, original: orig_str, div_id: div_id } );
     550                                                previews[div_id] = args;
     551
     552                                                html = '<div id="'+ div_id +'" data-wp-preview="'+ encodeURIComponent(orig_str) +'" class="wp-preview-wrap" contenteditable="false">' +
     553                                                        '<div class="wp-preview">'+ new_str +'</div>' + // add inner wrapper so the preview node(s) can be appended there without disturbing the blocker and end divs?
     554                                                        '<div data-wp-preview-blocker="1">\uFEFF</div></div>';
     555
     556                                                return html;
     557                                        });
     558                                });
     559                        }
     560
     561                        return content;
     562                },
     563
     564                // go through the previews added in step_1 and fire node callback
     565                previews_step_2: function(nodes) {
     566                        var self = this;
     567
     568                        tinymce.each( nodes, function(node){
     569                                var div_id = node.id, args;
     570
     571                                if ( !div_id || !self.previews.hasOwnProperty(div_id) )
     572                                        return;
     573
     574                                args = self.previews[div_id];
     575
     576                                if ( args.node_callback ) { // use the inner wrapper as node in the callback
     577                                        args.node_callback.call( self, { ed: self.ed, node: node.firstChild, div_id: div_id } );
     578                                }
     579                        });
    439580                }
    440581        });
    441582
  • wp-includes/js/tinymce/plugins/wpgallery/editor_plugin_src.js

     
    2626                                if ( e.target.nodeName == 'IMG' && ed.dom.hasClass(e.target, 'wpGallery') )
    2727                                        ed.plugins.wordpress._showButtons(e.target, 'wp_gallerybtns');
    2828                        });
    29 
     29/*
    3030                        ed.onBeforeSetContent.add(function(ed, o) {
    3131                                o.content = t._do_gallery(o.content);
    3232                        });
     
    3535                                if (o.get)
    3636                                        o.content = t._get_gallery(o.content);
    3737                        });
     38*/
    3839                },
    3940
    4041                _do_gallery : function(co) {
  • wp-includes/js/tinymce/themes/advanced/skins/wp_theme/content.css

     
    141141        height: 250px;
    142142}
    143143
     144/* Previews */
     145
     146div[data-wp-preview-blocker] {
     147        height: 100%;
     148        width: 100%;
     149        position: absolute;
     150        background: #fff;
     151        opacity: 0.01;
     152        filter: alpha(opacity=1);
     153        top: 0;
     154        left: 0;
     155        bottom: 0;
     156        right: 0;
     157        z-index: 5;
     158}
     159
     160div[data-wp-preview-blocker].focused {
     161        background-color: #000;
     162        filter: alpha(opacity=25);
     163        opacity: 0.25;
     164}
     165
     166div.wp-preview-wrap {
     167        margin: 10px auto;
     168        position: relative;
     169}
     170
     171div.wp-preview-wrap,
     172div[data-wp-preview-blocker] {
     173        -ms-user-select: none;
     174        -moz-user-select: none; /* doesn't work */
     175        -webkit-user-select: none;
     176        user-select: none;
     177}
     178
     179div.wp-preview-wrap .gallery-icon {
     180        margin: 0;
     181}
     182
     183div.wp-preview-wrap .gallery-icon img {
     184        display: block;
     185        margin: 0 auto;
     186        padding: 0;
     187        max-width: 90%;
     188        height: auto;
     189        border: 0;
     190}
     191
     192div.wp-preview-wrap dd.gallery-caption {
     193        margin: 0 6%;
     194        font-size: 12px;
     195}
     196
     197div.wp-preview-wrap div.gallery {
     198        clear: both;
     199}
     200
     201div.wp-preview-wrap div.gallery dl.gallery-item {
     202        float: left;
     203        margin: 10px 0;
     204        padding: 0;
     205}
     206
     207div.wp-preview-wrap div.gallery-columns-1 dl.gallery-item {
     208        width: 99%;
     209}
     210
     211div.wp-preview-wrap div.gallery-columns-2 dl.gallery-item {
     212        width: 49.5%;
     213}
     214
     215div.wp-preview-wrap div.gallery-columns-3 dl.gallery-item {
     216        width: 33%;
     217}
     218
     219div.wp-preview-wrap div.gallery-columns-4 dl.gallery-item {
     220        width: 24.75%;
     221}
     222
     223div.wp-preview-wrap div.gallery-columns-5 dl.gallery-item {
     224        width: 19.8%;
     225}
     226
     227div.wp-preview-wrap div.gallery-columns-6 dl.gallery-item {
     228        width: 16.5%;
     229}
     230
     231div.wp-preview-wrap div.gallery-columns-7 dl.gallery-item {
     232        width: 14.2%;
     233}
     234
     235div.wp-preview-wrap div.gallery-columns-8 dl.gallery-item {
     236        width: 12.45%;
     237}
     238
     239div.wp-preview-wrap div.gallery-columns-9 dl.gallery-item {
     240        width: 11.1%;
     241}
     242
     243div.wp-preview-wrap div.gallery-columns-10 dl.gallery-item {
     244        width: 9.99%;
     245}
     246
     247
     248