king-addons / includes / widgets / Phone_Call_Button / Phone_Call_Button.php

Phone_Call_Button.php in King Addons for Elementor – 80+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce, Mega Menu, Popup Builder 51.1.65, at includes/widgets/Phone_Call_Button/Phone_Call_Button.php

644 lines 19.8 KB

Raw Download Zip

1	<?php
2	/**
3	* Phone Call Button Widget (Free).
4	*
5	* @package King_Addons
6	*/
7
8	namespace King_Addons;
9
10	use Elementor\Controls_Manager;
11	use Elementor\Group_Control_Border;
12	use Elementor\Group_Control_Box_Shadow;
13	use Elementor\Group_Control_Typography;
14	use Elementor\Icons_Manager;
15	use Elementor\Widget_Base;
16
17	if (!defined('ABSPATH')) {
18	exit;
19	}
20
21	/**
22	* Renders a phone call button.
23	*/
24	class Phone_Call_Button extends Widget_Base
25	{
26	/**
27	* Widget slug.
28	*
29	* @return string
30	*/
31	public function get_name(): string
32	{
33	return 'king-addons-phone-call-button';
34	}
35
36	/**
37	* Widget title.
38	*
39	* @return string
40	*/
41	public function get_title(): string
42	{
43	return esc_html__('Phone Call Button', 'king-addons');
44	}
45
46	/**
47	* Widget icon.
48	*
49	* @return string
50	*/
51	public function get_icon(): string
52	{
53	return 'king-addons-icon king-addons-phone-call-button';
54	}
55
56	/**
57	* Style dependencies.
58	*
59	* @return array<int, string>
60	*/
61	public function get_style_depends(): array
62	{
63	return [
64	KING_ADDONS_ASSETS_UNIQUE_KEY . '-phone-call-button-style',
65	];
66	}
67
68	/**
69	* Script dependencies.
70	*
71	* @return array<int, string>
72	*/
73	public function get_script_depends(): array
74	{
75	return [
76	KING_ADDONS_ASSETS_UNIQUE_KEY . '-phone-call-button-script',
77	];
78	}
79
80	/**
81	* Categories.
82	*
83	* @return array<int, string>
84	*/
85	public function get_categories(): array
86	{
87	return ['king-addons'];
88	}
89
90	/**
91	* Keywords.
92	*
93	* @return array<int, string>
94	*/
95	public function get_keywords(): array
96	{
97	return ['phone', 'call', 'button', 'contact'];
98	}
99
100	public function get_custom_help_url()
101	{
102	return 'mailto:bug@kingaddons.com?subject=Bug Report - King Addons&body=Please describe the issue';
103	}
104
105	/**
106	* Register controls.
107	*
108	* @return void
109	*/
110	public function register_controls(): void
111	{
112	$this->register_content_controls();
113	$this->register_layout_controls();
114	$this->register_style_controls();
115	$this->register_pro_notice_controls();
116	}
117
118	/**
119	* Render widget.
120	*
121	* @return void
122	*/
123	public function render(): void
124	{
125	$settings = $this->get_settings_for_display();
126	$phone = trim((string) ($settings['kng_phone'] ?? ''));
127	if ($phone === '') {
128	return;
129	}
130
131	$button_text = $settings['kng_button_text'] ?? '';
132	$alignment = $settings['kng_align'] ?? 'left';
133	$icon_position = (string) ($settings['kng_icon_position'] ?? 'left');
134	$icon = $settings['kng_icon'] ?? [
135	'value' => 'fas fa-phone',
136	'library' => 'fa-solid',
137	];
138
139	$effect = (string) ($settings['kng_attention_animation'] ?? $settings['kng_effect'] ?? 'none');
140	$can_use_pro = (bool) king_addons_freemius()->can_use_premium_code__premium_only();
141	$pro_effects = ['bounce', 'ring'];
142	if (in_array($effect, $pro_effects, true) && !$can_use_pro) {
143	$effect = 'none';
144	}
145
146	$wrapper_classes = ['king-addons-phone-call'];
147	$wrapper_classes[] = 'align-' . $alignment;
148	$button_classes = ['king-addons-phone-call__button'];
149	if ($icon_position === 'right') {
150	$button_classes[] = 'is-icon-right';
151	}
152	if ($effect !== 'none') {
153	$button_classes[] = 'is-anim-' . $effect;
154	}
155
156	?>
157	<div class="<?php echo esc_attr(implode(' ', $wrapper_classes)); ?>">
158	<a class="<?php echo esc_attr(implode(' ', $button_classes)); ?>" href="tel:<?php echo esc_attr($phone); ?>" data-device="all" data-animation="<?php echo esc_attr($effect); ?>" aria-label="<?php echo esc_attr($button_text ?: $phone); ?>">
159	<?php if (!empty($icon['value'])) : ?>
160	<span class="king-addons-phone-call__icon" aria-hidden="true">
161	<?php Icons_Manager::render_icon($icon, ['aria-hidden' => 'true']); ?>
162	</span>
163	<?php endif; ?>
164	<?php if (!empty($button_text)) : ?>
165	<span class="king-addons-phone-call__text"><?php echo esc_html($button_text); ?></span>
166	<?php else : ?>
167	<span class="king-addons-phone-call__text"><?php echo esc_html($phone); ?></span>
168	<?php endif; ?>
169	</a>
170	</div>
171	<?php
172	}
173
174	/**
175	* Content controls.
176	*
177	* @return void
178	*/
179	protected function register_content_controls(): void
180	{
181	$this->start_controls_section(
182	'kng_content_section',
183	[
184	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Content', 'king-addons'),
185	'tab' => Controls_Manager::TAB_CONTENT,
186	]
187	);
188
189	$this->add_control(
190	'kng_phone',
191	[
192	'label' => esc_html__('Phone Number', 'king-addons'),
193	'type' => Controls_Manager::TEXT,
194	'default' => '12345',
195	'placeholder' => esc_html__('+1 555 000 1234', 'king-addons'),
196	'description' => esc_html__('Will be used in tel: link. Keep digits and plus.', 'king-addons'),
197	]
198	);
199
200	$this->add_control(
201	'kng_button_text',
202	[
203	'label' => esc_html__('Button Text', 'king-addons'),
204	'type' => Controls_Manager::TEXT,
205	'default' => esc_html__('Call now', 'king-addons'),
206	]
207	);
208
209	$this->add_control(
210	'kng_icon',
211	[
212	'label' => esc_html__('Icon', 'king-addons'),
213	'type' => Controls_Manager::ICONS,
214	'default' => [
215	'value' => 'fas fa-phone',
216	'library' => 'fa-solid',
217	],
218	]
219	);
220
221	$this->end_controls_section();
222	}
223
224	/**
225	* Layout controls.
226	*
227	* @return void
228	*/
229	protected function register_layout_controls(): void
230	{
231	$this->start_controls_section(
232	'kng_layout_section',
233	[
234	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Layout', 'king-addons'),
235	'tab' => Controls_Manager::TAB_CONTENT,
236	]
237	);
238
239	// Clean up any legacy/duplicate controls added elsewhere (e.g., Pro attention animation).
240	$this->remove_control('kng_effect');
241	$this->remove_control('kng_attention_animation');
242
243	$this->add_responsive_control(
244	'kng_align',
245	[
246	'label' => esc_html__('Alignment', 'king-addons'),
247	'type' => Controls_Manager::CHOOSE,
248	'options' => [
249	'left' => [
250	'title' => esc_html__('Left', 'king-addons'),
251	'icon' => 'eicon-text-align-left',
252	],
253	'center' => [
254	'title' => esc_html__('Center', 'king-addons'),
255	'icon' => 'eicon-text-align-center',
256	],
257	'right' => [
258	'title' => esc_html__('Right', 'king-addons'),
259	'icon' => 'eicon-text-align-right',
260	],
261	],
262	'default' => 'left',
263	'selectors' => [
264	'{{WRAPPER}} .king-addons-phone-call' => 'justify-content: {{VALUE}};',
265	],
266	]
267	);
268
269	$this->add_control(
270	'kng_icon_position',
271	[
272	'label' => esc_html__('Icon Position', 'king-addons'),
273	'type' => Controls_Manager::SELECT,
274	'default' => 'left',
275	'options' => [
276	'left' => esc_html__('Left', 'king-addons'),
277	'right' => esc_html__('Right', 'king-addons'),
278	],
279	]
280	);
281
282	$this->add_control(
283	'kng_attention_animation',
284	[
285	'label' => esc_html__('Attention Animation', 'king-addons'),
286	'type' => Controls_Manager::SELECT,
287	'default' => 'pulse',
288	'options' => [
289	'none' => esc_html__('None', 'king-addons'),
290	'pulse' => esc_html__('Pulse (Free)', 'king-addons'),
291	'waves' => esc_html__('Waves (Free)', 'king-addons'),
292	'bounce' => esc_html__('Bounce (Pro)', 'king-addons'),
293	'ring' => esc_html__('Ring (Pro)', 'king-addons'),
294	],
295	]
296	);
297
298	$this->end_controls_section();
299	}
300
301	/**
302	* Style controls.
303	*
304	* @return void
305	*/
306	protected function register_style_controls(): void
307	{
308	$this->start_controls_section(
309	'kng_style_section',
310	[
311	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Button', 'king-addons'),
312	'tab' => Controls_Manager::TAB_STYLE,
313	]
314	);
315
316	$this->add_group_control(
317	Group_Control_Typography::get_type(),
318	[
319	'name' => 'kng_text_typography',
320	'selector' => '{{WRAPPER}} .king-addons-phone-call__text',
321	]
322	);
323
324	$this->start_controls_tabs('kng_button_tabs');
325
326	$this->start_controls_tab(
327	'kng_button_tab_normal',
328	[
329	'label' => esc_html__('Normal', 'king-addons'),
330	]
331	);
332
333	$this->add_control(
334	'kng_text_color',
335	[
336	'label' => esc_html__('Text Color', 'king-addons'),
337	'type' => Controls_Manager::COLOR,
338	'selectors' => [
339	'{{WRAPPER}} .king-addons-phone-call__button' => 'color: {{VALUE}};',
340	],
341	]
342	);
343
344	$this->add_control(
345	'kng_hover_scale',
346	[
347	'label' => esc_html__('Hover Scale', 'king-addons'),
348	'type' => Controls_Manager::SLIDER,
349	'size_units' => ['custom'],
350	'range' => [
351	'custom' => ['min' => 1, 'max' => 1.5, 'step' => 0.01],
352	],
353	'default' => [
354	'size' => 1.05,
355	],
356	'selectors' => [
357	'{{WRAPPER}} .king-addons-phone-call__button' => '--kng-phone-hover-scale: {{SIZE}};',
358	],
359	]
360	);
361
362	$this->add_control(
363	'kng_bg_color',
364	[
365	'label' => esc_html__('Background', 'king-addons'),
366	'type' => Controls_Manager::COLOR,
367	'selectors' => [
368	'{{WRAPPER}} .king-addons-phone-call__button' => 'background-color: {{VALUE}};',
369	],
370	]
371	);
372
373	$this->add_group_control(
374	Group_Control_Border::get_type(),
375	[
376	'name' => 'kng_border',
377	'selector' => '{{WRAPPER}} .king-addons-phone-call__button',
378	]
379	);
380
381	$this->add_group_control(
382	Group_Control_Box_Shadow::get_type(),
383	[
384	'name' => 'kng_shadow',
385	'selector' => '{{WRAPPER}} .king-addons-phone-call__button',
386	'condition' => [
387	'kng_disable_shadow!' => 'yes',
388	],
389	]
390	);
391
392	$this->end_controls_tab();
393
394	$this->start_controls_tab(
395	'kng_button_tab_hover',
396	[
397	'label' => esc_html__('Hover', 'king-addons'),
398	]
399	);
400
401	$this->add_control(
402	'kng_text_color_hover',
403	[
404	'label' => esc_html__('Text Color', 'king-addons'),
405	'type' => Controls_Manager::COLOR,
406	'selectors' => [
407	'{{WRAPPER}} .king-addons-phone-call__button:hover' => 'color: {{VALUE}};',
408	],
409	]
410	);
411
412	$this->add_control(
413	'kng_bg_color_hover',
414	[
415	'label' => esc_html__('Background', 'king-addons'),
416	'type' => Controls_Manager::COLOR,
417	'selectors' => [
418	'{{WRAPPER}} .king-addons-phone-call__button:hover' => 'background-color: {{VALUE}};',
419	],
420	]
421	);
422
423	$this->add_control(
424	'kng_border_color_hover',
425	[
426	'label' => esc_html__('Border Color', 'king-addons'),
427	'type' => Controls_Manager::COLOR,
428	'selectors' => [
429	'{{WRAPPER}} .king-addons-phone-call__button:hover' => 'border-color: {{VALUE}};',
430	],
431	]
432	);
433
434	$this->add_group_control(
435	Group_Control_Border::get_type(),
436	[
437	'name' => 'kng_border_hover',
438	'selector' => '{{WRAPPER}} .king-addons-phone-call__button:hover',
439	]
440	);
441
442	$this->add_group_control(
443	Group_Control_Box_Shadow::get_type(),
444	[
445	'name' => 'kng_shadow_hover',
446	'selector' => '{{WRAPPER}} .king-addons-phone-call__button:hover',
447	'condition' => [
448	'kng_disable_shadow!' => 'yes',
449	],
450	]
451	);
452
453	$this->end_controls_tab();
454	$this->end_controls_tabs();
455
456	$this->add_control(
457	'kng_radius',
458	[
459	'label' => esc_html__('Border Radius', 'king-addons'),
460	'type' => Controls_Manager::SLIDER,
461	'size_units' => ['px', '%'],
462	'range' => [
463	'px' => ['min' => 0, 'max' => 40],
464	'%' => ['min' => 0, 'max' => 100],
465	],
466	'selectors' => [
467	'{{WRAPPER}} .king-addons-phone-call__button' => 'border-radius: {{SIZE}}{{UNIT}};',
468	],
469	]
470	);
471
472	$this->add_control(
473	'kng_disable_shadow',
474	[
475	'label' => esc_html__('Disable Box Shadow', 'king-addons'),
476	'type' => Controls_Manager::SWITCHER,
477	'label_on' => esc_html__('Yes', 'king-addons'),
478	'label_off' => esc_html__('No', 'king-addons'),
479	'return_value' => 'yes',
480	'default' => '',
481	'selectors' => [
482	'{{WRAPPER}} .king-addons-phone-call__button' => 'box-shadow: none;',
483	'{{WRAPPER}} .king-addons-phone-call__button:hover' => 'box-shadow: none;',
484	],
485	]
486	);
487
488	$this->add_control(
489	'kng_effect_heading',
490	[
491	'label' => esc_html__('Effect Styling', 'king-addons'),
492	'type' => Controls_Manager::HEADING,
493	'separator' => 'before',
494	]
495	);
496
497	$this->add_control(
498	'kng_effect_color',
499	[
500	'label' => esc_html__('Effect Color', 'king-addons'),
501	'type' => Controls_Manager::COLOR,
502	'default' => '#5B03FF',
503	'selectors' => [
504	'{{WRAPPER}} .king-addons-phone-call__button' => '--kng-phone-effect-color: {{VALUE}};',
505	],
506	]
507	);
508
509	$this->add_control(
510	'kng_effect_color_hover',
511	[
512	'label' => esc_html__('Hover Effect Color', 'king-addons'),
513	'type' => Controls_Manager::COLOR,
514	'default' => '#7A2CFF',
515	'selectors' => [
516	'{{WRAPPER}} .king-addons-phone-call__button:hover' => '--kng-phone-effect-color-hover: {{VALUE}};',
517	],
518	]
519	);
520
521	$this->add_control(
522	'kng_effect_thickness',
523	[
524	'label' => esc_html__('Effect Thickness', 'king-addons'),
525	'type' => Controls_Manager::SLIDER,
526	'size_units' => ['px'],
527	'range' => [
528	'px' => ['min' => 0, 'max' => 8],
529	],
530	'default' => [
531	'size' => 2,
532	'unit' => 'px',
533	],
534	'selectors' => [
535	'{{WRAPPER}} .king-addons-phone-call__button' => '--kng-phone-effect-thickness: {{SIZE}}{{UNIT}};',
536	],
537	]
538	);
539
540	$this->add_control(
541	'kng_effect_spread',
542	[
543	'label' => esc_html__('Effect Spread', 'king-addons'),
544	'type' => Controls_Manager::SLIDER,
545	'size_units' => ['px'],
546	'range' => [
547	'px' => ['min' => 0, 'max' => 30],
548	],
549	'default' => [
550	'size' => 10,
551	'unit' => 'px',
552	],
553	'selectors' => [
554	'{{WRAPPER}} .king-addons-phone-call__button' => '--kng-phone-effect-inset: calc(-1 * {{SIZE}}{{UNIT}});',
555	],
556	]
557	);
558
559	$this->add_control(
560	'kng_effect_duration',
561	[
562	'label' => esc_html__('Effect Duration (s)', 'king-addons'),
563	'type' => Controls_Manager::SLIDER,
564	'size_units' => ['s'],
565	'range' => [
566	's' => ['min' => 0.5, 'max' => 3, 'step' => 0.1],
567	],
568	'default' => [
569	'size' => 1.6,
570	'unit' => 's',
571	],
572	'selectors' => [
573	'{{WRAPPER}} .king-addons-phone-call__button' => '--kng-phone-effect-duration: {{SIZE}}{{UNIT}};',
574	],
575	]
576	);
577
578	$this->add_control(
579	'kng_effect_opacity',
580	[
581	'label' => esc_html__('Effect Opacity', 'king-addons'),
582	'type' => Controls_Manager::SLIDER,
583	'size_units' => ['custom'],
584	'range' => [
585	'custom' => ['min' => 0, 'max' => 1, 'step' => 0.05],
586	],
587	'default' => [
588	'size' => 0.35,
589	],
590	'selectors' => [
591	'{{WRAPPER}} .king-addons-phone-call__button' => '--kng-phone-effect-opacity: {{SIZE}};',
592	],
593	]
594	);
595
596	$this->add_group_control(
597	Group_Control_Box_Shadow::get_type(),
598	[
599	'name' => 'kng_shadow_footer_placeholder', // kept to avoid breaking existing references; hidden by tabs usage.
600	'selector' => '{{WRAPPER}} .king-addons-phone-call__button',
601	'condition' => ['_never_render_' => 'true'],
602	]
603	);
604
605	$this->add_responsive_control(
606	'kng_padding',
607	[
608	'label' => esc_html__('Padding', 'king-addons'),
609	'type' => Controls_Manager::DIMENSIONS,
610	'size_units' => ['px', 'em'],
611	'selectors' => [
612	'{{WRAPPER}} .king-addons-phone-call__button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
613	],
614	]
615	);
616
617	$this->end_controls_section();
618	}
619
620	/**
621	* Render pro notice.
622	*
623	* @return void
624	*/
625	public function register_pro_notice_controls(): void
626	{
627	if (!king_addons_freemius()->can_use_premium_code__premium_only()) {
628	Core::renderProFeaturesSection($this, '', Controls_Manager::RAW_HTML, 'phone-call-button', [
629	'Floating button (left/right, mobile-only)',
630	'More attention animations: Bounce, Ring',
631	'Device targeting and schedule',
632	'Custom SVG icon and tooltip',
633	]);
634	}
635	}
636	}
637
638
639
640
641
642
643
644