Issues (2010)

Security Analysis    not enabled

This project does not seem to handle request data directly as such no vulnerable execution paths were found.

  Cross-Site Scripting
Cross-Site Scripting enables an attacker to inject code into the response of a web-request that is viewed by other users. It can for example be used to bypass access controls, or even to take over other users' accounts.
  File Exposure
File Exposure allows an attacker to gain access to local files that he should not be able to access. These files can for example include database credentials, or other configuration files.
  File Manipulation
File Manipulation enables an attacker to write custom data to files. This potentially leads to injection of arbitrary code on the server.
  Object Injection
Object Injection enables an attacker to inject an object into PHP code, and can lead to arbitrary code execution, file exposure, or file manipulation attacks.
  Code Injection
Code Injection enables an attacker to execute arbitrary code on the server.
  Response Splitting
Response Splitting can be used to send arbitrary responses.
  File Inclusion
File Inclusion enables an attacker to inject custom files into PHP's file loading mechanism, either explicitly passed to include, or for example via PHP's auto-loading mechanism.
  Command Injection
Command Injection enables an attacker to inject a shell command that is execute with the privileges of the web-server. This can be used to expose sensitive data, or gain access of your server.
  SQL Injection
SQL Injection enables an attacker to execute arbitrary SQL code on your database server gaining access to user data, or manipulating user data.
  XPath Injection
XPath Injection enables an attacker to modify the parts of XML document that are read. If that XML document is for example used for authentication, this can lead to further vulnerabilities similar to SQL Injection.
  LDAP Injection
LDAP Injection enables an attacker to inject LDAP statements potentially granting permission to run unauthorized queries, or modify content inside the LDAP tree.
  Header Injection
  Other Vulnerability
This category comprises other attack vectors such as manipulating the PHP runtime, loading custom extensions, freezing the runtime, or similar.
  Regex Injection
Regex Injection enables an attacker to execute arbitrary code in your PHP process.
  XML Injection
XML Injection enables an attacker to read files on your local filesystem including configuration files, or can be abused to freeze your web-server process.
  Variable Injection
Variable Injection enables an attacker to overwrite program variables with custom data, and can lead to further vulnerabilities.
Unfortunately, the security analysis is currently not available for your project. If you are a non-commercial open-source project, please contact support to gain access.

wp-includes/media-template.php (1 issue)

Upgrade to new PHP Analysis Engine

These results are based on our legacy PHP analysis, consider migrating to our new PHP analysis engine instead. Learn more

1
<?php
2
/**
3
 * WordPress media templates.
4
 *
5
 * @package WordPress
6
 * @subpackage Media
7
 * @since 3.5.0
8
 */
9
10
/**
11
 * Output the markup for a audio tag to be used in an Underscore template
12
 * when data.model is passed.
13
 *
14
 * @since 3.9.0
15
 */
16
function wp_underscore_audio_template() {
17
	$audio_types = wp_get_audio_extensions();
18
?>
19
<audio style="visibility: hidden"
20
	controls
21
	class="wp-audio-shortcode"
22
	width="{{ _.isUndefined( data.model.width ) ? 400 : data.model.width }}"
23
	preload="{{ _.isUndefined( data.model.preload ) ? 'none' : data.model.preload }}"
24
	<#
25 View Code Duplication
	<?php foreach ( array( 'autoplay', 'loop' ) as $attr ):
26
	?>if ( ! _.isUndefined( data.model.<?php echo $attr ?> ) && data.model.<?php echo $attr ?> ) {
27
		#> <?php echo $attr ?><#
28
	}
29
	<?php endforeach ?>#>
30
>
31
	<# if ( ! _.isEmpty( data.model.src ) ) { #>
32
	<source src="{{ data.model.src }}" type="{{ wp.media.view.settings.embedMimes[ data.model.src.split('.').pop() ] }}" />
33
	<# } #>
34
35
	<?php foreach ( $audio_types as $type ):
36
	?><# if ( ! _.isEmpty( data.model.<?php echo $type ?> ) ) { #>
37
	<source src="{{ data.model.<?php echo $type ?> }}" type="{{ wp.media.view.settings.embedMimes[ '<?php echo $type ?>' ] }}" />
38
	<# } #>
39
	<?php endforeach;
40
?></audio>
41
<?php
42
}
43
44
/**
45
 * Output the markup for a video tag to be used in an Underscore template
46
 * when data.model is passed.
47
 *
48
 * @since 3.9.0
49
 */
50
function wp_underscore_video_template() {
51
	$video_types = wp_get_video_extensions();
52
?>
53
<#  var w_rule = '', classes = [],
54
		w, h, settings = wp.media.view.settings,
55
		isYouTube = isVimeo = false;
56
57
	if ( ! _.isEmpty( data.model.src ) ) {
58
		isYouTube = data.model.src.match(/youtube|youtu\.be/);
59
		isVimeo = -1 !== data.model.src.indexOf('vimeo');
60
	}
61
62
	if ( settings.contentWidth && data.model.width >= settings.contentWidth ) {
63
		w = settings.contentWidth;
64
	} else {
65
		w = data.model.width;
66
	}
67
68
	if ( w !== data.model.width ) {
69
		h = Math.ceil( ( data.model.height * w ) / data.model.width );
70
	} else {
71
		h = data.model.height;
72
 	}
73
74
	if ( w ) {
75
		w_rule = 'width: ' + w + 'px; ';
76
	}
77
78
	if ( isYouTube ) {
79
		classes.push( 'youtube-video' );
80
	}
81
82
	if ( isVimeo ) {
83
		classes.push( 'vimeo-video' );
84
	}
85
86
#>
87
<div style="{{ w_rule }}" class="wp-video">
88
<video controls
89
	class="wp-video-shortcode {{ classes.join( ' ' ) }}"
90
	<# if ( w ) { #>width="{{ w }}"<# } #>
91
	<# if ( h ) { #>height="{{ h }}"<# } #>
92
	<?php
93
	$props = array( 'poster' => '', 'preload' => 'metadata' );
94
	foreach ( $props as $key => $value ):
95
		if ( empty( $value ) ) {
96
		?><#
97
		if ( ! _.isUndefined( data.model.<?php echo $key ?> ) && data.model.<?php echo $key ?> ) {
98
			#> <?php echo $key ?>="{{ data.model.<?php echo $key ?> }}"<#
99
		} #>
100
		<?php } else {
101
			echo $key ?>="{{ _.isUndefined( data.model.<?php echo $key ?> ) ? '<?php echo $value ?>' : data.model.<?php echo $key ?> }}"<?php
102
		}
103
	endforeach;
104
	?><#
105 View Code Duplication
	<?php foreach ( array( 'autoplay', 'loop' ) as $attr ):
106
	?> if ( ! _.isUndefined( data.model.<?php echo $attr ?> ) && data.model.<?php echo $attr ?> ) {
107
		#> <?php echo $attr ?><#
108
	}
109
	<?php endforeach ?>#>
110
>
111
	<# if ( ! _.isEmpty( data.model.src ) ) {
112
		if ( isYouTube ) { #>
113
		<source src="{{ data.model.src }}" type="video/youtube" />
114
		<# } else if ( isVimeo ) { #>
115
		<source src="{{ data.model.src }}" type="video/vimeo" />
116
		<# } else { #>
117
		<source src="{{ data.model.src }}" type="{{ settings.embedMimes[ data.model.src.split('.').pop() ] }}" />
118
		<# }
119
	} #>
120
121
	<?php foreach ( $video_types as $type ):
122
	?><# if ( data.model.<?php echo $type ?> ) { #>
123
	<source src="{{ data.model.<?php echo $type ?> }}" type="{{ settings.embedMimes[ '<?php echo $type ?>' ] }}" />
124
	<# } #>
125
	<?php endforeach; ?>
126
	{{{ data.model.content }}}
127
</video>
128
</div>
129
<?php
130
}
131
132
/**
133
 * Prints the templates used in the media manager.
134
 *
135
 * @since 3.5.0
136
 *
137
 * @global bool $is_IE
138
 */
