Changeset 28144

Timestamp:

04/16/2014 12:22:28 AM (12 years ago)

Author:

nacin

Message:

Graceful failures for TinyMCE views of video/audio playlists.

props gcorne.
fixes #27821.

Location:

trunk/src/wp-includes

Files:

• js/mce-view.js (modified) (4 diffs)
• js/tinymce/skins/wordpress/wp-content.css (modified) (3 diffs)
• media-template.php (modified) (2 diffs)

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

@@ -603 +603 @@
                         }, this );
 
+                        if ( ! this.data.tracks ) {
+                                return;
+                        }
+
                         p = new WPPlaylistView({
                                 el: $( self.node ).find( '.wp-playlist' ).get(0),
@@ -624 +628 @@
                                 tracks = [];
 
-                        if ( ! this.attachments.length ) {
+                        // Don't render errors while still fetching attachments
+                        if ( this.dfd && 'pending' === this.dfd.state() && ! this.attachments.length ) {
                                 return;
                         }
@@ -631 +636 @@
                                 data[ key ] = model.coerce( data, key );
                         });
-
-                        attachments = this.attachments.toJSON();
 
                         options = {
@@ -642 +645 @@
                                 artists: data.artists
                         };
+
+                        if ( ! this.attachments.length ) {
+                                return this.template( options );
+                        }
+
+                        attachments = this.attachments.toJSON();
 
                         _.each( attachments, function( attachment ) {

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

@@ -290 +290 @@
 }
 
+.wpview-error {
+        border: 1px solid #dedede;
+        padding: 20px 0;
+        margin: 0;
+}
+
+.selected .wpview-error {
+        border-color: transparent;
+}
+
+.wpview-error .dashicons {
+        display: block;
+        margin: 0 auto;
+        width: 32px;
+        height: 32px;
+        font-size: 32px;
+}
+
+.wpview-error p {
+        margin: 0;
+        text-align: center;
+        font-family: 'Open Sans', sans-serif;
+}
+
 
 .wpview-wrap .toolbar div:hover,
@@ -351 +375 @@
 }
 
-.gallery-error {
-        border: 1px solid #dedede;
-        padding: 20px 0;
-        margin: 0;
-}
-
-.selected .gallery-error {
-        border-color: transparent;
-}
-
-.gallery-error .dashicons {
-        display: block;
-        margin: 0 auto;
-        width: 32px;
-        height: 32px;
-        font-size: 32px;
-}
-
-.gallery-error p {
-        margin: 0;
-        text-align: center;
-        font-family: 'Open Sans', sans-serif;
-}
 
 .gallery .gallery-item {
@@ -444 +445 @@
         max-width: 100%;
         height: auto;
+        border: none;
+        padding: 0;
 }
 

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

@@ -1002 +1002 @@
                         </div>
                 <# } else { #>
-                        <div class="gallery-error">
+                        <div class="wpview-error">
                                 <div class="dashicons dashicons-format-gallery"></div><p><?php _e( 'No items found.' ); ?></p>
                         </div>
@@ -1033 +1033 @@
                         <div class="dashicons dashicons-no-alt remove"></div>
                 </div>
-                <div class="wp-playlist wp-{{ data.type }}-playlist wp-playlist-{{ data.style }}">
-                        <# if ( 'audio' === data.type ){ #>
-                        <div class="wp-playlist-current-item"></div>
-                        <# } #>
-                        <{{ data.type }} controls="controls" preload="none" <#
-                                if ( data.width ) { #> width="{{ data.width }}"<# }
-                                #><# if ( data.height ) { #> height="{{ data.height }}"<# } #>></{{ data.type }}>
-                        <div class="wp-playlist-next"></div>
-                        <div class="wp-playlist-prev"></div>
-                </div>
-                <div class="wpview-overlay"></div>
+                <# if ( data.tracks ) { #>
+                        <div class="wp-playlist wp-{{ data.type }}-playlist wp-playlist-{{ data.style }}">
+                                <# if ( 'audio' === data.type ){ #>
+                                <div class="wp-playlist-current-item"></div>
+                                <# } #>
+                                <{{ data.type }} controls="controls" preload="none" <#
+                                        if ( data.width ) { #> width="{{ data.width }}"<# }
+                                        #><# if ( data.height ) { #> height="{{ data.height }}"<# } #>></{{ data.type }}>
+                                <div class="wp-playlist-next"></div>
+                                <div class="wp-playlist-prev"></div>
+                        </div>
+                        <div class="wpview-overlay"></div>
+                <# } else { #>
+                        <div class="wpview-error">
+                                <div class="dashicons dashicons-video-alt3"></div><p><?php _e( 'No items found.' ); ?></p>
+                        </div>
+                <# } #>
         </script>