icons.php (6701B)
1 <?php 2 namespace Elementor; 3 4 use Elementor\Modules\DynamicTags\Module as TagsModule; 5 6 if ( ! defined( 'ABSPATH' ) ) { 7 exit; // Exit if accessed directly. 8 } 9 10 /** 11 * Elementor Icons control. 12 * 13 * A base control for creating a Icons chooser control. 14 * Used to select an Icon. 15 * 16 * Usage: @see https://developers.elementor.com/elementor-controls/icons-control 17 * 18 * @since 2.6.0 19 */ 20 class Control_Icons extends Control_Base_Multiple { 21 22 /** 23 * Get media control type. 24 * 25 * Retrieve the control type, in this case `media`. 26 * 27 * @access public 28 * @since 2.6.0 29 * @return string Control type. 30 */ 31 public function get_type() { 32 return 'icons'; 33 } 34 35 /** 36 * Get Icons control default values. 37 * 38 * Retrieve the default value of the Icons control. Used to return the default 39 * values while initializing the Icons control. 40 * 41 * @access public 42 * @since 2.6.0 43 * @return array Control default value. 44 */ 45 public function get_default_value() { 46 return [ 47 'value' => '', 48 'library' => '', 49 ]; 50 } 51 52 /** 53 * Render Icons control output in the editor. 54 * 55 * Used to generate the control HTML in the editor using Underscore JS 56 * template. The variables for the class are available using `data` JS 57 * object. 58 * 59 * @since 2.6.0 60 * @access public 61 */ 62 public function content_template() { 63 ?> 64 <# if ( 'inline' === data.skin ) { #> 65 <?php $this->render_inline_skin(); ?> 66 <# } else { #> 67 <?php $this->render_media_skin(); ?> 68 <# } #> 69 <?php 70 } 71 72 public function render_media_skin() { 73 ?> 74 <div class="elementor-control-field elementor-control-media"> 75 <label class="elementor-control-title">{{{ data.label }}}</label> 76 <div class="elementor-control-input-wrapper elementor-aspect-ratio-219"> 77 <div class="elementor-control-media__content elementor-control-tag-area elementor-control-preview-area elementor-fit-aspect-ratio"> 78 <div class="elementor-control-media-upload-button elementor-control-media__content__upload-button elementor-fit-aspect-ratio"> 79 <i class="eicon-plus-circle" aria-hidden="true"></i> 80 </div> 81 <div class="elementor-control-media-area elementor-fit-aspect-ratio"> 82 <div class="elementor-control-media__remove elementor-control-media__content__remove" title="<?php echo esc_html__( 'Remove', 'elementor' ); ?>"> 83 <i class="eicon-trash-o"></i> 84 </div> 85 <div class="elementor-control-media__preview elementor-fit-aspect-ratio"></div> 86 </div> 87 <div class="elementor-control-media__tools elementor-control-dynamic-switcher-wrapper"> 88 <div class="elementor-control-icon-picker elementor-control-media__tool"><?php echo esc_html__( 'Icon Library', 'elementor' ); ?></div> 89 <div class="elementor-control-svg-uploader elementor-control-media__tool"><?php echo esc_html__( 'Upload SVG', 'elementor' ); ?></div> 90 </div> 91 </div> 92 </div> 93 <# if ( data.description ) { #> 94 <div class="elementor-control-field-description">{{{ data.description }}}</div> 95 <# } #> 96 <input type="hidden" data-setting="{{ data.name }}"/> 97 </div> 98 <?php 99 } 100 101 public function render_inline_skin() { 102 ?> 103 <div class="elementor-control-field elementor-control-inline-icon"> 104 <label class="elementor-control-title">{{{ data.label }}}</label> 105 <div class="elementor-control-input-wrapper"> 106 <div class="elementor-choices"> 107 <input id="<?php $this->print_control_uid(); ?>-none" type="radio" value="none"> 108 <label class="elementor-choices-label elementor-control-unit-1 tooltip-target elementor-control-icons--inline__none" for="<?php $this->print_control_uid(); ?>-none" data-tooltip="<?php echo esc_html__( 'None', 'elementor' ); ?>" title="<?php echo esc_html__( 'None', 'elementor' ); ?>"> 109 <i class="eicon-ban" aria-hidden="true"></i> 110 <span class="elementor-screen-only"><?php echo esc_html__( 'None', 'elementor' ); ?></span> 111 </label> 112 <# if ( ! data.exclude_inline_options.includes( 'svg' ) ) { #> 113 <input id="<?php $this->print_control_uid(); ?>-svg" type="radio" value="svg"> 114 <label class="elementor-choices-label elementor-control-unit-1 tooltip-target elementor-control-icons--inline__svg" for="<?php $this->print_control_uid(); ?>-svg" data-tooltip="<?php echo esc_html__( 'Upload SVG', 'elementor' ); ?>" title="<?php echo esc_html__( 'Upload SVG', 'elementor' ); ?>"> 115 <i class="eicon-upload" aria-hidden="true"></i> 116 <span class="elementor-screen-only"><?php echo esc_html__( 'Upload SVG', 'elementor' ); ?></span> 117 </label> 118 <# } 119 if ( ! data.exclude_inline_options.includes( 'icon' ) ) { #> 120 <input id="<?php $this->print_control_uid(); ?>-icon" type="radio" value="icon"> 121 <label class="elementor-choices-label elementor-control-unit-1 tooltip-target elementor-control-icons--inline__icon" for="<?php $this->print_control_uid(); ?>-icon" data-tooltip="<?php echo esc_html__( 'Icon Library', 'elementor' ); ?>" title="<?php echo esc_html__( 'Icon Library', 'elementor' ); ?>"> 122 <span class="elementor-control-icons--inline__displayed-icon"> 123 <i class="eicon-circle" aria-hidden="true"></i> 124 </span> 125 <span class="elementor-screen-only"><?php echo esc_html__( 'Icon Library', 'elementor' ); ?></span> 126 </label> 127 <# } #> 128 </div> 129 </div> 130 </div> 131 132 <# if ( data.description ) { #> 133 <div class="elementor-control-field-description">{{{ data.description }}}</div> 134 <# } #> 135 <?php 136 } 137 138 /** 139 * Get Icons control default settings. 140 * 141 * Retrieve the default settings of the Icons control. Used to return the default 142 * settings while initializing the Icons control. 143 * 144 * @since 2.6.0 145 * @access protected 146 * 147 * @return array Control default settings. 148 */ 149 protected function get_default_settings() { 150 return [ 151 'label_block' => true, 152 'dynamic' => [ 153 'categories' => [ TagsModule::IMAGE_CATEGORY ], 154 'returnType' => 'object', 155 ], 156 'search_bar' => true, 157 'recommended' => false, 158 'skin' => 'media', 159 'exclude_inline_options' => [], 160 ]; 161 } 162 163 public function support_svg_import( $mimes ) { 164 $mimes['svg'] = 'image/svg+xml'; 165 return $mimes; 166 } 167 168 public function on_import( $settings ) { 169 if ( empty( $settings['library'] ) || 'svg' !== $settings['library'] || empty( $settings['value']['url'] ) ) { 170 return $settings; 171 } 172 173 add_filter( 'upload_mimes', [ $this, 'support_svg_import' ], 100 ); 174 175 $imported = Plugin::$instance->templates_manager->get_import_images_instance()->import( $settings['value'] ); 176 177 remove_filter( 'upload_mimes', [ $this, 'support_svg_import' ], 100 ); 178 179 if ( ! $imported ) { 180 $settings['value'] = ''; 181 $settings['library'] = ''; 182 } else { 183 $settings['value'] = $imported; 184 } 185 return $settings; 186 } 187 }