139
function wp_print_media_templates() {
140
	global $is_IE;
141
	$class = 'media-modal wp-core-ui';
142
	if ( $is_IE && strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE 7') !== false )
143
		$class .= ' ie7';
144
	?>
145
	<!--[if lte IE 8]>
146
	<style>
147
		.attachment:focus {
148
			outline: #1e8cbe solid;
149
		}
150
		.selected.attachment {
151
			outline: #1e8cbe solid;
152
		}
153
	</style>
154
	<![endif]-->
155
	<script type="text/html" id="tmpl-media-frame">
156
		<div class="media-frame-menu"></div>
157
		<div class="media-frame-title"></div>
158
		<div class="media-frame-router"></div>
159
		<div class="media-frame-content"></div>
160
		<div class="media-frame-toolbar"></div>
161
		<div class="media-frame-uploader"></div>
162
	</script>
163
164
	<script type="text/html" id="tmpl-media-modal">
165
		<div class="<?php echo $class; ?>">
166
			<button type="button" class="button-link media-modal-close"><span class="media-modal-icon"><span class="screen-reader-text"><?php _e( 'Close media panel' ); ?></span></span></button>
167
			<div class="media-modal-content"></div>
168
		</div>
169
		<div class="media-modal-backdrop"></div>
170
	</script>
171
172
	<script type="text/html" id="tmpl-uploader-window">
173
		<div class="uploader-window-content">
174
			<h1><?php _e( 'Drop files to upload' ); ?></h1>
175
		</div>
176
	</script>
177
178
	<script type="text/html" id="tmpl-uploader-editor">
179
		<div class="uploader-editor-content">
180
			<div class="uploader-editor-title"><?php _e( 'Drop files to upload' ); ?></div>
181
		</div>
182
	</script>
183
184
	<script type="text/html" id="tmpl-uploader-inline">
185
		<# var messageClass = data.message ? 'has-upload-message' : 'no-upload-message'; #>
186
		<# if ( data.canClose ) { #>
187
		<button class="close dashicons dashicons-no"><span class="screen-reader-text"><?php _e( 'Close uploader' ); ?></span></button>
188
		<# } #>
189
		<div class="uploader-inline-content {{ messageClass }}">
190
		<# if ( data.message ) { #>
191
			<h2 class="upload-message">{{ data.message }}</h2>
192
		<# } #>
193
		<?php if ( ! _device_can_upload() ) : ?>
194
			<h2 class="upload-instructions"><?php printf( __( 'The web browser on your device cannot be used to upload files. You may be able to use the <a href="%s">native app for your device</a> instead.' ), 'https://apps.wordpress.org/' ); ?></h2>
195
		<?php elseif ( is_multisite() && ! is_upload_space_available() ) : ?>
196
			<h2 class="upload-instructions"><?php _e( 'Upload Limit Exceeded' ); ?></h2>
197
			<?php
198
			/** This action is documented in wp-admin/includes/media.php */
199
			do_action( 'upload_ui_over_quota' ); ?>
200
201
		<?php else : ?>
202
			<div class="upload-ui">
203
				<h2 class="upload-instructions drop-instructions"><?php _e( 'Drop files anywhere to upload' ); ?></h2>
204
				<p class="upload-instructions drop-instructions"><?php _ex( 'or', 'Uploader: Drop files here - or - Select Files' ); ?></p>
205
				<button type="button" class="browser button button-hero"><?php _e( 'Select Files' ); ?></button>
206
			</div>
207
208
			<div class="upload-inline-status"></div>
209
210
			<div class="post-upload-ui">
211
				<?php
212
				/** This action is documented in wp-admin/includes/media.php */
213
				do_action( 'pre-upload-ui' );
214
				/** This action is documented in wp-admin/includes/media.php */
215
				do_action( 'pre-plupload-upload-ui' );
216
217
				if ( 10 === remove_action( 'post-plupload-upload-ui', 'media_upload_flash_bypass' ) ) {
218
					/** This action is documented in wp-admin/includes/media.php */
219
					do_action( 'post-plupload-upload-ui' );
220
					add_action( 'post-plupload-upload-ui', 'media_upload_flash_bypass' );
221
				} else {
222
					/** This action is documented in wp-admin/includes/media.php */
223
					do_action( 'post-plupload-upload-ui' );
224
				}
225
226
				$max_upload_size = wp_max_upload_size();
227
				if ( ! $max_upload_size ) {
228
					$max_upload_size = 0;
229
				}
230
				?>
231
232
				<p class="max-upload-size"><?php
233
					printf( __( 'Maximum upload file size: %s.' ), esc_html( size_format( $max_upload_size ) ) );
0 ignored issues
show
It seems like size_format($max_upload_size) targeting size_format() can also be of type false; however, esc_html() does only seem to accept string, did you maybe forget to handle an error condition?
Loading history...
234
				?></p>
235
236
				<# if ( data.suggestedWidth && data.suggestedHeight ) { #>
237
					<p class="suggested-dimensions">
238
						<?php _e( 'Suggested image dimensions:' ); ?> {{data.suggestedWidth}} &times; {{data.suggestedHeight}}
239
					</p>
240
				<# } #>
241
242
				<?php
243
				/** This action is documented in wp-admin/includes/media.php */
244
				do_action( 'post-upload-ui' ); ?>
245
			</div>
246
		<?php endif; ?>
247
		</div>
248
	</script>
249
250
	<script type="text/html" id="tmpl-media-library-view-switcher">
251
		<a href="<?php echo esc_url( add_query_arg( 'mode', 'list', $_SERVER['REQUEST_URI'] ) ) ?>" class="view-list">
252
			<span class="screen-reader-text"><?php _e( 'List View' ); ?></span>
253
		</a>
254
		<a href="<?php echo esc_url( add_query_arg( 'mode', 'grid', $_SERVER['REQUEST_URI'] ) ) ?>" class="view-grid current">
255
			<span class="screen-reader-text"><?php _e( 'Grid View' ); ?></span>
256
		</a>
257
	</script>
258
259
	<script type="text/html" id="tmpl-uploader-status">
260
		<h2><?php _e( 'Uploading' ); ?></h2>
261
		<button type="button" class="button-link upload-dismiss-errors"><span class="screen-reader-text"><?php _e( 'Dismiss Errors' ); ?></span></button>
262
263
		<div class="media-progress-bar"><div></div></div>
264
		<div class="upload-details">
265
			<span class="upload-count">
266
				<span class="upload-index"></span> / <span class="upload-total"></span>
267
			</span>
268
			<span class="upload-detail-separator">&ndash;</span>
269
			<span class="upload-filename"></span>
270
		</div>
271
		<div class="upload-errors"></div>
272
	</script>
273
274
	<script type="text/html" id="tmpl-uploader-status-error">
275
		<span class="upload-error-filename">{{{ data.filename }}}</span>
276
		<span class="upload-error-message">{{ data.message }}</span>
277
	</script>
278
279
	<script type="text/html" id="tmpl-edit-attachment-frame">
280
		<div class="edit-media-header">
281
			<button class="left dashicons <# if ( ! data.hasPrevious ) { #> disabled <# } #>"><span class="screen-reader-text"><?php _e( 'Edit previous media item' ); ?></span></button>
282
			<button class="right dashicons <# if ( ! data.hasNext ) { #> disabled <# } #>"><span class="screen-reader-text"><?php _e( 'Edit next media item' ); ?></span></button>
283
		</div>
284
		<div class="media-frame-title"></div>
285
		<div class="media-frame-content"></div>
286
	</script>
287
288
	<script type="text/html" id="tmpl-attachment-details-two-column">
289
		<div class="attachment-media-view {{ data.orientation }}">
290
			<div class="thumbnail thumbnail-{{ data.type }}">
291
				<# if ( data.uploading ) { #>
292
					<div class="media-progress-bar"><div></div></div>
293
				<# } else if ( 'image' === data.type && data.sizes && data.sizes.large ) { #>
294
					<img class="details-image" src="{{ data.sizes.large.url }}" draggable="false" alt="" />
295
				<# } else if ( 'image' === data.type && data.sizes && data.sizes.full ) { #>
296
					<img class="details-image" src="{{ data.sizes.full.url }}" draggable="false" alt="" />
297
				<# } else if ( -1 === jQuery.inArray( data.type, [ 'audio', 'video' ] ) ) { #>
298
					<img class="details-image icon" src="{{ data.icon }}" draggable="false" alt="" />
299
				<# } #>
300
301
				<# if ( 'audio' === data.type ) { #>
302
				<div class="wp-media-wrapper">
303
					<audio style="visibility: hidden" controls class="wp-audio-shortcode" width="100%" preload="none">
304
						<source type="{{ data.mime }}" src="{{ data.url }}"/>
305
					</audio>
306
				</div>
307
				<# } else if ( 'video' === data.type ) {
308
					var w_rule = '';
309
					if ( data.width ) {
310
						w_rule = 'width: ' + data.width + 'px;';
311
					} else if ( wp.media.view.settings.contentWidth ) {
312
						w_rule = 'width: ' + wp.media.view.settings.contentWidth + 'px;';
313
					}
314
				#>
315
				<div style="{{ w_rule }}" class="wp-media-wrapper wp-video">
316
					<video controls="controls" class="wp-video-shortcode" preload="metadata"
317
						<# if ( data.width ) { #>width="{{ data.width }}"<# } #>
318
						<# if ( data.height ) { #>height="{{ data.height }}"<# } #>
319
						<# if ( data.image && data.image.src !== data.icon ) { #>poster="{{ data.image.src }}"<# } #>>
320
						<source type="{{ data.mime }}" src="{{ data.url }}"/>
321
					</video>
322
				</div>
323
				<# } #>
324
325
				<div class="attachment-actions">
326
					<# if ( 'image' === data.type && ! data.uploading && data.sizes && data.can.save ) { #>
327
					<button type="button" class="button edit-attachment"><?php _e( 'Edit Image' ); ?></button>
328
					<# } #>
329
				</div>
330
			</div>
331
		</div>
332
		<div class="attachment-info">
333
			<span class="settings-save-status">
334
				<span class="spinner"></span>
335
				<span class="saved"><?php esc_html_e('Saved.'); ?></span>
336
			</span>
337
			<div class="details">
338
				<div class="filename"><strong><?php _e( 'File name:' ); ?></strong> {{ data.filename }}</div>
339
				<div class="filename"><strong><?php _e( 'File type:' ); ?></strong> {{ data.mime }}</div>
340
				<div class="uploaded"><strong><?php _e( 'Uploaded on:' ); ?></strong> {{ data.dateFormatted }}</div>
341
342
				<div class="file-size"><strong><?php _e( 'File size:' ); ?></strong> {{ data.filesizeHumanReadable }}</div>
343
				<# if ( 'image' === data.type && ! data.uploading ) { #>
344
					<# if ( data.width && data.height ) { #>
345
						<div class="dimensions"><strong><?php _e( 'Dimensions:' ); ?></strong> {{ data.width }} &times; {{ data.height }}</div>
346
					<# } #>
347
				<# } #>
348
349
				<# if ( data.fileLength ) { #>
350
					<div class="file-length"><strong><?php _e( 'Length:' ); ?></strong> {{ data.fileLength }}</div>
351
				<# } #>
352
353
				<# if ( 'audio' === data.type && data.meta.bitrate ) { #>
354
					<div class="bitrate">
355
						<strong><?php _e( 'Bitrate:' ); ?></strong> {{ Math.round( data.meta.bitrate / 1000 ) }}kb/s
356
						<# if ( data.meta.bitrate_mode ) { #>
357
						{{ ' ' + data.meta.bitrate_mode.toUpperCase() }}
358
						<# } #>
359
					</div>
360
				<# } #>
361
362
				<div class="compat-meta">
363
					<# if ( data.compat && data.compat.meta ) { #>
364
						{{{ data.compat.meta }}}
365
					<# } #>
366
				</div>
367
			</div>
368
369
			<div class="settings">
370
				<label class="setting" data-setting="url">
371
					<span class="name"><?php _e('URL'); ?></span>
372
					<input type="text" value="{{ data.url }}" readonly />
373
				</label>
374
				<# var maybeReadOnly = data.can.save || data.allowLocalEdits ? '' : 'readonly'; #>
375
				<?php if ( post_type_supports( 'attachment', 'title' ) ) : ?>
376
				<label class="setting" data-setting="title">
377
					<span class="name"><?php _e('Title'); ?></span>
378
					<input type="text" value="{{ data.title }}" {{ maybeReadOnly }} />
379
				</label>
380
				<?php endif; ?>
381
				<# if ( 'audio' === data.type ) { #>
382 View Code Duplication
				<?php foreach ( array(
383
					'artist' => __( 'Artist' ),
384
					'album' => __( 'Album' ),
385
				) as $key => $label ) : ?>
386
				<label class="setting" data-setting="<?php echo esc_attr( $key ) ?>">
387
					<span class="name"><?php echo $label ?></span>
388
					<input type="text" value="{{ data.<?php echo $key ?> || data.meta.<?php echo $key ?> || '' }}" />
389
				</label>
390
				<?php endforeach; ?>
391
				<# } #>
392
				<label class="setting" data-setting="caption">
393
					<span class="name"><?php _e( 'Caption' ); ?></span>
394
					<textarea {{ maybeReadOnly }}>{{ data.caption }}</textarea>
395
				</label>
396
				<# if ( 'image' === data.type ) { #>
397
					<label class="setting" data-setting="alt">
398
						<span class="name"><?php _e( 'Alt Text' ); ?></span>
399
						<input type="text" value="{{ data.alt }}" {{ maybeReadOnly }} />
400
					</label>
401
				<# } #>
402
				<label class="setting" data-setting="description">
403
					<span class="name"><?php _e('Description'); ?></span>
404
					<textarea {{ maybeReadOnly }}>{{ data.description }}</textarea>
405
				</label>
406
				<label class="setting">
407
					<span class="name"><?php _e( 'Uploaded By' ); ?></span>
408
					<span class="value">{{ data.authorName }}</span>
409
				</label>
410
				<# if ( data.uploadedToTitle ) { #>
411
					<label class="setting">
412
						<span class="name"><?php _e( 'Uploaded To' ); ?></span>
413
						<# if ( data.uploadedToLink ) { #>
414
							<span class="value"><a href="{{ data.uploadedToLink }}">{{ data.uploadedToTitle }}</a></span>
415
						<# } else { #>
416
							<span class="value">{{ data.uploadedToTitle }}</span>
417
						<# } #>
418
					</label>
419
				<# } #>
420
				<div class="attachment-compat"></div>
421
			</div>
422
423
			<div class="actions">
424
				<a class="view-attachment" href="{{ data.link }}"><?php _e( 'View attachment page' ); ?></a>
425
				<# if ( data.can.save ) { #> |
426
					<a href="post.php?post={{ data.id }}&action=edit"><?php _e( 'Edit more details' ); ?></a>
427
				<# } #>
428
				<# if ( ! data.uploading && data.can.remove ) { #> |
429 View Code Duplication
					<?php if ( MEDIA_TRASH ): ?>
430
						<# if ( 'trash' === data.status ) { #>
431
							<button type="button" class="button-link untrash-attachment"><?php _e( 'Untrash' ); ?></button>
432
						<# } else { #>
433
							<button type="button" class="button-link trash-attachment"><?php _ex( 'Trash', 'verb' ); ?></button>
434
						<# } #>
435
					<?php else: ?>
436
						<button type="button" class="button-link delete-attachment"><?php _e( 'Delete Permanently' ); ?></button>
437
					<?php endif; ?>
438
				<# } #>
439
			</div>
440
441
		</div>
442
	</script>
443
444
	<script type="text/html" id="tmpl-attachment">
445
		<div class="attachment-preview js--select-attachment type-{{ data.type }} subtype-{{ data.subtype }} {{ data.orientation }}">
446
			<div class="thumbnail">
447
				<# if ( data.uploading ) { #>
448
					<div class="media-progress-bar"><div style="width: {{ data.percent }}%"></div></div>
449
				<# } else if ( 'image' === data.type && data.sizes ) { #>
450
					<div class="centered">
451
						<img src="{{ data.size.url }}" draggable="false" alt="" />
452
					</div>
453
				<# } else { #>
454
					<div class="centered">
455
						<# if ( data.image && data.image.src && data.image.src !== data.icon ) { #>
456
							<img src="{{ data.image.src }}" class="thumbnail" draggable="false" alt="" />
457
						<# } else { #>
458
							<img src="{{ data.icon }}" class="icon" draggable="false" alt="" />
459
						<# } #>
460
					</div>
461
					<div class="filename">
462
						<div>{{ data.filename }}</div>
463
					</div>
464
				<# } #>
465
			</div>
466
			<# if ( data.buttons.close ) { #>
467
				<button type="button" class="button-link attachment-close media-modal-icon"><span class="screen-reader-text"><?php _e( 'Remove' ); ?></span></button>
468
			<# } #>
469
		</div>
470
		<# if ( data.buttons.check ) { #>
471
			<button type="button" class="button-link check" tabindex="-1"><span class="media-modal-icon"></span><span class="screen-reader-text"><?php _e( 'Deselect' ); ?></span></button>
472
		<# } #>
473
		<#
474
		var maybeReadOnly = data.can.save || data.allowLocalEdits ? '' : 'readonly';
475
		if ( data.describe ) {
476
			if ( 'image' === data.type ) { #>
477
				<input type="text" value="{{ data.caption }}" class="describe" data-setting="caption"
478
					placeholder="<?php esc_attr_e('Caption this image&hellip;'); ?>" {{ maybeReadOnly }} />
479
			<# } else { #>
480
				<input type="text" value="{{ data.title }}" class="describe" data-setting="title"
481
					<# if ( 'video' === data.type ) { #>
482
						placeholder="<?php esc_attr_e('Describe this video&hellip;'); ?>"
483
					<# } else if ( 'audio' === data.type ) { #>
484
						placeholder="<?php esc_attr_e('Describe this audio file&hellip;'); ?>"
485
					<# } else { #>
486
						placeholder="<?php esc_attr_e('Describe this media file&hellip;'); ?>"
487
					<# } #> {{ maybeReadOnly }} />
488
			<# }
489
		} #>
490
	</script>
491
492
	<script type="text/html" id="tmpl-attachment-details">
493
		<h2>
494
			<?php _e( 'Attachment Details' ); ?>
495
			<span class="settings-save-status">
496
				<span class="spinner"></span>
497
				<span class="saved"><?php esc_html_e('Saved.'); ?></span>
498
			</span>
499
		</h2>
500
		<div class="attachment-info">
501
			<div class="thumbnail thumbnail-{{ data.type }}">
502
				<# if ( data.uploading ) { #>
503
					<div class="media-progress-bar"><div></div></div>
504
				<# } else if ( 'image' === data.type && data.sizes ) { #>
505
					<img src="{{ data.size.url }}" draggable="false" alt="" />
506
				<# } else { #>
507
					<img src="{{ data.icon }}" class="icon" draggable="false" alt="" />
508
				<# } #>
509
			</div>
510
			<div class="details">
511
				<div class="filename">{{ data.filename }}</div>
512
				<div class="uploaded">{{ data.dateFormatted }}</div>
513
514
				<div class="file-size">{{ data.filesizeHumanReadable }}</div>
515
				<# if ( 'image' === data.type && ! data.uploading ) { #>
516
					<# if ( data.width && data.height ) { #>
517
						<div class="dimensions">{{ data.width }} &times; {{ data.height }}</div>
518
					<# } #>
519
520
					<# if ( data.can.save && data.sizes ) { #>
521
						<a class="edit-attachment" href="{{ data.editLink }}&amp;image-editor" target="_blank"><?php _e( 'Edit Image' ); ?></a>
522
					<# } #>
523
				<# } #>
524
525
				<# if ( data.fileLength ) { #>
526
					<div class="file-length"><?php _e( 'Length:' ); ?> {{ data.fileLength }}</div>
527
				<# } #>
528
529
				<# if ( ! data.uploading && data.can.remove ) { #>
530 View Code Duplication
					<?php if ( MEDIA_TRASH ): ?>
531
					<# if ( 'trash' === data.status ) { #>
532
						<button type="button" class="button-link untrash-attachment"><?php _e( 'Untrash' ); ?></button>
533
					<# } else { #>
534
						<button type="button" class="button-link trash-attachment"><?php _ex( 'Trash', 'verb' ); ?></button>
535
					<# } #>
536
					<?php else: ?>
537
						<button type="button" class="button-link delete-attachment"><?php _e( 'Delete Permanently' ); ?></button>
538
					<?php endif; ?>
539
				<# } #>
540
541
				<div class="compat-meta">
542
					<# if ( data.compat && data.compat.meta ) { #>
543
						{{{ data.compat.meta }}}
544
					<# } #>
545
				</div>
546
			</div>
547
		</div>
548
549
		<label class="setting" data-setting="url">
550
			<span class="name"><?php _e('URL'); ?></span>
551
			<input type="text" value="{{ data.url }}" readonly />
552
		</label>
553
		<# var maybeReadOnly = data.can.save || data.allowLocalEdits ? '' : 'readonly'; #>
554
		<?php if ( post_type_supports( 'attachment', 'title' ) ) : ?>
555
		<label class="setting" data-setting="title">
556
			<span class="name"><?php _e('Title'); ?></span>
557
			<input type="text" value="{{ data.title }}" {{ maybeReadOnly }} />
558
		</label>
559
		<?php endif; ?>
560
		<# if ( 'audio' === data.type ) { #>
561 View Code Duplication
		<?php foreach ( array(
562
			'artist' => __( 'Artist' ),
563
			'album' => __( 'Album' ),
564
		) as $key => $label ) : ?>
565
		<label class="setting" data-setting="<?php echo esc_attr( $key ) ?>">
566
			<span class="name"><?php echo $label ?></span>
567
			<input type="text" value="{{ data.<?php echo $key ?> || data.meta.<?php echo $key ?> || '' }}" />
568
		</label>
569
		<?php endforeach; ?>
570
		<# } #>
571
		<label class="setting" data-setting="caption">
572
			<span class="name"><?php _e('Caption'); ?></span>
573
			<textarea {{ maybeReadOnly }}>{{ data.caption }}</textarea>
574
		</label>
575
		<# if ( 'image' === data.type ) { #>
576
			<label class="setting" data-setting="alt">
577
				<span class="name"><?php _e('Alt Text'); ?></span>
578
				<input type="text" value="{{ data.alt }}" {{ maybeReadOnly }} />
579
			</label>
580
		<# } #>
581
		<label class="setting" data-setting="description">
582
			<span class="name"><?php _e('Description'); ?></span>
583
			<textarea {{ maybeReadOnly }}>{{ data.description }}</textarea>
584
		</label>
585
	</script>
586
587
	<script type="text/html" id="tmpl-media-selection">
588
		<div class="selection-info">
589
			<span class="count"></span>
590
			<# if ( data.editable ) { #>
591
				<button type="button" class="button-link edit-selection"><?php _e( 'Edit Selection' ); ?></button>
592
			<# } #>
593
			<# if ( data.clearable ) { #>
594
				<button type="button" class="button-link clear-selection"><?php _e( 'Clear' ); ?></button>
595
			<# } #>
596
		</div>
597
		<div class="selection-view"></div>
598
	</script>
599
600
	<script type="text/html" id="tmpl-attachment-display-settings">
601
		<h2><?php _e( 'Attachment Display Settings' ); ?></h2>
602
603
		<# if ( 'image' === data.type ) { #>
604
			<label class="setting">
605
				<span><?php _e('Alignment'); ?></span>
606
				<select class="alignment"
607
					data-setting="align"
608
					<# if ( data.userSettings ) { #>
609
						data-user-setting="align"
610
					<# } #>>
611
612
					<option value="left">
613
						<?php esc_attr_e('Left'); ?>
614
					</option>
615
					<option value="center">
616
						<?php esc_attr_e('Center'); ?>
617
					</option>
618
					<option value="right">
619
						<?php esc_attr_e('Right'); ?>
620
					</option>
621
					<option value="none" selected>
622
						<?php esc_attr_e('None'); ?>
623
					</option>
624
				</select>
625
			</label>
626
		<# } #>
627
628
		<div class="setting">
629
			<label>
630
				<# if ( data.model.canEmbed ) { #>
631
					<span><?php _e('Embed or Link'); ?></span>
632
				<# } else { #>
633
					<span><?php _e('Link To'); ?></span>
634
				<# } #>
635
636
				<select class="link-to"
637
					data-setting="link"
638
					<# if ( data.userSettings && ! data.model.canEmbed ) { #>
639
						data-user-setting="urlbutton"
640
					<# } #>>
641
642
				<# if ( data.model.canEmbed ) { #>
643
					<option value="embed" selected>
644
						<?php esc_attr_e('Embed Media Player'); ?>
645
					</option>
646
					<option value="file">
647
				<# } else { #>
648
					<option value="none" selected>
649
						<?php esc_attr_e('None'); ?>
650
					</option>
651
					<option value="file">
652
				<# } #>
653
					<# if ( data.model.canEmbed ) { #>
654
						<?php esc_attr_e('Link to Media File'); ?>
655
					<# } else { #>
656
						<?php esc_attr_e('Media File'); ?>
657
					<# } #>
658
					</option>
659
					<option value="post">
660
					<# if ( data.model.canEmbed ) { #>
661
						<?php esc_attr_e('Link to Attachment Page'); ?>
662
					<# } else { #>
663
						<?php esc_attr_e('Attachment Page'); ?>
664
					<# } #>
665
					</option>
666
				<# if ( 'image' === data.type ) { #>
667
					<option value="custom">
668
						<?php esc_attr_e('Custom URL'); ?>
669
					</option>
670
				<# } #>
671
				</select>
672
			</label>
673
			<input type="text" class="link-to-custom" data-setting="linkUrl" />
674
		</div>
675
676
		<# if ( 'undefined' !== typeof data.sizes ) { #>
677
			<label class="setting">
678
				<span><?php _e('Size'); ?></span>
679
				<select class="size" name="size"
680
					data-setting="size"
681
					<# if ( data.userSettings ) { #>
682
						data-user-setting="imgsize"
683
					<# } #>>
684
					<?php
685
					/** This filter is documented in wp-admin/includes/media.php */
686
					$sizes = apply_filters( 'image_size_names_choose', array(
687
						'thumbnail' => __('Thumbnail'),
688
						'medium'    => __('Medium'),
689
						'large'     => __('Large'),
690
						'full'      => __('Full Size'),
691
					) );
692
693 View Code Duplication
					foreach ( $sizes as $value => $name ) : ?>
694
						<#
695
						var size = data.sizes['<?php echo esc_js( $value ); ?>'];
696
						if ( size ) { #>
697
							<option value="<?php echo esc_attr( $value ); ?>" <?php selected( $value, 'full' ); ?>>
698
								<?php echo esc_html( $name ); ?> &ndash; {{ size.width }} &times; {{ size.height }}
699
							</option>
700
						<# } #>
701
					<?php endforeach; ?>
702
				</select>
703
			</label>
704
		<# } #>
705
	</script>
706
707
	<script type="text/html" id="tmpl-gallery-settings">
708
		<h2><?php _e( 'Gallery Settings' ); ?></h2>
709
710
		<label class="setting">
711
			<span><?php _e('Link To'); ?></span>
712
			<select class="link-to"
713
				data-setting="link"
714
				<# if ( data.userSettings ) { #>
715
					data-user-setting="urlbutton"
716
				<# } #>>
717
718
				<option value="post" <# if ( ! wp.media.galleryDefaults.link || 'post' == wp.media.galleryDefaults.link ) {
719
					#>selected="selected"<# }
720
				#>>
721
					<?php esc_attr_e('Attachment Page'); ?>
722
				</option>
723
				<option value="file" <# if ( 'file' == wp.media.galleryDefaults.link ) { #>selected="selected"<# } #>>
724
					<?php esc_attr_e('Media File'); ?>
725
				</option>
726
				<option value="none" <# if ( 'none' == wp.media.galleryDefaults.link ) { #>selected="selected"<# } #>>
727
					<?php esc_attr_e('None'); ?>
728
				</option>
729
			</select>
730
		</label>
731
732
		<label class="setting">
733
			<span><?php _e('Columns'); ?></span>
734
			<select class="columns" name="columns"
735
				data-setting="columns">
736
				<?php for ( $i = 1; $i <= 9; $i++ ) : ?>
737
					<option value="<?php echo esc_attr( $i ); ?>" <#
738
						if ( <?php echo $i ?> == wp.media.galleryDefaults.columns ) { #>selected="selected"<# }
739
					#>>
740
						<?php echo esc_html( $i ); ?>
741
					</option>
742
				<?php endfor; ?>
743
			</select>
744
		</label>
745
746
		<label class="setting">
747
			<span><?php _e( 'Random Order' ); ?></span>
748
			<input type="checkbox" data-setting="_orderbyRandom" />
749
		</label>
750
751
		<label class="setting size">
752
			<span><?php _e( 'Size' ); ?></span>
753
			<select class="size" name="size"
754
				data-setting="size"
755
				<# if ( data.userSettings ) { #>
756
					data-user-setting="imgsize"
757
				<# } #>
758
				>
759
				<?php
760
				// This filter is documented in wp-admin/includes/media.php
761
				$size_names = apply_filters( 'image_size_names_choose', array(
762
					'thumbnail' => __( 'Thumbnail' ),
763
					'medium'    => __( 'Medium' ),
764
					'large'     => __( 'Large' ),
765
					'full'      => __( 'Full Size' ),
766
				) );
767
768
				foreach ( $size_names as $size => $label ) : ?>
769
					<option value="<?php echo esc_attr( $size ); ?>">
770
						<?php echo esc_html( $label ); ?>
771
					</option>
772
				<?php endforeach; ?>
773
			</select>
774
		</label>
775
	</script>
776
777
	<script type="text/html" id="tmpl-playlist-settings">
778
		<h2><?php _e( 'Playlist Settings' ); ?></h2>
779
780
		<# var emptyModel = _.isEmpty( data.model ),
781
			isVideo = 'video' === data.controller.get('library').props.get('type'); #>
782
783
		<label class="setting">
784
			<input type="checkbox" data-setting="tracklist" <# if ( emptyModel ) { #>
785
				checked="checked"
786
			<# } #> />
787
			<# if ( isVideo ) { #>
788
			<span><?php _e( 'Show Video List' ); ?></span>
789
			<# } else { #>
790
			<span><?php _e( 'Show Tracklist' ); ?></span>
791
			<# } #>
792
		</label>
793
794
		<# if ( ! isVideo ) { #>
795
		<label class="setting">
796
			<input type="checkbox" data-setting="artists" <# if ( emptyModel ) { #>
797
				checked="checked"
798
			<# } #> />
799
			<span><?php _e( 'Show Artist Name in Tracklist' ); ?></span>
800
		</label>
801
		<# } #>
802
803
		<label class="setting">
804
			<input type="checkbox" data-setting="images" <# if ( emptyModel ) { #>
805
				checked="checked"
806
			<# } #> />
807
			<span><?php _e( 'Show Images' ); ?></span>
808
		</label>
809
	</script>
810
811
	<script type="text/html" id="tmpl-embed-link-settings">
812
		<label class="setting link-text">
813
			<span><?php _e( 'Link Text' ); ?></span>
814
			<input type="text" class="alignment" data-setting="linkText" />
815
		</label>
816
		<div class="embed-container" style="display: none;">
817
			<div class="embed-preview"></div>
818
		</div>
819
	</script>
820
821
	<script type="text/html" id="tmpl-embed-image-settings">
822
		<div class="thumbnail">
823
			<img src="{{ data.model.url }}" draggable="false" alt="" />
824
		</div>
825
826
		<?php
827
		/** This filter is documented in wp-admin/includes/media.php */
828
		if ( ! apply_filters( 'disable_captions', '' ) ) : ?>
829
			<label class="setting caption">
830
				<span><?php _e('Caption'); ?></span>
831
				<textarea data-setting="caption" />
832
			</label>
833
		<?php endif; ?>
834
835
		<label class="setting alt-text">
836
			<span><?php _e('Alt Text'); ?></span>
837
			<input type="text" data-setting="alt" />
838
		</label>
839
840
		<div class="setting align">
841
			<span><?php _e('Align'); ?></span>
842
			<div class="button-group button-large" data-setting="align">
843
				<button class="button" value="left">
844
					<?php esc_attr_e('Left'); ?>
845
				</button>
846
				<button class="button" value="center">
847
					<?php esc_attr_e('Center'); ?>
848
				</button>
849
				<button class="button" value="right">
850
					<?php esc_attr_e('Right'); ?>
851
				</button>
852
				<button class="button active" value="none">
853
					<?php esc_attr_e('None'); ?>
854
				</button>
855
			</div>
856
		</div>
857
858
		<div class="setting link-to">
859
			<span><?php _e('Link To'); ?></span>
860
			<div class="button-group button-large" data-setting="link">
861
				<button class="button" value="file">
862
					<?php esc_attr_e('Image URL'); ?>
863
				</button>
864
				<button class="button" value="custom">
865
					<?php esc_attr_e('Custom URL'); ?>
866
				</button>
867
				<button class="button active" value="none">
868
					<?php esc_attr_e('None'); ?>
869
				</button>
870
			</div>
871
			<input type="text" class="link-to-custom" data-setting="linkUrl" />
872
		</div>
873
	</script>
874
875
	<script type="text/html" id="tmpl-image-details">
876
		<div class="media-embed">
877
			<div class="embed-media-settings">
878
				<div class="column-image">
879
					<div class="image">
880
						<img src="{{ data.model.url }}" draggable="false" alt="" />
881
882
						<# if ( data.attachment && window.imageEdit ) { #>
883
							<div class="actions">
884
								<input type="button" class="edit-attachment button" value="<?php esc_attr_e( 'Edit Original' ); ?>" />
885
								<input type="button" class="replace-attachment button" value="<?php esc_attr_e( 'Replace' ); ?>" />
886
							</div>
887
						<# } #>
888
					</div>
889
				</div>
890
				<div class="column-settings">
891
					<?php
892
					/** This filter is documented in wp-admin/includes/media.php */
893
					if ( ! apply_filters( 'disable_captions', '' ) ) : ?>
894
						<label class="setting caption">
895
							<span><?php _e('Caption'); ?></span>
896
							<textarea data-setting="caption">{{ data.model.caption }}</textarea>
897
						</label>
898
					<?php endif; ?>
899
900
					<label class="setting alt-text">
901
						<span><?php _e('Alternative Text'); ?></span>
902
						<input type="text" data-setting="alt" value="{{ data.model.alt }}" />
903
					</label>
904
905
					<h2><?php _e( 'Display Settings' ); ?></h2>
906
					<div class="setting align">
907
						<span><?php _e('Align'); ?></span>
908
						<div class="button-group button-large" data-setting="align">
909
							<button class="button" value="left">
910
								<?php esc_attr_e('Left'); ?>
911
							</button>
912
							<button class="button" value="center">
913
								<?php esc_attr_e('Center'); ?>
914
							</button>
915
							<button class="button" value="right">
916
								<?php esc_attr_e('Right'); ?>
917
							</button>
918
							<button class="button active" value="none">
919
								<?php esc_attr_e('None'); ?>
920
							</button>
921
						</div>
922
					</div>
923
924
					<# if ( data.attachment ) { #>
925
						<# if ( 'undefined' !== typeof data.attachment.sizes ) { #>
926
							<label class="setting size">
927
								<span><?php _e('Size'); ?></span>
928
								<select class="size" name="size"
929
									data-setting="size"
930
									<# if ( data.userSettings ) { #>
931
										data-user-setting="imgsize"
932
									<# } #>>
933
									<?php
934
									/** This filter is documented in wp-admin/includes/media.php */
935
									$sizes = apply_filters( 'image_size_names_choose', array(
936
										'thumbnail' => __('Thumbnail'),
937
										'medium'    => __('Medium'),
938
										'large'     => __('Large'),
939
										'full'      => __('Full Size'),
940
									) );
941
942 View Code Duplication
									foreach ( $sizes as $value => $name ) : ?>
943
										<#
944
										var size = data.sizes['<?php echo esc_js( $value ); ?>'];
945
										if ( size ) { #>
946
											<option value="<?php echo esc_attr( $value ); ?>">
947
												<?php echo esc_html( $name ); ?> &ndash; {{ size.width }} &times; {{ size.height }}
948
											</option>
949
										<# } #>
950
									<?php endforeach; ?>
951
									<option value="<?php echo esc_attr( 'custom' ); ?>">
952
										<?php _e( 'Custom Size' ); ?>
953
									</option>
954
								</select>
955
							</label>
956
						<# } #>
957
							<div class="custom-size<# if ( data.model.size !== 'custom' ) { #> hidden<# } #>">
958
								<label><span><?php _e( 'Width' ); ?> <small>(px)</small></span> <input data-setting="customWidth" type="number" step="1" value="{{ data.model.customWidth }}" /></label><span class="sep">&times;</span><label><span><?php _e( 'Height' ); ?> <small>(px)</small></span><input data-setting="customHeight" type="number" step="1" value="{{ data.model.customHeight }}" /></label>
959
							</div>
960
					<# } #>
961
962
					<div class="setting link-to">
963
						<span><?php _e('Link To'); ?></span>
964
						<select data-setting="link">
965
						<# if ( data.attachment ) { #>
966
							<option value="file">
967
								<?php esc_attr_e('Media File'); ?>
968
							</option>
969
							<option value="post">
970
								<?php esc_attr_e('Attachment Page'); ?>
971
							</option>
972
						<# } else { #>
973
							<option value="file">
974
								<?php esc_attr_e('Image URL'); ?>
975
							</option>
976
						<# } #>
977
							<option value="custom">
978
								<?php esc_attr_e('Custom URL'); ?>
979
							</option>
980
							<option value="none">
981
								<?php esc_attr_e('None'); ?>
982
							</option>
983
						</select>
984
						<input type="text" class="link-to-custom" data-setting="linkUrl" />
985
					</div>
986
					<div class="advanced-section">
987
						<h2><button type="button" class="button-link advanced-toggle"><?php _e( 'Advanced Options' ); ?></button></h2>
988
						<div class="advanced-settings hidden">
989
							<div class="advanced-image">
990
								<label class="setting title-text">
991
									<span><?php _e('Image Title Attribute'); ?></span>
992
									<input type="text" data-setting="title" value="{{ data.model.title }}" />
993
								</label>
994
								<label class="setting extra-classes">
995
									<span><?php _e('Image CSS Class'); ?></span>
996
									<input type="text" data-setting="extraClasses" value="{{ data.model.extraClasses }}" />
997
								</label>
998
							</div>
999
							<div class="advanced-link">
1000
								<div class="setting link-target">
1001
									<label><input type="checkbox" data-setting="linkTargetBlank" value="_blank" <# if ( data.model.linkTargetBlank ) { #>checked="checked"<# } #>><?php _e( 'Open link in a new tab' ); ?></label>
1002
								</div>
1003
								<label class="setting link-rel">
1004
									<span><?php _e('Link Rel'); ?></span>
1005
									<input type="text" data-setting="linkRel" value="{{ data.model.linkClassName }}" />
1006
								</label>
1007
								<label class="setting link-class-name">
1008
									<span><?php _e('Link CSS Class'); ?></span>
1009
									<input type="text" data-setting="linkClassName" value="{{ data.model.linkClassName }}" />
1010
								</label>
1011
							</div>
1012
						</div>
1013
					</div>
1014
				</div>
1015
			</div>
1016
		</div>
1017
	</script>
1018
1019
	<script type="text/html" id="tmpl-image-editor">
1020
		<div id="media-head-{{ data.id }}"></div>
1021
		<div id="image-editor-{{ data.id }}"></div>
1022
	</script>
1023
1024
	<script type="text/html" id="tmpl-audio-details">
1025
		<# var ext, html5types = {
1026
			mp3: wp.media.view.settings.embedMimes.mp3,
1027
			ogg: wp.media.view.settings.embedMimes.ogg
1028
		}; #>
1029
1030
		<?php $audio_types = wp_get_audio_extensions(); ?>
1031
		<div class="media-embed media-embed-details">
1032
			<div class="embed-media-settings embed-audio-settings">
1033
				<?php wp_underscore_audio_template() ?>
1034
1035
				<# if ( ! _.isEmpty( data.model.src ) ) {
1036
					ext = data.model.src.split('.').pop();
1037
					if ( html5types[ ext ] ) {
1038
						delete html5types[ ext ];
1039
					}
1040
				#>
1041
				<label class="setting">
1042
					<span>SRC</span>
1043
					<input type="text" disabled="disabled" data-setting="src" value="{{ data.model.src }}" />
1044
					<button type="button" class="button-link remove-setting"><?php _e( 'Remove audio source' ); ?></button>
1045
				</label>
1046
				<# } #>
1047
				<?php
1048
1049 View Code Duplication
				foreach ( $audio_types as $type ):
1050
				?><# if ( ! _.isEmpty( data.model.<?php echo $type ?> ) ) {
1051
					if ( ! _.isUndefined( html5types.<?php echo $type ?> ) ) {
1052
						delete html5types.<?php echo $type ?>;
1053
					}
1054
				#>
1055
				<label class="setting">
1056
					<span><?php echo strtoupper( $type ) ?></span>
1057
					<input type="text" disabled="disabled" data-setting="<?php echo $type ?>" value="{{ data.model.<?php echo $type ?> }}" />
1058
					<button type="button" class="button-link remove-setting"><?php _e( 'Remove audio source' ); ?></button>
1059
				</label>
1060
				<# } #>
1061
				<?php endforeach ?>
1062
1063
				<# if ( ! _.isEmpty( html5types ) ) { #>
1064
				<div class="setting">
1065
					<span><?php _e( 'Add alternate sources for maximum HTML5 playback:' ) ?></span>
1066
					<div class="button-large">
1067
					<# _.each( html5types, function (mime, type) { #>
1068
					<button class="button add-media-source" data-mime="{{ mime }}">{{ type }}</button>
1069
					<# } ) #>
1070
					</div>
1071
				</div>
1072
				<# } #>
1073
1074
				<div class="setting preload">
1075
					<span><?php _e( 'Preload' ); ?></span>
1076
					<div class="button-group button-large" data-setting="preload">
1077
						<button class="button" value="auto"><?php _ex( 'Auto', 'auto preload' ); ?></button>
1078
						<button class="button" value="metadata"><?php _e( 'Metadata' ); ?></button>
1079
						<button class="button active" value="none"><?php _e( 'None' ); ?></button>
1080
					</div>
1081
				</div>
1082
1083
				<label class="setting checkbox-setting">
1084
					<input type="checkbox" data-setting="autoplay" />
1085
					<span><?php _e( 'Autoplay' ); ?></span>
1086
				</label>
1087
1088
				<label class="setting checkbox-setting">
1089
					<input type="checkbox" data-setting="loop" />
1090
					<span><?php _e( 'Loop' ); ?></span>
1091
				</label>
1092
			</div>
1093
		</div>
1094
	</script>
1095
1096
	<script type="text/html" id="tmpl-video-details">
1097
		<# var ext, html5types = {
1098
			mp4: wp.media.view.settings.embedMimes.mp4,
1099
			ogv: wp.media.view.settings.embedMimes.ogv,
1100
			webm: wp.media.view.settings.embedMimes.webm
1101
		}; #>
1102
1103
		<?php $video_types = wp_get_video_extensions(); ?>
1104
		<div class="media-embed media-embed-details">
1105
			<div class="embed-media-settings embed-video-settings">
1106
				<div class="wp-video-holder">
1107
				<#
1108
				var w = ! data.model.width || data.model.width > 640 ? 640 : data.model.width,
1109
					h = ! data.model.height ? 360 : data.model.height;
1110
1111
				if ( data.model.width && w !== data.model.width ) {
1112
					h = Math.ceil( ( h * w ) / data.model.width );
1113
				}
1114
				#>
1115
1116
				<?php wp_underscore_video_template() ?>
1117
1118
				<# if ( ! _.isEmpty( data.model.src ) ) {
1119
					ext = data.model.src.split('.').pop();
1120
					if ( html5types[ ext ] ) {
1121
						delete html5types[ ext ];
1122
					}
1123
				#>
1124
				<label class="setting">
1125
					<span>SRC</span>
1126
					<input type="text" disabled="disabled" data-setting="src" value="{{ data.model.src }}" />
1127
					<button type="button" class="button-link remove-setting"><?php _e( 'Remove video source' ); ?></button>
1128
				</label>
1129
				<# } #>
1130 View Code Duplication
				<?php foreach ( $video_types as $type ):
1131
				?><# if ( ! _.isEmpty( data.model.<?php echo $type ?> ) ) {
1132
					if ( ! _.isUndefined( html5types.<?php echo $type ?> ) ) {
1133
						delete html5types.<?php echo $type ?>;
1134
					}
1135
				#>
1136
				<label class="setting">
1137
					<span><?php echo strtoupper( $type ) ?></span>
1138
					<input type="text" disabled="disabled" data-setting="<?php echo $type ?>" value="{{ data.model.<?php echo $type ?> }}" />
1139
					<button type="button" class="button-link remove-setting"><?php _e( 'Remove video source' ); ?></button>
1140
				</label>
1141
				<# } #>
1142
				<?php endforeach ?>
1143
				</div>
1144
1145
				<# if ( ! _.isEmpty( html5types ) ) { #>
1146
				<div class="setting">
1147
					<span><?php _e( 'Add alternate sources for maximum HTML5 playback:' ); ?></span>
1148
					<div class="button-large">
1149
					<# _.each( html5types, function (mime, type) { #>
1150
					<button class="button add-media-source" data-mime="{{ mime }}">{{ type }}</button>
1151
					<# } ) #>
1152
					</div>
1153
				</div>
1154
				<# } #>
1155
1156
				<# if ( ! _.isEmpty( data.model.poster ) ) { #>
1157
				<label class="setting">
1158
					<span><?php _e( 'Poster Image' ); ?></span>
1159
					<input type="text" disabled="disabled" data-setting="poster" value="{{ data.model.poster }}" />
1160
					<button type="button" class="button-link remove-setting"><?php _e( 'Remove poster image' ); ?></button>
1161
				</label>
1162
				<# } #>
1163
				<div class="setting preload">
1164
					<span><?php _e( 'Preload' ); ?></span>
1165
					<div class="button-group button-large" data-setting="preload">
1166
						<button class="button" value="auto"><?php _ex( 'Auto', 'auto preload' ); ?></button>
1167
						<button class="button" value="metadata"><?php _e( 'Metadata' ); ?></button>
1168
						<button class="button active" value="none"><?php _e( 'None' ); ?></button>
1169
					</div>
1170
				</div>
1171
1172
				<label class="setting checkbox-setting">
1173
					<input type="checkbox" data-setting="autoplay" />
1174
					<span><?php _e( 'Autoplay' ); ?></span>
1175
				</label>
1176
1177
				<label class="setting checkbox-setting">
1178
					<input type="checkbox" data-setting="loop" />
1179
					<span><?php _e( 'Loop' ); ?></span>
1180
				</label>
1181
1182
				<label class="setting" data-setting="content">
1183
					<span><?php _e( 'Tracks (subtitles, captions, descriptions, chapters, or metadata)' ); ?></span>
1184
					<#
1185
					var content = '';
1186
					if ( ! _.isEmpty( data.model.content ) ) {
1187
						var tracks = jQuery( data.model.content ).filter( 'track' );
1188
						_.each( tracks.toArray(), function (track) {
1189
							content += track.outerHTML; #>
1190
						<p>
1191
							<input class="content-track" type="text" value="{{ track.outerHTML }}" />
1192
							<button type="button" class="button-link remove-setting remove-track"><?php _ex( 'Remove video track', 'media' ); ?></button>
1193
						</p>
1194
						<# } ); #>
1195
					<# } else { #>
1196
					<em><?php _e( 'There are no associated subtitles.' ); ?></em>
1197
					<# } #>
1198
					<textarea class="hidden content-setting">{{ content }}</textarea>
1199
				</label>
1200
			</div>
1201
		</div>
1202
	</script>
1203
1204
	<script type="text/html" id="tmpl-editor-gallery">
1205
		<# if ( data.attachments.length ) { #>
1206
			<div class="gallery gallery-columns-{{ data.columns }}">
1207
				<# _.each( data.attachments, function( attachment, index ) { #>
1208
					<dl class="gallery-item">
1209
						<dt class="gallery-icon">
1210
							<# if ( attachment.thumbnail ) { #>
1211
								<img src="{{ attachment.thumbnail.url }}" width="{{ attachment.thumbnail.width }}" height="{{ attachment.thumbnail.height }}" alt="" />
1212
							<# } else { #>
1213
								<img src="{{ attachment.url }}" alt="" />
1214
							<# } #>
1215
						</dt>
1216
						<# if ( attachment.caption ) { #>
1217
							<dd class="wp-caption-text gallery-caption">
1218
								{{{ data.verifyHTML( attachment.caption ) }}}
1219
							</dd>
1220
						<# } #>
1221
					</dl>
1222
					<# if ( index % data.columns === data.columns - 1 ) { #>
1223
						<br style="clear: both;">
1224
					<# } #>
1225
				<# } ); #>
1226
			</div>
1227
		<# } else { #>
1228
			<div class="wpview-error">
1229
				<div class="dashicons dashicons-format-gallery"></div><p><?php _e( 'No items found.' ); ?></p>
1230
			</div>
1231
		<# } #>
1232
	</script>
1233
1234
	<script type="text/html" id="tmpl-crop-content">
1235
		<img class="crop-image" src="{{ data.url }}" alt="<?php esc_attr_e( 'Image crop area preview. Requires mouse interaction.' ); ?>">
1236
		<div class="upload-errors"></div>
1237
	</script>
1238
1239
	<script type="text/html" id="tmpl-site-icon-preview">
1240
		<h2><?php _e( 'Preview' ); ?></h2>
1241
		<strong aria-hidden="true"><?php _e( 'As a browser icon' ); ?></strong>
1242
		<div class="favicon-preview">
1243
			<img src="<?php echo esc_url( admin_url( 'images/' . ( is_rtl() ? 'browser-rtl.png' : 'browser.png' ) ) ); ?>" class="browser-preview" width="182" height="" alt="" />
1244
1245
			<div class="favicon">
1246
				<img id="preview-favicon" src="{{ data.url }}" alt="<?php esc_attr_e( 'Preview as a browser icon' ); ?>"/>
1247
			</div>
1248
			<span class="browser-title" aria-hidden="true"><?php bloginfo( 'name' ); ?></span>
1249
		</div>
1250
1251
		<strong aria-hidden="true"><?php _e( 'As an app icon' ); ?></strong>
1252
		<div class="app-icon-preview">
1253
			<img id="preview-app-icon" src="{{ data.url }}" alt="<?php esc_attr_e( 'Preview as an app icon' ); ?>"/>
1254
		</div>
1255
	</script>
1256
1257
	<?php
1258
1259
	/**
1260
	 * Fires when the custom Backbone media templates are printed.
1261
	 *
1262
	 * @since 3.5.0
1263
	 */
1264
	do_action( 'print_media_templates' );
1265
}
1266