[Summary view] [Print] [Text view]

   1  <?php
   2  /**
   3   * Customize API: WP_Customize_Color_Control class
   4   *
   5   * @package WordPress
   6   * @subpackage Customize
   7   * @since 4.4.0
   8   */
   9  
  10  /**
  11   * Customize Color Control class.
  12   *
  13   * @since 3.4.0
  14   *
  15   * @see WP_Customize_Control
  16   */
  17  class WP_Customize_Color_Control extends WP_Customize_Control {
  18      /**
  19       * Type.
  20       *
  21       * @var string
  22       */
  23      public $type = 'color';
  24  
  25      /**
  26       * Statuses.
  27       *
  28       * @var array
  29       */
  30      public $statuses;
  31  
  32      /**
  33       * Mode.
  34       *
  35       * @since 4.7.0
  36       * @var string
  37       */
  38      public $mode = 'full';
  39  
  40      /**
  41       * Constructor.
  42       *
  43       * @since 3.4.0
  44       *
  45       * @see WP_Customize_Control::__construct()
  46       *
  47       * @param WP_Customize_Manager $manager Customizer bootstrap instance.
  48       * @param string               $id      Control ID.
  49       * @param array                $args    Optional. Arguments to override class property defaults.
  50       *                                      See WP_Customize_Control::__construct() for information
  51       *                                      on accepted arguments. Default empty array.
  52       */
  53  	public function __construct( $manager, $id, $args = array() ) {
  54          $this->statuses = array( '' => __( 'Default' ) );
  55          parent::__construct( $manager, $id, $args );
  56      }
  57  
  58      /**
  59       * Enqueue scripts/styles for the color picker.
  60       *
  61       * @since 3.4.0
  62       */
  63  	public function enqueue() {
  64          wp_enqueue_script( 'wp-color-picker' );
  65          wp_enqueue_style( 'wp-color-picker' );
  66      }
  67  
  68      /**
  69       * Refresh the parameters passed to the JavaScript via JSON.
  70       *
  71       * @since 3.4.0
  72       * @uses WP_Customize_Control::to_json()
  73       */
  74  	public function to_json() {
  75          parent::to_json();
  76          $this->json['statuses']     = $this->statuses;
  77          $this->json['defaultValue'] = $this->setting->default;
  78          $this->json['mode']         = $this->mode;
  79      }
  80  
  81      /**
  82       * Don't render the control content from PHP, as it's rendered via JS on load.
  83       *
  84       * @since 3.4.0
  85       */
  86  	public function render_content() {}
  87  
  88      /**
  89       * Render a JS template for the content of the color picker control.
  90       *
  91       * @since 4.1.0
  92       */
  93  	public function content_template() {
  94          ?>
  95          <# var defaultValue = '#RRGGBB', defaultValueAttr = '',
  96              isHueSlider = data.mode === 'hue';
  97          if ( data.defaultValue && _.isString( data.defaultValue ) && ! isHueSlider ) {
  98              if ( '#' !== data.defaultValue.substring( 0, 1 ) ) {
  99                  defaultValue = '#' + data.defaultValue;
 100              } else {
 101                  defaultValue = data.defaultValue;
 102              }
 103              defaultValueAttr = ' data-default-color=' + defaultValue; // Quotes added automatically.
 104          } #>
 105          <# if ( data.label ) { #>
 106              <span class="customize-control-title">{{{ data.label }}}</span>
 107          <# } #>
 108          <# if ( data.description ) { #>
 109              <span class="description customize-control-description">{{{ data.description }}}</span>
 110          <# } #>
 111          <div class="customize-control-content">
 112              <label><span class="screen-reader-text">{{{ data.label }}}</span>
 113              <# if ( isHueSlider ) { #>
 114                  <input class="color-picker-hue" type="text" data-type="hue" />
 115              <# } else { #>
 116                  <input class="color-picker-hex" type="text" maxlength="7" placeholder="{{ defaultValue }}" {{ defaultValueAttr }} />
 117              <# } #>
 118              </label>
 119          </div>
 120          <?php
 121      }
 122  }