1 | <?php |
||
21 | class Kirki_Control_Dimensions extends WP_Customize_Control { |
||
22 | |||
23 | /** |
||
24 | * The control type. |
||
25 | * |
||
26 | * @access public |
||
27 | * @var string |
||
28 | */ |
||
29 | public $type = 'kirki-dimensions'; |
||
30 | |||
31 | /** |
||
32 | * Used to automatically generate all CSS output. |
||
33 | * |
||
34 | * @access public |
||
35 | * @var array |
||
36 | */ |
||
37 | public $output = array(); |
||
38 | |||
39 | /** |
||
40 | * Data type |
||
41 | * |
||
42 | * @access public |
||
43 | * @var string |
||
44 | */ |
||
45 | public $option_type = 'theme_mod'; |
||
46 | |||
47 | /** |
||
48 | * The kirki_config we're using for this control |
||
49 | * |
||
50 | * @access public |
||
51 | * @var string |
||
52 | */ |
||
53 | public $kirki_config = 'global'; |
||
54 | |||
55 | /** |
||
56 | * Refresh the parameters passed to the JavaScript via JSON. |
||
57 | * |
||
58 | * @see WP_Customize_Control::to_json() |
||
59 | */ |
||
60 | public function to_json() { |
||
61 | parent::to_json(); |
||
62 | |||
63 | $this->json['default'] = $this->setting->default; |
||
64 | if ( isset( $this->default ) ) { |
||
65 | $this->json['default'] = $this->default; |
||
66 | } |
||
67 | $this->json['output'] = $this->output; |
||
68 | $this->json['value'] = $this->value(); |
||
69 | $this->json['choices'] = $this->choices; |
||
70 | $this->json['link'] = $this->get_link(); |
||
71 | $this->json['id'] = $this->id; |
||
72 | $this->json['l10n'] = $this->l10n(); |
||
73 | |||
74 | $this->json['inputAttrs'] = ''; |
||
75 | foreach ( $this->input_attrs as $attr => $value ) { |
||
76 | $this->json['inputAttrs'] .= $attr . '="' . esc_attr( $value ) . '" '; |
||
77 | } |
||
78 | |||
79 | if ( is_array( $this->choices ) ) { |
||
80 | foreach ( $this->choices as $choice => $value ) { |
||
81 | if ( 'labels' !== $choice && true === $value ) { |
||
82 | $this->json['choices'][ $choice ] = true; |
||
83 | } |
||
84 | } |
||
85 | } |
||
86 | if ( is_array( $this->json['default'] ) ) { |
||
87 | foreach ( $this->json['default'] as $key => $value ) { |
||
88 | if ( isset( $this->json['choices'][ $key ] ) && ! isset( $this->json['value'][ $key ] ) ) { |
||
89 | $this->json['value'][ $key ] = $value; |
||
90 | } |
||
91 | } |
||
92 | } |
||
93 | } |
||
94 | |||
95 | /** |
||
96 | * Enqueue control related scripts/styles. |
||
97 | * |
||
98 | * @access public |
||
99 | */ |
||
100 | public function enqueue() { |
||
101 | |||
102 | $script_to_localize = ; |
||
|
|||
103 | wp_enqueue_script( 'kirki-dimensions', trailingslashit( Kirki::$url ) . 'controls/dimensions/dimensions.js', array( 'jquery', 'customize-base' ), false, true ); |
||
104 | wp_enqueue_style( 'kirki-dimensions-css', trailingslashit( Kirki::$url ) . 'controls/dimensions/dimensions.css', null ); |
||
105 | wp_localize_script( 'kirki-dimensions', 'dimensionskirkiL10n', $this->l10n() ); |
||
106 | } |
||
107 | |||
108 | /** |
||
109 | * An Underscore (JS) template for this control's content (but not its container). |
||
110 | * |
||
111 | * Class variables for this control class are available in the `data` JS object; |
||
112 | * export custom variables by overriding {@see WP_Customize_Control::to_json()}. |
||
113 | * |
||
114 | * @see WP_Customize_Control::print_template() |
||
115 | * |
||
116 | * @access protected |
||
117 | */ |
||
118 | protected function content_template() { |
||
119 | ?> |
||
120 | <div class="kirki-controls-loading-spinner"><div class="bounce1"></div><div class="bounce2"></div><div class="bounce3"></div></div> |
||
121 | <label> |
||
122 | <# if ( data.label ) { #><span class="customize-control-title">{{{ data.label }}}</span><# } #> |
||
123 | <# if ( data.description ) { #><span class="description customize-control-description">{{{ data.description }}}</span><# } #> |
||
124 | <div class="wrapper"> |
||
125 | <div class="control"> |
||
126 | <# for ( choiceKey in data.default ) { #> |
||
127 | <div class="{{ choiceKey }}"> |
||
128 | <h5> |
||
129 | <# if ( ! _.isUndefined( data.choices.labels ) && ! _.isUndefined( data.choices.labels[ choiceKey ] ) ) { #> |
||
130 | {{ data.choices.labels[ choiceKey ] }} |
||
131 | <# } else if ( ! _.isUndefined( data.l10n[ choiceKey ] ) ) { #> |
||
132 | {{ data.l10n[ choiceKey ] }} |
||
133 | <# } else { #> |
||
134 | {{ choiceKey }} |
||
135 | <# } #> |
||
136 | </h5> |
||
137 | <div class="{{ choiceKey }} input-wrapper"> |
||
138 | <input {{{ data.inputAttrs }}} type="text" value="{{ data.value[ choiceKey ] }}"/> |
||
139 | </div> |
||
140 | </div> |
||
141 | <# } #> |
||
142 | </div> |
||
143 | </div> |
||
144 | </label> |
||
145 | <?php |
||
146 | } |
||
147 | |||
148 | /** |
||
149 | * Render the control's content. |
||
150 | * |
||
151 | * @see WP_Customize_Control::render_content() |
||
152 | */ |
||
153 | protected function render_content() {} |
||
154 | |||
155 | /** |
||
156 | * Returns an array of translation strings. |
||
157 | * |
||
158 | * @access protected |
||
159 | * @since 3.0.0 |
||
160 | * @return string |
||
161 | */ |
||
162 | protected function l10n() { |
||
163 | return array( |
||
164 | 'left-top' => esc_attr__( 'Left Top', 'kirki' ), |
||
165 | 'left-center' => esc_attr__( 'Left Center', 'kirki' ), |
||
166 | 'left-bottom' => esc_attr__( 'Left Bottom', 'kirki' ), |
||
167 | 'right-top' => esc_attr__( 'Right Top', 'kirki' ), |
||
168 | 'right-center' => esc_attr__( 'Right Center', 'kirki' ), |
||
169 | 'right-bottom' => esc_attr__( 'Right Bottom', 'kirki' ), |
||
170 | 'center-top' => esc_attr__( 'Center Top', 'kirki' ), |
||
171 | 'center-center' => esc_attr__( 'Center Center', 'kirki' ), |
||
172 | 'center-bottom' => esc_attr__( 'Center Bottom', 'kirki' ), |
||
173 | 'font-size' => esc_attr__( 'Font Size', 'kirki' ), |
||
174 | 'font-weight' => esc_attr__( 'Font Weight', 'kirki' ), |
||
175 | 'line-height' => esc_attr__( 'Line Height', 'kirki' ), |
||
176 | 'font-style' => esc_attr__( 'Font Style', 'kirki' ), |
||
177 | 'letter-spacing' => esc_attr__( 'Letter Spacing', 'kirki' ), |
||
178 | 'word-spacing' => esc_attr__( 'Word Spacing', 'kirki' ), |
||
179 | 'top' => esc_attr__( 'Top', 'kirki' ), |
||
180 | 'bottom' => esc_attr__( 'Bottom', 'kirki' ), |
||
181 | 'left' => esc_attr__( 'Left', 'kirki' ), |
||
182 | 'right' => esc_attr__( 'Right', 'kirki' ), |
||
183 | 'center' => esc_attr__( 'Center', 'kirki' ), |
||
184 | 'size' => esc_attr__( 'Size', 'kirki' ), |
||
185 | 'height' => esc_attr__( 'Height', 'kirki' ), |
||
186 | 'spacing' => esc_attr__( 'Spacing', 'kirki' ), |
||
187 | 'width' => esc_attr__( 'Width', 'kirki' ), |
||
188 | 'height' => esc_attr__( 'Height', 'kirki' ), |
||
189 | 'invalid-value' => esc_attr__( 'Invalid Value', 'kirki' ), |
||
190 | ); |
||
191 | } |
||
192 | } |
||
193 |