class-wp-widget-media-video.php (8407B)
1 <?php 2 /** 3 * Widget API: WP_Widget_Media_Video class 4 * 5 * @package WordPress 6 * @subpackage Widgets 7 * @since 4.8.0 8 */ 9 10 /** 11 * Core class that implements a video widget. 12 * 13 * @since 4.8.0 14 * 15 * @see WP_Widget_Media 16 * @see WP_Widget 17 */ 18 class WP_Widget_Media_Video extends WP_Widget_Media { 19 20 /** 21 * Constructor. 22 * 23 * @since 4.8.0 24 */ 25 public function __construct() { 26 parent::__construct( 27 'media_video', 28 __( 'Video' ), 29 array( 30 'description' => __( 'Displays a video from the media library or from YouTube, Vimeo, or another provider.' ), 31 'mime_type' => 'video', 32 ) 33 ); 34 35 $this->l10n = array_merge( 36 $this->l10n, 37 array( 38 'no_media_selected' => __( 'No video selected' ), 39 'add_media' => _x( 'Add Video', 'label for button in the video widget' ), 40 'replace_media' => _x( 'Replace Video', 'label for button in the video widget; should preferably not be longer than ~13 characters long' ), 41 'edit_media' => _x( 'Edit Video', 'label for button in the video widget; should preferably not be longer than ~13 characters long' ), 42 'missing_attachment' => sprintf( 43 /* translators: %s: URL to media library. */ 44 __( 'We can’t find that video. Check your <a href="%s">media library</a> and make sure it wasn’t deleted.' ), 45 esc_url( admin_url( 'upload.php' ) ) 46 ), 47 /* translators: %d: Widget count. */ 48 'media_library_state_multi' => _n_noop( 'Video Widget (%d)', 'Video Widget (%d)' ), 49 'media_library_state_single' => __( 'Video Widget' ), 50 /* translators: %s: A list of valid video file extensions. */ 51 'unsupported_file_type' => sprintf( __( 'Sorry, we can’t load the video at the supplied URL. Please check that the URL is for a supported video file (%s) or stream (e.g. YouTube and Vimeo).' ), '<code>.' . implode( '</code>, <code>.', wp_get_video_extensions() ) . '</code>' ), 52 ) 53 ); 54 } 55 56 /** 57 * Get schema for properties of a widget instance (item). 58 * 59 * @since 4.8.0 60 * 61 * @see WP_REST_Controller::get_item_schema() 62 * @see WP_REST_Controller::get_additional_fields() 63 * @link https://core.trac.wordpress.org/ticket/35574 64 * 65 * @return array Schema for properties. 66 */ 67 public function get_instance_schema() { 68 69 $schema = array( 70 'preload' => array( 71 'type' => 'string', 72 'enum' => array( 'none', 'auto', 'metadata' ), 73 'default' => 'metadata', 74 'description' => __( 'Preload' ), 75 'should_preview_update' => false, 76 ), 77 'loop' => array( 78 'type' => 'boolean', 79 'default' => false, 80 'description' => __( 'Loop' ), 81 'should_preview_update' => false, 82 ), 83 'content' => array( 84 'type' => 'string', 85 'default' => '', 86 'sanitize_callback' => 'wp_kses_post', 87 'description' => __( 'Tracks (subtitles, captions, descriptions, chapters, or metadata)' ), 88 'should_preview_update' => false, 89 ), 90 ); 91 92 foreach ( wp_get_video_extensions() as $video_extension ) { 93 $schema[ $video_extension ] = array( 94 'type' => 'string', 95 'default' => '', 96 'format' => 'uri', 97 /* translators: %s: Video extension. */ 98 'description' => sprintf( __( 'URL to the %s video source file' ), $video_extension ), 99 ); 100 } 101 102 return array_merge( $schema, parent::get_instance_schema() ); 103 } 104 105 /** 106 * Render the media on the frontend. 107 * 108 * @since 4.8.0 109 * 110 * @param array $instance Widget instance props. 111 */ 112 public function render_media( $instance ) { 113 $instance = array_merge( wp_list_pluck( $this->get_instance_schema(), 'default' ), $instance ); 114 $attachment = null; 115 116 if ( $this->is_attachment_with_mime_type( $instance['attachment_id'], $this->widget_options['mime_type'] ) ) { 117 $attachment = get_post( $instance['attachment_id'] ); 118 } 119 120 $src = $instance['url']; 121 if ( $attachment ) { 122 $src = wp_get_attachment_url( $attachment->ID ); 123 } 124 125 if ( empty( $src ) ) { 126 return; 127 } 128 129 $youtube_pattern = '#^https?://(?:www\.)?(?:youtube\.com/watch|youtu\.be/)#'; 130 $vimeo_pattern = '#^https?://(.+\.)?vimeo\.com/.*#'; 131 132 if ( $attachment || preg_match( $youtube_pattern, $src ) || preg_match( $vimeo_pattern, $src ) ) { 133 add_filter( 'wp_video_shortcode', array( $this, 'inject_video_max_width_style' ) ); 134 135 echo wp_video_shortcode( 136 array_merge( 137 $instance, 138 compact( 'src' ) 139 ), 140 $instance['content'] 141 ); 142 143 remove_filter( 'wp_video_shortcode', array( $this, 'inject_video_max_width_style' ) ); 144 } else { 145 echo $this->inject_video_max_width_style( wp_oembed_get( $src ) ); 146 } 147 } 148 149 /** 150 * Inject max-width and remove height for videos too constrained to fit inside sidebars on frontend. 151 * 152 * @since 4.8.0 153 * 154 * @param string $html Video shortcode HTML output. 155 * @return string HTML Output. 156 */ 157 public function inject_video_max_width_style( $html ) { 158 $html = preg_replace( '/\sheight="\d+"/', '', $html ); 159 $html = preg_replace( '/\swidth="\d+"/', '', $html ); 160 $html = preg_replace( '/(?<=width:)\s*\d+px(?=;?)/', '100%', $html ); 161 return $html; 162 } 163 164 /** 165 * Enqueue preview scripts. 166 * 167 * These scripts normally are enqueued just-in-time when a video shortcode is used. 168 * In the customizer, however, widgets can be dynamically added and rendered via 169 * selective refresh, and so it is important to unconditionally enqueue them in 170 * case a widget does get added. 171 * 172 * @since 4.8.0 173 */ 174 public function enqueue_preview_scripts() { 175 /** This filter is documented in wp-includes/media.php */ 176 if ( 'mediaelement' === apply_filters( 'wp_video_shortcode_library', 'mediaelement' ) ) { 177 wp_enqueue_style( 'wp-mediaelement' ); 178 wp_enqueue_script( 'mediaelement-vimeo' ); 179 wp_enqueue_script( 'wp-mediaelement' ); 180 } 181 } 182 183 /** 184 * Loads the required scripts and styles for the widget control. 185 * 186 * @since 4.8.0 187 */ 188 public function enqueue_admin_scripts() { 189 parent::enqueue_admin_scripts(); 190 191 $handle = 'media-video-widget'; 192 wp_enqueue_script( $handle ); 193 194 $exported_schema = array(); 195 foreach ( $this->get_instance_schema() as $field => $field_schema ) { 196 $exported_schema[ $field ] = wp_array_slice_assoc( $field_schema, array( 'type', 'default', 'enum', 'minimum', 'format', 'media_prop', 'should_preview_update' ) ); 197 } 198 wp_add_inline_script( 199 $handle, 200 sprintf( 201 'wp.mediaWidgets.modelConstructors[ %s ].prototype.schema = %s;', 202 wp_json_encode( $this->id_base ), 203 wp_json_encode( $exported_schema ) 204 ) 205 ); 206 207 wp_add_inline_script( 208 $handle, 209 sprintf( 210 ' 211 wp.mediaWidgets.controlConstructors[ %1$s ].prototype.mime_type = %2$s; 212 wp.mediaWidgets.controlConstructors[ %1$s ].prototype.l10n = _.extend( {}, wp.mediaWidgets.controlConstructors[ %1$s ].prototype.l10n, %3$s ); 213 ', 214 wp_json_encode( $this->id_base ), 215 wp_json_encode( $this->widget_options['mime_type'] ), 216 wp_json_encode( $this->l10n ) 217 ) 218 ); 219 } 220 221 /** 222 * Render form template scripts. 223 * 224 * @since 4.8.0 225 */ 226 public function render_control_template_scripts() { 227 parent::render_control_template_scripts() 228 ?> 229 <script type="text/html" id="tmpl-wp-media-widget-video-preview"> 230 <# if ( data.error && 'missing_attachment' === data.error ) { #> 231 <div class="notice notice-error notice-alt notice-missing-attachment"> 232 <p><?php echo $this->l10n['missing_attachment']; ?></p> 233 </div> 234 <# } else if ( data.error && 'unsupported_file_type' === data.error ) { #> 235 <div class="notice notice-error notice-alt notice-missing-attachment"> 236 <p><?php echo $this->l10n['unsupported_file_type']; ?></p> 237 </div> 238 <# } else if ( data.error ) { #> 239 <div class="notice notice-error notice-alt"> 240 <p><?php _e( 'Unable to preview media due to an unknown error.' ); ?></p> 241 </div> 242 <# } else if ( data.is_oembed && data.model.poster ) { #> 243 <a href="{{ data.model.src }}" target="_blank" class="media-widget-video-link"> 244 <img src="{{ data.model.poster }}" /> 245 </a> 246 <# } else if ( data.is_oembed ) { #> 247 <a href="{{ data.model.src }}" target="_blank" class="media-widget-video-link no-poster"> 248 <span class="dashicons dashicons-format-video"></span> 249 </a> 250 <# } else if ( data.model.src ) { #> 251 <?php wp_underscore_video_template(); ?> 252 <# } #> 253 </script> 254 <?php 255 } 256 }