123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124 |
- <?php
- class WP_Customize_Color_Control extends WP_Customize_Control {
-
- public $type = 'color';
-
- public $statuses;
-
- public $mode = 'full';
-
- public function __construct( $manager, $id, $args = array() ) {
- $this->statuses = array( '' => __('Default') );
- parent::__construct( $manager, $id, $args );
- }
-
- public function enqueue() {
- wp_enqueue_script( 'wp-color-picker' );
- wp_enqueue_style( 'wp-color-picker' );
- }
-
- public function to_json() {
- parent::to_json();
- $this->json['statuses'] = $this->statuses;
- $this->json['defaultValue'] = $this->setting->default;
- $this->json['mode'] = $this->mode;
- }
-
- public function render_content() {}
-
- public function content_template() {
- ?>
- <
- isHueSlider = data.mode === 'hue';
- if ( data.defaultValue && ! isHueSlider ) {
- if ( '#' !== data.defaultValue.substring( 0, 1 ) ) {
- defaultValue = '#' + data.defaultValue;
- } else {
- defaultValue = data.defaultValue;
- }
- defaultValueAttr = ' data-default-color=' + defaultValue;
- }
- <label>
- <
- <span class="customize-control-title">{{{ data.label }}}</span>
- <
- <
- <span class="description customize-control-description">{{{ data.description }}}</span>
- <
- <div class="customize-control-content">
- <# if ( isHueSlider ) {
- <input class="color-picker-hue" type="text" data-type="hue" />
- <# } else {
- <input class="color-picker-hex" type="text" maxlength="7" placeholder="{{ defaultValue }}" {{ defaultValueAttr }} />
- <# } #>
- </div>
- </label>
- <?php
- }
- }
|