WordPress.org

Make WordPress Core

Ticket #27016: 27016.2.diff

File 27016.2.diff, 5.7 KB (added by wonderboymusic, 7 years ago)
  • src/wp-includes/class-wp-editor.php

     
    234234                                                'textcolor',
    235235                                                'fullscreen',
    236236                                                'wordpress',
     237                                                'wpaudiovideo',
    237238                                                'wpeditimage',
    238239                                                'wpgallery',
    239240                                                'wplink',
     
    335336                                        self::$first_init['external_plugins'] = json_encode( $mce_external_plugins );
    336337                                }
    337338
     339                                $suffix = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ? '' : '.min';
     340                                $version = 'ver=' . $GLOBALS['wp_version'];
     341                                $dashicons = includes_url( "css/dashicons$suffix.css?$version" );
     342
    338343                                // WordPress default stylesheet
    339                                 $mce_css = array( self::$baseurl . '/skins/wordpress/wp-content.css' );
     344                                $mce_css = array( $dashicons, self::$baseurl . '/skins/wordpress/wp-content.css' );
    340345
    341346                                // load editor_style.css if the current theme supports it
    342347                                if ( ! empty( $GLOBALS['editor_styles'] ) && is_array( $GLOBALS['editor_styles'] ) ) {
  • src/wp-includes/js/tinymce/plugins/wpaudiovideo/plugin.js

     
     1/* global tinymce */
     2tinymce.PluginManager.add( 'wpaudiovideo', function( editor ) {
     3
     4        function parseMediaShortcode( content ) {
     5                return content.replace( /\[(audio|video)[^\]]*\][\s\S]*?\[\/\1\]/g, function( match, type ) {
     6                        var data = tinymce.DOM.encode( match.substr(1) ),
     7                                cls = 'wp-media-shortcode dashicons dashicons-format-' + type;
     8
     9                        return '<div class="' + cls + '" title="' + data + '" contenteditable="false">\u00a0</div>';
     10                });
     11        }
     12
     13        function getMediaShortcode( content ) {
     14                function getAttr( str, name ) {
     15                        name = new RegExp( name + '=\"([^\"]+)\"', 'g' ).exec( str );
     16                        return name ? window.decodeURIComponent( name[1] ) : '';
     17                }
     18
     19                return content.replace( /<div ([^>]+)>(?:\u00a0|&nbsp;| )*<\/div>/g, function( match, attr ) {
     20                        var cls = getAttr( attr, 'class' );
     21
     22                        if ( cls.indexOf('wp-media-shortcode') !== -1 ) {
     23                                return tinymce.trim( '[' + getAttr( attr, 'title' ) );
     24                        }
     25
     26                        return match;
     27                });
     28        }
     29
     30        editor.on( 'BeforeSetContent', function( e ) {
     31                e.content = parseMediaShortcode( e.content );
     32        });
     33
     34        editor.on( 'PostProcess', function( e ) {
     35                if ( e.get ) {
     36                        e.content = getMediaShortcode( e.content );
     37                }
     38        });
     39
     40        editor.on( 'init', function() {
     41                var dom = editor.dom,
     42                        selection = editor.selection;
     43
     44            function moveCaret( node ) {
     45                        selection.select(  node.nextSibling || node.previousSibling || node.parentNode );
     46                        selection.collapse( true );
     47                        editor.nodeChanged();
     48                }
     49
     50                function getWrapper( event ) {
     51                        if ( dom.hasClass( event.target, 'wp-control' ) ) {
     52                                return event.target;
     53                        } else {
     54                                return dom.getParent( event.target, 'div.wp-control' ) || dom.getParent( selection.getNode(), 'div.wp-control' );
     55                        }
     56                }
     57
     58                editor.on( 'click contextmenu', function( event ) {
     59                        var wrapper = getWrapper( event );
     60
     61                        if ( wrapper ) {
     62                                // Don't follow links in the non-editable wrapper
     63                                if ( dom.is( event.target, 'a' ) || dom.getParent( event.target, 'a' ) ) {
     64                                        event.preventDefault();
     65                                }
     66
     67                                if ( tinymce.Env.ie ) {
     68                                        // Move the caret out of the wrapper
     69                                        moveCaret( wrapper );
     70                                }
     71                        }
     72                });
     73
     74                editor.on( 'mousedown', function( event ) {
     75                        var wrapper = getWrapper( event );
     76
     77                        if ( wrapper ) {
     78                                dom.addClass( wrapper, 'wp-selected' )
     79                                event.preventDefault();
     80
     81                                if ( tinymce.Env.ie && tinymce.Env.ie < 9 ) {
     82                                        // Move the caret out of the wrapper
     83                                        setTimeout( function() {
     84                                                moveCaret( wrapper );
     85                                        }, 0 );
     86
     87
     88                                        // Prevent IE < 9 from making the div resizable.
     89                                        // Without this the tick border and resize handles show for a moment.
     90                                        // oncontrolselect and unselectable="on" don't seem to work here :(
     91                //                      throw new Error('(ignore me)');
     92                                }
     93                        } else {
     94                                dom.removeClass( dom.select( 'div.wp-selected' ), 'wp-selected' );
     95                        }
     96                });
     97
     98                editor.on( 'keydown', function( event ) {
     99                        var element, p,
     100                                key = event.keyCode;
     101
     102                        if ( key === tinymce.util.VK.DELETE || key === tinymce.util.VK.BACKSPACE ) {
     103                                element = dom.select( 'div.wp-selected' );
     104
     105                                if ( element.length ) {
     106                                        dom.events.cancel( event );
     107                                        dom.remove( element[0] );
     108                                        editor.nodeChanged();
     109                                }
     110                        }
     111                });
     112        });
     113
     114        return {
     115                parseMediaShortcode: parseMediaShortcode,
     116                getMediaShortcode: getMediaShortcode
     117        };
     118});
  • src/wp-includes/js/tinymce/skins/wordpress/wp-content.css

     
    127127        border-style: solid;
    128128}
    129129
     130/* Audio/video shortcodes */
     131.mce-content-body .wp-media-shortcode {
     132        margin-bottom: 20px;
     133        border: 1px dashed #888;
     134        background: #f2f2f2;
     135        width: 99%;
     136        height: 250px;
     137        line-height: 250px;
     138        outline: 0;
     139        cursor: default;
     140        color: transparent;
     141        font-size: 48px;
     142        -webkit-user-select: none;
     143        -moz-user-select: none;
     144        user-select: none;
     145}
     146
     147.mce-content-body .wp-media-shortcode:before {
     148        color: #444;
     149}
     150
     151.mce-content-body .wp-media-shortcode.dashicons-format-audio {
     152        height: 40px;
     153        line-height: 40px;
     154        font-size: 20px;
     155}
     156
     157.mce-content-body .wp-media-shortcode-selected {
     158        background-color: #ededed;
     159        border-style: solid;
     160}
     161
    130162img.wp-oembed {
    131163        border: 1px dashed #888;
    132164        background: #f7f5f2 url("images/embedded.png") no-repeat scroll center center;