borderless / modules / elementor / widgets / progress-bar.php

progress-bar.php in Borderless – Addons and Templates for Elementor 1.6.1, at modules/elementor/widgets/progress-bar.php

426 lines 12.2 KB

Raw Download Zip

1	<?php
2
3	namespace Borderless\Widgets;
4
5	if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
6
7	use \Elementor\Controls_Manager;
8	use \Elementor\Group_Control_Background;
9	use \Elementor\Group_Control_Box_Shadow;
10	use \Elementor\Group_Control_Typography;
11	use \Elementor\Core\Kits\Documents\Tabs\Global_Typography;
12	use \Elementor\Widget_Base;
13
14	class Progress_Bar extends Widget_Base {
15
16	public function get_name() {
17	return 'borderless-elementor-progress-bar';
18	}
19
20	public function get_title() {
21	return esc_html__( 'Progress Bar', 'borderless');
22	}
23
24	public function get_icon() {
25	return 'borderless-icon-progress-bar';
26	}
27
28	public function get_categories() {
29	return [ 'borderless' ];
30	}
31
32	public function get_keywords()
33	{
34	return [
35	'progress bar',
36	'bar',
37	'borderless',
38	'borderless progress bar',
39	'borderless bar'
40	];
41	}
42
43	public function get_custom_help_url()
44	{
45	return 'https://wpborderless.com/';
46	}
47
48	public function get_style_depends() {
49	return
50	[
51	'borderless-elementor-style'
52	];
53	}
54
55	public function get_script_depends() {
56	return
57	[
58	'borderless-elementor-appear-script',
59	'borderless-elementor-progressbar-script'
60	];
61	}
62
63	protected function _register_controls() {
64
65
66	/-----------------------------------------------------------------------------------/
67	/* *. Layout
68	/-----------------------------------------------------------------------------------/
69
70	$this->start_controls_section(
71	'borderless_elementor_section_progress_bar_layout',
72	[
73	'label' => esc_html__( 'Layout', 'borderless' ),
74	'tab' => Controls_Manager::TAB_CONTENT,
75	]
76	);
77
78	$this->add_control(
79	'borderless_elementor_progress_bar_title',
80	[
81	'label' => esc_html__( 'Title', 'borderless'),
82	'type' => Controls_Manager::TEXT,
83	'dynamic' => [
84	'active' => true,
85	],
86	]
87	);
88
89	$this->add_control(
90	'borderless_elementor_progress_bar_counter_value',
91	[
92	'label' => esc_html__( 'Counter Value', 'borderless'),
93	'type' => Controls_Manager::SLIDER,
94	'size_units' => ['%'],
95	'range' => [
96	'%' => [
97	'min' => 1,
98	'max' => 100,
99	],
100	],
101	'default' => [
102	'unit' => '%',
103	'size' => 50,
104	],
105	'separator' => 'before',
106	]
107	);
108
109	$this->add_control(
110	'borderless_elementor_progress_bar_animation_duration',
111	[
112	'label' => __('Animation Duration', 'borderless'),
113	'type' => Controls_Manager::SLIDER,
114	'size_units' => ['px'],
115	'range' => [
116	'px' => [
117	'min' => 1000,
118	'max' => 10000,
119	'step' => 100,
120	],
121	],
122	'default' => [
123	'unit' => 'px',
124	'size' => 1500,
125	],
126	'separator' => 'before',
127	]
128	);
129
130	$this->end_controls_section();
131
132
133	/-----------------------------------------------------------------------------------/
134	/* *. Layout - Style
135	/-----------------------------------------------------------------------------------/
136
137	$this->start_controls_section(
138	'borderless_elementor_section_progress_bar_styles_general',
139	[
140	'label' => esc_html__( 'General', 'borderless'),
141	'tab' => Controls_Manager::TAB_STYLE
142	]
143	);
144
145	$this->add_control(
146	'borderless_elementor_progress_bar_alignment',
147	[
148	'label' => __('Alignment', 'borderless'),
149	'type' => \Elementor\Controls_Manager::CHOOSE,
150	'options' => [
151	'borderless-elementor-progress-bar-alignment-left' => [
152	'title' => __('Left', 'borderless'),
153	'icon' => 'fa fa-align-left',
154	],
155	'borderless-elementor-progress-bar-alignment-center' => [
156	'title' => __('Center', 'borderless'),
157	'icon' => 'fa fa-align-center',
158	],
159	'borderless-elementor-progress-bar-alignment-right' => [
160	'title' => __('Right', 'borderless'),
161	'icon' => 'fa fa-align-right',
162	],
163	],
164	'default' => 'borderless-elementor-progress-bar-alignment-center',
165	]
166	);
167
168	$this->add_control(
169	'borderless_elementor_progress_bar_size',
170	[
171	'label' => __('Size', 'borderless'),
172	'type' => Controls_Manager::SLIDER,
173	'size_units' => ['%'],
174	'range' => [
175	'%' => [
176	'min' => 1,
177	'max' => 100,
178	'step' => 1,
179	],
180	],
181	'default' => [
182	'unit' => '%',
183	'size' => 100,
184	],
185	'selectors' => [
186	'{{WRAPPER}} .borderless-elementor-progress-bar' => 'width: {{SIZE}}{{UNIT}};',
187	],
188	'separator' => 'before',
189	]
190	);
191
192	$this->add_control(
193	'borderless_elementor_progress_bar_stroke_width',
194	[
195	'label' => __('Stroke Width', 'borderless'),
196	'type' => Controls_Manager::SLIDER,
197	'size_units' => ['px'],
198	'range' => [
199	'px' => [
200	'min' => 0,
201	'max' => 100,
202	'step' => 1,
203	],
204	],
205	'default' => [
206	'unit' => 'px',
207	'size' => 2,
208	],
209	'separator' => 'before',
210	]
211	);
212
213	$this->add_control(
214	'borderless_elementor_progress_bar_stroke_color_style',
215	[
216	'label' => __( 'Stroke Color Style', 'borderless' ),
217	'type' => \Elementor\Controls_Manager::SELECT,
218	'default' => 'borderless-elementor-progress-bar-stroke-solid-color',
219	'options' => [
220	'borderless-elementor-progress-bar-stroke-solid-color' => __( 'Solid', 'borderless' ),
221	'borderless-elementor-progress-bar-stroke-gradient-color' => __( 'Gradient', 'borderless' ),
222	],
223	]
224	);
225
226	$this->add_control(
227	'borderless_elementor_progress_bar_stroke_color',
228	[
229	'label' => __('Stroke Color', 'borderless'),
230	'type' => Controls_Manager::COLOR,
231	'default' => '#000',
232	'condition' => [
233	'borderless_elementor_progress_bar_stroke_color_style' => 'borderless-elementor-progress-bar-stroke-solid-color',
234	],
235	]
236	);
237
238	$this->add_control(
239	'borderless_elementor_progress_bar_stroke_color_from',
240	[
241	'label' => __('Stroke Color From', 'borderless'),
242	'type' => Controls_Manager::COLOR,
243	'default' => '#000',
244	'condition' => [
245	'borderless_elementor_progress_bar_stroke_color_style' => 'borderless-elementor-progress-bar-stroke-gradient-color',
246	],
247	]
248	);
249
250	$this->add_control(
251	'borderless_elementor_progress_bar_stroke_color_to',
252	[
253	'label' => __('Stroke Color To', 'borderless'),
254	'type' => Controls_Manager::COLOR,
255	'default' => '#000',
256	'condition' => [
257	'borderless_elementor_progress_bar_stroke_color_style' => 'borderless-elementor-progress-bar-stroke-gradient-color',
258	],
259	]
260	);
261
262	$this->add_control(
263	'borderless_elementor_progress_bar_trail_width',
264	[
265	'label' => __('Trail Width', 'borderless'),
266	'type' => Controls_Manager::SLIDER,
267	'size_units' => ['px'],
268	'range' => [
269	'px' => [
270	'min' => 0,
271	'max' => 100,
272	'step' => 1,
273	],
274	],
275	'default' => [
276	'unit' => 'px',
277	'size' => 2,
278	],
279	'separator' => 'before',
280	]
281	);
282
283	$this->add_control(
284	'borderless_elementor_progress_bar_trail_color',
285	[
286	'label' => __('Trail Color', 'borderless'),
287	'type' => Controls_Manager::COLOR,
288	'default' => '#eee',
289	]
290	);
291
292	$this->add_control(
293	'borderless_elementor_progress_bar_background_color',
294	[
295	'label' => __('Background Color', 'borderless'),
296	'type' => Controls_Manager::COLOR,
297	'default' => '#fff',
298	'selectors' => [
299	'{{WRAPPER}} .borderless-elementor-progress-bar' => 'background-color: {{VALUE}}',
300	],
301	'separator' => 'before',
302	]
303	);
304
305	$this->add_group_control(
306	Group_Control_Box_Shadow::get_type(),
307	[
308	'name' => 'borderless_elementor_progress_bar_box_shadow',
309	'label' => __('Box Shadow', 'borderless'),
310	'selector' => '{{WRAPPER}} .borderless-elementor-progress-bar',
311	'separator' => 'before',
312	]
313	);
314
315	$this->end_controls_section();
316
317	/-----------------------------------------------------------------------------------/
318	/* *. Typography - Style
319	/-----------------------------------------------------------------------------------/
320
321	$this->start_controls_section(
322	'borderless_section_circular_progress_bar_typography',
323	[
324	'label' => __('Typography', 'borderless'),
325	'tab' => Controls_Manager::TAB_STYLE,
326	]
327	);
328
329	$this->add_group_control(
330	Group_Control_Typography::get_type(),
331	[
332	'name' => 'borderless_elementor_progress_bar_title_typography',
333	'label' => __('Title', 'borderless'),
334	'global' => [
335	'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
336	],
337	'selector' => '{{WRAPPER}} .borderless-elementor-progress-bar .progressbar-text div .borderless-elementor-progress-bar-title',
338	]
339	);
340
341	$this->add_control(
342	'borderless_elementor_progress_bar_title_color',
343	[
344	'label' => __('Title Color', 'borderless'),
345	'type' => Controls_Manager::COLOR,
346	'default' => '',
347	'selectors' => [
348	'{{WRAPPER}} .borderless-elementor-progress-bar .progressbar-text div .borderless-elementor-progress-bar-title' => 'color: {{VALUE}}',
349	],
350	'separator' => 'after',
351	]
352	);
353
354	$this->add_group_control(
355	Group_Control_Typography::get_type(),
356	[
357	'name' => 'borderless_elementor_progress_bar_counter_typography',
358	'label' => __('Counter', 'borderless'),
359	'global' => [
360	'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
361	],
362	'selector' => '{{WRAPPER}} .borderless-elementor-progress-bar .progressbar-text div .borderless-elementor-progress-bar-counter-value',
363	]
364	);
365
366	$this->add_control(
367	'borderless_elementor_progress_bar_counter_color',
368	[
369	'label' => __('Counter Color', 'borderless'),
370	'type' => Controls_Manager::COLOR,
371	'default' => '',
372	'separator' => 'after',
373	]
374	);
375
376	$this->add_group_control(
377	Group_Control_Typography::get_type(),
378	[
379	'name' => 'borderless_elementor_progress_bar_postfix_typography',
380	'label' => __('Postfix', 'borderless'),
381	'global' => [
382	'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
383	],
384	'selector' => '{{WRAPPER}} .borderless-elementor-progress-bar .progressbar-text div .borderless-elementor-progress-bar-counter-postfix',
385	]
386	);
387
388	$this->add_control(
389	'borderless_elementor_progress_bar_postfix_color',
390	[
391	'label' => __('Postfix Color', 'borderless'),
392	'type' => Controls_Manager::COLOR,
393	'default' => '',
394	'selectors' => [
395	'{{WRAPPER}} .borderless-elementor-progress-bar .progressbar-text div .borderless-elementor-progress-bar-counter-postfix' => 'color: {{VALUE}}',
396	],
397	]
398	);
399
400	$this->end_controls_section();
401
402	}
403
404	/-----------------------------------------------------------------------------------/
405	/* *. Render
406	/-----------------------------------------------------------------------------------/
407
408	protected function render() {
409	$settings = $this->get_settings_for_display();
410
411	if ($settings['borderless_elementor_progress_bar_stroke_color_style'] == 'borderless-elementor-progress-bar-stroke-solid-color') {
412	$borderless_elementor_progress_bar_stroke_color_style = 'stroke_color_mode="solid" stroke_color="' . esc_attr($settings['borderless_elementor_progress_bar_stroke_color']) . '"';
413	} else {
414	$borderless_elementor_progress_bar_stroke_color_style = 'stroke_color_mode="gradient" stroke_color="' . esc_attr($settings['borderless_elementor_progress_bar_stroke_color']) . '" stroke_color_from="' . esc_attr($settings['borderless_elementor_progress_bar_stroke_color_from']) . '" stroke_color_to="' . esc_attr($settings['borderless_elementor_progress_bar_stroke_color_to']) . '"';
415	}
416
417	echo '<div class="borderless-elementor-progress-bar-widget ' . esc_attr($settings['borderless_elementor_progress_bar_alignment']) . '"><div class="borderless-elementor-progress-bar ' . esc_attr($settings['borderless_elementor_progress_bar_shape']) . '" title="' . esc_attr($settings['borderless_elementor_progress_bar_title']) . '" counter_value="' . esc_attr($settings['borderless_elementor_progress_bar_counter_value']['size']) . '" ' . $borderless_elementor_progress_bar_stroke_color_style . ' trail_color="' . esc_attr($settings['borderless_elementor_progress_bar_trail_color']) . '" counter_color="' . esc_attr($settings['borderless_elementor_progress_bar_counter_color']) . '" stroke_width="' . esc_attr($settings['borderless_elementor_progress_bar_stroke_width']['size']) . '" trail_width="' . esc_attr($settings['borderless_elementor_progress_bar_trail_width']['size']) . '" animation_duration="' . esc_attr($settings['borderless_elementor_progress_bar_animation_duration']['size']) . '"></div></div>';
418	}
419
420
421	protected function _content_template() {
422
423	}
424
425
426	}