dimensions.php (4836B)
1 <?php 2 namespace Elementor; 3 4 if ( ! defined( 'ABSPATH' ) ) { 5 exit; // Exit if accessed directly. 6 } 7 8 /** 9 * Elementor dimension control. 10 * 11 * A base control for creating dimension control. Displays input fields for top, 12 * right, bottom, left and the option to link them together. 13 * 14 * @since 1.0.0 15 */ 16 class Control_Dimensions extends Control_Base_Units { 17 18 /** 19 * Get dimensions control type. 20 * 21 * Retrieve the control type, in this case `dimensions`. 22 * 23 * @since 1.0.0 24 * @access public 25 * 26 * @return string Control type. 27 */ 28 public function get_type() { 29 return 'dimensions'; 30 } 31 32 /** 33 * Get dimensions control default values. 34 * 35 * Retrieve the default value of the dimensions control. Used to return the 36 * default values while initializing the dimensions control. 37 * 38 * @since 1.0.0 39 * @access public 40 * 41 * @return array Control default value. 42 */ 43 public function get_default_value() { 44 return array_merge( 45 parent::get_default_value(), [ 46 'top' => '', 47 'right' => '', 48 'bottom' => '', 49 'left' => '', 50 'isLinked' => true, 51 ] 52 ); 53 } 54 55 /** 56 * Get dimensions control default settings. 57 * 58 * Retrieve the default settings of the dimensions control. Used to return the 59 * default settings while initializing the dimensions control. 60 * 61 * @since 1.0.0 62 * @access protected 63 * 64 * @return array Control default settings. 65 */ 66 protected function get_default_settings() { 67 return array_merge( 68 parent::get_default_settings(), [ 69 'label_block' => true, 70 'allowed_dimensions' => 'all', 71 'placeholder' => '', 72 ] 73 ); 74 } 75 76 /** 77 * Render dimensions control output in the editor. 78 * 79 * Used to generate the control HTML in the editor using Underscore JS 80 * template. The variables for the class are available using `data` JS 81 * object. 82 * 83 * @since 1.0.0 84 * @access public 85 */ 86 public function content_template() { 87 $dimensions = [ 88 'top' => esc_html__( 'Top', 'elementor' ), 89 'right' => esc_html__( 'Right', 'elementor' ), 90 'bottom' => esc_html__( 'Bottom', 'elementor' ), 91 'left' => esc_html__( 'Left', 'elementor' ), 92 ]; 93 ?> 94 <div class="elementor-control-field"> 95 <label class="elementor-control-title">{{{ data.label }}}</label> 96 <?php $this->print_units_template(); ?> 97 <div class="elementor-control-input-wrapper"> 98 <ul class="elementor-control-dimensions"> 99 <?php 100 foreach ( $dimensions as $dimension_key => $dimension_title ) : 101 ?> 102 <li class="elementor-control-dimension"> 103 <input id="<?php $this->print_control_uid( $dimension_key ); ?>" type="number" data-setting="<?php 104 // PHPCS - the variable $dimension_key is a plain text. 105 echo $dimension_key; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped 106 ?>" placeholder="<# 107 placeholder = view.getControlPlaceholder(); 108 if ( _.isObject( placeholder ) ) { 109 if ( ! _.isUndefined( placeholder.<?php 110 // PHPCS - the variable $dimension_key is a plain text. 111 echo $dimension_key; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped 112 ?> ) ) { 113 print( placeholder.<?php 114 // PHPCS - the variable $dimension_key is a plain text. 115 echo $dimension_key; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped 116 ?> ); 117 } 118 } else { 119 print( placeholder ); 120 } #>" 121 <# if ( -1 === _.indexOf( allowed_dimensions, '<?php 122 // PHPCS - the variable $dimension_key is a plain text. 123 echo $dimension_key; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped 124 ?>' ) ) { #> 125 disabled 126 <# } #> 127 /> 128 <label for="<?php $this->print_control_uid( $dimension_key ); ?>" class="elementor-control-dimension-label"><?php 129 // PHPCS - the variable $dimension_title holds an escaped translated value. 130 echo $dimension_title; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped 131 ?></label> 132 </li> 133 <?php endforeach; ?> 134 <li> 135 <button class="elementor-link-dimensions tooltip-target" data-tooltip="<?php echo esc_attr__( 'Link values together', 'elementor' ); ?>"> 136 <span class="elementor-linked"> 137 <i class="eicon-link" aria-hidden="true"></i> 138 <span class="elementor-screen-only"><?php echo esc_html__( 'Link values together', 'elementor' ); ?></span> 139 </span> 140 <span class="elementor-unlinked"> 141 <i class="eicon-chain-broken" aria-hidden="true"></i> 142 <span class="elementor-screen-only"><?php echo esc_html__( 'Unlinked values', 'elementor' ); ?></span> 143 </span> 144 </button> 145 </li> 146 </ul> 147 </div> 148 </div> 149 <# if ( data.description ) { #> 150 <div class="elementor-control-field-description">{{{ data.description }}}</div> 151 <# } #> 152 <?php 153 } 154 }