mirror of
https://github.com/WordPress/WordPress.git
synced 2024-12-31 13:37:51 +01:00
Customizer: Introduce WP_Customize_Media_Control.
`WP_Customize_Media_Control` is a new base class for all Customizer media controls. If used directly it supports the ID of an attachment instead of an URL like `WP_Customize_Upload_Control`. props celloexpressions. fixes #29215. Built from https://develop.svn.wordpress.org/trunk@31698 git-svn-id: http://core.svn.wordpress.org/trunk@31679 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Dominik Schilling
parent
3349b7d25b
commit
f9180e1b4b
@ -582,8 +582,9 @@ p.customize-section-description {
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
/** Header control **/
|
||||
/** Media controls **/
|
||||
|
||||
.customize-control-media .current,
|
||||
.customize-control-upload .current,
|
||||
.customize-control-image .current,
|
||||
.customize-control-background .current,
|
||||
@ -610,6 +611,9 @@ p.customize-section-description {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.customize-control-media .remove-button,
|
||||
.customize-control-media .default-button,
|
||||
.customize-control-media .upload-button,
|
||||
.customize-control-upload .remove-button,
|
||||
.customize-control-upload .default-button,
|
||||
.customize-control-upload .upload-button,
|
||||
@ -626,6 +630,7 @@ p.customize-section-description {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.customize-control-media .current .container,
|
||||
.customize-control-upload .current .container,
|
||||
.customize-control-image .current .container,
|
||||
.customize-control-background .current .container,
|
||||
@ -637,12 +642,14 @@ p.customize-section-description {
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.customize-control-media .current .container,
|
||||
.customize-control-upload .current .container,
|
||||
.customize-control-background .current .container,
|
||||
.customize-control-image .current .container {
|
||||
min-height: 40px;
|
||||
}
|
||||
|
||||
.customize-control-media .placeholder,
|
||||
.customize-control-upload .placeholder,
|
||||
.customize-control-image .placeholder,
|
||||
.customize-control-background .placeholder,
|
||||
@ -653,6 +660,7 @@ p.customize-section-description {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.customize-control-media .inner,
|
||||
.customize-control-upload .inner,
|
||||
.customize-control-image .inner,
|
||||
.customize-control-background .inner,
|
||||
@ -666,6 +674,7 @@ p.customize-section-description {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.customize-control-media .inner,
|
||||
.customize-control-upload .inner,
|
||||
.customize-control-background .inner,
|
||||
.customize-control-image .inner {
|
||||
@ -673,6 +682,7 @@ p.customize-section-description {
|
||||
min-height: 40px;
|
||||
}
|
||||
|
||||
.customize-control-media .inner,
|
||||
.customize-control-upload .inner,
|
||||
.customize-control-image .inner,
|
||||
.customize-control-background .inner,
|
||||
@ -782,6 +792,7 @@ p.customize-section-description {
|
||||
100% { color: #d4b146; }
|
||||
}
|
||||
|
||||
.customize-control-media .actions,
|
||||
.customize-control-upload .actions,
|
||||
.customize-control-image .actions,
|
||||
.customize-control-background .actions,
|
||||
@ -799,6 +810,7 @@ p.customize-section-description {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.customize-control-media img,
|
||||
.customize-control-upload img,
|
||||
.customize-control-image img,
|
||||
.customize-control-background img,
|
||||
@ -808,6 +820,8 @@ p.customize-section-description {
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.customize-control-media .remove-button,
|
||||
.customize-control-media .default-button,
|
||||
.customize-control-upload .remove-button,
|
||||
.customize-control-upload .default-button,
|
||||
.customize-control-image .remove-button,
|
||||
@ -819,6 +833,7 @@ p.customize-section-description {
|
||||
margin-left: 3px;
|
||||
}
|
||||
|
||||
.customize-control-media .upload-button,
|
||||
.customize-control-upload .upload-button,
|
||||
.customize-control-image .upload-button,
|
||||
.customize-control-background .upload-button,
|
||||
|
||||
2
wp-admin/css/customize-controls-rtl.min.css
vendored
2
wp-admin/css/customize-controls-rtl.min.css
vendored
File diff suppressed because one or more lines are too long
@ -582,8 +582,9 @@ p.customize-section-description {
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
/** Header control **/
|
||||
/** Media controls **/
|
||||
|
||||
.customize-control-media .current,
|
||||
.customize-control-upload .current,
|
||||
.customize-control-image .current,
|
||||
.customize-control-background .current,
|
||||
@ -610,6 +611,9 @@ p.customize-section-description {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.customize-control-media .remove-button,
|
||||
.customize-control-media .default-button,
|
||||
.customize-control-media .upload-button,
|
||||
.customize-control-upload .remove-button,
|
||||
.customize-control-upload .default-button,
|
||||
.customize-control-upload .upload-button,
|
||||
@ -626,6 +630,7 @@ p.customize-section-description {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.customize-control-media .current .container,
|
||||
.customize-control-upload .current .container,
|
||||
.customize-control-image .current .container,
|
||||
.customize-control-background .current .container,
|
||||
@ -637,12 +642,14 @@ p.customize-section-description {
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.customize-control-media .current .container,
|
||||
.customize-control-upload .current .container,
|
||||
.customize-control-background .current .container,
|
||||
.customize-control-image .current .container {
|
||||
min-height: 40px;
|
||||
}
|
||||
|
||||
.customize-control-media .placeholder,
|
||||
.customize-control-upload .placeholder,
|
||||
.customize-control-image .placeholder,
|
||||
.customize-control-background .placeholder,
|
||||
@ -653,6 +660,7 @@ p.customize-section-description {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.customize-control-media .inner,
|
||||
.customize-control-upload .inner,
|
||||
.customize-control-image .inner,
|
||||
.customize-control-background .inner,
|
||||
@ -666,6 +674,7 @@ p.customize-section-description {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.customize-control-media .inner,
|
||||
.customize-control-upload .inner,
|
||||
.customize-control-background .inner,
|
||||
.customize-control-image .inner {
|
||||
@ -673,6 +682,7 @@ p.customize-section-description {
|
||||
min-height: 40px;
|
||||
}
|
||||
|
||||
.customize-control-media .inner,
|
||||
.customize-control-upload .inner,
|
||||
.customize-control-image .inner,
|
||||
.customize-control-background .inner,
|
||||
@ -782,6 +792,7 @@ p.customize-section-description {
|
||||
100% { color: #d4b146; }
|
||||
}
|
||||
|
||||
.customize-control-media .actions,
|
||||
.customize-control-upload .actions,
|
||||
.customize-control-image .actions,
|
||||
.customize-control-background .actions,
|
||||
@ -799,6 +810,7 @@ p.customize-section-description {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.customize-control-media img,
|
||||
.customize-control-upload img,
|
||||
.customize-control-image img,
|
||||
.customize-control-background img,
|
||||
@ -808,6 +820,8 @@ p.customize-section-description {
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.customize-control-media .remove-button,
|
||||
.customize-control-media .default-button,
|
||||
.customize-control-upload .remove-button,
|
||||
.customize-control-upload .default-button,
|
||||
.customize-control-image .remove-button,
|
||||
@ -819,6 +833,7 @@ p.customize-section-description {
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
.customize-control-media .upload-button,
|
||||
.customize-control-upload .upload-button,
|
||||
.customize-control-image .upload-button,
|
||||
.customize-control-background .upload-button,
|
||||
|
||||
2
wp-admin/css/customize-controls.min.css
vendored
2
wp-admin/css/customize-controls.min.css
vendored
File diff suppressed because one or more lines are too long
@ -1370,13 +1370,13 @@
|
||||
});
|
||||
|
||||
/**
|
||||
* An upload control, which utilizes the media modal.
|
||||
* A control that implements the media modal.
|
||||
*
|
||||
* @class
|
||||
* @augments wp.customize.Control
|
||||
* @augments wp.customize.Class
|
||||
*/
|
||||
api.UploadControl = api.Control.extend({
|
||||
api.MediaControl = api.Control.extend({
|
||||
|
||||
/**
|
||||
* When the control's DOM structure is ready,
|
||||
@ -1471,7 +1471,7 @@
|
||||
this.params.attachment = attachment;
|
||||
|
||||
// Set the Customizer setting; the callback takes care of rendering.
|
||||
this.setting( attachment.url );
|
||||
this.setting( attachment.id );
|
||||
node = this.container.find( 'audio, video' ).get(0);
|
||||
|
||||
// Initialize audio/video previews.
|
||||
@ -1509,6 +1509,41 @@
|
||||
this.params.attachment = {};
|
||||
this.setting( '' );
|
||||
this.renderContent(); // Not bound to setting change when emptying.
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* An upload control, which utilizes the media modal.
|
||||
*
|
||||
* @class
|
||||
* @augments wp.customize.MediaControl
|
||||
* @augments wp.customize.Control
|
||||
* @augments wp.customize.Class
|
||||
*/
|
||||
api.UploadControl = api.MediaControl.extend({
|
||||
|
||||
/**
|
||||
* Callback handler for when an attachment is selected in the media modal.
|
||||
* Gets the selected image information, and sets it within the control.
|
||||
*/
|
||||
select: function() {
|
||||
// Get the attachment from the modal frame.
|
||||
var node,
|
||||
attachment = this.frame.state().get( 'selection' ).first().toJSON(),
|
||||
mejsSettings = window._wpmejsSettings || {};
|
||||
|
||||
this.params.attachment = attachment;
|
||||
|
||||
// Set the Customizer setting; the callback takes care of rendering.
|
||||
this.setting( attachment.url );
|
||||
node = this.container.find( 'audio, video' ).get(0);
|
||||
|
||||
// Initialize audio/video previews.
|
||||
if ( node ) {
|
||||
this.player = new MediaElementPlayer( node, mejsSettings );
|
||||
} else {
|
||||
this.cleanupPlayer();
|
||||
}
|
||||
},
|
||||
|
||||
// @deprecated
|
||||
@ -1526,6 +1561,7 @@
|
||||
*
|
||||
* @class
|
||||
* @augments wp.customize.UploadControl
|
||||
* @augments wp.customize.MediaControl
|
||||
* @augments wp.customize.Control
|
||||
* @augments wp.customize.Class
|
||||
*/
|
||||
@ -1539,6 +1575,7 @@
|
||||
*
|
||||
* @class
|
||||
* @augments wp.customize.UploadControl
|
||||
* @augments wp.customize.MediaControl
|
||||
* @augments wp.customize.Control
|
||||
* @augments wp.customize.Class
|
||||
*/
|
||||
@ -1575,8 +1612,8 @@
|
||||
*/
|
||||
api.HeaderControl = api.Control.extend({
|
||||
ready: function() {
|
||||
this.btnRemove = $('#customize-control-header_image .actions .remove');
|
||||
this.btnNew = $('#customize-control-header_image .actions .new');
|
||||
this.btnRemove = $('#customize-control-header_image .actions .remove');
|
||||
this.btnNew = $('#customize-control-header_image .actions .new');
|
||||
|
||||
_.bindAll(this, 'openMedia', 'removeImage');
|
||||
|
||||
@ -2311,6 +2348,7 @@
|
||||
|
||||
api.controlConstructor = {
|
||||
color: api.ColorControl,
|
||||
media: api.MediaControl,
|
||||
upload: api.UploadControl,
|
||||
image: api.ImageControl,
|
||||
header: api.HeaderControl,
|
||||
|
||||
4
wp-admin/js/customize-controls.min.js
vendored
4
wp-admin/js/customize-controls.min.js
vendored
File diff suppressed because one or more lines are too long
@ -521,11 +521,11 @@ class WP_Customize_Control {
|
||||
* @since 4.1.0
|
||||
*/
|
||||
final public function print_template() {
|
||||
?>
|
||||
<script type="text/html" id="tmpl-customize-control-<?php echo $this->type; ?>-content">
|
||||
<?php $this->content_template(); ?>
|
||||
</script>
|
||||
<?php
|
||||
?>
|
||||
<script type="text/html" id="tmpl-customize-control-<?php echo $this->type; ?>-content">
|
||||
<?php $this->content_template(); ?>
|
||||
</script>
|
||||
<?php
|
||||
}
|
||||
|
||||
/**
|
||||
@ -638,24 +638,22 @@ class WP_Customize_Color_Control extends WP_Customize_Control {
|
||||
}
|
||||
|
||||
/**
|
||||
* Customize Upload Control class.
|
||||
* Customize Media Control class.
|
||||
*
|
||||
* @since 3.4.0
|
||||
* @since 4.2.0
|
||||
*
|
||||
* @see WP_Customize_Control
|
||||
*/
|
||||
class WP_Customize_Upload_Control extends WP_Customize_Control {
|
||||
public $type = 'upload';
|
||||
class WP_Customize_Media_Control extends WP_Customize_Control {
|
||||
public $type = 'media';
|
||||
public $mime_type = '';
|
||||
public $button_labels = array();
|
||||
public $removed = ''; // unused
|
||||
public $context; // unused
|
||||
public $extensions = array(); // unused
|
||||
|
||||
/**
|
||||
* Constructor.
|
||||
*
|
||||
* @since 4.1.0
|
||||
* @since 4.2.0 Moved from WP_Customize_Upload_Control.
|
||||
*
|
||||
* @param WP_Customize_Manager $manager {@see WP_Customize_Manager} instance.
|
||||
*/
|
||||
@ -677,6 +675,7 @@ class WP_Customize_Upload_Control extends WP_Customize_Control {
|
||||
* Enqueue control related scripts/styles.
|
||||
*
|
||||
* @since 3.4.0
|
||||
* @since 4.2.0 Moved from WP_Customize_Upload_Control.
|
||||
*/
|
||||
public function enqueue() {
|
||||
wp_enqueue_media();
|
||||
@ -686,6 +685,8 @@ class WP_Customize_Upload_Control extends WP_Customize_Control {
|
||||
* Refresh the parameters passed to the JavaScript via JSON.
|
||||
*
|
||||
* @since 3.4.0
|
||||
* @since 4.2.0 Moved from WP_Customize_Upload_Control.
|
||||
*
|
||||
* @uses WP_Customize_Control::to_json()
|
||||
*/
|
||||
public function to_json() {
|
||||
@ -698,6 +699,7 @@ class WP_Customize_Upload_Control extends WP_Customize_Control {
|
||||
if ( is_object( $this->setting ) ) {
|
||||
if ( $this->setting->default ) {
|
||||
// Fake an attachment model - needs all fields used by template.
|
||||
// Note that the default value must be a URL, NOT an attachment ID.
|
||||
$type = in_array( substr( $this->setting->default, -3 ), array( 'jpg', 'png', 'gif', 'bmp' ) ) ? 'image' : 'document';
|
||||
$default_attachment = array(
|
||||
'id' => 1,
|
||||
@ -720,11 +722,7 @@ class WP_Customize_Upload_Control extends WP_Customize_Control {
|
||||
// Set the default as the attachment.
|
||||
$this->json['attachment'] = $this->json['defaultAttachment'];
|
||||
} elseif ( $value ) {
|
||||
// Get the attachment model for the existing file.
|
||||
$attachment_id = attachment_url_to_postid( $value );
|
||||
if ( $attachment_id ) {
|
||||
$this->json['attachment'] = wp_prepare_attachment_for_js( $attachment_id );
|
||||
}
|
||||
$this->json['attachment'] = wp_prepare_attachment_for_js( $value );
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -732,15 +730,18 @@ class WP_Customize_Upload_Control extends WP_Customize_Control {
|
||||
/**
|
||||
* Don't render any content for this control from PHP.
|
||||
*
|
||||
* @see WP_Customize_Upload_Control::content_template()
|
||||
* @since 3.4.0
|
||||
* @since 4.2.0 Moved from WP_Customize_Upload_Control.
|
||||
*
|
||||
* @see WP_Customize_Media_Control::content_template()
|
||||
*/
|
||||
public function render_content() {}
|
||||
|
||||
/**
|
||||
* Render a JS template for the content of the upload control.
|
||||
* Render a JS template for the content of the media control.
|
||||
*
|
||||
* @since 4.1.0
|
||||
* @since 4.2.0 Moved from WP_Customize_Upload_Control.
|
||||
*/
|
||||
public function content_template() {
|
||||
?>
|
||||
@ -822,6 +823,42 @@ class WP_Customize_Upload_Control extends WP_Customize_Control {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Customize Upload Control Class.
|
||||
*
|
||||
* @since 3.4.0
|
||||
*
|
||||
* @see WP_Customize_Media_Control
|
||||
*/
|
||||
class WP_Customize_Upload_Control extends WP_Customize_Media_Control {
|
||||
public $type = 'upload';
|
||||
public $mime_type = '';
|
||||
public $button_labels = array();
|
||||
public $removed = ''; // unused
|
||||
public $context; // unused
|
||||
public $extensions = array(); // unused
|
||||
|
||||
/**
|
||||
* Refresh the parameters passed to the JavaScript via JSON.
|
||||
*
|
||||
* @since 3.4.0
|
||||
*
|
||||
* @uses WP_Customize_Media_Control::to_json()
|
||||
*/
|
||||
public function to_json() {
|
||||
parent::to_json();
|
||||
|
||||
$value = $this->value();
|
||||
if ( $value ) {
|
||||
// Get the attachment model for the existing file.
|
||||
$attachment_id = attachment_url_to_postid( $value );
|
||||
if ( $attachment_id ) {
|
||||
$this->json['attachment'] = wp_prepare_attachment_for_js( $attachment_id );
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Customize Image Control class.
|
||||
*
|
||||
|
||||
@ -1139,6 +1139,7 @@ final class WP_Customize_Manager {
|
||||
|
||||
/* Control Types (custom control classes) */
|
||||
$this->register_control_type( 'WP_Customize_Color_Control' );
|
||||
$this->register_control_type( 'WP_Customize_Media_Control' );
|
||||
$this->register_control_type( 'WP_Customize_Upload_Control' );
|
||||
$this->register_control_type( 'WP_Customize_Image_Control' );
|
||||
$this->register_control_type( 'WP_Customize_Background_Image_Control' );
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
*
|
||||
* @global string $wp_version
|
||||
*/
|
||||
$wp_version = '4.2-alpha-31697';
|
||||
$wp_version = '4.2-alpha-31698';
|
||||
|
||||
/**
|
||||
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.
|
||||
|
||||
Loading…
Reference in New Issue
Block a user