PluginProbe
Elementor Website Builder – more than just a page builder / 3.4.1
Elementor Website Builder – more than just a page builder v3.4.1
4.3.0-beta2 4.3.0-beta1 4.2.4 4.2.3 4.2.2 4.2.1 4.2.0 4.1.5 4.2.0-beta2 4.2.0-dev2 4.2.0-beta1 4.1.4 4.1.3 4.1.2 4.1.1 4.1.0 4.1.0-beta3 4.1.0-dev3 4.0.9 4.1.0-beta2 4.1.0-dev2 4.0.8 4.1.0-beta1 4.1.0-dev1 4.0.7 All 451 releases
elementor / includes / managers / icons.php

icons.php in Elementor Website Builder – more than just a page builder 3.4.1, at includes/managers/icons.php

588 lines 17.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2 namespace Elementor;
3
4 use Elementor\Core\Page_Assets\Data_Managers\Font_Icon_Svg as Font_Icon_Svg_Data_Manager;
5 use Elementor\Core\Page_Assets\Managers\Font_Icon_Svg\Manager as Font_Icon_Svg_Manager;
6 use Elementor\Core\Files\Assets\Svg\Svg_Handler;
7
8 if ( ! defined( 'ABSPATH' ) ) {
9 exit; // Exit if accessed directly.
10 }
11
12 /**
13 * Elementor icons manager.
14 *
15 * Elementor icons manager handler class
16 *
17 * @since 2.4.0
18 */
19 class Icons_Manager {
20
21 const NEEDS_UPDATE_OPTION = 'icon_manager_needs_update';
22
23 const FONT_ICON_SVG_CLASS_NAME = 'e-font-icon-svg';
24
25 const LOAD_FA4_SHIM_OPTION_KEY = 'elementor_load_fa4_shim';
26 /**
27 * Tabs.
28 *
29 * Holds the list of all the tabs.
30 *
31 * @access private
32 * @static
33 * @since 2.4.0
34 * @var array
35 */
36 private static $tabs;
37
38 private static $data_manager;
39
40 private static $font_icon_svg_symbols = [];
41
42 private static function get_needs_upgrade_option() {
43 return get_option( 'elementor_' . self::NEEDS_UPDATE_OPTION, null );
44 }
45
46 /**
47 * register styles
48 *
49 * Used to register all icon types stylesheets so they could be enqueued later by widgets
50 */
51 public function register_styles() {
52 $config = self::get_icon_manager_tabs_config();
53
54 $shared_styles = [];
55
56 foreach ( $config as $type => $icon_type ) {
57 if ( ! isset( $icon_type['url'] ) ) {
58 continue;
59 }
60 $dependencies = [];
61 if ( ! empty( $icon_type['enqueue'] ) ) {
62 foreach ( (array) $icon_type['enqueue'] as $font_css_url ) {
63 if ( ! in_array( $font_css_url, array_keys( $shared_styles ) ) ) {
64 $style_handle = 'elementor-icons-shared-' . count( $shared_styles );
65 wp_register_style(
66 $style_handle,
67 $font_css_url,
68 [],
69 $icon_type['ver']
70 );
71 $shared_styles[ $font_css_url ] = $style_handle;
72 }
73 $dependencies[] = $shared_styles[ $font_css_url ];
74 }
75 }
76 wp_register_style(
77 'elementor-icons-' . $icon_type['name'],
78 $icon_type['url'],
79 $dependencies,
80 $icon_type['ver']
81 );
82 }
83 }
84
85 /**
86 * Init Tabs
87 *
88 * Initiate Icon Manager Tabs.
89 *
90 * @access private
91 * @static
92 * @since 2.4.0
93 */
94 private static function init_tabs() {
95 self::$tabs = apply_filters( 'elementor/icons_manager/native', [
96 'fa-regular' => [
97 'name' => 'fa-regular',
98 'label' => esc_html__( 'Font Awesome - Regular', 'elementor' ),
99 'url' => self::get_fa_asset_url( 'regular' ),
100 'enqueue' => [ self::get_fa_asset_url( 'fontawesome' ) ],
101 'prefix' => 'fa-',
102 'displayPrefix' => 'far',
103 'labelIcon' => 'fab fa-font-awesome-alt',
104 'ver' => '5.15.3',
105 'fetchJson' => self::get_fa_asset_url( 'regular', 'js', false ),
106 'native' => true,
107 ],
108 'fa-solid' => [
109 'name' => 'fa-solid',
110 'label' => esc_html__( 'Font Awesome - Solid', 'elementor' ),
111 'url' => self::get_fa_asset_url( 'solid' ),
112 'enqueue' => [ self::get_fa_asset_url( 'fontawesome' ) ],
113 'prefix' => 'fa-',
114 'displayPrefix' => 'fas',
115 'labelIcon' => 'fab fa-font-awesome',
116 'ver' => '5.15.3',
117 'fetchJson' => self::get_fa_asset_url( 'solid', 'js', false ),
118 'native' => true,
119 ],
120 'fa-brands' => [
121 'name' => 'fa-brands',
122 'label' => esc_html__( 'Font Awesome - Brands', 'elementor' ),
123 'url' => self::get_fa_asset_url( 'brands' ),
124 'enqueue' => [ self::get_fa_asset_url( 'fontawesome' ) ],
125 'prefix' => 'fa-',
126 'displayPrefix' => 'fab',
127 'labelIcon' => 'fab fa-font-awesome-flag',
128 'ver' => '5.15.3',
129 'fetchJson' => self::get_fa_asset_url( 'brands', 'js', false ),
130 'native' => true,
131 ],
132 ] );
133 }
134
135 /**
136 * Get Icon Manager Tabs
137 * @return array
138 */
139 public static function get_icon_manager_tabs() {
140 if ( self::is_font_icon_inline_svg() && ! Plugin::$instance->editor->is_edit_mode() && ! Plugin::$instance->preview->is_preview_mode() ) {
141 self::$tabs = [];
142 } elseif ( ! self::$tabs ) {
143 self::init_tabs();
144 }
145
146 $additional_tabs = apply_filters( 'elementor/icons_manager/additional_tabs', [] );
147
148 return array_merge( self::$tabs, $additional_tabs );
149 }
150
151 public static function enqueue_shim() {
152 wp_enqueue_script(
153 'font-awesome-4-shim',
154 self::get_fa_asset_url( 'v4-shims', 'js' ),
155 [],
156 ELEMENTOR_VERSION
157 );
158 // Make sure that the CSS in the 'all' file does not override FA Pro's CSS
159 if ( ! wp_script_is( 'font-awesome-pro' ) ) {
160 wp_enqueue_style(
161 'font-awesome-5-all',
162 self::get_fa_asset_url( 'all' ),
163 [],
164 ELEMENTOR_VERSION
165 );
166 }
167 wp_enqueue_style(
168 'font-awesome-4-shim',
169 self::get_fa_asset_url( 'v4-shims' ),
170 [],
171 ELEMENTOR_VERSION
172 );
173 }
174
175 private static function get_fa_asset_url( $filename, $ext_type = 'css', $add_suffix = true ) {
176 static $is_test_mode = null;
177 if ( null === $is_test_mode ) {
178 $is_test_mode = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG || defined( 'ELEMENTOR_TESTS' ) && ELEMENTOR_TESTS;
179 }
180 $url = ELEMENTOR_ASSETS_URL . 'lib/font-awesome/' . $ext_type . '/' . $filename;
181 if ( ! $is_test_mode && $add_suffix ) {
182 $url .= '.min';
183 }
184
185 return $url . '.' . $ext_type;
186 }
187
188 public static function get_icon_manager_tabs_config() {
189 $tabs = [
190 'all' => [
191 'name' => 'all',
192 'label' => esc_html__( 'All Icons', 'elementor' ),
193 'labelIcon' => 'eicon-filter',
194 'native' => true,
195 ],
196 ];
197
198 return array_values( array_merge( $tabs, self::get_icon_manager_tabs() ) );
199 }
200
201 /**
202 * is_font_awesome_inline
203 *
204 * @return bool
205 */
206 private static function is_font_icon_inline_svg() {
207 return Plugin::$instance->experiments->is_feature_active( 'e_font_icon_svg' );
208 }
209
210 /**
211 * render_svg_symbols
212 *
213 */
214 public static function render_svg_symbols() {
215 if ( ! self::$font_icon_svg_symbols ) {
216 return;
217 }
218
219 $svg = '<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">';
220
221 foreach ( self::$font_icon_svg_symbols as $symbol_id => $symbol ) {
222 $svg .= '<symbol id="' . $symbol_id . '" viewBox="0 0 ' . esc_attr( $symbol['width'] ) . ' ' . esc_attr( $symbol['height'] ) . '">';
223 $svg .= '<path d="' . esc_attr( $symbol['path'] ) . '"></path>';
224 $svg .= '</symbol>';
225 }
226
227 $svg .= '</svg>';
228
229 Utils::print_unescaped_internal_string( $svg );
230 }
231
232 public static function get_icon_svg_data( $icon ) {
233 $font_family_manager = Font_Icon_Svg_Manager::get_font_family_manager( $icon['font_family'] );
234
235 $config = $font_family_manager::get_config( $icon );
236
237 return self::$data_manager->get_asset_data( $config );
238 }
239
240 /**
241 * Get font awesome svg.
242 * @param $icon array [ 'value' => string, 'library' => string ]
243 *
244 * @return bool|mixed|string
245 */
246 public static function get_font_icon_svg( $icon, $attributes = [] ) {
247 // Load the SVG from the database.
248 $icon_data = self::get_icon_svg_data( $icon );
249
250 if ( ! $icon_data['path'] ) {
251 return '';
252 }
253
254 // Add the icon data to the symbols array for later use in page rendering process.
255 if ( ! in_array( $icon_data['key'], self::$font_icon_svg_symbols, true ) ) {
256 self::$font_icon_svg_symbols[ $icon_data['key'] ] = $icon_data;
257 }
258
259 if ( ! empty( $attributes['class'] ) && ! is_array( $attributes['class'] ) ) {
260 $attributes['class'] = [ $attributes['class'] ];
261 }
262
263 $attributes['class'][] = self::FONT_ICON_SVG_CLASS_NAME;
264
265 /**
266 * If in edit mode inline the full svg, otherwise use the symbol.
267 * Will be displayed only after page update or widget "blur".
268 */
269 if ( Plugin::$instance->editor->is_edit_mode() ) {
270 return '<svg xmlns="http://www.w3.org/2000/svg" ' . Utils::render_html_attributes( $attributes ) . '
271 viewBox="0 0 ' . esc_attr( $icon_data['width'] ) . ' ' . esc_attr( $icon_data['height'] ) . '">
272 <path d="' . esc_attr( $icon_data['path'] ) . '"></path>
273 </svg>';
274 }
275
276 return '<svg ' . Utils::render_html_attributes( $attributes ) . '><use xlink:href="#' . esc_attr( $icon_data['key'] ) . '" /></svg>';
277 }
278
279 public static function render_uploaded_svg_icon( $value ) {
280 if ( ! isset( $value['id'] ) ) {
281 return '';
282 }
283
284 return Svg_Handler::get_inline_svg( $value['id'] );
285 }
286
287 public static function render_font_icon( $icon, $attributes = [], $tag = 'i' ) {
288 $icon_types = self::get_icon_manager_tabs();
289
290 if ( isset( $icon_types[ $icon['library'] ]['render_callback'] ) && is_callable( $icon_types[ $icon['library'] ]['render_callback'] ) ) {
291 return call_user_func_array( $icon_types[ $icon['library'] ]['render_callback'], [ $icon, $attributes, $tag ] );
292 }
293
294 $content = '';
295
296 $font_icon_svg_family = self::is_font_icon_inline_svg() ? Font_Icon_Svg_Manager::get_font_family( $icon['library'] ) : '';
297
298 if ( $font_icon_svg_family ) {
299 $icon['font_family'] = $font_icon_svg_family;
300
301 $content = self::get_font_icon_svg( $icon, $attributes );
302
303 if ( $content ) {
304 return $content;
305 }
306 }
307
308 if ( ! $content ) {
309 if ( empty( $attributes['class'] ) ) {
310 $attributes['class'] = $icon['value'];
311 } else {
312 if ( is_array( $attributes['class'] ) ) {
313 $attributes['class'][] = $icon['value'];
314 } else {
315 $attributes['class'] .= ' ' . $icon['value'];
316 }
317 }
318 }
319
320 return '<' . $tag . ' ' . Utils::render_html_attributes( $attributes ) . '>' . $content . '</' . $tag . '>';
321 }
322
323 /**
324 * Render Icon
325 *
326 * Used to render Icon for \Elementor\Controls_Manager::ICONS
327 * @param array $icon Icon Type, Icon value
328 * @param array $attributes Icon HTML Attributes
329 * @param string $tag Icon HTML tag, defaults to <i>
330 *
331 * @return mixed|string
332 */
333 public static function render_icon( $icon, $attributes = [], $tag = 'i' ) {
334 if ( empty( $icon['library'] ) ) {
335 return false;
336 }
337
338 $output = '';
339
340 /**
341 * When the library value is svg it means that it's a SVG media attachment uploaded by the user.
342 * Otherwise, it's the name of the font family that the icon belongs to.
343 */
344 if ( 'svg' === $icon['library'] ) {
345 $output = self::render_uploaded_svg_icon( $icon['value'] );
346 } else {
347 $output = self::render_font_icon( $icon, $attributes, $tag );
348 }
349
350 Utils::print_unescaped_internal_string( $output );
351
352 return true;
353 }
354
355 /**
356 * Font Awesome 4 to font Awesome 5 Value Migration
357 *
358 * used to convert string value of Icon control to array value of Icons control
359 * ex: 'fa fa-star' => [ 'value' => 'fas fa-star', 'library' => 'fa-solid' ]
360 *
361 * @param $value
362 *
363 * @return array
364 */
365 public static function fa4_to_fa5_value_migration( $value ) {
366 static $migration_dictionary = false;
367 if ( '' === $value ) {
368 return [
369 'value' => '',
370 'library' => '',
371 ];
372 }
373 if ( false === $migration_dictionary ) {
374 $migration_dictionary = json_decode( file_get_contents( ELEMENTOR_ASSETS_PATH . 'lib/font-awesome/migration/mapping.js' ), true );
375 }
376 if ( isset( $migration_dictionary[ $value ] ) ) {
377 return $migration_dictionary[ $value ];
378 }
379
380 return [
381 'value' => 'fas ' . str_replace( 'fa ', '', $value ),
382 'library' => 'fa-solid',
383 ];
384 }
385
386 /**
387 * on_import_migration
388 * @param array $element settings array
389 * @param string $old_control old control id
390 * @param string $new_control new control id
391 * @param bool $remove_old boolean weather to remove old control or not
392 *
393 * @return array
394 */
395 public static function on_import_migration( array $element, $old_control = '', $new_control = '', $remove_old = false ) {
396
397 if ( ! isset( $element['settings'][ $old_control ] ) || isset( $element['settings'][ $new_control ] ) ) {
398 return $element;
399 }
400
401 // Case when old value is saved as empty string
402 $new_value = [
403 'value' => '',
404 'library' => '',
405 ];
406
407 // Case when old value needs migration
408 if ( ! empty( $element['settings'][ $old_control ] ) && ! self::is_migration_allowed() ) {
409 $new_value = self::fa4_to_fa5_value_migration( $element['settings'][ $old_control ] );
410 }
411
412 $element['settings'][ $new_control ] = $new_value;
413
414 //remove old value
415 if ( $remove_old ) {
416 unset( $element['settings'][ $old_control ] );
417 }
418
419 return $element;
420 }
421
422 /**
423 * is_migration_allowed
424 * @return bool
425 */
426 public static function is_migration_allowed() {
427 static $migration_allowed = false;
428 if ( false === $migration_allowed ) {
429 $migration_allowed = null === self::get_needs_upgrade_option();
430
431 /**
432 * allowed to filter migration allowed
433 */
434 $migration_allowed = apply_filters( 'elementor/icons_manager/migration_allowed', $migration_allowed );
435 }
436 return $migration_allowed;
437 }
438
439 /**
440 * Register_Admin Settings
441 *
442 * adds Font Awesome migration / update admin settings
443 * @param Settings $settings
444 */
445 public function register_admin_settings( Settings $settings ) {
446 $settings->add_field(
447 Settings::TAB_ADVANCED,
448 Settings::TAB_ADVANCED,
449 'load_fa4_shim',
450 [
451 'label' => esc_html__( 'Load Font Awesome 4 Support', 'elementor' ),
452 'field_args' => [
453 'type' => 'select',
454 'std' => 'yes',
455 'options' => [
456 '' => esc_html__( 'No', 'elementor' ),
457 'yes' => esc_html__( 'Yes', 'elementor' ),
458 ],
459 'desc' => esc_html__( 'Font Awesome 4 support script (shim.js) is a script that makes sure all previously selected Font Awesome 4 icons are displayed correctly while using Font Awesome 5 library.', 'elementor' ),
460 ],
461 ]
462 );
463 }
464
465 public function register_admin_tools_settings( Tools $settings ) {
466 $settings->add_tab( 'fontawesome4_migration', [ 'label' => esc_html__( 'Font Awesome Upgrade', 'elementor' ) ] );
467
468 $settings->add_section( 'fontawesome4_migration', 'fontawesome4_migration', [
469 'callback' => function() {
470 echo '<h2>' . esc_html__( 'Font Awesome Upgrade', 'elementor' ) . '</h2>';
471 echo '<p>' . // PHPCS - Plain Text
472 __( 'Access 1,500+ amazing Font Awesome 5 icons and enjoy faster performance and design flexibility.', 'elementor' ) . '<br>' . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
473 __( 'By upgrading, whenever you edit a page containing a Font Awesome 4 icon, Elementor will convert it to the new Font Awesome 5 icon.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
474 '</p><p><strong>' .
475 __( 'Please note that the upgrade process may cause some of the previously used Font Awesome 4 icons to look a bit different due to minor design changes made by Font Awesome.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
476 '</strong></p><p>' .
477 __( 'The upgrade process includes a database update', 'elementor' ) . ' - ' . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
478 __( 'We highly recommend backing up your database before performing this upgrade.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
479 '</p>' .
480 __( 'This action is not reversible and cannot be undone by rolling back to previous versions.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
481 '</p>';
482 },
483 'fields' => [
484 [
485 'label' => esc_html__( 'Font Awesome Upgrade', 'elementor' ),
486 'field_args' => [
487 'type' => 'raw_html',
488 'html' => sprintf( '<span data-action="%s" data-_nonce="%s" class="button" id="elementor_upgrade_fa_button">%s</span>',
489 self::NEEDS_UPDATE_OPTION . '_upgrade',
490 wp_create_nonce( self::NEEDS_UPDATE_OPTION ),
491 __( 'Upgrade To Font Awesome 5', 'elementor' )
492 ),
493 ],
494 ],
495 ],
496 ] );
497 }
498
499 /**
500 * Ajax Upgrade to FontAwesome 5
501 */
502 public function ajax_upgrade_to_fa5() {
503 check_ajax_referer( self::NEEDS_UPDATE_OPTION, '_nonce' );
504
505 delete_option( 'elementor_' . self::NEEDS_UPDATE_OPTION );
506
507 wp_send_json_success( [ 'message' => '<p>' . esc_html__( 'Hurray! The upgrade process to Font Awesome 5 was completed successfully.', 'elementor' ) . '</p>' ] );
508 }
509
510 /**
511 * Add Update Needed Flag
512 * @param array $settings
513 *
514 * @return array;
515 */
516 public function add_update_needed_flag( $settings ) {
517 $settings['icons_update_needed'] = true;
518 return $settings;
519 }
520
521 public function enqueue_fontawesome_css() {
522 if ( ! self::is_migration_allowed() ) {
523 wp_enqueue_style( 'font-awesome' );
524 } else {
525 $current_filter = current_filter();
526 $load_shim = get_option( self::LOAD_FA4_SHIM_OPTION_KEY, false );
527 if ( 'elementor/editor/after_enqueue_styles' === $current_filter ) {
528 self::enqueue_shim();
529 } else if ( 'yes' === $load_shim ) {
530 self::enqueue_shim();
531 }
532 }
533 }
534
535 /**
536 * @deprecated 3.1.0
537 */
538 public function add_admin_strings() {
539 Plugin::$instance->modules_manager->get_modules( 'dev-tools' )->deprecation->deprecated_function( __METHOD__, '3.1.0' );
540
541 return [];
542 }
543
544 /**
545 * @since 3.0.0
546 * @deprecated 3.0.0
547 */
548 public function register_ajax_actions() {
549 _deprecated_function( __METHOD__, '3.0.0' );
550 }
551
552 /**
553 * @since 3.0.0.
554 * @deprecated 3.0.0
555 */
556 public function ajax_enable_svg_uploads() {
557 _deprecated_function( __METHOD__, '3.0.0' );
558 }
559
560 /**
561 * Icons Manager constructor
562 */
563 public function __construct() {
564 if ( is_admin() ) {
565 // @todo: remove once we deprecate fa4
566 add_action( 'elementor/admin/after_create_settings/' . Settings::PAGE_ID, [ $this, 'register_admin_settings' ], 100 );
567 }
568
569 if ( self::is_font_icon_inline_svg() ) {
570 self::$data_manager = new Font_Icon_Svg_Data_Manager();
571
572 add_action( 'wp_footer', [ $this, 'render_svg_symbols' ], 10 );
573 }
574
575 add_action( 'elementor/frontend/after_enqueue_styles', [ $this, 'enqueue_fontawesome_css' ] );
576 add_action( 'elementor/frontend/after_register_styles', [ $this, 'register_styles' ] );
577
578 if ( ! self::is_migration_allowed() ) {
579 add_filter( 'elementor/editor/localize_settings', [ $this, 'add_update_needed_flag' ] );
580 add_action( 'elementor/admin/after_create_settings/' . Tools::PAGE_ID, [ $this, 'register_admin_tools_settings' ], 100 );
581
582 if ( ! empty( $_POST ) ) { // phpcs:ignore -- nonce validation done in callback
583 add_action( 'wp_ajax_' . self::NEEDS_UPDATE_OPTION . '_upgrade', [ $this, 'ajax_upgrade_to_fa5' ] );
584 }
585 }
586 }
587 }
588