premium-button.php — Premium Addons for Elementor – Powerful Elementor Templates & Widgets 4.1.0

premium-addons-for-elementor / widgets / premium-button.php

premium-addons-for-elementor / widgets Last commit date

premium-button.php

1256 lines

1	<?php
2
3	/**
4	* Premium Button.
5	*/
6	namespace PremiumAddons\Widgets;
7
8	// Elementor Classes.
9	use Elementor\Icons_Manager;
10	use Elementor\Widget_Base;
11	use Elementor\Controls_Manager;
12	use Elementor\Scheme_Color;
13	use Elementor\Scheme_Typography;
14	use Elementor\Group_Control_Border;
15	use Elementor\Group_Control_Typography;
16	use Elementor\Group_Control_Text_Shadow;
17	use Elementor\Group_Control_Box_Shadow;
18
19	// PremiumAddons Classes.
20	use PremiumAddons\Includes\Helper_Functions;
21	use PremiumAddons\Includes\Premium_Template_Tags;
22
23	if ( ! defined( 'ABSPATH' ) ) exit; // If this file is called directly, abort.
24
25	/**
26	* Class Premium_Button
27	*/
28	class Premium_Button extends Widget_Base {
29
30	public function get_name() {
31	return 'premium-addon-button';
32	}
33
34	public function check_rtl() {
35	return is_rtl();
36	}
37
38	public function getTemplateInstance() {
39	return $this->templateInstance = Premium_Template_Tags::getInstance();
40	}
41
42	public function get_style_depends() {
43	return [
44	'premium-addons'
45	];
46	}
47
48	public function get_script_depends() {
49	return [
50	'lottie-js'
51	];
52	}
53
54	public function get_title() {
55	return sprintf( '%1$s %2$s', Helper_Functions::get_prefix(), __('Button', 'premium-addons-for-elementor') );
56	}
57
58	public function get_icon() {
59	return 'pa-button';
60	}
61
62	public function get_categories() {
63	return [ 'premium-elements' ];
64	}
65
66	public function get_custom_help_url() {
67	return 'https://premiumaddons.com/support/';
68	}
69
70	/**
71	* Register Button controls.
72	*
73	* @since 1.0.0
74	* @access protected
75	*/
76	protected function _register_controls() {
77
78	$this->start_controls_section('premium_button_general_section',
79	[
80	'label' => __('Button', 'premium-addons-for-elementor'),
81	]
82	);
83
84	$this->add_control('premium_button_text',
85	[
86	'label' => __('Text', 'premium-addons-for-elementor'),
87	'type' => Controls_Manager::TEXT,
88	'dynamic' => [ 'active' => true ],
89	'default' => __('Click Me','premium-addons-for-elementor'),
90	'label_block' => true,
91	]
92	);
93
94	$this->add_control('premium_button_link_selection',
95	[
96	'label' => __('Link Type', 'premium-addons-for-elementor'),
97	'type' => Controls_Manager::SELECT,
98	'options' => [
99	'url' => __('URL', 'premium-addons-for-elementor'),
100	'link' => __('Existing Page', 'premium-addons-for-elementor'),
101	],
102	'default' => 'url',
103	'label_block' => true,
104	]
105	);
106
107	$this->add_control('premium_button_link',
108	[
109	'label' => __('Link', 'premium-addons-for-elementor'),
110	'type' => Controls_Manager::URL,
111	'dynamic' => [ 'active' => true ],
112	'default' => [
113	'url' => '#',
114	],
115	'placeholder' => 'https://premiumaddons.com/',
116	'label_block' => true,
117	'separator' => 'after',
118	'condition' => [
119	'premium_button_link_selection' => 'url'
120	]
121	]
122	);
123
124	$this->add_control('premium_button_existing_link',
125	[
126	'label' => __('Existing Page', 'premium-addons-for-elementor'),
127	'type' => Controls_Manager::SELECT2,
128	'options' => $this->getTemplateInstance()->get_all_posts(),
129	'condition' => [
130	'premium_button_link_selection' => 'link',
131	],
132	'multiple' => false,
133	'separator' => 'after',
134	'label_block' => true,
135	]
136	);
137
138	$this->add_control('premium_button_hover_effect',
139	[
140	'label' => __('Hover Effect', 'premium-addons-for-elementor'),
141	'type' => Controls_Manager::SELECT,
142	'default' => 'none',
143	'options' => [
144	'none' => __('None', 'premium-addons-for-elementor'),
145	'style1' => __('Slide', 'premium-addons-for-elementor'),
146	'style2' => __('Shutter', 'premium-addons-for-elementor'),
147	'style3' => __('Icon Fade', 'premium-addons-for-elementor'),
148	'style4' => __('Icon Slide', 'premium-addons-for-elementor'),
149	'style5' => __('In & Out', 'premium-addons-for-elementor'),
150	],
151	'label_block' => true,
152	]
153	);
154
155	$this->add_control('premium_button_style1_dir',
156	[
157	'label' => __('Slide Direction', 'premium-addons-for-elementor'),
158	'type' => Controls_Manager::SELECT,
159	'default' => 'bottom',
160	'options' => [
161	'bottom' => __('Top to Bottom', 'premium-addons-for-elementor'),
162	'top' => __('Bottom to Top', 'premium-addons-for-elementor'),
163	'left' => __('Right to Left', 'premium-addons-for-elementor'),
164	'right' => __('Left to Right', 'premium-addons-for-elementor'),
165	],
166	'condition' => [
167	'premium_button_hover_effect' => 'style1',
168	],
169	'label_block' => true,
170	]
171	);
172
173	$this->add_control('premium_button_style2_dir',
174	[
175	'label' => __('Shutter Direction', 'premium-addons-for-elementor'),
176	'type' => Controls_Manager::SELECT,
177	'default' => 'shutouthor',
178	'options' => [
179	'shutinhor' => __('Shutter in Horizontal', 'premium-addons-for-elementor'),
180	'shutinver' => __('Shutter in Vertical', 'premium-addons-for-elementor'),
181	'shutoutver' => __('Shutter out Horizontal', 'premium-addons-for-elementor'),
182	'shutouthor' => __('Shutter out Vertical', 'premium-addons-for-elementor'),
183	'scshutoutver' => __('Scaled Shutter Vertical', 'premium-addons-for-elementor'),
184	'scshutouthor' => __('Scaled Shutter Horizontal', 'premium-addons-for-elementor'),
185	'dshutinver' => __('Tilted Left'),
186	'dshutinhor' => __('Tilted Right'),
187	],
188	'condition' => [
189	'premium_button_hover_effect' => 'style2',
190	],
191	'label_block' => true,
192	]
193	);
194
195	$this->add_control('premium_button_style4_dir',
196	[
197	'label' => __('Slide Direction', 'premium-addons-for-elementor'),
198	'type' => Controls_Manager::SELECT,
199	'default' => 'bottom',
200	'options' => [
201	'top' => __('Bottom to Top','premium-addons-for-elementor'),
202	'bottom' => __('Top to Bottom','premium-addons-for-elementor'),
203	'left' => __('Left to Right','premium-addons-for-elementor'),
204	'right' => __('Right to Left','premium-addons-for-elementor'),
205	],
206	'label_block' => true,
207	'condition' => [
208	'premium_button_hover_effect' => 'style4',
209	],
210	]
211	);
212
213	$this->add_control('premium_button_style5_dir',
214	[
215	'label' => __('Style', 'premium-addons-for-elementor'),
216	'type' => Controls_Manager::SELECT,
217	'default' => 'radialin',
218	'options' => [
219	'radialin' => __('Radial In', 'premium-addons-for-elementor'),
220	'radialout' => __('Radial Out', 'premium-addons-for-elementor'),
221	'rectin' => __('Rectangle In', 'premium-addons-for-elementor'),
222	'rectout' => __('Rectangle Out', 'premium-addons-for-elementor'),
223	],
224	'condition' => [
225	'premium_button_hover_effect' => 'style5',
226	],
227	'label_block' => true,
228	]
229	);
230
231	$this->add_control('premium_button_icon_switcher',
232	[
233	'label' => __('Icon', 'premium-addons-for-elementor'),
234	'type' => Controls_Manager::SWITCHER,
235	'description' => __('Enable or disable button icon','premium-addons-for-elementor'),
236	'condition' => [
237	'premium_button_hover_effect!' => 'style4'
238	],
239	]
240	);
241
242	$this->add_control('icon_type',
243	[
244	'label' => __('Icon Type', 'premium-addons-for-elementor'),
245	'type' => Controls_Manager::SELECT,
246	'options' => [
247	'icon' => __('Icon', 'premium-addons-for-elementor'),
248	'animation' => __('Lottie Animation', 'premium-addons-for-elementor'),
249	],
250	'default' => 'icon',
251	'label_block' => true,
252	'condition' => [
253	'premium_button_hover_effect!' => 'style4',
254	'premium_button_icon_switcher' => 'yes',
255	],
256	]
257	);
258
259	$this->add_control('premium_button_icon_selection_updated',
260	[
261	'label' => __('Icon', 'premium-addons-for-elementor'),
262	'type' => Controls_Manager::ICONS,
263	'fa4compatibility' => 'premium_button_icon_selection',
264	'default' => [
265	'value' => 'fas fa-bars',
266	'library' => 'fa-solid',
267	],
268	'condition' => [
269	'premium_button_icon_switcher' => 'yes',
270	'premium_button_hover_effect!' => 'style4',
271	'icon_type' => 'icon'
272	],
273	'label_block' => true,
274	]
275	);
276
277	$this->add_control('lottie_url',
278	[
279	'label' => __( 'Animation JSON URL', 'premium-addons-for-elementor' ),
280	'type' => Controls_Manager::TEXT,
281	'dynamic' => [ 'active' => true ],
282	'description' => 'Get JSON code URL from <a href="https://lottiefiles.com/" target="_blank">here</a>',
283	'label_block' => true,
284	'condition' => [
285	'premium_button_icon_switcher' => 'yes',
286	'premium_button_hover_effect!' => 'style4',
287	'icon_type' => 'animation'
288	],
289	]
290	);
291
292	$this->add_control('lottie_loop',
293	[
294	'label' => __('Loop','premium-addons-for-elementor'),
295	'type' => Controls_Manager::SWITCHER,
296	'return_value' => 'true',
297	'default' => 'true',
298	'condition' => [
299	'premium_button_icon_switcher' => 'yes',
300	'premium_button_hover_effect!' => 'style4',
301	'icon_type' => 'animation'
302	],
303	]
304	);
305
306	$this->add_control('lottie_reverse',
307	[
308	'label' => __('Reverse','premium-addons-for-elementor'),
309	'type' => Controls_Manager::SWITCHER,
310	'return_value' => 'true',
311	'condition' => [
312	'premium_button_icon_switcher' => 'yes',
313	'premium_button_hover_effect!' => 'style4',
314	'icon_type' => 'animation'
315	],
316	]
317	);
318
319	$this->add_control('slide_icon_type',
320	[
321	'label' => __('Icon Type', 'premium-addons-for-elementor'),
322	'type' => Controls_Manager::SELECT,
323	'options' => [
324	'icon' => __('Icon', 'premium-addons-for-elementor'),
325	'animation' => __('Lottie Animation', 'premium-addons-for-elementor'),
326	],
327	'default' => 'icon',
328	'label_block' => true,
329	'condition' => [
330	'premium_button_hover_effect' => 'style4'
331	],
332	]
333	);
334
335	$this->add_control('premium_button_style4_icon_selection_updated',
336	[
337	'label' => __('Icon', 'premium-addons-for-elementor'),
338	'type' => Controls_Manager::ICONS,
339	'fa4compatibility' => 'premium_button_style4_icon_selection',
340	'default' => [
341	'value' => 'fas fa-bars',
342	'library' => 'fa-solid',
343	],
344	'condition' => [
345	'slide_icon_type' => 'icon',
346	'premium_button_hover_effect' => 'style4'
347	],
348	'label_block' => true,
349	]
350	);
351
352	$this->add_control('slide_lottie_url',
353	[
354	'label' => __( 'Animation JSON URL', 'premium-addons-for-elementor' ),
355	'type' => Controls_Manager::TEXT,
356	'dynamic' => [ 'active' => true ],
357	'description' => 'Get JSON code URL from <a href="https://lottiefiles.com/" target="_blank">here</a>',
358	'label_block' => true,
359	'condition' => [
360	'slide_icon_type' => 'animation',
361	'premium_button_hover_effect' => 'style4'
362	],
363	]
364	);
365
366	$this->add_control('slide_lottie_loop',
367	[
368	'label' => __('Loop','premium-addons-for-elementor'),
369	'type' => Controls_Manager::SWITCHER,
370	'return_value' => 'true',
371	'default' => 'true',
372	'condition' => [
373	'slide_icon_type' => 'animation',
374	'premium_button_hover_effect' => 'style4'
375	]
376	]
377	);
378
379	$this->add_control('slide_lottie_reverse',
380	[
381	'label' => __('Reverse','premium-addons-for-elementor'),
382	'type' => Controls_Manager::SWITCHER,
383	'return_value' => 'true',
384	'condition' => [
385	'slide_icon_type' => 'animation',
386	'premium_button_hover_effect' => 'style4'
387	]
388	]
389	);
390
391	$this->add_control('premium_button_icon_position',
392	[
393	'label' => __('Icon Position', 'premium-addons-for-elementor'),
394	'type' => Controls_Manager::SELECT,
395	'default' => 'before',
396	'options' => [
397	'before' => __('Before', 'premium-addons-for-elementor'),
398	'after' => __('After', 'premium-addons-for-elementor'),
399	],
400	'label_block' => true,
401	'condition' => [
402	'premium_button_icon_switcher' => 'yes',
403	'premium_button_hover_effect!' => 'style4',
404	],
405	]
406	);
407
408	$this->add_responsive_control('premium_button_icon_before_size',
409	[
410	'label' => __('Icon Size', 'premium-addons-for-elementor'),
411	'type' => Controls_Manager::SLIDER,
412	'condition' => [
413	'premium_button_icon_switcher' => 'yes',
414	'premium_button_hover_effect!' => 'style4'
415	],
416	'selectors' => [
417	'{{WRAPPER}} .premium-button-text-icon-wrapper i' => 'font-size: {{SIZE}}px',
418	'{{WRAPPER}} .premium-button-text-icon-wrapper svg' => 'width: {{SIZE}}px; height: {{SIZE}}px',
419	]
420	]
421	);
422
423	$this->add_responsive_control('premium_button_icon_style4_size',
424	[
425	'label' => __('Icon Size', 'premium-addons-for-elementor'),
426	'type' => Controls_Manager::SLIDER,
427	'condition' => [
428	'premium_button_hover_effect' => 'style4'
429	],
430	'selectors' => [
431	'{{WRAPPER}} .premium-button-style4-icon-wrapper i' => 'font-size: {{SIZE}}px',
432	'{{WRAPPER}} .premium-button-style4-icon-wrapper svg' => 'width: {{SIZE}}px; height: {{SIZE}}px'
433	]
434	]
435	);
436
437	if( ! $this->check_rtl() ) {
438	$this->add_responsive_control('premium_button_icon_before_spacing',
439	[
440	'label' => __('Icon Spacing', 'premium-addons-for-elementor'),
441	'type' => Controls_Manager::SLIDER,
442	'condition' => [
443	'premium_button_icon_switcher' => 'yes',
444	'premium_button_icon_position' => 'before',
445	'premium_button_hover_effect!' => ['style3', 'style4']
446	],
447	'default' => [
448	'size' => 15
449	],
450	'selectors' => [
451	'{{WRAPPER}} .premium-button-text-icon-wrapper i, {{WRAPPER}} .premium-button-text-icon-wrapper svg' => 'margin-right: {{SIZE}}px',
452	],
453	'separator' => 'after',
454	]
455	);
456
457	$this->add_responsive_control('premium_button_icon_after_spacing',
458	[
459	'label' => __('Icon Spacing', 'premium-addons-for-elementor'),
460	'type' => Controls_Manager::SLIDER,
461	'condition' => [
462	'premium_button_icon_switcher' => 'yes',
463	'premium_button_icon_position' => 'after',
464	'premium_button_hover_effect!' => ['style3', 'style4']
465	],
466	'default' => [
467	'size' => 15
468	],
469	'selectors' => [
470	'{{WRAPPER}} .premium-button-text-icon-wrapper i, {{WRAPPER}} .premium-button-text-icon-wrapper svg' => 'margin-left: {{SIZE}}px',
471	],
472	'separator' => 'after',
473	]
474	);
475	}
476
477	if( $this->check_rtl() ) {
478	$this->add_responsive_control('premium_button_icon_rtl_before_spacing',
479	[
480	'label' => __('Icon Spacing', 'premium-addons-for-elementor'),
481	'type' => Controls_Manager::SLIDER,
482	'condition' => [
483	'premium_button_icon_switcher' => 'yes',
484	'premium_button_icon_position' => 'before',
485	'premium_button_hover_effect!' => ['style3', 'style4']
486	],
487	'default' => [
488	'size' => 15
489	],
490	'selectors' => [
491	'{{WRAPPER}} .premium-button-text-icon-wrapper i, {{WRAPPER}} .premium-button-text-icon-wrapper svg' => 'margin-left: {{SIZE}}px',
492	],
493	'separator' => 'after',
494	]
495	);
496
497	$this->add_responsive_control('premium_button_icon_rtl_after_spacing',
498	[
499	'label' => __('Icon Spacing', 'premium-addons-for-elementor'),
500	'type' => Controls_Manager::SLIDER,
501	'condition' => [
502	'premium_button_icon_switcher' => 'yes',
503	'premium_button_icon_position' => 'after',
504	'premium_button_hover_effect!' => ['style3', 'style4']
505	],
506	'default' => [
507	'size' => 15
508	],
509	'selectors' => [
510	'{{WRAPPER}} .premium-button-text-icon-wrapper i, {{WRAPPER}} .premium-button-text-icon-wrapper svg' => 'margin-right: {{SIZE}}px',
511	],
512	'separator' => 'after',
513	]
514	);
515	}
516
517	$this->add_responsive_control('premium_button_icon_style3_before_transition',
518	[
519	'label' => __('Icon Spacing', 'premium-addons-for-elementor'),
520	'type' => Controls_Manager::SLIDER,
521	'condition' => [
522	'premium_button_icon_switcher' => 'yes',
523	'premium_button_icon_position' => 'before',
524	'premium_button_hover_effect' => 'style3'
525	],
526	'range' => [
527	'px' => [
528	'min' => -50,
529	'max' => 50,
530	]
531	],
532	'selectors' => [
533	'{{WRAPPER}} .premium-button-style3-before:hover i, {{WRAPPER}} .premium-button-style3-before:hover svg' => '-webkit-transform: translateX({{SIZE}}{{UNIT}}); transform: translateX({{SIZE}}{{UNIT}})',
534	],
535	]
536	);
537
538	$this->add_responsive_control('premium_button_icon_style3_after_transition',
539	[
540	'label' => __('Icon Spacing', 'premium-addons-for-elementor'),
541	'type' => Controls_Manager::SLIDER,
542	'condition' => [
543	'premium_button_icon_switcher' => 'yes',
544	'premium_button_icon_position!'=> 'before',
545	'premium_button_hover_effect' => 'style3'
546	],
547	'range' => [
548	'px' => [
549	'min' => -50,
550	'max' => 50,
551	]
552	],
553	'selectors' => [
554	'{{WRAPPER}} .premium-button-style3-after:hover i, {{WRAPPER}} .premium-button-style3-after:hover svg' => '-webkit-transform: translateX({{SIZE}}{{UNIT}}); transform: translateX({{SIZE}}{{UNIT}})',
555	],
556	]
557	);
558
559	$this->add_control('premium_button_size',
560	[
561	'label' => __('Size', 'premium-addons-for-elementor'),
562	'type' => Controls_Manager::SELECT,
563	'default' => 'lg',
564	'options' => [
565	'sm' => __('Small', 'premium-addons-for-elementor'),
566	'md' => __('Medium', 'premium-addons-for-elementor'),
567	'lg' => __('Large', 'premium-addons-for-elementor'),
568	'block' => __('Block', 'premium-addons-for-elementor'),
569	],
570	'label_block' => true,
571	'separator' => 'before',
572	]
573	);
574
575	$this->add_responsive_control('premium_button_align',
576	[
577	'label' => __( 'Alignment', 'premium-addons-for-elementor' ),
578	'type' => Controls_Manager::CHOOSE,
579	'options' => [
580	'left' => [
581	'title' => __( 'Left', 'premium-addons-for-elementor' ),
582	'icon' => 'fa fa-align-left',
583	],
584	'center' => [
585	'title' => __( 'Center', 'premium-addons-for-elementor' ),
586	'icon' => 'fa fa-align-center',
587	],
588	'right' => [
589	'title' => __( 'Right', 'premium-addons-for-elementor' ),
590	'icon' => 'fa fa-align-right',
591	],
592	],
593	'selectors' => [
594	'{{WRAPPER}} .premium-button-container' => 'text-align: {{VALUE}}',
595	],
596	'default' => 'center',
597	]
598	);
599
600	$this->add_control('premium_button_event_switcher',
601	[
602	'label' => __('onclick Event', 'premium-addons-for-elementor'),
603	'type' => Controls_Manager::SWITCHER,
604	'separator' => 'before',
605	]
606	);
607
608	$this->add_control('premium_button_event_function',
609	[
610	'label' => __('Example: myFunction();', 'premium-addons-for-elementor'),
611	'type' => Controls_Manager::CODE,
612	'dynamic' => [ 'active' => true ],
613	'condition' => [
614	'premium_button_event_switcher' => 'yes',
615	],
616	]
617	);
618
619	$this->end_controls_section();
620
621	$this->start_controls_section('section_pa_docs',
622	[
623	'label' => __('Helpful Documentations', 'premium-addons-for-elementor'),
624	]
625	);
626
627	$docs = [
628	'https://premiumaddons.com/docs/button-widget-tutorial' => 'Getting started »',
629	'https://premiumaddons.com/docs/how-can-i-open-an-elementor-popup-using-premium-button' => 'How to open an Elementor popup using button widget »',
630	'https://premiumaddons.com/docs/how-to-play-pause-a-soundtrack-using-premium-button-widget' => 'How to play/pause a soundtrack using button widget »',
631	'https://premiumaddons.com/docs/how-to-use-elementor-widgets-to-navigate-through-carousel-widget-slides/' => 'How To Use Premium Button To Navigate Through Carousel Widget Slides »'
632	];
633
634	$doc_index = 1;
635	foreach( $docs as $url => $title ) {
636
637	$doc_url = Helper_Functions::get_campaign_link( $url, 'editor-page', 'wp-editor', 'get-support' );
638
639	$this->add_control('doc_' . $doc_index,
640	[
641	'type' => Controls_Manager::RAW_HTML,
642	'raw' => sprintf( '<a href="%s" target="_blank">%s</a>', $doc_url , __( $title, 'premium-addons-for-elementor' ) ),
643	'content_classes' => 'editor-pa-doc',
644	]
645	);
646
647	$doc_index++;
648
649	}
650
651	$this->end_controls_section();
652
653	$this->start_controls_section('premium_button_style_section',
654	[
655	'label' => __('Button', 'premium-addons-for-elementor'),
656	'tab' => Controls_Manager::TAB_STYLE,
657	]
658	);
659
660	$this->add_group_control(
661	Group_Control_Typography::get_type(),
662	[
663	'name' => 'premium_button_typo',
664	'scheme' => Scheme_Typography::TYPOGRAPHY_1,
665	'selector' => '{{WRAPPER}} .premium-button',
666	]
667	);
668
669	$this->start_controls_tabs('premium_button_style_tabs');
670
671	$this->start_controls_tab('premium_button_style_normal',
672	[
673	'label' => __('Normal', 'premium-addons-for-elementor'),
674	]
675	);
676
677	$this->add_control('premium_button_text_color_normal',
678	[
679	'label' => __('Text Color', 'premium-addons-for-elementor'),
680	'type' => Controls_Manager::COLOR,
681	'scheme' => [
682	'type' => Scheme_Color::get_type(),
683	'value' => Scheme_Color::COLOR_2,
684	],
685	'selectors' => [
686	'{{WRAPPER}} .premium-button .premium-button-text-icon-wrapper span' => 'color: {{VALUE}};',
687	]
688	]);
689
690	$this->add_control('premium_button_icon_color_normal',
691	[
692	'label' => __('Icon Color', 'premium-addons-for-elementor'),
693	'type' => Controls_Manager::COLOR,
694	'scheme' => [
695	'type' => Scheme_Color::get_type(),
696	'value' => Scheme_Color::COLOR_2,
697	],
698	'selectors' => [
699	'{{WRAPPER}} .premium-button-text-icon-wrapper i' => 'color: {{VALUE}};',
700	],
701	'condition' => [
702	'premium_button_icon_switcher' => 'yes',
703	'icon_type' => 'icon',
704	'premium_button_hover_effect!' => ['style3','style4']
705	]
706	]
707	);
708
709	$this->add_control('premium_button_background_normal',
710	[
711	'label' => __('Background Color', 'premium-addons-for-elementor'),
712	'type' => Controls_Manager::COLOR,
713	'scheme' => [
714	'type' => Scheme_Color::get_type(),
715	'value' => Scheme_Color::COLOR_1,
716	],
717	'selectors' => [
718	'{{WRAPPER}} .premium-button, {{WRAPPER}} .premium-button.premium-button-style2-shutinhor:before , {{WRAPPER}} .premium-button.premium-button-style2-shutinver:before , {{WRAPPER}} .premium-button-style5-radialin:before , {{WRAPPER}} .premium-button-style5-rectin:before' => 'background-color: {{VALUE}};',
719	]
720	]
721	);
722
723	$this->add_group_control(
724	Group_Control_Border::get_type(),
725	[
726	'name' => 'premium_button_border_normal',
727	'selector' => '{{WRAPPER}} .premium-button',
728	]
729	);
730
731	$this->add_control('premium_button_border_radius_normal',
732	[
733	'label' => __('Border Radius', 'premium-addons-for-elementor'),
734	'type' => Controls_Manager::SLIDER,
735	'size_units' => ['px', '%' ,'em'],
736	'selectors' => [
737	'{{WRAPPER}} .premium-button' => 'border-radius: {{SIZE}}{{UNIT}};'
738	]
739	]
740	);
741
742	$this->add_group_control(
743	Group_Control_Text_Shadow::get_type(),
744	[
745	'label' => __('Icon Shadow','premium-addons-for-elementor'),
746	'name' => 'premium_button_icon_shadow_normal',
747	'selector' => '{{WRAPPER}} .premium-button-text-icon-wrapper i',
748	'condition' => [
749	'premium_button_icon_switcher' => 'yes',
750	'icon_type' => 'icon',
751	'premium_button_hover_effect!' => ['style3', 'style4']
752	]
753	]
754	);
755
756	$this->add_group_control(
757	Group_Control_Text_Shadow::get_type(),
758	[
759	'label' => __('Text Shadow','premium-addons-for-elementor'),
760	'name' => 'premium_button_text_shadow_normal',
761	'selector' => '{{WRAPPER}} .premium-button-text-icon-wrapper span',
762	]
763	);
764
765	$this->add_group_control(
766	Group_Control_Box_Shadow::get_type(),
767	[
768	'label' => __('Button Shadow','premium-addons-for-elementor'),
769	'name' => 'premium_button_box_shadow_normal',
770	'selector' => '{{WRAPPER}} .premium-button',
771	]
772	);
773
774	$this->add_responsive_control('premium_button_margin_normal',
775	[
776	'label' => __('Margin', 'premium-addons-for-elementor'),
777	'type' => Controls_Manager::DIMENSIONS,
778	'size_units' => ['px', 'em', '%'],
779	'selectors' => [
780	'{{WRAPPER}} .premium-button' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
781	]
782	]
783	);
784
785	$this->add_responsive_control('premium_button_padding_normal',
786	[
787	'label' => __('Padding', 'premium-addons-for-elementor'),
788	'type' => Controls_Manager::DIMENSIONS,
789	'size_units' => ['px', 'em', '%'],
790	'selectors' => [
791	'{{WRAPPER}} .premium-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
792	]
793	]
794	);
795
796	$this->end_controls_tab();
797
798	$this->start_controls_tab('premium_button_style_hover',
799	[
800	'label' => __('Hover', 'premium-addons-for-elementor'),
801	]
802	);
803
804	$this->add_control('premium_button_text_color_hover',
805	[
806	'label' => __('Text Color', 'premium-addons-for-elementor'),
807	'type' => Controls_Manager::COLOR,
808	'scheme' => [
809	'type' => Scheme_Color::get_type(),
810	'value' => Scheme_Color::COLOR_1,
811	],
812	'selectors' => [
813	'{{WRAPPER}} .premium-button:hover .premium-button-text-icon-wrapper span' => 'color: {{VALUE}};',
814	],
815	'condition' => [
816	'premium_button_hover_effect!' => 'style4'
817	]
818	]
819	);
820
821	$this->add_control('premium_button_icon_color_hover',
822	[
823	'label' => __('Icon Color', 'premium-addons-for-elementor'),
824	'type' => Controls_Manager::COLOR,
825	'scheme' => [
826	'type' => Scheme_Color::get_type(),
827	'value' => Scheme_Color::COLOR_2,
828	],
829	'selectors' => [
830	'{{WRAPPER}} .premium-button:hover .premium-button-text-icon-wrapper i' => 'color: {{VALUE}};',
831	],
832	'condition' => [
833	'premium_button_icon_switcher' => 'yes',
834	'icon_type' => 'icon',
835	'premium_button_hover_effect!' => 'style4',
836	]
837	]
838	);
839
840	$this->add_control('premium_button_style4_icon_color',
841	[
842	'label' => __('Icon Color', 'premium-addons-for-elementor'),
843	'type' => Controls_Manager::COLOR,
844	'scheme' => [
845	'type' => Scheme_Color::get_type(),
846	'value' => Scheme_Color::COLOR_1,
847	],
848	'selectors' => [
849	'{{WRAPPER}} .premium-button:hover .premium-button-style4-icon-wrapper' => 'color: {{VALUE}};',
850	],
851	'condition' => [
852	'premium_button_hover_effect' => 'style4',
853	'slide_icon_type' => 'icon'
854	]
855	]
856	);
857
858	$this->add_control('premium_button_background_hover',
859	[
860	'label' => __('Background Color', 'premium-addons-for-elementor'),
861	'type' => Controls_Manager::COLOR,
862	'scheme' => [
863	'type' => Scheme_Color::get_type(),
864	'value' => Scheme_Color::COLOR_3
865	],
866	'selectors' => [
867	'{{WRAPPER}} .premium-button-none:hover ,{{WRAPPER}} .premium-button-style1-bottom:before, {{WRAPPER}} .premium-button-style1-top:before, {{WRAPPER}} .premium-button-style1-right:before, {{WRAPPER}} .premium-button-style1-left:before, {{WRAPPER}} .premium-button-style2-shutouthor:before, {{WRAPPER}} .premium-button-style2-shutoutver:before, {{WRAPPER}} .premium-button-style2-shutinhor, {{WRAPPER}} .premium-button-style2-shutinver , {{WRAPPER}} .premium-button-style2-dshutinhor:before , {{WRAPPER}} .premium-button-style2-dshutinver:before , {{WRAPPER}} .premium-button-style2-scshutouthor:before , {{WRAPPER}} .premium-button-style2-scshutoutver:before, {{WRAPPER}} .premium-button-style3-after:hover , {{WRAPPER}} .premium-button-style3-before:hover,{{WRAPPER}} .premium-button-style4-icon-wrapper , {{WRAPPER}} .premium-button-style5-radialin , {{WRAPPER}} .premium-button-style5-radialout:before, {{WRAPPER}} .premium-button-style5-rectin , {{WRAPPER}} .premium-button-style5-rectout:before' => 'background-color: {{VALUE}}',
868	],
869	]
870	);
871
872	$this->add_group_control(
873	Group_Control_Border::get_type(),
874	[
875	'name' => 'premium_button_border_hover',
876	'selector' => '{{WRAPPER}} .premium-button:hover',
877	]
878	);
879
880	$this->add_control('premium_button_border_radius_hover',
881	[
882	'label' => __('Border Radius', 'premium-addons-for-elementor'),
883	'type' => Controls_Manager::SLIDER,
884	'size_units' => ['px', '%' ,'em'],
885	'selectors' => [
886	'{{WRAPPER}} .premium-button:hover' => 'border-radius: {{SIZE}}{{UNIT}};'
887	]
888	]
889	);
890
891	$this->add_group_control(
892	Group_Control_Text_Shadow::get_type(),
893	[
894	'label' => __('Icon Shadow','premium-addons-for-elementor'),
895	'name' => 'premium_button_icon_shadow_hover',
896	'selector' => '{{WRAPPER}} .premium-button:hover .premium-button-text-icon-wrapper i',
897	'condition' => [
898	'premium_button_icon_switcher' => 'yes',
899	'icon_type' => 'icon',
900	'premium_button_hover_effect!' => 'style4',
901	]
902	]
903	);
904
905	$this->add_group_control(
906	Group_Control_Text_Shadow::get_type(),
907	[
908	'label' => __('Icon Shadow','premium-addons-for-elementor'),
909	'name' => 'premium_button_style4_icon_shadow_hover',
910	'selector' => '{{WRAPPER}} .premium-button:hover .premium-button-style4-icon-wrapper',
911	'condition' => [
912	'premium_button_hover_effect' => 'style4',
913	'slide_icon_type' => 'icon'
914	]
915	]
916	);
917
918	$this->add_group_control(
919	Group_Control_Text_Shadow::get_type(),
920	[
921	'label' => __('Text Shadow','premium-addons-for-elementor'),
922	'name' => 'premium_button_text_shadow_hover',
923	'selector' => '{{WRAPPER}} .premium-button:hover .premium-button-text-icon-wrapper span',
924	'condition' => [
925	'premium_button_hover_effect!' => 'style4'
926	]
927	]
928	);
929
930	$this->add_group_control(
931	Group_Control_Box_Shadow::get_type(),
932	[
933	'label' => __('Button Shadow','premium-addons-for-elementor'),
934	'name' => 'premium_button_box_shadow_hover',
935	'selector' => '{{WRAPPER}} .premium-button:hover',
936	]
937	);
938
939	$this->add_responsive_control('premium_button_margin_hover',
940	[
941	'label' => __('Margin', 'premium-addons-for-elementor'),
942	'type' => Controls_Manager::DIMENSIONS,
943	'size_units' => ['px', 'em', '%'],
944	'selectors' => [
945	'{{WRAPPER}} .premium-button:hover' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
946	]
947	]
948	);
949
950	$this->add_responsive_control('premium_button_padding_hover',
951	[
952	'label' => __('Padding', 'premium-addons-for-elementor'),
953	'type' => Controls_Manager::DIMENSIONS,
954	'size_units' => ['px', 'em', '%'],
955	'selectors' => [
956	'{{WRAPPER}} .premium-button:hover' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
957	]
958	]
959	);
960
961	$this->end_controls_tab();
962
963	$this->end_controls_tabs();
964
965	$this->end_controls_section();
966	}
967
968	/**
969	* Render Button output on the frontend.
970	*
971	* Written in PHP and used to generate the final HTML.
972	*
973	* @since 1.0.0
974	* @access protected
975	*/
976	protected function render() {
977
978	$settings = $this->get_settings_for_display();
979
980	$this->add_inline_editing_attributes( 'premium_button_text');
981
982	$button_text = $settings['premium_button_text'];
983
984	if( $settings['premium_button_link_selection'] === 'url' ){
985	$button_url = $settings['premium_button_link']['url'];
986	} else {
987	$button_url = get_permalink( $settings['premium_button_existing_link'] );
988	}
989
990	$button_size = 'premium-button-' . $settings['premium_button_size'];
991
992	$button_event = $settings['premium_button_event_function'];
993
994	if ( ! empty ( $settings['premium_button_icon_selection'] ) ) {
995	$this->add_render_attribute( 'icon', 'class', $settings['premium_button_icon_selection'] );
996	$this->add_render_attribute( 'icon', 'aria-hidden', 'true' );
997	}
998
999	$icon_type = $settings['icon_type'];
1000
1001	if( 'icon' === $icon_type ) {
1002	$migrated = isset( $settings['__fa4_migrated']['premium_button_icon_selection_updated'] );
1003	$is_new = empty( $settings['premium_button_icon_selection'] ) && Icons_Manager::is_migration_allowed();
1004	} else {
1005	$this->add_render_attribute( 'lottie', [
1006	'class' => 'premium-lottie-animation',
1007	'data-lottie-url' => $settings['lottie_url'],
1008	'data-lottie-loop' => $settings['lottie_loop'],
1009	'data-lottie-reverse' => $settings['lottie_reverse'],
1010	]);
1011	}
1012
1013
1014	if ( $settings['premium_button_hover_effect'] == 'none' ) {
1015	$style_dir = 'premium-button-none';
1016	} elseif( $settings['premium_button_hover_effect'] == 'style1' ) {
1017	$style_dir = 'premium-button-style1-' . $settings['premium_button_style1_dir'];
1018	} elseif ( $settings['premium_button_hover_effect'] == 'style2' ) {
1019	$style_dir = 'premium-button-style2-' . $settings['premium_button_style2_dir'];
1020	} elseif ( $settings['premium_button_hover_effect'] == 'style3' ) {
1021	$style_dir = 'premium-button-style3-' . $settings['premium_button_icon_position'];
1022	} elseif ( $settings['premium_button_hover_effect'] == 'style4' ) {
1023	$style_dir = 'premium-button-style4-' . $settings['premium_button_style4_dir'];
1024
1025	$slide_icon_type = $settings['slide_icon_type'];
1026
1027	if( 'icon' === $slide_icon_type ) {
1028	if ( ! empty ( $settings['premium_button_style4_icon_selection'] ) ) {
1029	$this->add_render_attribute( 'slide_icon', 'class', $settings['premium_button_style4_icon_selection'] );
1030	$this->add_render_attribute( 'slide_icon', 'aria-hidden', 'true' );
1031	}
1032
1033	$slide_migrated = isset( $settings['__fa4_migrated']['premium_button_style4_icon_selection_updated'] );
1034	$slide_is_new = empty( $settings['premium_button_style4_icon_selection'] ) && Icons_Manager::is_migration_allowed();
1035
1036	} else {
1037
1038	$this->add_render_attribute( 'slide_lottie', [
1039	'class' => 'premium-lottie-animation',
1040	'data-lottie-url' => $settings['slide_lottie_url'],
1041	'data-lottie-loop' => $settings['slide_lottie_loop'],
1042	'data-lottie-reverse' => $settings['slide_lottie_reverse'],
1043	]
1044	);
1045
1046	}
1047
1048	} elseif ( $settings['premium_button_hover_effect'] == 'style5' ) {
1049	$style_dir = 'premium-button-style5-' . $settings['premium_button_style5_dir'];
1050	}
1051
1052	$this->add_render_attribute( 'button', 'class', array(
1053	'premium-button',
1054	$button_size,
1055	$style_dir
1056	));
1057
1058	if( ! empty( $button_url ) ) {
1059
1060	$this->add_render_attribute( 'button', 'href', $button_url );
1061
1062	if( ! empty( $settings['premium_button_link']['is_external'] ) )
1063	$this->add_render_attribute( 'button', 'target', '_blank' );
1064
1065	if( ! empty( $settings['premium_button_link']['nofollow'] ) )
1066	$this->add_render_attribute( 'button', 'rel', 'nofollow' );
1067	}
1068
1069	if( 'yes' === $settings['premium_button_event_switcher'] && ! empty( $button_event ) ) {
1070	$this->add_render_attribute( 'button', 'onclick', $button_event );
1071	}
1072
1073	?>
1074
1075	<div class="premium-button-container">
1076	<a <?php echo $this->get_render_attribute_string( 'button' ); ?>>
1077	<div class="premium-button-text-icon-wrapper">
1078	<?php if ('yes' === $settings['premium_button_icon_switcher'] ) : ?>
1079	<?php if( $settings['premium_button_icon_position'] === 'before' && $settings['premium_button_hover_effect'] !== 'style4' ) : ?>
1080	<?php if( 'icon' === $icon_type ) : ?>
1081	<?php if ( $is_new \|\| $migrated ) :
1082	Icons_Manager::render_icon( $settings['premium_button_icon_selection_updated'], [ 'aria-hidden' => 'true' ] );
1083	else: ?>
1084	<i <?php echo $this->get_render_attribute_string( 'icon' ); ?>></i>
1085	<?php endif; ?>
1086	<?php else: ?>
1087	<div <?php echo $this->get_render_attribute_string( 'lottie' ); ?>></div>
1088	<?php endif; ?>
1089	<?php endif; ?>
1090	<?php endif; ?>
1091	<span <?php echo $this->get_render_attribute_string( 'premium_button_text' ); ?>><?php echo $button_text; ?></span>
1092	<?php if ('yes' === $settings['premium_button_icon_switcher'] ) : ?>
1093	<?php if( $settings['premium_button_icon_position'] === 'after' && $settings['premium_button_hover_effect'] !== 'style4' ) : ?>
1094	<?php if( 'icon' === $icon_type ) : ?>
1095	<?php if ( $is_new \|\| $migrated ) :
1096	Icons_Manager::render_icon( $settings['premium_button_icon_selection_updated'], [ 'aria-hidden' => 'true' ] );
1097	else: ?>
1098	<i <?php echo $this->get_render_attribute_string( 'icon' ); ?>></i>
1099	<?php endif; ?>
1100	<?php else: ?>
1101	<div <?php echo $this->get_render_attribute_string( 'lottie' ); ?>></div>
1102	<?php endif; ?>
1103	<?php endif; ?>
1104	<?php endif; ?>
1105	</div>
1106	<?php if( $settings['premium_button_hover_effect'] === 'style4' ) : ?>
1107	<div class="premium-button-style4-icon-wrapper <?php echo esc_attr( $settings['premium_button_style4_dir'] ); ?>">
1108	<?php if( 'icon' === $slide_icon_type ) : ?>
1109	<?php if ( $slide_is_new \|\| $slide_migrated ) :
1110	Icons_Manager::render_icon( $settings['premium_button_style4_icon_selection_updated'], [ 'aria-hidden' => 'true' ] );
1111	else: ?>
1112	<i <?php echo $this->get_render_attribute_string( 'slide_icon' ); ?>></i>
1113	<?php endif; ?>
1114	<?php else: ?>
1115	<div <?php echo $this->get_render_attribute_string( 'slide_lottie' ); ?>></div>
1116	<?php endif;?>
1117	</div>
1118	<?php endif; ?>
1119	</a>
1120	</div>
1121
1122	<?php
1123	}
1124
1125	/**
1126	* Render Button widget output in the editor.
1127	*
1128	* Written as a Backbone JavaScript template and used to generate the live preview.
1129	*
1130	* @since 1.0.0
1131	* @access protected
1132	*/
1133	protected function content_template() {
1134	?>
1135	<#
1136
1137	view.addInlineEditingAttributes( 'premium_button_text' );
1138
1139	var buttonText = settings.premium_button_text,
1140	buttonUrl,
1141	styleDir,
1142	slideIcon,
1143	buttonSize = 'premium-button-' + settings.premium_button_size,
1144	buttonEvent = settings.premium_button_event_function,
1145	buttonIcon = settings.premium_button_icon_selection;
1146
1147	if( 'url' == settings.premium_button_link_selection ) {
1148	buttonUrl = settings.premium_button_link.url;
1149	} else {
1150	buttonUrl = settings.premium_button_existing_link;
1151	}
1152
1153	if ( 'none' == settings.premium_button_hover_effect ) {
1154	styleDir = 'premium-button-none';
1155	} else if( 'style1' == settings.premium_button_hover_effect ) {
1156	styleDir = 'premium-button-style1-' + settings.premium_button_style1_dir;
1157	} else if ( 'style2' == settings.premium_button_hover_effect ){
1158	styleDir = 'premium-button-style2-' + settings.premium_button_style2_dir;
1159	} else if ( 'style3' == settings.premium_button_hover_effect ) {
1160	styleDir = 'premium-button-style3-' + settings.premium_button_icon_position;
1161	} else if ( 'style4' == settings.premium_button_hover_effect ) {
1162	styleDir = 'premium-button-style4-' + settings.premium_button_style4_dir;
1163
1164	var slideIconType = settings.slide_icon_type;
1165
1166	if( 'icon' === slideIconType ) {
1167
1168	slideIcon = settings.premium_button_style4_icon_selection;
1169
1170	var slideIconHTML = elementor.helpers.renderIcon( view, settings.premium_button_style4_icon_selection_updated, { 'aria-hidden': true }, 'i' , 'object' ),
1171	slideMigrated = elementor.helpers.isIconMigrated( settings, 'premium_button_style4_icon_selection_updated' );
1172
1173	} else {
1174
1175	view.addRenderAttribute( 'slide_lottie', {
1176	'class': 'premium-lottie-animation',
1177	'data-lottie-url': settings.slide_lottie_url,
1178	'data-lottie-loop': settings.slide_lottie_loop,
1179	'data-lottie-reverse': settings.slide_lottie_reverse
1180	});
1181
1182	}
1183
1184
1185	} else if ( 'style5' == settings.premium_button_hover_effect ){
1186	styleDir = 'premium-button-style5-' + settings.premium_button_style5_dir;
1187	}
1188
1189	var iconType = settings.icon_type;
1190
1191	if( 'icon' === iconType ) {
1192	var iconHTML = elementor.helpers.renderIcon( view, settings.premium_button_icon_selection_updated, { 'aria-hidden': true }, 'i' , 'object' ),
1193	migrated = elementor.helpers.isIconMigrated( settings, 'premium_button_icon_selection_updated' );
1194	} else {
1195
1196	view.addRenderAttribute( 'lottie', {
1197	'class': 'premium-lottie-animation',
1198	'data-lottie-url': settings.lottie_url,
1199	'data-lottie-loop': settings.lottie_loop,
1200	'data-lottie-reverse': settings.lottie_reverse
1201	});
1202
1203	}
1204
1205	#>
1206
1207	<div class="premium-button-container">
1208	<a class="premium-button {{ buttonSize }} {{ styleDir }}" href="{{ buttonUrl }}" onclick="{{ buttonEvent }}">
1209	<div class="premium-button-text-icon-wrapper">
1210	<# if ('yes' === settings.premium_button_icon_switcher) { #>
1211	<# if( 'before' === settings.premium_button_icon_position && 'style4' != settings.premium_button_hover_effect ) { #>
1212	<# if( 'icon' === iconType ) {
1213	if ( iconHTML && iconHTML.rendered && ( ! buttonIcon \|\| migrated ) ) { #>
1214	{{{ iconHTML.value }}}
1215	<# } else { #>
1216	<i class="{{ buttonIcon }}" aria-hidden="true"></i>
1217	<# } #>
1218	<# } else { #>
1219	<div {{{ view.getRenderAttributeString('lottie') }}}></div>
1220	<# } #>
1221	<# } #>
1222	<# } #>
1223	<span {{{ view.getRenderAttributeString('premium_button_text') }}}>{{{ buttonText }}}</span>
1224	<# if ('yes' === settings.premium_button_icon_switcher) { #>
1225	<# if( 'after' == settings.premium_button_icon_position && 'style4' != settings.premium_button_hover_effect ) { #>
1226	<# if( 'icon' === iconType ) {
1227	if ( iconHTML && iconHTML.rendered && ( ! buttonIcon \|\| migrated ) ) { #>
1228	{{{ iconHTML.value }}}
1229	<# } else { #>
1230	<i class="{{ buttonIcon }}" aria-hidden="true"></i>
1231	<# } #>
1232	<# } else { #>
1233	<div {{{ view.getRenderAttributeString('lottie') }}}></div>
1234	<# } #>
1235	<# } #>
1236	<# } #>
1237	</div>
1238	<# if( 'style4' == settings.premium_button_hover_effect ) { #>
1239	<div class="premium-button-style4-icon-wrapper {{ settings.premium_button_style4_dir }}">
1240	<# if ( 'icon' === slideIconType ) { #>
1241	<# if ( slideIconHTML && slideIconHTML.rendered && ( ! slideIcon \|\| slideMigrated ) ) { #>
1242	{{{ slideIconHTML.value }}}
1243	<# } else { #>
1244	<i class="{{ slideIcon }}" aria-hidden="true"></i>
1245	<# } #>
1246	<# } else { #>
1247	<div {{{ view.getRenderAttributeString('slide_lottie') }}}></div>
1248	<# } #>
1249	</div>
1250	<# } #>
1251	</a>
1252	</div>
1253
1254	<?php
1255	}
1256	}