Changeset 27608 for trunk/src/wp-includes/media-template.php

Timestamp:

03/19/2014 05:30:27 AM (12 years ago)

Author:

wonderboymusic

Message:

Create a new file, media-audiovideo.js, to house all of the audio and video JS code in core.

UX Changes:

• Don't add a menu item for "Add Audio|Video Source"
• In the Audio|Video Details modal, add buttons and some suggestive text for adding alternate playback sources
• Don't show "Create Audio|Video Playlist" menu items until the user has uploaded audio or video files

See #27437.

File:

• trunk/src/wp-includes/media-template.php (modified) (7 diffs)

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

@@ -766 +766 @@
 
     <script type="text/html" id="tmpl-audio-details">
+        <# var ext, html5types = { mp3: true, ogg: true }; #>
+
         <?php $audio_types = wp_get_audio_extensions(); ?>
         <div class="media-embed media-embed-details">
             <div class="embed-media-settings embed-audio-settings">
-                <div class="instructions media-instructions">{{{ wp.media.view.l10n.audioDetailsText }}}</div>
-
                 <?php wp_underscore_audio_template() ?>
 
-                <# if ( ! _.isEmpty( data.model.src ) ) { #>
+                <# if ( ! _.isEmpty( data.model.src ) ) {
+                    ext = data.model.src.split('.').pop();
+                    if ( html5types[ ext ] ) {
+                        delete html5types[ ext ];
+                    }
+                #>
                 <label class="setting">
                     <span>SRC</span>
@@ -783 +788 @@
 
                 foreach ( $audio_types as $type ):
-                ?><# if ( ! _.isEmpty( data.model.<?php echo $type ?> ) ) { #>
+                ?><# if ( ! _.isEmpty( data.model.<?php echo $type ?> ) ) {
+                    if ( ! _.isUndefined( html5types.<?php echo $type ?> ) ) {
+                        delete html5types.<?php echo $type ?>;
+                    }
+                #>
                 <label class="setting">
                     <span><?php echo strtoupper( $type ) ?></span>
@@ -791 +800 @@
                 <# } #>
                 <?php endforeach ?>
+
+                <# if ( ! _.isEmpty( html5types ) ) { #>
+                <div class="setting">
+                    <span>{{{ wp.media.view.l10n.mediaHTML5Text }}}</span>
+                    <div class="button-large">
+                    <# _.each( html5types, function (value, type) { #>
+                    <button class="button add-media-source">{{ type }}</button>
+                    <# } ) #>
+                    </div>
+                </div>
+                <# } #>
 
                 <div class="setting preload">
@@ -816 +836 @@
 
     <script type="text/html" id="tmpl-video-details">
+        <# var ext, html5types = { mp4: true, ogv: true, webm: true }; #>
+
         <?php $video_types = wp_get_video_extensions(); ?>
         <div class="media-embed media-embed-details">
             <div class="embed-media-settings embed-video-settings">
-                <div class="instructions media-instructions">{{{ wp.media.view.l10n.videoDetailsText }}}</div>
                 <div class="wp-video-holder">
                 <#
@@ -833 +854 @@
                 <?php wp_underscore_video_template() ?>
 
-                <# if ( ! _.isEmpty( data.model.src ) ) { #>
+                <# if ( ! _.isEmpty( data.model.src ) ) {
+                    ext = data.model.src.split('.').pop();
+                    if ( html5types[ ext ] ) {
+                        delete html5types[ ext ];
+                    }
+                #>
                 <label class="setting">
                     <span>SRC</span>
@@ -841 +867 @@
                 <# } #>
                 <?php foreach ( $video_types as $type ):
-                ?><# if ( ! _.isEmpty( data.model.<?php echo $type ?> ) ) { #>
+                ?><# if ( ! _.isEmpty( data.model.<?php echo $type ?> ) ) {
+                    if ( ! _.isUndefined( html5types.<?php echo $type ?> ) ) {
+                        delete html5types.<?php echo $type ?>;
+                    }
+                #>
                 <label class="setting">
                     <span><?php echo strtoupper( $type ) ?></span>
@@ -850 +880 @@
                 <?php endforeach ?>
                 </div>
+
+                <# if ( ! _.isEmpty( html5types ) ) { #>
+                <div class="setting">
+                    <span>{{{ wp.media.view.l10n.mediaHTML5Text }}}</span>
+                    <div class="button-large">
+                    <# _.each( html5types, function (value, type) { #>
+                    <button class="button add-media-source">{{ type }}</button>
+                    <# } ) #>
+                    </div>
+                </div>
+                <# } #>
+
                 <# if ( ! _.isEmpty( data.model.poster ) ) { #>
                 <label class="setting">