class-redux-slider.php (12606B)
1 <?php 2 /** 3 * Slider Field 4 * 5 * @package Redux Framework/Fields 6 * @subpackage Field_Slider 7 * @since 3.3 8 * @author Kevin Provance (kprovance) 9 * @version 4.0.0 10 */ 11 12 defined( 'ABSPATH' ) || exit; 13 14 if ( ! class_exists( 'Redux_Slider', false ) ) { 15 16 /** 17 * Class Redux_Slider 18 */ 19 class Redux_Slider extends Redux_Field { 20 21 /** 22 * No value readout. 23 * 24 * @var int 25 */ 26 private $display_none = 0; 27 28 /** 29 * Label value readout. 30 * 31 * @var int 32 */ 33 private $display_label = 1; 34 35 /** 36 * Text value readout. 37 * 38 * @var int 39 */ 40 private $display_text = 2; 41 42 /** 43 * Select box value readout. 44 * 45 * @var int 46 */ 47 private $display_select = 3; 48 49 /** 50 * Set field and value defaults. 51 */ 52 public function set_defaults() { 53 $defaults = array( 54 'handles' => 1, 55 'resolution' => 1, 56 'display_value' => 'text', 57 'float_mark' => '.', 58 'forced' => true, 59 'min' => 0, 60 'max' => 1, 61 'step' => 1, 62 ); 63 64 $this->field = wp_parse_args( $this->field, $defaults ); 65 66 // Sanitize float mark. 67 if ( ',' !== $this->field['float_mark'] && '.' !== $this->field['float_mark'] ) { 68 $this->field['float_mark'] = '.'; 69 } 70 71 // Sanitize resolution value. 72 $this->field['resolution'] = $this->clean_val( $this->field['resolution'] ); 73 74 // Sanitize handle value. 75 if ( 0 === $this->field['handles'] || 1 === $this->field['handles'] ) { 76 $this->field['handles'] = 1; 77 } else { 78 $this->field['handles'] = 2; 79 } 80 81 // Sanitize display value. 82 if ( 'label' === $this->field['display_value'] ) { 83 $this->field['display_value'] = $this->display_label; 84 } elseif ( 'select' === $this->field['display_value'] ) { 85 $this->field['display_value'] = $this->display_select; 86 } elseif ( 'none' === $this->field['display_value'] ) { 87 $this->field['display_value'] = $this->display_none; 88 } else { 89 $this->field['display_value'] = $this->display_text; 90 } 91 } 92 93 /** 94 * Sanitize value. 95 * 96 * @param mixed $var Value to sanitize. 97 * 98 * @return float|int 99 */ 100 private function clean_val( $var ) { 101 if ( is_float( $var ) ) { 102 $clear_var = floatval( $var ); 103 } else { 104 $clear_var = intval( $var ); 105 } 106 107 return $clear_var; 108 } 109 110 /** 111 * Clean default values. 112 * 113 * @param mixed $val Default values. 114 * 115 * @return float|int 116 */ 117 private function clean_default( $val ) { 118 if ( empty( $val ) && ! empty( $this->field['default'] ) && $this->clean_val( $this->field['min'] ) >= 1 ) { 119 $val = $this->clean_val( $this->field['default'] ); 120 } 121 122 if ( empty( $val ) && $this->clean_val( $this->field['min'] ) >= 1 ) { 123 $val = $this->clean_val( $this->field['min'] ); 124 } 125 126 if ( empty( $val ) ) { 127 $val = 0; 128 } 129 130 // Extra Validation. 131 if ( $val < $this->field['min'] ) { 132 $val = $this->clean_val( $this->field['min'] ); 133 } elseif ( $val > $this->field['max'] ) { 134 $val = $this->clean_val( $this->field['max'] ); 135 } 136 137 return $val; 138 } 139 140 /** 141 * Sanitize default array. 142 * 143 * @param array $val Defaults. 144 * 145 * @return array 146 */ 147 private function clean_default_array( array $val ): array { 148 $one = $this->value[1]; 149 $two = $this->value[2]; 150 151 if ( empty( $one ) && ! empty( $this->field['default'][1] ) && $this->clean_val( $this->field['min'] ) >= 1 ) { 152 $one = $this->clean_val( $this->field['default'][1] ); 153 } 154 155 if ( empty( $one ) && $this->clean_val( $this->field['min'] ) >= 1 ) { 156 $one = $this->clean_val( $this->field['min'] ); 157 } 158 159 if ( empty( $one ) ) { 160 $one = 0; 161 } 162 163 if ( empty( $two ) && ! empty( $this->field['default'][2] ) && $this->clean_val( $this->field['min'] ) >= 1 ) { 164 $two = $this->clean_val( $this->field['default'][1] + 1 ); 165 } 166 167 if ( empty( $two ) && $this->clean_val( $this->field['min'] ) >= 1 ) { 168 $two = $this->clean_val( $this->field['default'][1] + 1 ); 169 } 170 171 if ( empty( $two ) ) { 172 $two = $this->field['default'][1] + 1; 173 } 174 175 $val[0] = $one; 176 $val[1] = $two; 177 178 return $val; 179 } 180 181 /** 182 * Clean the field data to the fields defaults given the parameters. 183 * 184 * @since Redux_Framework 3.1.8 185 */ 186 private function clean() { 187 188 // Set min to 0 if no value is set. 189 $this->field['min'] = empty( $this->field['min'] ) ? 0 : $this->clean_val( $this->field['min'] ); 190 191 // Set max to min + 1 if empty. 192 $this->field['max'] = empty( $this->field['max'] ) ? $this->field['min'] + 1 : $this->clean_val( $this->field['max'] ); 193 194 // Set step to 1 if step is empty ot step > max. 195 $this->field['step'] = empty( $this->field['step'] ) || $this->field['step'] > $this->field['max'] ? 1 : $this->clean_val( $this->field['step'] ); 196 197 if ( 2 === $this->field['handles'] ) { 198 if ( ! is_array( $this->value ) ) { 199 $this->value[1] = 0; 200 $this->value[2] = 1; 201 } 202 $this->value = $this->clean_default_array( $this->value ); 203 } else { 204 if ( is_array( $this->value ) ) { 205 $this->value = 0; 206 } 207 $this->value = $this->clean_default( $this->value ); 208 } 209 210 // More dummy checks. 211 if ( ! is_array( $this->value ) && 2 === $this->field['handles'] ) { 212 $this->value[0] = $this->field['min']; 213 $this->value[1] = $this->field['min'] + 1; 214 } 215 216 if ( is_array( $this->value ) && 1 === $this->field['handles'] ) { 217 $this->value = $this->field['min']; 218 } 219 } 220 221 /** 222 * Enqueue Function. 223 * If this field requires any scripts, or css define this function and register/enqueue the scripts/css 224 * 225 * @since ReduxFramework 3.1.8 226 */ 227 public function enqueue() { 228 $min = Redux_Functions::is_min(); 229 230 wp_enqueue_style( 'select2-css' ); 231 232 wp_enqueue_style( 233 'redux-nouislider-css', 234 Redux_Core::$url . "assets/css/vendor/nouislider$min.css", 235 array(), 236 '5.0.0' 237 ); 238 239 wp_register_script( 240 'redux-nouislider-js', 241 Redux_Core::$url . 'assets/js/vendor/nouislider/redux.jquery.nouislider' . $min . '.js', 242 array( 'jquery' ), 243 '5.0.0', 244 true 245 ); 246 247 wp_enqueue_script( 248 'redux-field-slider-js', 249 Redux_Core::$url . 'inc/fields/slider/redux-slider' . $min . '.js', 250 array( 'jquery', 'redux-nouislider-js', 'redux-js', 'select2-js' ), 251 $this->timestamp, 252 true 253 ); 254 255 if ( $this->parent->args['dev_mode'] ) { 256 wp_enqueue_style( 257 'redux-field-slider-css', 258 Redux_Core::$url . 'inc/fields/slider/redux-slider.css', 259 array(), 260 $this->timestamp 261 ); 262 } 263 } 264 265 /** 266 * Field Render Function. 267 * Takes the vars and outputs the HTML for the field in the settings 268 * 269 * @since ReduxFramework 0.0.4 270 */ 271 public function render() { 272 $this->clean(); 273 274 $field_id = $this->field['id']; 275 $field_name = $this->field['name'] . $this->field['name_suffix']; 276 277 // Set handle number variable. 278 $two_handles = false; 279 if ( 2 === $this->field['handles'] ) { 280 $two_handles = true; 281 } 282 283 // Set default values(s). 284 if ( true === $two_handles ) { 285 $val_one = $this->value[0]; 286 $val_two = $this->value[1]; 287 288 $html = 'data-default-one=' . $val_one . ' '; 289 $html .= 'data-default-two=' . $val_two . ' '; 290 291 $name_one = $field_name . '[1]'; 292 $name_two = $field_name . '[2]'; 293 294 $id_one = $field_id . '[1]'; 295 $id_two = $field_id . '[2]'; 296 } else { 297 $val_one = $this->value; 298 $val_two = ''; 299 300 $html = 'data-default-one=' . $val_one; 301 302 $name_one = $field_name; 303 $name_two = ''; 304 305 $id_one = $field_id; 306 $id_two = ''; 307 } 308 309 $show_input = false; 310 $show_label = false; 311 $show_select = false; 312 313 // TEXT output. 314 if ( $this->display_text === $this->field['display_value'] ) { 315 $show_input = true; 316 echo '<input 317 type="text" 318 name="' . esc_attr( $name_one ) . '" 319 id="' . esc_attr( $id_one ) . '" 320 value="' . esc_attr( $val_one ) . '" 321 class="redux-slider-input redux-slider-input-one-' . esc_attr( $field_id ) . ' ' . esc_attr( $this->field['class'] ) . '"/>'; 322 323 // LABEL output. 324 } elseif ( $this->display_label === $this->field['display_value'] ) { 325 $show_label = true; 326 327 $label_num = $two_handles ? '-one' : ''; 328 329 echo '<div class="redux-slider-label' . esc_attr( $label_num ) . '" 330 id="redux-slider-label-one-' . esc_attr( $field_id ) . '" 331 name="' . esc_attr( $name_one ) . '"> 332 </div>'; 333 334 // SELECT output. 335 } elseif ( $this->display_select === $this->field['display_value'] ) { 336 $show_select = true; 337 338 if ( isset( $this->field['select2'] ) ) { 339 $this->field['select2'] = wp_parse_args( $this->field['select2'], $this->select2_config ); 340 } else { 341 $this->field['select2'] = $this->select2_config; 342 } 343 344 $this->field['select2'] = Redux_Functions::sanitize_camel_case_array_keys( $this->field['select2'] ); 345 346 $select2_data = Redux_Functions::create_data_string( $this->field['select2'] ); 347 348 echo '<select 349 class="redux-slider-select-one redux-slider-select-one-' . esc_attr( $field_id ) . ' ' . esc_attr( $this->field['class'] ) . '" 350 name="' . esc_attr( $name_one ) . '" 351 id="' . esc_attr( $id_one ) . '" ' . esc_attr( $select2_data ) . '></select>'; 352 } 353 354 // DIV output. 355 echo '<div 356 class="redux-slider-container ' . esc_attr( $this->field['class'] ) . '" 357 id="' . esc_attr( $field_id ) . '" 358 data-id="' . esc_attr( $field_id ) . '" 359 data-min="' . esc_attr( $this->field['min'] ) . '" 360 data-max="' . esc_attr( $this->field['max'] ) . '" 361 data-step="' . esc_attr( $this->field['step'] ) . '" 362 data-handles="' . esc_attr( $this->field['handles'] ) . '" 363 data-display="' . esc_attr( $this->field['display_value'] ) . '" 364 data-rtl="' . esc_attr( is_rtl() ) . '" 365 data-forced="' . esc_attr( $this->field['forced'] ) . '" 366 data-float-mark="' . esc_attr( $this->field['float_mark'] ) . '" 367 data-resolution="' . esc_attr( $this->field['resolution'] ) . '" ' . esc_html( $html ) . '></div>'; 368 369 // Double slider output. 370 if ( true === $two_handles ) { 371 372 // TEXT. 373 if ( true === $show_input ) { 374 echo '<input 375 type="text" 376 name="' . esc_attr( $name_two ) . '" 377 id="' . esc_attr( $id_two ) . '" 378 value="' . esc_attr( $val_two ) . '" 379 class="redux-slider-input redux-slider-input-two-' . esc_attr( $field_id ) . ' ' . esc_attr( $this->field['class'] ) . '"/>'; 380 } 381 382 // LABEL. 383 if ( true === $show_label ) { 384 echo '<div 385 class="redux-slider-label-two" 386 id="redux-slider-label-two-' . esc_attr( $field_id ) . '" 387 name="' . esc_attr( $name_two ) . '"></div>'; 388 } 389 390 // SELECT. 391 if ( true === $show_select ) { 392 echo '<select 393 class="redux-slider-select-two redux-slider-select-two-' . esc_attr( $field_id ) . ' ' . esc_attr( $this->field['class'] ) . '" 394 name="' . esc_attr( $name_two ) . '" 395 id="' . esc_attr( $id_two ) . '" ' . esc_attr( $select2_data ) . '></select>'; 396 } 397 } 398 399 // NO output (input hidden). 400 if ( $this->display_none === $this->field['display_value'] || $this->display_label === $this->field['display_value'] ) { 401 echo '<input 402 type="hidden" 403 class="redux-slider-value-one-' . esc_attr( $field_id ) . ' ' . esc_attr( $this->field['class'] ) . '" 404 name="' . esc_attr( $name_one ) . '" 405 id="' . esc_attr( $id_one ) . '" 406 value="' . esc_attr( $val_one ) . '"/>'; 407 408 // double slider hidden output. 409 if ( true === $two_handles ) { 410 echo '<input 411 type="hidden" 412 class="redux-slider-value-two-' . esc_attr( $field_id ) . ' ' . esc_attr( $this->field['class'] ) . '" 413 name="' . esc_attr( $name_two ) . '" 414 id="' . esc_attr( $id_two ) . '" 415 value="' . esc_attr( $val_two ) . '"/>'; 416 } 417 } 418 } 419 420 /** 421 * Enable output_variables to be generated. 422 * 423 * @since 4.0.3 424 * @return void 425 */ 426 public function output_variables() { 427 // No code needed, just defining the method is enough. 428 } 429 } 430 } 431 432 class_alias( 'Redux_Slider', 'ReduxFramework_Slider' );