WordPress.org
Get WordPress

Make WordPress Core

Ticket #27389: 27389.8.diff

File 27389.8.diff, 13.0 KB (added by wonderboymusic, 12 years ago)

  • src/wp-includes/js/mce-view.js

     
    3131                        var html = this.getHtml();
    3232                        // Search all tinymce editor instances and update the placeholders
    3333                        _.each( tinymce.editors, function( editor ) {
    34                                 var doc;
     34                                var doc, self = this;
    3535                                if ( editor.plugins.wpview ) {
    3636                                        doc = editor.getDoc();
    37                                         $( doc ).find( '[data-wpview-text="' + this.encodedText + '"]' ).html( html );
     37                                        $( doc ).find( '[data-wpview-text="' + this.encodedText + '"]' ).each(function (i, elem) {
     38                                                var node = $( elem );
     39                                                node.html( html );
     40                                                $( self ).trigger( 'ready', elem );
     41                                        });
    3842                                }
    3943                        }, this );
    4044                }
    … …  
    178182
    179183                /**
    180184                 * Refresh views after an update is made
    181                  * 
     185                 *
    182186                 * @param view {object} being refreshed
    183187                 * @param text {string} textual representation of the view
    184188                 */
    … …  
    204208                        return instances[ encodedText ];
    205209                },
    206210
    207                 /** 
     211                /**
    208212                 * render( scope )
    209                  * 
     213                 *
    210214                 * Renders any view instances inside a DOM node `scope`.
    211215                 *
    212216                 * View instances are detected by the presence of wrapper elements.

  • src/wp-includes/js/media-audiovideo.js

     
    1 /* global _wpMediaViewsL10n */
     1/* global _wpMediaViewsL10n, _wpmejsSettings, MediaElementPlayer */
    22
    33(function ($, _, Backbone) {
    44        var media = wp.media, l10n = typeof _wpMediaViewsL10n === 'undefined' ? {} : _wpMediaViewsL10n;
    … …  
    6161                                video: ['ogg', 'webm']
    6262                        },
    6363                        'chrome' : {
    64                                 audio: ['ogg', 'mpeg', 'x-ms-wma'],
     64                                audio: ['ogg', 'mpeg'],
    6565                                video: ['ogg', 'webm', 'mp4', 'm4v', 'mpeg']
    6666                        },
    6767                        'ff' : {
    … …  
    227227                        return frame;
    228228                },
    229229
    230                 shortcode : function (shortcode) {
    231                         var self = this;
     230                update : function (model) {
     231                        var self = this, content;
    232232
    233                         _.each( wp.media.audio.defaults, function( value, key ) {
    234                                 shortcode[ key ] = self.coerce( shortcode, key );
     233                        _.each( this.defaults, function( value, key ) {
     234                                model[ key ] = self.coerce( model, key );
    235235
    236                                 if ( value === shortcode[ key ] ) {
    237                                         delete shortcode[ key ];
     236                                if ( value === model[ key ] ) {
     237                                        delete model[ key ];
    238238                                }
    239239                        });
    240240
    241                         return wp.shortcode.string({
    242                                 tag:     'audio',
    243                                 attrs:   shortcode
     241                        content = model.content;
     242                        delete model.content;
     243
     244                        return new wp.shortcode({
     245                                tag: 'audio',
     246                                attrs: model,
     247                                content: content
    244248                        });
    245249                }
    246250        };
    … …  
    283287                        return frame;
    284288                },
    285289
    286                 shortcode : function (shortcode) {
    287                         var self = this, content = shortcode.content;
    288                         delete shortcode.content;
     290                update : function (model) {
     291                        var self = this, content;
    289292
    290293                        _.each( this.defaults, function( value, key ) {
    291                                 shortcode[ key ] = self.coerce( shortcode, key );
     294                                model[ key ] = self.coerce( model, key );
    292295
    293                                 if ( value === shortcode[ key ] ) {
    294                                         delete shortcode[ key ];
     296                                if ( value === model[ key ] ) {
     297                                        delete model[ key ];
    295298                                }
    296299                        });
    297300
    298                         return wp.shortcode.string({
    299                                 tag:     'video',
    300                                 attrs:   shortcode,
     301                        content = model.content;
     302                        delete model.content;
     303
     304                        return new wp.shortcode({
     305                                tag: 'video',
     306                                attrs: model,
    301307                                content: content
    302308                        });
    303309                }
    … …  
    972978                }
    973979        } );
    974980
     981        wp.mce.media = {
     982                toView:  function( content ) {
     983                        var match = wp.shortcode.next( this.shortcode, content );
     984
     985                        if ( ! match ) {
     986                                return;
     987                        }
     988
     989                        return {
     990                                index:   match.index,
     991                                content: match.content,
     992                                options: {
     993                                        shortcode: match.shortcode
     994                                }
     995                        };
     996                },
     997
     998                edit: function( node ) {
     999                        var p,
     1000                                media = wp.media[ this.shortcode ],
     1001                                self = this,
     1002                                frame, data;
     1003
     1004                        wp.media.mixin.pauseAllPlayers();
     1005
     1006                        data = window.decodeURIComponent( $( node ).data('wpview-text') );
     1007                        frame = media.edit( data );
     1008                        frame.on( 'close', function () {
     1009                                frame.detach();
     1010                        } );
     1011                        frame.state( self.shortcode + '-details' ).on( 'update', function( selection ) {
     1012                                var shortcode = wp.media[ self.shortcode ].update( selection ).string();
     1013                                $( node ).attr( 'data-wpview-text', window.encodeURIComponent( shortcode ) );
     1014                                wp.mce.views.refreshView( self, shortcode );
     1015                                frame.detach();
     1016                        } );
     1017                        frame.open();
     1018                }
     1019        };
     1020
     1021        wp.mce.media.View = wp.mce.View.extend({
     1022                initialize: function( options ) {
     1023                        this.shortcode = options.shortcode;
     1024                        _.bindAll( this, 'setPlayer' );
     1025                        $(this).on( 'ready', this.setPlayer );
     1026                },
     1027
     1028                setPlayer: function (e, node) {
     1029                        // if the ready event fires on an empty node
     1030                        if ( ! node ) {
     1031                                return;
     1032                        }
     1033
     1034                        var self = this,
     1035                                media,
     1036                                settings = {},
     1037                                className = '.wp-' +  this.shortcode.tag + '-shortcode';
     1038
     1039                        if ( this.player ) {
     1040                                this.unsetPlayer();
     1041                        }
     1042
     1043                        media = $( node ).find( className );
     1044
     1045                        if ( ! _.isUndefined( window._wpmejsSettings ) ) {
     1046                                settings.pluginPath = _wpmejsSettings.pluginPath;
     1047                        }
     1048
     1049                        if ( ! this.isCompatible( media ) ) {
     1050                                media.closest( '.wpview-wrap' ).addClass( 'wont-play' );
     1051                                if ( ! media.parent().hasClass( 'wpview-wrap' ) ) {
     1052                                        media.parent().replaceWith( media );
     1053                                }
     1054                                media.replaceWith( '<p>' + media.find( 'source' ).eq(0).prop( 'src' ) + '</p>' );
     1055                                return;
     1056                        } else {
     1057                                media.closest( '.wpview-wrap' ).removeClass( 'wont-play' );
     1058                                if ( this.ua.is( 'ff' ) ) {
     1059                                        media.prop( 'preload', 'metadata' );
     1060                                } else {
     1061                                        media.prop( 'preload', 'none' );
     1062                                }
     1063                        }
     1064
     1065                        media = wp.media.view.MediaDetails.prepareSrc( media.get(0) );
     1066
     1067                        // Thanks, Firefox!
     1068                        setTimeout(function () {
     1069                                self.player = new MediaElementPlayer( media, settings );
     1070                        }, 50);
     1071                },
     1072
     1073                getHtml: function() {
     1074                        var attrs = this.shortcode.attrs.named;
     1075                        return this.template({ model: attrs });
     1076                }
     1077        });
     1078        _.extend( wp.mce.media.View.prototype, wp.media.mixin );
     1079
     1080        wp.mce.video = _.extend( {}, wp.mce.media, {
     1081                shortcode: 'video',
     1082                View: wp.mce.media.View.extend({
     1083                        className: 'editor-video',
     1084                        template:  media.template('editor-video')
     1085                })
     1086        } );
     1087
     1088        wp.mce.views.register( 'video', wp.mce.video );
     1089
     1090        wp.mce.audio = _.extend( {}, wp.mce.media, {
     1091                shortcode: 'audio',
     1092                View: wp.mce.media.View.extend({
     1093                        className: 'editor-audio',
     1094                        template:  media.template('editor-audio')
     1095                })
     1096        } );
     1097
     1098        wp.mce.views.register( 'audio', wp.mce.audio );
     1099
    9751100        function init() {
    9761101                $(document.body)
    9771102                        .on( 'click', '.wp-switch-editor', wp.media.mixin.pauseAllPlayers )

  • src/wp-includes/js/tinymce/plugins/wpgallery/plugin.js

     
    2525        }
    2626
    2727        function replaceAVShortcodes( content ) {
    28                 var testRegex = /\[(video-playlist|audio|video|playlist)[^\]]*\]/,
    29                         replaceRegex = /\[(video-playlist|audio|video|playlist)[^\]]*\]([\s\S]*?\[\/\1\])?/;
     28                var testRegex = /\[(video-playlist|playlist)[^\]]*\]/,
     29                        replaceRegex = /\[(video-playlist|playlist)[^\]]*\]([\s\S]*?\[\/\1\])?/;
    3030
    3131                while ( testRegex.test( content ) ) {
    3232                        content = content.replace( replaceRegex, replaceCallback );
    … …  
    9292                                editor.dom.setAttrib( node, 'data-wp-media', window.encodeURIComponent( shortcode ) );
    9393                                frame.detach();
    9494                        });
    95                 } else if ( editor.dom.hasClass( node, 'wp-video' ) ) {
    96                         frame = wp.media.video.edit( data );
    97                         frame.on( 'close', function () {
    98                                 frame.detach();
    99                         } );
    100                         frame.state( 'video-details' ).on(
    101                                 'update replace add-source select-poster-image add-track',
    102                                 function ( selection ) {
    103                                         var shortcode = wp.media.video.shortcode( selection );
    104                                         editor.dom.setAttrib( node, 'data-wp-media', window.encodeURIComponent( shortcode ) );
    105                                         frame.detach();
    106                                 }
    107                         );
    108                         frame.open();
    109                 } else if ( editor.dom.hasClass( node, 'wp-audio' ) ) {
    110                         frame = wp.media.audio.edit( data );
    111                         frame.on( 'close', function () {
    112                                 frame.detach();
    113                         } );
    114                         frame.state( 'audio-details' ).on( 'update replace add-source', function ( selection ) {
    115                                 var shortcode = wp.media.audio.shortcode( selection );
    116                                 editor.dom.setAttrib( node, 'data-wp-media', window.encodeURIComponent( shortcode ) );
    117                                 frame.detach();
    118                         } );
    119                         frame.open();
    12095                } else {
    12196                        // temp
    12297                        window.console && window.console.log( 'Edit AV shortcode ' + data );
    … …  
    177152                if ( node.nodeName === 'IMG' && dom.getAttrib( node, 'data-wp-media' ) ) {
    178153                        if ( dom.hasClass( node, 'wp-gallery' ) ) {
    179154                                event.name = 'gallery';
    180                         } else if ( dom.hasClass( node, 'wp-video' ) ) {
    181                                 event.name = 'video';
    182                         } else if ( dom.hasClass( node, 'wp-audio' ) ) {
    183                                 event.name = 'audio';
    184155                        } else if ( dom.hasClass( node, 'wp-playlist' ) ) {
    185156                                event.name = 'playlist';
    186157                        } else if ( dom.hasClass( node, 'wp-video-playlist' ) ) {

  • src/wp-includes/js/tinymce/skins/wordpress/wp-content.css

     
    141141        background-image: url(images/gallery.png);
    142142}
    143143
    144 .mce-content-body img.wp-media.wp-video {
    145         background-image: url(images/video.png);
    146 }
    147 
    148 .mce-content-body img.wp-media.wp-audio {
    149         height: 70px;
    150         background-image: url(images/audio.png);
    151 }
    152 
    153144.mce-content-body img.wp-media.wp-playlist {
    154145        background-image: url("images/playlist-audio.png");
    155146}
    … …  
    223214}
    224215
    225216/**
    226  * Gallery preview
     217 * Media previews
    227218 */
    228 .wpview-type-gallery {
     219.wpview-type-gallery,
     220.wpview-type-audio,
     221.wpview-type-video {
    229222    position: relative;
    230223    margin-bottom: 16px;
    231224        cursor: pointer;
    … …  
    232225        border: 1px solid transparent;
    233226}
    234227
    235  .wpview-type-gallery:after {
     228.wpview-type-audio {
     229        padding: 24px 0 0;
     230}
     231
     232.wpview-type-video {
     233        padding: 0;
     234}
     235
     236.wont-play {
     237        padding: 4px 0;
     238}
     239
     240.wont-play p {
     241        font-size: 13px;
     242        line-height: 1.3;
     243        display: block;
     244        width: 70%;
     245        margin: 0 15%;
     246        text-align: center;
     247}
     248
     249.wpview-type-gallery:after {
    236250    content: '';
    237251        display: table;
    238252    clear: both;
    239253}
    240254
    241  .wpview-type-gallery.selected {
     255.wpview-type-gallery.selected,
     256.wpview-type-audio,
     257.wpview-type-video {
    242258        background-color: #f2f8ff;
    243259        border-color: #777;
    244260}
    245261
    246 .wpview-type-gallery .toolbar {
    247     position: absolute;
    248     top: 0;
    249     right: 0;
    250     background-color: #333;
    251     color: white;
     262.wpview-type-gallery .toolbar,
     263.wpview-type-audio .toolbar,
     264.wpview-type-video .toolbar {
     265        position: absolute;
     266        top: 0;
     267        right: 0;
     268        background-color: #333;
     269        color: white;
    252270        display: none;
     271        z-index: 100;
    253272}
    254273
     274.wpview-type-video .toolbar div,
    255275.wpview-type-gallery .toolbar div,
    256276#wp-image-toolbar div {
    257277        margin: 5px;
    258278}
    259279
     280.wpview-type-audio .toolbar div {
     281        margin: 2px 5px;
     282}
     283
     284.wpview-type-audio .toolbar,
     285.wpview-type-video .toolbar,
    260286.wpview-type-gallery.selected .toolbar {
    261287        display: block;
    262288}
    263289
     290.wpview-type-audio .toolbar span,
     291.wpview-type-video .toolbar span,
    264292.wpview-type-gallery .toolbar span {
    265293        cursor: pointer;
    266294}

  • src/wp-includes/media-template.php

     
    961961                        <# } ); #>
    962962                </div>
    963963        </script>
     964
     965        <script type="text/html" id="tmpl-editor-audio">
     966                <div class="toolbar">
     967                        <div class="dashicons dashicons-format-audio edit"></div>
     968                        <div class="dashicons dashicons-no-alt remove"></div>
     969                </div>
     970                <?php wp_underscore_audio_template() ?>
     971        </script>
     972
     973        <script type="text/html" id="tmpl-editor-video">
     974                <div class="toolbar">
     975                        <div class="dashicons dashicons-format-video edit"></div>
     976                        <div class="dashicons dashicons-no-alt remove"></div>
     977                </div>
     978                <?php wp_underscore_video_template() ?>
     979        </script>
     980
    964981        <?php
    965982
    966983        /**

  • src/wp-includes/script-loader.php

     
    396396        // Both rely on numerous settings, styles, and templates to operate correctly.
    397397        $scripts->add( 'media-views',  "/wp-includes/js/media-views$suffix.js",  array( 'utils', 'media-models', 'wp-plupload', 'jquery-ui-sortable', 'wp-mediaelement', 'image-edit' ), false, 1 );
    398398        $scripts->add( 'media-editor', "/wp-includes/js/media-editor$suffix.js", array( 'shortcode', 'media-views' ), false, 1 );
    399         $scripts->add( 'media-audiovideo', "/wp-includes/js/media-audiovideo$suffix.js", array( 'media-editor' ), false, 1 );
     399        $scripts->add( 'media-audiovideo', "/wp-includes/js/media-audiovideo$suffix.js", array( 'media-editor', 'mce-view' ), false, 1 );
    400400        $scripts->add( 'mce-view', "/wp-includes/js/mce-view$suffix.js", array( 'shortcode', 'media-models' ), false, 1 );
    401401
    402402        if ( is_admin() ) {