easy-elements / includes / Extensions / ScrollTop / ScrollTop.php

ScrollTop.php in Easy Elements for Elementor – Addons & Website Templates 1.4.3, at includes/Extensions/ScrollTop/ScrollTop.php

142 lines 7.1 KB

Raw Download Zip

1	<?php
2	namespace Easyel\EasyElements\Extensions\ScrollTop;
3
4	if ( ! defined( 'ABSPATH' ) ) {
5	exit;
6	}
7
8	class ScrollTop {
9
10	private static $instance = null;
11
12	private function __construct() {
13
14	$tab_slug = 'extensions';
15	$extensions_settings = get_option( 'easy_element_' . $tab_slug, [] );
16
17	$enable_scroll_top = isset( $extensions_settings['enable_scroll_top'] ) ? $extensions_settings['enable_scroll_top'] : 0;
18
19	if ( (int) $enable_scroll_top !== 1 ) {
20	return;
21	}
22
23	add_action( 'wp_footer', [ $this, 'render_scroll_top_html' ] );
24	add_action( 'wp_enqueue_scripts', [ $this, 'enqueue_scripts' ] );
25	}
26
27	public static function get_instance() : self {
28	if ( null === self::$instance ) {
29	self::$instance = new self();
30	}
31	return self::$instance;
32	}
33
34	public function enqueue_scripts() {
35
36	wp_enqueue_style(
37	'easyel-scroll-top',
38	EASYELEMENTS_DIR_URL . 'includes/Extensions/ScrollTop/assets/css/scroll-top.css',
39	[],
40	EASYELEMENTS_VER
41	);
42
43	$settings = get_option( 'easyel_scroll_top_settings', [] );
44	$bg_color_raw = ! empty( $settings['scroll_top_bg_color'] ) ? sanitize_hex_color( $settings['scroll_top_bg_color'] ) : null;
45	$bg_color = $bg_color_raw ? $bg_color_raw : '#333333';
46	$icon_color_raw = ! empty( $settings['scroll_top_icon_color'] ) ? sanitize_hex_color( $settings['scroll_top_icon_color'] ) : null;
47	$icon_color = $icon_color_raw ? $icon_color_raw : '#ffffff';
48	$size = ! empty( $settings['scroll_top_size'] ) ? absint( $settings['scroll_top_size'] ) : 45;
49	$radius = ! empty( $settings['scroll_top_radius'] ) ? absint( $settings['scroll_top_radius'] ) : 50;
50	$position = isset( $settings['scroll_top_position'] ) ? $settings['scroll_top_position'] : 'right';
51	$offset = ! empty( $settings['scroll_top_offset'] ) ? absint( $settings['scroll_top_offset'] ) : 300;
52	$border_width = isset( $settings['scroll_top_border_width'] ) ? absint( $settings['scroll_top_border_width'] ) : 0;
53	$border_color_raw = ! empty( $settings['scroll_top_border_color'] ) ? sanitize_hex_color( $settings['scroll_top_border_color'] ) : null;
54	$border_color = $border_color_raw ? $border_color_raw : '#cccccc';
55	$hover_bg_color_raw = ! empty( $settings['scroll_top_hover_bg_color'] ) ? sanitize_hex_color( $settings['scroll_top_hover_bg_color'] ) : null;
56	$hover_bg_color = $hover_bg_color_raw ? $hover_bg_color_raw : '#000000';
57	$hover_icon_color_raw = ! empty( $settings['scroll_top_hover_icon_color'] ) ? sanitize_hex_color( $settings['scroll_top_hover_icon_color'] ) : null;
58	$hover_icon_color = $hover_icon_color_raw ? $hover_icon_color_raw : '#ffffff';
59	$hover_border_color_raw = ! empty( $settings['scroll_top_hover_border_color'] ) ? sanitize_hex_color( $settings['scroll_top_hover_border_color'] ) : null;
60	$hover_border_color = $hover_border_color_raw ? $hover_border_color_raw : '#cccccc';
61
62	switch ( $position ) {
63	case 'left':
64	$pos_css = 'left: 20px; right: auto;';
65	break;
66	case 'center':
67	$pos_css = 'left: 50%; right: auto; transform: translateX(-50%);';
68	break;
69	default:
70	$pos_css = 'right: 20px; left: auto;';
71	break;
72	}
73
74	$custom_css = "
75	.easyel-scroll-top-btn {
76	--easyel-scroll-top-bg: {$bg_color};
77	--easyel-scroll-top-color: {$icon_color};
78	--easyel-scroll-top-hover-bg: {$hover_bg_color};
79	--easyel-scroll-top-hover-color: {$hover_icon_color};
80	--easyel-scroll-top-hover-border: {$hover_border_color};
81	--easyel-scroll-top-size: {$size}px;
82	--easyel-scroll-top-radius: {$radius}%;
83	border: {$border_width}px solid {$border_color};
84	{$pos_css}
85	}
86	";
87
88	wp_add_inline_style( 'easyel-scroll-top', $custom_css );
89
90	wp_enqueue_script(
91	'easyel-scroll-top',
92	EASYELEMENTS_DIR_URL . 'includes/Extensions/ScrollTop/assets/js/scroll-top.js',
93	[ 'jquery' ],
94	EASYELEMENTS_VER,
95	true
96	);
97
98	wp_localize_script( 'easyel-scroll-top', 'easyelScrollTopData', [
99	'offset' => $offset,
100	] );
101	}
102
103	public function render_scroll_top_html() {
104	$settings = get_option( 'easyel_scroll_top_settings', [] );
105	$icon = isset( $settings['scroll_top_icon'] ) ? $settings['scroll_top_icon'] : 'arrow';
106
107	$icon_html = '';
108
109	switch ( $icon ) {
110	case 'custom_icon':
111	$custom_class = ! empty( $settings['scroll_top_custom_icon'] ) ? $settings['scroll_top_custom_icon'] : 'fas fa-arrow-up';
112	$icon_html = '<i class="' . esc_attr( $custom_class ) . '"></i>';
113	break;
114	case 'custom_image':
115	$custom_image = ! empty( $settings['scroll_top_custom_image'] ) ? $settings['scroll_top_custom_image'] : '';
116	if ( $custom_image ) {
117	$icon_html = '<img src="' . esc_url( $custom_image ) . '" alt="' . esc_attr__( 'Scroll to top', 'easy-elements' ) . '">';
118	} else {
119	$icon_html = $this->get_icon_svg( 'arrow' );
120	}
121	break;
122	default:
123	$icon_html = $this->get_icon_svg( $icon );
124	break;
125	}
126
127	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
128	echo '<button class="easyel-scroll-top-btn" aria-label="' . esc_attr__( 'Scroll to top', 'easy-elements' ) . '">' . wp_kses( $icon_html, easyel_allowed_html() ) . '</button>';
129	}
130
131	private function get_icon_svg( $icon ) {
132	switch ( $icon ) {
133	case 'chevron':
134	return '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M201.4 137.4c12.5-12.5 32.8-12.5 45.3 0l160 160c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L224 205.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l160-160z"/></svg>';
135	case 'double':
136	return '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M246.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L224 109.3 361.4 246.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160zm160 352l-160-160c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L224 301.3 361.4 438.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3z"/></svg>';
137	default: // arrow
138	return '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path fill="currentColor" d="M214.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 141.2V448c0 17.7 14.3 32 32 32s32-14.3 32-32V141.2L329.4 246.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"/></svg>';
139	}
140	}
141	}
142