wp_underscore_video_template

Output the markup for a video tag to be used in an Underscore template when data.model is passed.

Description

wp_underscore_video_template(); 

Usage

  1. if ( !function_exists( 'wp_underscore_video_template' ) ) { 
  2. require_once ABSPATH . WPINC . '/media-template.php'; 
  3.  
  4.  
  5. // NOTICE! Understand what this does before running. 
  6. $result = wp_underscore_video_template(); 
  7.  

Defined (1)

The function is defined in the following location(s).

/wp-includes/media-template.php  
  1. function wp_underscore_video_template() { 
  2. $video_types = wp_get_video_extensions(); 
  3. ?> 
  4. <# var w_rule = '', classes = [],  
  5. w, h, settings = wp.media.view.settings,  
  6. isYouTube = isVimeo = false; 
  7.  
  8. if ( ! _.isEmpty( data.model.src ) ) { 
  9. isYouTube = data.model.src.match(/youtube|youtu\.be/); 
  10. isVimeo = -1 !== data.model.src.indexOf('vimeo'); 
  11.  
  12. if ( settings.contentWidth && data.model.width >= settings.contentWidth ) { 
  13. w = settings.contentWidth; 
  14. } else { 
  15. w = data.model.width; 
  16.  
  17. if ( w !== data.model.width ) { 
  18. h = Math.ceil( ( data.model.height * w ) / data.model.width ); 
  19. } else { 
  20. h = data.model.height; 
  21.  
  22. if ( w ) { 
  23. w_rule = 'width: ' + w + 'px; '; 
  24.  
  25. if ( isYouTube ) { 
  26. classes.push( 'youtube-video' ); 
  27.  
  28. if ( isVimeo ) { 
  29. classes.push( 'vimeo-video' ); 
  30.  
  31. #> 
  32. <div style="{{ w_rule }}" class="wp-video"> 
  33. <video controls 
  34. class="wp-video-shortcode {{ classes.join( ' ' ) }}" 
  35. <# if ( w ) { #>width="{{ w }}"<# } #> 
  36. <# if ( h ) { #>height="{{ h }}"<# } #> 
  37. <?php 
  38. $props = array( 'poster' => '', 'preload' => 'metadata' ); 
  39. foreach ( $props as $key => $value ): 
  40. if ( empty( $value ) ) { 
  41. ?><# 
  42. if ( ! _.isUndefined( data.model.<?php echo $key ?> ) && data.model.<?php echo $key ?> ) { 
  43. #> <?php echo $key ?>="{{ data.model.<?php echo $key ?> }}"<# 
  44. } #> 
  45. <?php } else { 
  46. echo $key ?>="{{ _.isUndefined( data.model.<?php echo $key ?> ) ? '<?php echo $value ?>' : data.model.<?php echo $key ?> }}"<?php 
  47. endforeach; 
  48. ?><# 
  49. <?php foreach ( array( 'autoplay', 'loop' ) as $attr ): 
  50. ?> if ( ! _.isUndefined( data.model.<?php echo $attr ?> ) && data.model.<?php echo $attr ?> ) { 
  51. #> <?php echo $attr ?><# 
  52. <?php endforeach ?>#> 
  53. <# if ( ! _.isEmpty( data.model.src ) ) { 
  54. if ( isYouTube ) { #> 
  55. <source src="{{ data.model.src }}" type="video/youtube" /> 
  56. <# } else if ( isVimeo ) { #> 
  57. <source src="{{ data.model.src }}" type="video/vimeo" /> 
  58. <# } else { #> 
  59. <source src="{{ data.model.src }}" type="{{ settings.embedMimes[ data.model.src.split('.').pop() ] }}" /> 
  60. <# } 
  61. } #> 
  62.  
  63. <?php foreach ( $video_types as $type ): 
  64. ?><# if ( data.model.<?php echo $type ?> ) { #> 
  65. <source src="{{ data.model.<?php echo $type ?> }}" type="{{ settings.embedMimes[ '<?php echo $type ?>' ] }}" /> 
  66. <# } #> 
  67. <?php endforeach; ?> 
  68. {{{ data.model.content }}} 
  69. </video> 
  70. </div> 
  71. <?php