easy-elements / widgets / progress / progress.php

progress.php in Easy Elements for Elementor – Addons & Website Templates 1.5.0, at widgets/progress/progress.php

256 lines 6.5 KB

Raw Download Zip

1	<?php
2	namespace Easyel\EasyElements\Widgets;
3	use Elementor\Controls_Manager;
4	use Elementor\Group_Control_Typography;
5	use Elementor\Group_Control_Background;
6
7	defined( 'ABSPATH' ) \|\| die();
8
9	class Easyel_Progress_Widget extends \Elementor\Widget_Base {
10
11	public function get_name() {
12	return 'easyel-progress-bar';
13	}
14
15	public function get_title() {
16	return esc_html__( 'Progress Bar', 'easy-elements' );
17	}
18
19	public function get_icon() {
20	return 'easyicon easyelIcon-progress-bar';
21	}
22
23	public function get_categories() {
24	return [ 'easyelements_category' ];
25	}
26
27	public function get_keywords() {
28	return [ 'progress', 'text', 'link', 'circle', 'text' ];
29	}
30
31	public function get_style_depends() {
32	return [
33	'easyel-progress-bar',
34	];
35	}
36
37
38	protected function register_controls() {
39	$this->start_controls_section(
40	'section_progress',
41	[
42	'label' => esc_html__( 'Progress Bar', 'easy-elements' ),
43	]
44	);
45
46	$this->add_control(
47	'select_style',
48	[
49	'label' => esc_html__( 'Select Style', 'easy-elements' ),
50	'type' => \Elementor\Controls_Manager::SELECT,
51	'default' => 'style1',
52	'options' => [
53	'style1' => esc_html__( 'Style 1', 'easy-elements' ),
54	'style2' => esc_html__( 'Style 2', 'easy-elements' ),
55	],
56	]
57	);
58
59	$this->add_control(
60	'title',
61	[
62	'label' => esc_html__( 'Title', 'easy-elements' ),
63	'type' => Controls_Manager::TEXT,
64	'dynamic' => [
65	'active' => true,
66	],
67	'placeholder' => esc_html__( 'Web Designer', 'easy-elements' ),
68	'default' => esc_html__( 'Web Designer', 'easy-elements' ),
69	'label_block' => true,
70	]
71	);
72
73	$this->add_control(
74	'easy_percent',
75	[
76	'label' => __( 'Percent', 'easy-elements' ),
77	'type' => \Elementor\Controls_Manager::NUMBER,
78	'min' => 0,
79	'max' => 100,
80	'default' => 50,
81	]
82	);
83	$this->end_controls_section();
84
85	$this->start_controls_section(
86	'rt_progress_style',
87	[
88	'label' => esc_html__( 'Progress', 'easy-elements' ),
89	'tab' => Controls_Manager::TAB_STYLE,
90	]
91	);
92
93	$this->add_control(
94	'progress_color',
95	[
96	'label' => esc_html__( 'Progress Color', 'easy-elements' ),
97	'type' => \Elementor\Controls_Manager::COLOR,
98	'selectors' => [
99	'{{WRAPPER}} .easyel-progress-bar .progress' => 'background: {{VALUE}}',
100	],
101	'condition' => [
102	'select_style' => 'style1'
103	]
104	]
105	);
106
107	$this->add_control(
108	'progress_bar_color',
109	[
110	'label' => esc_html__( 'Progress Bar Color', 'easy-elements' ),
111	'type' => \Elementor\Controls_Manager::COLOR,
112	'selectors' => [
113	'{{WRAPPER}} .easyel-progress-bar .progress-bar' => 'background: {{VALUE}}',
114	],
115	'condition' => [
116	'select_style' => 'style1'
117	]
118	]
119	);
120
121	// progress style 2 bg settings
122	$this->add_group_control(
123	\Elementor\Group_Control_Background::get_type(),
124	[
125	'name' => 'progress_color',
126	'types' => [ 'classic', 'gradient', 'video' ],
127	'selector' => '{{WRAPPER}} .easyel-progress-bar .progress',
128	'condition' => [
129	'select_style' => 'style2'
130	]
131	]
132	);
133
134
135	$this->add_control(
136	'progress_height',
137	[
138	'label' => esc_html__( 'Height', 'easy-elements' ),
139	'type' => Controls_Manager::SLIDER,
140	'selectors' => [
141	'{{WRAPPER}} .easyel-progress-bar .progress' => 'height: {{SIZE}}{{UNIT}};',
142	],
143	]
144	);
145
146	$this->add_control(
147	'progress_radius',[
148	'label' => esc_html__( 'Border Radius', 'easy-elements' ),
149	'type' => Controls_Manager::SLIDER,
150	'selectors' => [
151	'{{WRAPPER}} .easyel-progress-bar .progress' => 'border-radius: {{SIZE}}{{UNIT}};',
152	]
153	]
154	);
155
156	$this->end_controls_section();
157
158	$this->start_controls_section(
159	'title_styles',
160	[
161	'label' => esc_html__( 'Title', 'easy-elements' ),
162	'tab' => Controls_Manager::TAB_STYLE,
163	]
164	);
165
166	$this->add_control(
167	'title_color',
168	[
169	'label' => esc_html__( 'Color', 'easy-elements' ),
170	'type' => Controls_Manager::COLOR,
171	'selectors' => [
172	'{{WRAPPER}} .easyel-progress-bar .title' => 'color: {{VALUE}};',
173	],
174	]
175	);
176
177	$this->add_group_control(
178	Group_Control_Typography::get_type(),
179	[
180	'name' => 'title_typography',
181	'selector' => '{{WRAPPER}} .easyel-progress-bar .title',
182	]
183	);
184	$this->end_controls_section();
185
186	$this->start_controls_section(
187	'easy_percent_styles',
188	[
189	'label' => esc_html__( 'Percent', 'easy-elements' ),
190	'tab' => Controls_Manager::TAB_STYLE,
191	]
192	);
193	$this->add_control(
194	'easy_percent_color',
195	[
196	'label' => esc_html__( 'Color', 'easy-elements' ),
197	'type' => Controls_Manager::COLOR,
198	'selectors' => [
199	'{{WRAPPER}} .easyel-progress-bar .easy_percent' => 'color: {{VALUE}};',
200	],
201	]
202	);
203
204	$this->add_group_control(
205	Group_Control_Typography::get_type(),
206	[
207	'name' => 'easy_percent_typography',
208	'selector' => '{{WRAPPER}} .easyel-progress-bar .easy_percent',
209	]
210	);
211	$this->end_controls_section();
212	}
213
214	protected function render() {
215	$settings = $this->get_settings_for_display();
216	$easy_percent = !empty($settings['easy_percent']) ? rtrim($settings['easy_percent']) : 0;
217	$title = !empty($settings['title']) ? $settings['title'] : '';
218	?>
219	<div class="easyel-progress-bar">
220	<?php
221	if( $settings['select_style'] == 'style2' ) : ?>
222	<div class="progress-style2">
223	<?php if ( $title ) : ?>
224	<p class="title"><?php echo wp_kses_post( $title ); ?></p>
225	<?php endif; ?>
226	<div class="progress">
227	<div class="progress-bar wow fadeInLeft" data-wow-duration="0.5s" data-wow-delay=".3s" role="progressbar" style="width: <?php echo esc_html( $easy_percent ); ?>%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100">
228	</div>
229	<span class="easy_percent"><?php echo esc_html( $easy_percent ); ?>%</span>
230	</div>
231	</div>
232	<?php
233	else : ?>
234	<div class="progress-top">
235	<?php if ( $title ) : ?>
236	<p class="title"><?php echo wp_kses_post( $title ); ?></p>
237	<?php endif; ?>
238	<?php if ( $easy_percent ) : ?>
239	<span class="easy_percent"><?php echo esc_html( $easy_percent ); ?>%</span>
240	<?php endif; ?>
241	</div>
242	<div class="progress">
243	<div class="progress-bar"
244	style="width: <?php echo esc_html( $easy_percent ); ?>%;"
245	aria-valuenow="<?php echo esc_attr( $easy_percent ); ?>"
246	aria-valuemin="0"
247	aria-valuemax="100">
248	</div>
249	</div>
250	<?php
251	endif; ?>
252	</div>
253	<?php
254	}
255	}
256