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

Image_Accordion.php in King Addons for Elementor – 100+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce Builder, Mega Menu, Popup Builder 51.1.38, at includes/widgets/Image_Accordion/Image_Accordion.php

2,370 lines 89.9 KB

Raw Download Zip

1	<?php
2
3	namespace King_Addons;
4
5	use Elementor\Controls_Manager;
6	use Elementor\Group_Control_Background;
7	use Elementor\Group_Control_Box_Shadow;
8	use Elementor\Group_Control_Image_Size;
9	use Elementor\Group_Control_Typography;
10	use Elementor\Repeater;
11	use Elementor\Utils;
12	use Elementor\Widget_Base;
13
14	if (!defined('ABSPATH')) exit;
15
16	class Image_Accordion extends Widget_Base
17	{
18
19
20
21	public function get_name()
22	{
23	return 'king-addons-image-accordion';
24	}
25
26	public function get_title()
27	{
28	return esc_html__('Image Accordion', 'king-addons');
29	}
30
31	public function get_icon()
32	{
33	return 'king-addons-icon king-addons-image-accordion';
34	}
35
36	public function get_categories()
37	{
38	return ['king-addons'];
39	}
40
41	public function get_keywords()
42	{
43	return ['king addons', 'king', 'addons', 'kingaddons', 'king-addons',
44	'image accordion', 'image', 'accordion', 'slider', 'images', 'media', 'accor', 'carousel'];
45	}
46
47	public function get_script_depends()
48	{
49	return [
50	KING_ADDONS_ASSETS_UNIQUE_KEY . '-image-accordion-script',
51	KING_ADDONS_ASSETS_UNIQUE_KEY . '-lightgallery-lightgallery'
52	];
53	}
54
55	public function get_style_depends()
56	{
57	return [
58	KING_ADDONS_ASSETS_UNIQUE_KEY . '-animation-button',
59	KING_ADDONS_ASSETS_UNIQUE_KEY . '-animation-general',
60	KING_ADDONS_ASSETS_UNIQUE_KEY . '-animation-timing',
61	KING_ADDONS_ASSETS_UNIQUE_KEY . '-animation-loading',
62	KING_ADDONS_ASSETS_UNIQUE_KEY . '-image-accordion-style',
63	KING_ADDONS_ASSETS_UNIQUE_KEY . '-lightgallery-lightgallery',
64	KING_ADDONS_ASSETS_UNIQUE_KEY . '-general-general',
65	];
66	}
67
68	public function get_custom_help_url()
69	{
70	return 'mailto:[email protected]?subject=Bug Report - King Addons&body=Please describe the issue';
71	}
72
73	public ?string $item_bg_image_url;
74
75	public function add_section_lightbox_popup()
76	{
77	}
78
79	public function add_section_lightbox_styles()
80	{
81	}
82
83	public function add_control_accordion_direction()
84	{
85	$this->add_responsive_control(
86	'accordion_direction',
87	[
88	'label' => esc_html__('Layout', 'king-addons'),
89	'type' => Controls_Manager::SELECT,
90	'render_type' => 'template',
91	'options' => [
92	'row' => esc_html__('Horizontal', 'king-addons'),
93	'pro-cl' => esc_html__('Vertical (Pro)', 'king-addons'),
94	],
95	'prefix_class' => 'king-addons-image-accordion-',
96	'default' => 'row',
97	'selectors' => [
98	'{{WRAPPER}}.king-addons-image-accordion-row .king-addons-image-accordion-wrap .king-addons-image-accordion' => 'flex-direction: {{VALUE}};',
99	'{{WRAPPER}}.king-addons-image-accordion-column .king-addons-image-accordion-wrap .king-addons-image-accordion' => 'flex-direction: {{VALUE}};',
100	]
101	]
102	);
103	}
104
105	public function add_control_accordion_interaction()
106	{
107	$this->add_control(
108	'accordion_interaction',
109	[
110	'label' => esc_html__('Interaction', 'king-addons'),
111	'type' => Controls_Manager::SELECT,
112	'options' => [
113	'hover' => esc_html__('Hover', 'king-addons'),
114	'pro-ck' => esc_html__('Click (Pro)', 'king-addons'),
115	],
116	'render_type' => 'template',
117	'default' => 'hover',
118	'prefix_class' => 'king-addons-image-accordion-interaction-',
119	]
120	);
121	}
122
123	public function add_control_accordion_skew()
124	{
125	$this->add_control(
126	'accordion_skew',
127	[
128	'label' => sprintf(__('Skew Images %s', 'king-addons'), '<i class="eicon-pro-icon"></i>'),
129	'type' => Controls_Manager::SWITCHER,
130	'separator' => 'before',
131	'classes' => 'king-addons-pro-control'
132	]
133	);
134	}
135
136	public function add_control_image_effects()
137	{
138	$this->add_control(
139	'image_effects',
140	[
141	'label' => esc_html__('Select Effect', 'king-addons'),
142	'type' => Controls_Manager::SELECT,
143	'options' => [
144	'none' => esc_html__('None', 'king-addons'),
145	'pro-zi' => esc_html__('Zoom In (Pro)', 'king-addons'),
146	'pro-zo' => esc_html__('Zoom Out (Pro)', 'king-addons'),
147	'grayscale-in' => esc_html__('Grayscale In', 'king-addons'),
148	'pro-go' => esc_html__('Grayscale Out (Pro)', 'king-addons'),
149	'blur-in' => esc_html__('Blur In', 'king-addons'),
150	'pro-bo' => esc_html__('Blur Out (Pro)', 'king-addons'),
151	'slide' => esc_html__('Slide', 'king-addons')
152	],
153	'default' => 'none',
154	]
155	);
156	}
157
158	public function add_control_overlay_color()
159	{
160	$this->add_group_control(
161	Group_Control_Background::get_type(),
162	[
163	'name' => 'overlay_color',
164	'label' => esc_html__('Background', 'king-addons'),
165	'types' => ['classic', 'gradient'],
166	'exclude' => ['image'],
167	'fields_options' => [
168	'background' => [
169	'default' => 'classic',
170	],
171	'color' => [
172	'default' => 'rgba(128, 128, 128, 0.5)',
173	],
174	],
175	'selector' => '{{WRAPPER}} .king-addons-img-accordion-hover-bg'
176	]
177	);
178	}
179
180	public function add_control_overlay_blend_mode()
181	{
182	}
183
184	public function add_option_element_select()
185	{
186	return [
187	'title' => esc_html__('Title', 'king-addons'),
188	'description' => esc_html__('Description', 'king-addons'),
189	'pro-lbx' => esc_html__('Lightbox (Pro)', 'king-addons'),
190	'button' => esc_html__('Button', 'king-addons'),
191	'separator' => esc_html__('Separator', 'king-addons'),
192	];
193	}
194
195	public function add_control_button_animation()
196	{
197	$this->add_control(
198	'button_animation',
199	[
200	'label' => esc_html__('Select Animation', 'king-addons'),
201	'type' => 'king-addons-button-animations',
202	'default' => 'king-addons-button-sweep-to-top',
203	]
204	);
205	}
206
207	public function add_control_button_animation_height()
208	{
209	$this->add_control(
210	'button_animation_height',
211	[
212	'label' => esc_html__('Animation Height', 'king-addons'),
213	'type' => Controls_Manager::SLIDER,
214	'range' => [
215	'%' => [
216	'min' => 0,
217	'max' => 100,
218	],
219	'px' => [
220	'min' => 0,
221	'max' => 30,
222	],
223	],
224	'size_units' => ['%', 'px'],
225	'default' => [
226	'unit' => 'px',
227	'size' => 3,
228	],
229	'selectors' => [
230	'{{WRAPPER}} [class*="king-addons-button-underline"]:before' => 'height: {{SIZE}}{{UNIT}};',
231	'{{WRAPPER}} [class*="king-addons-button-overline"]:before' => 'height: {{SIZE}}{{UNIT}};',
232	],
233	'render_type' => 'template',
234	'condition' => [
235	'button_animation' => [
236	'king-addons-button-underline-from-left',
237	'king-addons-button-underline-from-center',
238	'king-addons-button-underline-from-right',
239	'king-addons-button-underline-reveal',
240	'king-addons-button-overline-reveal',
241	'king-addons-button-overline-from-left',
242	'king-addons-button-overline-from-center',
243	'king-addons-button-overline-from-right'
244	]
245	],
246	]
247	);
248	}
249
250	public function add_control_lightbox_popup_thumbnails()
251	{
252	}
253
254	public function add_control_lightbox_popup_thumbnails_default()
255	{
256	}
257
258	public function add_control_lightbox_popup_sharing()
259	{
260	}
261
262	public function add_repeater_args_element_align_hr()
263	{
264	return [
265	'label' => esc_html__('Horizontal Align', 'king-addons'),
266	'type' => Controls_Manager::CHOOSE,
267	'label_block' => false,
268	'default' => 'center',
269	'options' => [
270	'left' => [
271	'title' => esc_html__('Left', 'king-addons'),
272	'icon' => 'eicon-h-align-left',
273	],
274	'center' => [
275	'title' => esc_html__('Center', 'king-addons'),
276	'icon' => 'eicon-h-align-center',
277	],
278	'right' => [
279	'title' => esc_html__('Right', 'king-addons'),
280	'icon' => 'eicon-h-align-right',
281	]
282	],
283	'selectors' => [
284	'{{WRAPPER}} {{CURRENT_ITEM}}' => 'text-align: center'
285	],
286	'render_type' => 'template',
287	'separator' => 'after'
288	];
289	}
290
291	protected function register_controls()
292	{
293
294
295	$this->start_controls_section(
296	'accordion_settings',
297	[
298	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Settings', 'king-addons'),
299	'type' => Controls_Manager::SECTION,
300	]
301	);
302
303
304	$this->add_control_accordion_direction();
305
306
307	Core::renderUpgradeProNotice($this, Controls_Manager::RAW_HTML, 'image-accordion', 'accordion_direction', ['pro-cl']);
308
309	$this->add_control_accordion_interaction();
310
311
312	Core::renderUpgradeProNotice($this, Controls_Manager::RAW_HTML, 'image-accordion', 'accordion_interaction', ['pro-ck']);
313
314	$this->add_group_control(
315	Group_Control_Image_Size::get_type(),
316	[
317	'name' => 'accordion_image_size',
318	'default' => 'full',
319	]
320	);
321
322	$this->add_control(
323	'default_active',
324	[
325	'label' => __('Active Image By Default', 'king-addons'),
326	'type' => Controls_Manager::NUMBER,
327	'default' => 0,
328	'min' => 0,
329	]
330	);
331
332	$this->add_responsive_control(
333	'accordion_height',
334	[
335	'type' => Controls_Manager::SLIDER,
336	'label' => esc_html__('Height', 'king-addons'),
337	'size_units' => ['px', 'vh'],
338	'range' => [
339	'px' => [
340	'min' => 20,
341	'max' => 1500,
342	],
343	'vh' => [
344	'min' => 20,
345	'max' => 100,
346	],
347	],
348	'default' => [
349	'unit' => 'px',
350	'size' => 500,
351	],
352	'selectors' => [
353	'{{WRAPPER}} .king-addons-image-accordion' => 'height: {{SIZE}}{{UNIT}};',
354	],
355	'separator' => 'before',
356	]
357	);
358
359	$this->add_responsive_control(
360	'accordion_active_item_style',
361	[
362	'label' => esc_html__('Grow (Active)', 'king-addons'),
363	'type' => Controls_Manager::SLIDER,
364	'size_units' => ['px'],
365	'range' => [
366	'px' => [
367	'min' => 1,
368	'max' => 10,
369	],
370	],
371	'default' => [
372	'size' => 4,
373	'unit' => 'px'
374	],
375	'selectors' => [
376	'{{WRAPPER}} .king-addons-image-accordion-wrap .king-addons-image-accordion-item.king-addons-image-accordion-item-grow' => 'flex: {{SIZE}};',
377	],
378	'render_type' => 'template'
379	]
380	);
381
382	$this->add_responsive_control(
383	'accordion_items_spacing',
384	[
385	'label' => esc_html__('Gutter', 'king-addons'),
386	'type' => Controls_Manager::SLIDER,
387	'size_units' => ['px'],
388	'default' => [
389	'size' => 0,
390	'units' => 'px',
391	],
392	'range' => [
393	'px' => [
394	'min' => 0,
395	'max' => 100
396	]
397	],
398	'selectors' => [
399	'{{WRAPPER}}.king-addons-image-accordion-row .king-addons-image-accordion-item:not(:last-child)' => 'margin-right: {{SIZE}}px;',
400	'{{WRAPPER}}.king-addons-image-accordion-column .king-addons-image-accordion-item:not(:last-child)' => 'margin-bottom: {{SIZE}}px;'
401	]
402	]
403	);
404
405	$this->add_responsive_control(
406	'accordion_item_border',
407	[
408	'label' => esc_html__('Border Type', 'king-addons'),
409	'type' => Controls_Manager::SELECT,
410	'options' => [
411	'outer' => esc_html__('Outer', 'king-addons'),
412	'individual' => esc_html__('Individual', 'king-addons')
413	],
414	'default' => 'outer',
415	'prefix_class' => 'king-addons-acc-border-',
416	'render_type' => 'template',
417	'separator' => 'before'
418	]
419	);
420
421	$this->add_control(
422	'accordion_item_border_radius',
423	[
424	'label' => esc_html__('Border Radius', 'king-addons'),
425	'type' => Controls_Manager::DIMENSIONS,
426	'size_units' => ['px', '%'],
427	'default' => [
428	'top' => 0,
429	'right' => 0,
430	'bottom' => 0,
431	'left' => 0,
432	],
433	'selectors' => [
434	'{{WRAPPER}}.king-addons-acc-border-outer.king-addons-image-accordion-row .king-addons-image-accordion-item:first-child' => 'border-radius: {{TOP}}{{UNIT}} 0 0 {{LEFT}}{{UNIT}};',
435	'{{WRAPPER}}.king-addons-acc-border-outer.king-addons-image-accordion-row .king-addons-image-accordion-item:last-child' => 'border-radius: 0 {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} 0;',
436	'{{WRAPPER}}.king-addons-acc-border-outer.king-addons-image-accordion-column .king-addons-image-accordion-item:first-child' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} 0 0;',
437	'{{WRAPPER}}.king-addons-acc-border-outer.king-addons-image-accordion-column .king-addons-image-accordion-item:last-child' => 'border-radius: 0 0 {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
438	'{{WRAPPER}}.king-addons-acc-border-individual .king-addons-image-accordion-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
439	]
440	]
441	);
442
443	$this->add_control_accordion_skew();
444
445	$this->add_control(
446	'accordion_item_transition',
447	[
448	'label' => esc_html__('Grow Transition', 'king-addons'),
449	'type' => Controls_Manager::NUMBER,
450	'default' => 0.3,
451	'min' => 0,
452	'max' => 5,
453	'step' => 0.1,
454	'selectors' => [
455	'{{WRAPPER}} .king-addons-image-accordion-item' => 'transition-duration: {{VALUE}}s;',
456	'{{WRAPPER}} .king-addons-image-accordion-item .king-addons-accordion-background' => 'transition-duration: {{VALUE}}s;'
457	],
458	'separator' => 'before'
459	]
460	);
461
462	$this->end_controls_section();
463
464
465	$this->start_controls_section(
466	'section_accordion_items',
467	[
468	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Content', 'king-addons'),
469	'tab' => Controls_Manager::TAB_CONTENT,
470	]
471	);
472
473	$repeater = new Repeater();
474
475	$repeater->add_control(
476	'accordion_item_bg_image',
477	[
478	'label' => esc_html__('Image', 'king-addons'),
479	'type' => Controls_Manager::MEDIA,
480	'dynamic' => [
481	'active' => true,
482	],
483	'render_type' => 'template',
484	'default' => [
485	'url' => Utils::get_placeholder_image_src(),
486	]
487	]
488	);
489
490	$repeater->add_responsive_control(
491	'bg_image_size',
492	[
493	'label' => esc_html__('Size', 'king-addons'),
494	'type' => Controls_Manager::SELECT,
495	'options' => [
496	'cover' => esc_html__('Cover', 'king-addons'),
497	'contain' => esc_html__('Contain', 'king-addons'),
498	'auto' => esc_html__('Auto', 'king-addons'),
499	],
500	'default' => 'cover',
501	'selectors' => [
502	'{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-image-accordion-item .king-addons-accordion-background' => 'background-size: {{VALUE}}',
503	]
504	]
505	);
506
507	$repeater->add_responsive_control(
508	'bg_image_position',
509	[
510	'label' => esc_html__('Position', 'king-addons'),
511	'type' => Controls_Manager::SELECT,
512	'options' => [
513	'center center' => esc_html__('Center Center', 'king-addons'),
514	'center left' => esc_html__('Center Left', 'king-addons'),
515	'center right' => esc_html__('Center Right', 'king-addons'),
516	'top center' => esc_html__('Top Center', 'king-addons'),
517	'top left' => esc_html__('Top Left', 'king-addons'),
518	'top right' => esc_html__('Top Right', 'king-addons'),
519	'bottom center' => esc_html__('Bottom Center', 'king-addons'),
520	'bottom left' => esc_html__('Bottom Left', 'king-addons'),
521	'bottom right' => esc_html__('Bottom Right', 'king-addons'),
522	],
523	'default' => 'center center',
524	'selectors' => [
525	'{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-image-accordion-item .king-addons-accordion-background' => 'background-position: {{VALUE}}',
526	]
527	]
528	);
529
530	$repeater->add_responsive_control(
531	'bg_image_repeat',
532	[
533	'label' => esc_html__('Repeat', 'king-addons'),
534	'type' => Controls_Manager::SELECT,
535	'options' => [
536	'repeat' => esc_html__('Repeat', 'king-addons'),
537	'no-repeat' => esc_html__('No-repeat', 'king-addons'),
538	'repeat-x' => esc_html__('Repeat-x', 'king-addons'),
539	'repeat-y' => esc_html__('Repeat-y', 'king-addons'),
540	],
541	'default' => 'repeat',
542	'selectors' => [
543	'{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-image-accordion-item .king-addons-accordion-background' => 'background-repeat: {{VALUE}}',
544	]
545	]
546	);
547
548
549	$repeater->add_control(
550	'accordion_item_title', [
551	'label' => esc_html__('Title', 'king-addons'),
552	'type' => Controls_Manager::TEXT,
553	'dynamic' => [
554	'active' => true,
555	],
556	'default' => esc_html__('Item 1 Title', 'king-addons'),
557	'label_block' => true,
558	'separator' => 'before'
559	]
560	);
561
562	$repeater->add_control(
563	'accordion_item_description', [
564	'label' => esc_html__('Description', 'king-addons'),
565	'type' => Controls_Manager::TEXTAREA,
566	'dynamic' => [
567	'active' => true,
568	],
569	'default' => esc_html__('Lorem ipsum dolos ave nita', 'king-addons'),
570	'label_block' => true
571	]
572	);
573
574	$repeater->add_control(
575	'element_button_text',
576	[
577	'label' => esc_html__('Button Text', 'king-addons'),
578	'type' => Controls_Manager::TEXT,
579	'dynamic' => [
580	'active' => true,
581	],
582	'default' => 'Button'
583	]
584	);
585
586	$repeater->add_control(
587	'accordion_btn_url',
588	[
589	'label' => esc_html__('Button URL', 'king-addons'),
590	'type' => Controls_Manager::URL,
591	'dynamic' => [
592	'active' => true,
593	]
594	]
595	);
596
597	$repeater->add_control(
598	'wrapper_link',
599	[
600	'label' => esc_html__('Use Button URL as Image Link', 'king-addons'),
601	'type' => Controls_Manager::SWITCHER,
602	'label_block' => false,
603	'render_type' => 'template',
604	]
605	);
606
607	$this->add_control(
608	'accordion_items',
609	[
610	'type' => Controls_Manager::REPEATER,
611	'fields' => $repeater->get_controls(),
612	'default' => [
613	[
614	'accordion_item_title' => esc_html__('Item 1 Title', 'king-addons'),
615	'accordion_item_bg_image' => [
616	'url' => Utils::get_placeholder_image_src(),
617	],
618	],
619	[
620	'accordion_item_title' => esc_html__('Item 2 Title', 'king-addons'),
621	],
622	[
623	'accordion_item_title' => esc_html__('Item 3 Title', 'king-addons'),
624	'accordion_item_bg_image' => [
625	'url' => Utils::get_placeholder_image_src(),
626	],
627	],
628	],
629	'title_field' => '{{{ accordion_item_title }}}',
630	]
631	);
632
633	if (!king_addons_freemius()->can_use_premium_code__premium_only()) {
634	$this->add_control(
635	'accordion_repeater_pro_notice',
636	[
637	'type' => Controls_Manager::RAW_HTML,
638	'raw' => 'More than 3 Items are available<br> in the <strong><a href="https://kingaddons.com/pricing/?utm_source=kng-module-image-accordion-settings-upgrade-pro&utm_medium=plugin&utm_campaign=kng" target="_blank">Pro version</a></strong>',
639	'content_classes' => 'king-addons-pro-notice',
640	]
641	);
642	}
643
644	$this->end_controls_section();
645
646
647	$this->start_controls_section(
648	'section_accordion_elements',
649	[
650	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Elements', 'king-addons'),
651	'tab' => Controls_Manager::TAB_CONTENT,
652	]
653	);
654
655	$repeater = new Repeater();
656
657	$repeater->add_control(
658	'element_select',
659	[
660	'label' => esc_html__('Select Element', 'king-addons'),
661	'type' => Controls_Manager::SELECT,
662	'default' => 'title',
663	'options' => $this->add_option_element_select(),
664	'separator' => 'after'
665	]
666	);
667
668
669	Core::renderUpgradeProNotice($repeater, Controls_Manager::RAW_HTML, 'image-accordion', 'element_select', ['pro-lbx']);
670
671	$repeater->add_control(
672	'element_display',
673	[
674	'label' => esc_html__('Display', 'king-addons'),
675	'type' => Controls_Manager::SELECT,
676	'default' => 'block',
677	'options' => [
678	'inline' => esc_html__('Inline', 'king-addons'),
679	'block' => esc_html__('Seperate Line', 'king-addons'),
680	'custom' => esc_html__('Custom Width', 'king-addons'),
681	],
682	]
683	);
684
685	$repeater->add_control(
686	'element_custom_width',
687	[
688	'label' => esc_html__('Element Width', 'king-addons'),
689	'type' => Controls_Manager::SLIDER,
690	'size_units' => ['%'],
691	'range' => [
692	'%' => [
693	'min' => 0,
694	'max' => 100,
695	],
696	],
697	'default' => [
698	'unit' => '%',
699	'size' => 100,
700	],
701	'selectors' => [
702	'{{WRAPPER}} {{CURRENT_ITEM}}' => 'width: {{SIZE}}%;',
703	],
704	'condition' => [
705	'element_display' => 'custom',
706	],
707	]
708	);
709
710	if (!king_addons_freemius()->can_use_premium_code__premium_only()) {
711	$repeater->add_control(
712	'element_align_pro_notice',
713	[
714	'raw' => 'Vertical and Horizontal Align options are available in the <strong><a href="https://kingaddons.com/pricing/?utm_source=kng-module-image-accordion-settings-upgrade-pro&utm_medium=plugin&utm_campaign=kng" target="_blank">Pro version</a></strong>',
715
716	'type' => Controls_Manager::RAW_HTML,
717	'content_classes' => 'king-addons-pro-notice',
718	]
719	);
720	}
721
722	$repeater->add_control(
723	'element_align_vr',
724	[
725	'label' => esc_html__('Vertical Align', 'king-addons'),
726	'type' => Controls_Manager::CHOOSE,
727	'label_block' => false,
728	'default' => 'middle',
729	'options' => [
730	'top' => [
731	'title' => esc_html__('Top', 'king-addons'),
732	'icon' => 'eicon-v-align-top',
733	],
734	'middle' => [
735	'title' => esc_html__('Middle', 'king-addons'),
736	'icon' => 'eicon-v-align-middle',
737	],
738	'bottom' => [
739	'title' => esc_html__('Bottom', 'king-addons'),
740	'icon' => 'eicon-v-align-bottom',
741	],
742	]
743	]
744	);
745
746	$repeater->add_control('element_align_hr', $this->add_repeater_args_element_align_hr());
747
748	$repeater->add_control(
749	'element_title_tag',
750	[
751	'label' => esc_html__('Text HTML Tag', 'king-addons'),
752	'type' => Controls_Manager::SELECT,
753	'options' => [
754	'h1' => esc_html__('H1', 'king-addons'),
755	'h2' => esc_html__('H2', 'king-addons'),
756	'h3' => esc_html__('H3', 'king-addons'),
757	'h4' => esc_html__('H4', 'king-addons'),
758	'h5' => esc_html__('H5', 'king-addons'),
759	'h6' => esc_html__('H6', 'king-addons'),
760	'div' => esc_html__('div', 'king-addons'),
761	'span' => esc_html__('span', 'king-addons'),
762	'p' => esc_html__('p', 'king-addons'),
763	],
764	'default' => 'h2',
765	'condition' => [
766	'element_select' => 'title'
767	]
768	]
769	);
770
771	$repeater->add_control(
772	'element_lightbox_icon',
773	[
774	'label' => esc_html__('Select Icon', 'king-addons'),
775	'type' => Controls_Manager::ICONS,
776	'skin' => 'inline',
777	'label_block' => false,
778	'default' => [
779	'value' => 'fas fa-search',
780	'library' => 'fa-solid',
781	],
782	'condition' => [
783	'element_select' => 'lightbox'
784	]
785	]
786	);
787
788	$repeater->add_control(
789	'element_extra_text_pos',
790	[
791	'label' => esc_html__('Extra Text Display', 'king-addons'),
792	'type' => Controls_Manager::SELECT,
793	'options' => [
794	'none' => esc_html__('None', 'king-addons'),
795	'before' => esc_html__('Before Element', 'king-addons'),
796	'after' => esc_html__('After Element', 'king-addons'),
797	],
798	'default' => 'none',
799	'condition' => [
800	'element_select!' => [
801	'title',
802	'description',
803	'button',
804	'separator',
805	],
806	]
807	]
808	);
809
810	$repeater->add_control(
811	'element_extra_text',
812	[
813	'label' => esc_html__('Extra Text', 'king-addons'),
814	'type' => Controls_Manager::TEXT,
815	'dynamic' => [
816	'active' => true,
817	],
818	'default' => '',
819	'condition' => [
820	'element_select!' => [
821	'title',
822	'description',
823	'button',
824	'separator',
825	],
826	'element_extra_text_pos!' => 'none'
827	]
828	]
829	);
830
831	$repeater->add_control(
832	'element_extra_icon_pos',
833	[
834	'label' => esc_html__('Extra Icon Position', 'king-addons'),
835	'type' => Controls_Manager::SELECT,
836	'options' => [
837	'none' => esc_html__('None', 'king-addons'),
838	'before' => esc_html__('Before Element', 'king-addons'),
839	'after' => esc_html__('After Element', 'king-addons'),
840	],
841	'default' => 'none',
842	'condition' => [
843	'element_select!' => [
844	'title',
845	'separator',
846	'description',
847	'lightbox'
848	],
849	]
850	]
851	);
852
853	$repeater->add_control(
854	'element_extra_icon',
855	[
856	'label' => esc_html__('Select Icon', 'king-addons'),
857	'type' => Controls_Manager::ICONS,
858	'skin' => 'inline',
859	'label_block' => false,
860	'default' => [
861	'value' => 'fas fa-search',
862	'library' => 'fa-solid',
863	],
864	'condition' => [
865	'element_select!' => [
866	'title',
867	'separator',
868	'description',
869	'lightbox'
870	],
871	'element_extra_icon_pos!' => 'none'
872	]
873	]
874	);
875
876	$repeater->add_control(
877	'animation_divider',
878	[
879	'type' => Controls_Manager::DIVIDER,
880	'style' => 'thick',
881	'condition' => [
882	'element_select' => [
883	'button',
884	'lightbox'
885	],
886	]
887	]
888	);
889
890
891	$repeater->add_control(
892	'element_animation',
893	[
894	'label' => esc_html__('Select Animation', 'king-addons'),
895	'type' => 'king-addons-animations',
896	'default' => 'fade-in'
897	]
898	);
899
900
901	Core::renderUpgradeProNotice($repeater, Controls_Manager::RAW_HTML, 'image-accordion', 'element_animation', ['pro-slrt', 'pro-slxrt', 'pro-slbt', 'pro-sllt', 'pro-sltp', 'pro-slxlt', 'pro-sktp', 'pro-skrt', 'pro-skbt', 'pro-sklt', 'pro-scup', 'pro-scdn', 'pro-rllt', 'pro-rlrt']);
902
903	$repeater->add_control(
904	'element_animation_duration',
905	[
906	'label' => esc_html__('Animation Duration', 'king-addons'),
907	'type' => Controls_Manager::NUMBER,
908	'default' => 0.3,
909	'min' => 0,
910	'max' => 5,
911	'step' => 0.1,
912	'selectors' => [
913	'{{WRAPPER}} {{CURRENT_ITEM}}' => 'transition-duration: {{VALUE}}s;'
914	],
915	'condition' => [
916	'element_animation!' => 'none'
917	],
918	]
919	);
920
921	$repeater->add_control(
922	'element_animation_delay',
923	[
924	'label' => esc_html__('Animation Delay', 'king-addons'),
925	'type' => Controls_Manager::NUMBER,
926	'default' => 0,
927	'min' => 0,
928	'max' => 5,
929	'step' => 0.1,
930	'selectors' => [
931	'{{WRAPPER}} .king-addons-animation-wrap:hover {{CURRENT_ITEM}}' => 'transition-delay: {{VALUE}}s;'
932	],
933	'condition' => [
934	'element_animation!' => 'none'
935	],
936	]
937	);
938
939	$repeater->add_control(
940	'element_animation_timing',
941	[
942	'label' => esc_html__('Animation Timing', 'king-addons'),
943	'type' => Controls_Manager::SELECT,
944	'options' => Core::getAnimationTimings(),
945	'default' => 'ease-default',
946	'condition' => [
947	'element_animation!' => 'none'
948	],
949	]
950	);
951
952
953	Core::renderUpgradeProNotice($repeater, Controls_Manager::RAW_HTML, 'image-accordion', 'element_animation_timing', ['pro-eio', 'pro-eiqd', 'pro-eicb', 'pro-eiqrt', 'pro-eiqnt', 'pro-eisn', 'pro-eiex', 'pro-eicr', 'pro-eibk', 'pro-eoqd', 'pro-eocb', 'pro-eoqrt', 'pro-eoqnt', 'pro-eosn', 'pro-eoex', 'pro-eocr', 'pro-eobk', 'pro-eioqd', 'pro-eiocb', 'pro-eioqrt', 'pro-eioqnt', 'pro-eiosn', 'pro-eioex', 'pro-eiocr', 'pro-eiobk',]);
954
955	$repeater->add_control(
956	'element_animation_size',
957	[
958	'label' => esc_html__('Animation Size', 'king-addons'),
959	'type' => Controls_Manager::SELECT,
960	'options' => [
961	'small' => esc_html__('Small', 'king-addons'),
962	'medium' => esc_html__('Medium', 'king-addons'),
963	'large' => esc_html__('Large', 'king-addons'),
964	],
965	'default' => 'large',
966	'condition' => [
967	'element_animation!' => 'none'
968	],
969	]
970	);
971
972	$repeater->add_control(
973	'element_animation_tr',
974	[
975	'label' => esc_html__('Animation Transparency', 'king-addons'),
976	'type' => Controls_Manager::SWITCHER,
977	'default' => 'yes',
978	'return_value' => 'yes',
979	'condition' => [
980	'element_animation!' => 'none'
981	],
982	]
983	);
984
985	$repeater->add_responsive_control(
986	'element_show_on',
987	[
988	'label' => esc_html__('Show on this Device', 'king-addons'),
989	'type' => Controls_Manager::SWITCHER,
990	'default' => 'yes',
991	'widescreen_default' => 'yes',
992	'laptop_default' => 'yes',
993	'tablet_extra_default' => 'yes',
994	'tablet_default' => 'yes',
995	'mobile_extra_default' => 'yes',
996	'mobile_default' => 'yes',
997	'selectors_dictionary' => [
998	'' => 'position: absolute; left: -99999999px;',
999	'yes' => 'position: static; left: auto;'
1000	],
1001	'selectors' => [
1002	'{{WRAPPER}} {{CURRENT_ITEM}}' => '{{VALUE}}',
1003	],
1004	'render_type' => 'template',
1005	]
1006	);
1007
1008	$this->add_control(
1009	'accordion_elements',
1010	[
1011	'label' => esc_html__('Accordion Elements', 'king-addons'),
1012	'type' => Controls_Manager::REPEATER,
1013	'fields' => $repeater->get_controls(),
1014	'default' => [
1015	[
1016	'element_select' => 'title',
1017	],
1018	[
1019	'element_select' => 'description',
1020	'element_display' => 'inline',
1021	],
1022	[
1023	'element_select' => 'button',
1024	],
1025	],
1026	'title_field' => '{{{ element_select.charAt(0).toUpperCase() + element_select.slice(1) }}}',
1027	]
1028	);
1029
1030	$this->end_controls_section();
1031
1032
1033	$this->start_controls_section(
1034	'section_image_overlay',
1035	[
1036	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Media Overlay', 'king-addons'),
1037	'tab' => Controls_Manager::TAB_CONTENT,
1038	]
1039	);
1040
1041	$this->add_responsive_control(
1042	'overlay_width',
1043	[
1044	'label' => esc_html__('Overlay Width', 'king-addons'),
1045	'type' => Controls_Manager::SLIDER,
1046	'size_units' => ['%', 'px'],
1047	'default' => [
1048	'unit' => '%',
1049	'size' => 100,
1050	],
1051	'range' => [
1052	'%' => [
1053	'min' => 0,
1054	'max' => 100,
1055	],
1056	'px' => [
1057	'min' => 0,
1058	'max' => 500,
1059	],
1060	],
1061	'selectors' => [
1062	'{{WRAPPER}} .king-addons-img-accordion-hover-bg' => 'width: {{SIZE}}{{UNIT}};top:calc((100% - {{overlay_height.SIZE}}{{overlay_height.UNIT}})/2);left:calc((100% - {{SIZE}}{{UNIT}})/2);',
1063	'{{WRAPPER}} .king-addons-img-accordion-hover-bg[class*="-top"]' => 'top:calc((100% - {{overlay_height.SIZE}}{{overlay_height.UNIT}})/2);left:calc((100% - {{SIZE}}{{UNIT}})/2);',
1064	'{{WRAPPER}} .king-addons-img-accordion-hover-bg[class*="-bottom"]' => 'bottom:calc((100% - {{overlay_height.SIZE}}{{overlay_height.UNIT}})/2);left:calc((100% - {{SIZE}}{{UNIT}})/2);',
1065	'{{WRAPPER}} .king-addons-img-accordion-hover-bg[class*="-right"]' => 'top:calc((100% - {{overlay_height.SIZE}}{{overlay_height.UNIT}})/2);right:calc((100% - {{SIZE}}{{UNIT}})/2);',
1066	'{{WRAPPER}} .king-addons-img-accordion-hover-bg[class*="-left"]' => 'top:calc((100% - {{overlay_height.SIZE}}{{overlay_height.UNIT}})/2);left:calc((100% - {{SIZE}}{{UNIT}})/2);',
1067	],
1068	]
1069	);
1070
1071	$this->add_responsive_control(
1072	'overlay_height',
1073	[
1074	'label' => esc_html__('Overlay Height', 'king-addons'),
1075	'type' => Controls_Manager::SLIDER,
1076	'size_units' => ['%', 'px'],
1077	'default' => [
1078	'unit' => '%',
1079	'size' => 100,
1080	],
1081	'range' => [
1082	'%' => [
1083	'min' => 0,
1084	'max' => 100,
1085	],
1086	'px' => [
1087	'min' => 0,
1088	'max' => 500,
1089	],
1090	],
1091	'selectors' => [
1092	'{{WRAPPER}} .king-addons-img-accordion-hover-bg' => 'height: {{SIZE}}{{UNIT}};top:calc((100% - {{SIZE}}{{UNIT}})/2);left:calc((100% - {{overlay_width.SIZE}}{{overlay_width.UNIT}})/2);',
1093	'{{WRAPPER}} .king-addons-img-accordion-hover-bg[class*="-top"]' => 'top:calc((100% - {{SIZE}}{{UNIT}})/2);left:calc((100% - {{overlay_width.SIZE}}{{overlay_width.UNIT}})/2);',
1094	'{{WRAPPER}} .king-addons-img-accordion-hover-bg[class*="-bottom"]' => 'bottom:calc((100% - {{SIZE}}{{UNIT}})/2);left:calc((100% - {{overlay_width.SIZE}}{{overlay_width.UNIT}})/2);',
1095	'{{WRAPPER}} .king-addons-img-accordion-hover-bg[class*="-right"]' => 'top:calc((100% - {{SIZE}}{{UNIT}})/2);right:calc((100% - {{overlay_width.SIZE}}{{overlay_width.UNIT}})/2);',
1096	'{{WRAPPER}} .king-addons-img-accordion-hover-bg[class*="-left"]' => 'top:calc((100% - {{SIZE}}{{UNIT}})/2);left:calc((100% - {{overlay_width.SIZE}}{{overlay_width.UNIT}})/2);',
1097	],
1098	'separator' => 'after',
1099	]
1100	);
1101
1102	$this->add_control(
1103	'overlay_animation',
1104	[
1105	'label' => esc_html__('Select Animation', 'king-addons'),
1106	'type' => 'king-addons-animations-alt',
1107	'default' => 'fade-in',
1108	]
1109	);
1110
1111
1112	Core::renderUpgradeProNotice($this, Controls_Manager::RAW_HTML, 'image-accordion', 'overlay_animation', ['pro-slrt', 'pro-slxrt', 'pro-slbt', 'pro-sllt', 'pro-sltp', 'pro-slxlt', 'pro-sktp', 'pro-skrt', 'pro-skbt', 'pro-sklt', 'pro-scup', 'pro-scdn', 'pro-rllt', 'pro-rlrt']);
1113
1114	$this->add_control(
1115	'overlay_animation_duration',
1116	[
1117	'label' => esc_html__('Animation Duration', 'king-addons'),
1118	'type' => Controls_Manager::NUMBER,
1119	'default' => 0.3,
1120	'min' => 0,
1121	'max' => 5,
1122	'step' => 0.1,
1123	'selectors' => [
1124	'{{WRAPPER}} .king-addons-img-accordion-hover-bg' => 'transition-duration: {{VALUE}}s;'
1125	],
1126	'condition' => [
1127	'overlay_animation!' => 'none',
1128	],
1129	]
1130	);
1131
1132	$this->add_control(
1133	'overlay_animation_delay',
1134	[
1135	'label' => esc_html__('Animation Delay', 'king-addons'),
1136	'type' => Controls_Manager::NUMBER,
1137	'default' => 0,
1138	'min' => 0,
1139	'max' => 5,
1140	'step' => 0.1,
1141	'selectors' => [
1142	'{{WRAPPER}} .king-addons-animation-wrap:hover .king-addons-img-accordion-hover-bg' => 'transition-delay: {{VALUE}}s;'
1143	],
1144	'condition' => [
1145	'overlay_animation!' => 'none',
1146	],
1147	]
1148	);
1149
1150	$this->add_control(
1151	'overlay_animation_timing',
1152	[
1153	'label' => esc_html__('Animation Timing', 'king-addons'),
1154	'type' => Controls_Manager::SELECT,
1155	'options' => Core::getAnimationTimings(),
1156	'default' => 'ease-default',
1157	'condition' => [
1158	'overlay_animation!' => 'none',
1159	],
1160	]
1161	);
1162
1163
1164	Core::renderUpgradeProNotice($this, Controls_Manager::RAW_HTML, 'image accordion', 'overlay_animation_timing', Core::getAnimationTimingsConditionsPro());
1165
1166	$this->add_control(
1167	'overlay_animation_size',
1168	[
1169	'label' => esc_html__('Animation Size', 'king-addons'),
1170	'type' => Controls_Manager::SELECT,
1171	'options' => [
1172	'small' => esc_html__('Small', 'king-addons'),
1173	'medium' => esc_html__('Medium', 'king-addons'),
1174	'large' => esc_html__('Large', 'king-addons'),
1175	],
1176	'default' => 'large',
1177	'condition' => [
1178	'overlay_animation!' => 'none',
1179	],
1180	]
1181	);
1182
1183	$this->add_control(
1184	'overlay_animation_tr',
1185	[
1186	'label' => esc_html__('Animation Transparency', 'king-addons'),
1187	'type' => Controls_Manager::SWITCHER,
1188	'default' => 'yes',
1189	'return_value' => 'yes',
1190	'condition' => [
1191	'overlay_animation!' => 'none',
1192	],
1193	]
1194	);
1195
1196	$this->end_controls_section();
1197
1198
1199	$this->start_controls_section(
1200	'section_image_effects',
1201	[
1202	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Image Effects', 'king-addons'),
1203	'tab' => Controls_Manager::TAB_CONTENT,
1204	]
1205	);
1206
1207	$this->add_control_image_effects();
1208
1209
1210	Core::renderUpgradeProNotice($this, Controls_Manager::RAW_HTML, 'image-accordion', 'image_effects', ['pro-zi', 'pro-zo', 'pro-go', 'pro-bo']);
1211
1212	$this->add_control(
1213	'image_effects_duration',
1214	[
1215	'label' => esc_html__('Animation Duration', 'king-addons'),
1216	'type' => Controls_Manager::NUMBER,
1217	'default' => 0.5,
1218	'min' => 0,
1219	'max' => 5,
1220	'step' => 0.1,
1221	'selectors' => [
1222	'{{WRAPPER}} .king-addons-image-accordion-item .king-addons-accordion-background' => 'transition-duration: {{VALUE}}s;'
1223	],
1224	'condition' => [
1225	'image_effects!' => 'none',
1226	],
1227	]
1228	);
1229
1230	$this->add_control(
1231	'image_effects_delay',
1232	[
1233	'label' => esc_html__('Animation Delay', 'king-addons'),
1234	'type' => Controls_Manager::NUMBER,
1235	'default' => 0,
1236	'min' => 0,
1237	'max' => 5,
1238	'step' => 0.1,
1239	'selectors' => [
1240	'{{WRAPPER}} .king-addons-image-accordion-item:hover>div' => 'transition-delay: {{VALUE}}s;'
1241	],
1242	'condition' => [
1243	'image_effects!' => 'none',
1244	],
1245	]
1246	);
1247
1248	$this->add_control(
1249	'image_effects_animation_timing',
1250	[
1251	'label' => esc_html__('Animation Timing', 'king-addons'),
1252	'type' => Controls_Manager::SELECT,
1253	'options' => Core::getAnimationTimings(),
1254	'default' => 'ease-default',
1255	'condition' => [
1256	'image_effects!' => 'none',
1257	],
1258	]
1259	);
1260
1261
1262	Core::renderUpgradeProNotice($this, Controls_Manager::RAW_HTML, 'image-accordion', 'image_effects_animation_timing', Core::getAnimationTimingsConditionsPro());
1263
1264	$this->add_control(
1265	'image_effects_size',
1266	[
1267	'label' => esc_html__('Animation Size', 'king-addons'),
1268	'type' => Controls_Manager::SELECT,
1269	'options' => [
1270	'small' => esc_html__('Small', 'king-addons'),
1271	'medium' => esc_html__('Medium', 'king-addons'),
1272	'large' => esc_html__('Large', 'king-addons'),
1273	],
1274	'default' => 'medium',
1275	'condition' => [
1276	'image_effects!' => ['none', 'slide'],
1277	]
1278	]
1279	);
1280
1281	$this->add_control(
1282	'image_effects_direction',
1283	[
1284	'label' => esc_html__('Animation Direction', 'king-addons'),
1285	'type' => Controls_Manager::SELECT,
1286	'options' => [
1287	'top' => esc_html__('Top', 'king-addons'),
1288	'right' => esc_html__('Right', 'king-addons'),
1289	'bottom' => esc_html__('Bottom', 'king-addons'),
1290	'left' => esc_html__('Left', 'king-addons'),
1291	],
1292	'default' => 'bottom',
1293	'condition' => [
1294	'image_effects!' => 'none',
1295	'image_effects' => 'slide'
1296	]
1297	]
1298	);
1299
1300	$this->end_controls_section();
1301
1302	$this->add_section_lightbox_popup();
1303
1304
1305	Core::renderProFeaturesSection($this, '', Controls_Manager::RAW_HTML, 'image-accordion', [
1306	'Add Unlimited Images',
1307	'Trigger Images on Click',
1308	'Enable Image Lightbox',
1309	'Vertical Accordion Layout',
1310	'Image Effects: Zoom, Grayscale, Blur',
1311	'Image Overlay Blend Mode',
1312	'Skew Images by Default',
1313	'Advanced Elements Positioning'
1314	]);
1315
1316
1317	$this->start_controls_section(
1318	'section_style_overlay',
1319	[
1320	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Media Overlay', 'king-addons'),
1321	'tab' => Controls_Manager::TAB_STYLE,
1322	'show_label' => false,
1323	]
1324	);
1325
1326	$this->add_control_overlay_color();
1327
1328	$this->add_control_overlay_blend_mode();
1329
1330	$this->add_group_control(
1331	Group_Control_Box_Shadow::get_type(),
1332	[
1333	'name' => 'btn_box_shadow_1',
1334	'selector' => '{{WRAPPER}} .king-addons-image-accordion-item',
1335	]
1336	);
1337
1338	$this->add_control(
1339	'overlay_radius',
1340	[
1341	'label' => esc_html__('Border Radius', 'king-addons'),
1342	'type' => Controls_Manager::DIMENSIONS,
1343	'size_units' => ['px', '%'],
1344	'default' => [
1345	'top' => 0,
1346	'right' => 0,
1347	'bottom' => 0,
1348	'left' => 0,
1349	],
1350	'selectors' => [
1351	'{{WRAPPER}} .king-addons-img-accordion-hover-bg' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1352	],
1353	'separator' => 'before',
1354	]
1355	);
1356
1357	$this->end_controls_section();
1358
1359
1360	$this->start_controls_section(
1361	'section_style_title',
1362	[
1363	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Title', 'king-addons'),
1364	'tab' => Controls_Manager::TAB_STYLE,
1365	'show_label' => false,
1366	]
1367	);
1368
1369
1370	$this->add_control(
1371	'title_color',
1372	[
1373	'label' => esc_html__('Color', 'king-addons'),
1374	'type' => Controls_Manager::COLOR,
1375	'default' => '#FFFFFF',
1376	'selectors' => [
1377	'{{WRAPPER}} .king-addons-img-accordion-item-title .inner-block a' => 'color: {{VALUE}}',
1378	],
1379	]
1380	);
1381
1382	$this->add_control(
1383	'title_bg_color',
1384	[
1385	'label' => esc_html__('Background Color', 'king-addons'),
1386	'type' => Controls_Manager::COLOR,
1387	'selectors' => [
1388	'{{WRAPPER}} .king-addons-img-accordion-item-title .inner-block a' => 'background-color: {{VALUE}}',
1389	]
1390	]
1391	);
1392
1393	$this->add_control(
1394	'title_border_color',
1395	[
1396	'label' => esc_html__('Border Color', 'king-addons'),
1397	'type' => Controls_Manager::COLOR,
1398	'default' => '#E8E8E8',
1399	'selectors' => [
1400	'{{WRAPPER}} .king-addons-img-accordion-item-title .inner-block a' => 'border-color: {{VALUE}}',
1401	],
1402	]
1403	);
1404
1405	$this->add_group_control(
1406	Group_Control_Typography::get_type(),
1407	[
1408	'name' => 'title_typography',
1409	'selector' => '{{WRAPPER}} .king-addons-img-accordion-item-title a'
1410	]
1411	);
1412
1413	$this->add_control(
1414	'title_transition_duration',
1415	[
1416	'label' => esc_html__('Transition Duration (seconds)', 'king-addons'),
1417	'type' => Controls_Manager::NUMBER,
1418	'default' => 0.2,
1419	'min' => 0,
1420	'max' => 5,
1421	'step' => 0.1,
1422	'selectors' => [
1423	'{{WRAPPER}} .king-addons-img-accordion-item-title .inner-block a' => 'transition-duration: {{VALUE}}s',
1424	'{{WRAPPER}} .king-addons-img-accordion-item-title .king-addons-pointer-item:before' => 'transition-duration: {{VALUE}}s',
1425	'{{WRAPPER}} .king-addons-img-accordion-item-title .king-addons-pointer-item:after' => 'transition-duration: {{VALUE}}s',
1426	],
1427	]
1428	);
1429
1430	$this->add_control(
1431	'title_border_type',
1432	[
1433	'label' => esc_html__('Border Type', 'king-addons'),
1434	'type' => Controls_Manager::SELECT,
1435	'options' => [
1436	'none' => esc_html__('None', 'king-addons'),
1437	'solid' => esc_html__('Solid', 'king-addons'),
1438	'double' => esc_html__('Double', 'king-addons'),
1439	'dotted' => esc_html__('Dotted', 'king-addons'),
1440	'dashed' => esc_html__('Dashed', 'king-addons'),
1441	'groove' => esc_html__('Groove', 'king-addons'),
1442	],
1443	'default' => 'none',
1444	'selectors' => [
1445	'{{WRAPPER}} .king-addons-img-accordion-item-title .inner-block a' => 'border-style: {{VALUE}};',
1446	],
1447	'render_type' => 'template',
1448	'separator' => 'before',
1449	]
1450	);
1451
1452	$this->add_control(
1453	'title_border_width',
1454	[
1455	'label' => esc_html__('Border Width', 'king-addons'),
1456	'type' => Controls_Manager::DIMENSIONS,
1457	'size_units' => ['px'],
1458	'default' => [
1459	'top' => 1,
1460	'right' => 1,
1461	'bottom' => 1,
1462	'left' => 1,
1463	],
1464	'selectors' => [
1465	'{{WRAPPER}} .king-addons-img-accordion-item-title .inner-block a' => 'border-width: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1466	],
1467	'render_type' => 'template',
1468	'condition' => [
1469	'title_border_type!' => 'none',
1470	],
1471	]
1472	);
1473
1474	$this->add_responsive_control(
1475	'title_padding',
1476	[
1477	'label' => esc_html__('Padding', 'king-addons'),
1478	'type' => Controls_Manager::DIMENSIONS,
1479	'size_units' => ['px', '%'],
1480	'default' => [
1481	'top' => 0,
1482	'right' => 0,
1483	'bottom' => 0,
1484	'left' => 0,
1485	],
1486	'selectors' => [
1487	'{{WRAPPER}} .king-addons-img-accordion-item-title .inner-block a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1488	],
1489	'render_type' => 'template',
1490	'separator' => 'before',
1491	]
1492	);
1493
1494	$this->add_responsive_control(
1495	'title_margin',
1496	[
1497	'label' => esc_html__('Margin', 'king-addons'),
1498	'type' => Controls_Manager::DIMENSIONS,
1499	'size_units' => ['px', '%'],
1500	'default' => [
1501	'top' => 0,
1502	'right' => 0,
1503	'bottom' => 0,
1504	'left' => 0,
1505	],
1506	'selectors' => [
1507	'{{WRAPPER}} .king-addons-img-accordion-item-title .inner-block' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1508	],
1509	'render_type' => 'template',
1510	]
1511	);
1512
1513	$this->end_controls_section();
1514
1515
1516	$this->start_controls_section(
1517	'section_style_description',
1518	[
1519	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Description', 'king-addons'),
1520	'tab' => Controls_Manager::TAB_STYLE,
1521	'show_label' => false,
1522	]
1523	);
1524
1525	$this->add_control(
1526	'description_color',
1527	[
1528	'label' => esc_html__('Color', 'king-addons'),
1529	'type' => Controls_Manager::COLOR,
1530	'default' => '#DDDDDD',
1531	'selectors' => [
1532	'{{WRAPPER}} .king-addons-img-accordion-item-description .inner-block' => 'color: {{VALUE}}',
1533	],
1534	]
1535	);
1536
1537	$this->add_control(
1538	'description_bg_color',
1539	[
1540	'label' => esc_html__('Background Color', 'king-addons'),
1541	'type' => Controls_Manager::COLOR,
1542	'selectors' => [
1543	'{{WRAPPER}} .king-addons-img-accordion-item-description .inner-block' => 'background-color: {{VALUE}}',
1544	]
1545	]
1546	);
1547
1548	$this->add_control(
1549	'description_border_color',
1550	[
1551	'label' => esc_html__('Border Color', 'king-addons'),
1552	'type' => Controls_Manager::COLOR,
1553	'default' => '#E8E8E8',
1554	'selectors' => [
1555	'{{WRAPPER}} .king-addons-img-accordion-item-description .inner-block' => 'border-color: {{VALUE}}',
1556	],
1557	]
1558	);
1559
1560	$this->add_group_control(
1561	Group_Control_Typography::get_type(),
1562	[
1563	'name' => 'description_typography',
1564	'selector' => '{{WRAPPER}} .king-addons-img-accordion-item-description'
1565	]
1566	);
1567
1568	$this->add_responsive_control(
1569	'description_width',
1570	[
1571	'label' => esc_html__('Description Width', 'king-addons'),
1572	'type' => Controls_Manager::SLIDER,
1573	'size_units' => ['%'],
1574	'range' => [
1575	'%' => [
1576	'min' => 10,
1577	'max' => 100,
1578	],
1579	],
1580	'default' => [
1581	'unit' => '%',
1582	'size' => 100,
1583	],
1584	'selectors' => [
1585	'{{WRAPPER}} .king-addons-img-accordion-item-description .inner-block' => 'width: {{SIZE}}{{UNIT}};',
1586	],
1587	'separator' => 'before',
1588	]
1589	);
1590
1591	$this->add_control(
1592	'description_border_type',
1593	[
1594	'label' => esc_html__('Border Type', 'king-addons'),
1595	'type' => Controls_Manager::SELECT,
1596	'options' => [
1597	'none' => esc_html__('None', 'king-addons'),
1598	'solid' => esc_html__('Solid', 'king-addons'),
1599	'double' => esc_html__('Double', 'king-addons'),
1600	'dotted' => esc_html__('Dotted', 'king-addons'),
1601	'dashed' => esc_html__('Dashed', 'king-addons'),
1602	'groove' => esc_html__('Groove', 'king-addons'),
1603	],
1604	'default' => 'none',
1605	'selectors' => [
1606	'{{WRAPPER}} .king-addons-img-accordion-item-description .inner-block' => 'border-style: {{VALUE}};',
1607	],
1608	'render_type' => 'template',
1609	'separator' => 'before',
1610	]
1611	);
1612
1613	$this->add_control(
1614	'description_border_width',
1615	[
1616	'label' => esc_html__('Border Width', 'king-addons'),
1617	'type' => Controls_Manager::DIMENSIONS,
1618	'size_units' => ['px'],
1619	'default' => [
1620	'top' => 1,
1621	'right' => 1,
1622	'bottom' => 1,
1623	'left' => 1,
1624	],
1625	'selectors' => [
1626	'{{WRAPPER}} .king-addons-img-accordion-item-description .inner-block' => 'border-width: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1627	],
1628	'render_type' => 'template',
1629	'condition' => [
1630	'description_border_type!' => 'none',
1631	],
1632	]
1633	);
1634
1635	$this->add_responsive_control(
1636	'description_padding',
1637	[
1638	'label' => esc_html__('Padding', 'king-addons'),
1639	'type' => Controls_Manager::DIMENSIONS,
1640	'size_units' => ['px', '%'],
1641	'default' => [
1642	'top' => 0,
1643	'right' => 0,
1644	'bottom' => 0,
1645	'left' => 0,
1646	],
1647	'selectors' => [
1648	'{{WRAPPER}} .king-addons-img-accordion-item-description .inner-block' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1649	],
1650	'render_type' => 'template',
1651	'separator' => 'before',
1652	]
1653	);
1654
1655	$this->add_responsive_control(
1656	'description_margin',
1657	[
1658	'label' => esc_html__('Margin', 'king-addons'),
1659	'type' => Controls_Manager::DIMENSIONS,
1660	'size_units' => ['px', '%'],
1661	'default' => [
1662	'top' => 0,
1663	'right' => 0,
1664	'bottom' => 0,
1665	'left' => 0,
1666	],
1667	'render_type' => 'template',
1668	'selectors' => [
1669	'{{WRAPPER}} .king-addons-img-accordion-item-description .inner-block' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1670	],
1671	]
1672	);
1673
1674	$this->end_controls_section();
1675
1676
1677	$this->start_controls_section(
1678	'accordion_button_styles',
1679	[
1680	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Button', 'king-addons'),
1681
1682	'tab' => Controls_Manager::TAB_STYLE,
1683	]
1684	);
1685
1686	$this->start_controls_tabs('tabs_accordion_button_style');
1687
1688	$this->start_controls_tab(
1689	'tab_accordion_button_normal',
1690	[
1691	'label' => esc_html__('Normal', 'king-addons'),
1692	]
1693	);
1694
1695	$this->add_group_control(
1696	Group_Control_Background::get_type(),
1697	[
1698	'name' => 'button_bg_color',
1699	'label' => esc_html__('Background', 'king-addons'),
1700	'types' => ['classic', 'gradient'],
1701	'fields_options' => [
1702	'background' => [
1703	'default' => 'classic',
1704	],
1705	'color' => [
1706	'default' => '#5B03FF',
1707	],
1708	],
1709	'selector' => '{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a'
1710	]
1711	);
1712
1713	$this->add_control(
1714	'button_color',
1715	[
1716	'label' => esc_html__('Color', 'king-addons'),
1717	'type' => Controls_Manager::COLOR,
1718	'default' => '#FFFFFF',
1719	'selectors' => [
1720	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a' => 'color: {{VALUE}}',
1721	],
1722	]
1723	);
1724
1725	$this->add_control(
1726	'button_border_color',
1727	[
1728	'label' => esc_html__('Border Color', 'king-addons'),
1729	'type' => Controls_Manager::COLOR,
1730	'default' => '#E8E8E8',
1731	'selectors' => [
1732	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a' => 'border-color: {{VALUE}}',
1733	],
1734	]
1735	);
1736
1737	$this->add_group_control(
1738	Group_Control_Typography::get_type(),
1739	[
1740	'name' => 'button_typography',
1741	'selector' => '{{WRAPPER}} .king-addons-img-accordion-item-button a'
1742	]
1743	);
1744
1745	$this->add_group_control(
1746	Group_Control_Box_Shadow::get_type(),
1747	[
1748	'name' => 'button_box_shadow',
1749	'selector' => '{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a',
1750	]
1751	);
1752
1753	$this->end_controls_tab();
1754
1755	$this->start_controls_tab(
1756	'tab_accordion_button_hover',
1757	[
1758	'label' => esc_html__('Hover', 'king-addons'),
1759	]
1760	);
1761
1762	$this->add_group_control(
1763	Group_Control_Background::get_type(),
1764	[
1765	'name' => 'button_bg_color_hr',
1766	'label' => esc_html__('Background', 'king-addons'),
1767	'types' => ['classic', 'gradient'],
1768	'fields_options' => [
1769	'color' => [
1770	'default' => '#000000',
1771	],
1772	'background' => [
1773	'default' => 'classic',
1774	]
1775	],
1776	'selector' => '{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a.king-addons-button-none:hover, {{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a:before, {{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a:after'
1777	]
1778	);
1779
1780	$this->add_control(
1781	'button_color_hr',
1782	[
1783	'label' => esc_html__('Color', 'king-addons'),
1784	'type' => Controls_Manager::COLOR,
1785	'selectors' => [
1786	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a:hover' => 'color: {{VALUE}}',
1787	],
1788	]
1789	);
1790
1791	$this->add_control(
1792	'button_border_color_hr',
1793	[
1794	'label' => esc_html__('Border Color', 'king-addons'),
1795	'type' => Controls_Manager::COLOR,
1796	'default' => '#E8E8E8',
1797	'selectors' => [
1798	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a:hover' => 'border-color: {{VALUE}}',
1799	]
1800	]
1801	);
1802
1803	$this->add_group_control(
1804	Group_Control_Box_Shadow::get_type(),
1805	[
1806	'name' => 'button_box_shadow_hr',
1807	'selector' => '{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block :hover a',
1808	]
1809	);
1810
1811	$this->end_controls_tab();
1812
1813	$this->end_controls_tabs();
1814
1815	$this->add_control(
1816	'button_divider',
1817	[
1818	'type' => Controls_Manager::DIVIDER,
1819	'style' => 'thick',
1820	]
1821	);
1822
1823	$this->add_control_button_animation();
1824
1825	$this->add_control(
1826	'button_transition_duration',
1827	[
1828	'label' => esc_html__('Transition Duration (ms)', 'king-addons'),
1829	'type' => Controls_Manager::NUMBER,
1830	'default' => 300,
1831	'min' => 0,
1832	'step' => 50,
1833	'selectors' => [
1834	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a' => 'transition-duration: {{VALUE}}ms',
1835	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a:before' => 'transition-duration: {{VALUE}}ms',
1836	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a:after' => 'transition-duration: {{VALUE}}ms',
1837	],
1838	]
1839	);
1840
1841	$this->add_control_button_animation_height();
1842
1843	if (!king_addons_freemius()->can_use_premium_code__premium_only()) {
1844	$this->add_control(
1845	'team_member_pro_notice_2',
1846	[
1847	'type' => Controls_Manager::RAW_HTML,
1848	'raw' => 'Advanced button animations are available in the <strong><a href="https://kingaddons.com/pricing/?utm_source=kng-module-image-accordion-settings-upgrade-pro&utm_medium=plugin&utm_campaign=kng" target="_blank">Pro version</a></strong>',
1849	'content_classes' => 'king-addons-pro-notice',
1850	]
1851	);
1852	}
1853
1854	$this->add_control(
1855	'button_border_type',
1856	[
1857	'label' => esc_html__('Border Type', 'king-addons'),
1858	'type' => Controls_Manager::SELECT,
1859	'options' => [
1860	'none' => esc_html__('None', 'king-addons'),
1861	'solid' => esc_html__('Solid', 'king-addons'),
1862	'double' => esc_html__('Double', 'king-addons'),
1863	'dotted' => esc_html__('Dotted', 'king-addons'),
1864	'dashed' => esc_html__('Dashed', 'king-addons'),
1865	'groove' => esc_html__('Groove', 'king-addons'),
1866	],
1867	'default' => 'none',
1868	'selectors' => [
1869	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a' => 'border-style: {{VALUE}};',
1870	],
1871	'render_type' => 'template',
1872	'separator' => 'before',
1873	]
1874	);
1875
1876	$this->add_control(
1877	'button_border_width',
1878	[
1879	'label' => esc_html__('Border Width', 'king-addons'),
1880	'type' => Controls_Manager::DIMENSIONS,
1881	'size_units' => ['px'],
1882	'default' => [
1883	'top' => 1,
1884	'right' => 1,
1885	'bottom' => 1,
1886	'left' => 1,
1887	],
1888	'selectors' => [
1889	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a' => 'border-width: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1890	],
1891	'render_type' => 'template',
1892	'condition' => [
1893	'button_border_type!' => 'none',
1894	],
1895	]
1896	);
1897
1898	$this->add_control(
1899	'button_icon_spacing',
1900	[
1901	'label' => esc_html__('Extra Icon Spacing', 'king-addons'),
1902	'type' => Controls_Manager::SLIDER,
1903	'size_units' => ['px'],
1904	'range' => [
1905	'px' => [
1906	'min' => 0,
1907	'max' => 25,
1908	],
1909	],
1910	'default' => [
1911	'unit' => 'px',
1912	'size' => 5,
1913	],
1914	'selectors' => [
1915	'{{WRAPPER}} .king-addons-img-accordion-item-button .king-addons-img-accordion-extra-icon-left' => 'padding-right: {{SIZE}}{{UNIT}};',
1916	'{{WRAPPER}} .king-addons-img-accordion-item-button .king-addons-img-accordion-extra-icon-right' => 'padding-left: {{SIZE}}{{UNIT}};',
1917	],
1918	'separator' => 'before'
1919	]
1920	);
1921
1922	$this->add_responsive_control(
1923	'button_padding',
1924	[
1925	'label' => esc_html__('Padding', 'king-addons'),
1926	'type' => Controls_Manager::DIMENSIONS,
1927	'size_units' => ['px', '%'],
1928	'default' => [
1929	'top' => 7,
1930	'right' => 18,
1931	'bottom' => 8,
1932	'left' => 18,
1933	],
1934	'selectors' => [
1935	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1936	],
1937	'render_type' => 'template',
1938	'separator' => 'before',
1939	]
1940	);
1941
1942	$this->add_responsive_control(
1943	'button_margin',
1944	[
1945	'label' => esc_html__('Margin', 'king-addons'),
1946	'type' => Controls_Manager::DIMENSIONS,
1947	'size_units' => ['px', '%'],
1948	'default' => [
1949	'top' => 15,
1950	'right' => 0,
1951	'bottom' => 0,
1952	'left' => 0,
1953	],
1954	'selectors' => [
1955	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1956	],
1957	'render_type' => 'template',
1958	]
1959	);
1960
1961	$this->add_control(
1962	'button_radius',
1963	[
1964	'label' => esc_html__('Border Radius', 'king-addons'),
1965	'type' => Controls_Manager::DIMENSIONS,
1966	'size_units' => ['px', '%'],
1967	'default' => [
1968	'top' => 3,
1969	'right' => 3,
1970	'bottom' => 3,
1971	'left' => 3,
1972	],
1973	'selectors' => [
1974	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1975	'{{WRAPPER}} .king-addons-img-accordion-item-button .inner-block a:before' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1976	],
1977	'separator' => 'before',
1978	]
1979	);
1980
1981	$this->end_controls_section();
1982
1983	$this->add_section_lightbox_styles();
1984
1985
1986	$this->start_controls_section(
1987	'section_style_separator2',
1988	[
1989	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Separator', 'king-addons'),
1990	'tab' => Controls_Manager::TAB_STYLE,
1991	'show_label' => false,
1992	]
1993	);
1994
1995	$this->add_control(
1996	'separator2_color',
1997	[
1998	'label' => esc_html__('Color', 'king-addons'),
1999	'type' => Controls_Manager::COLOR,
2000	'default' => '#5B03FF',
2001	'selectors' => [
2002	'{{WRAPPER}} .king-addons-img-accordion-sep-style-2 .inner-block > span' => 'border-bottom-color: {{VALUE}}',
2003	],
2004	]
2005	);
2006
2007	$this->add_control(
2008	'separator2_width',
2009	[
2010	'label' => esc_html__('Width', 'king-addons'),
2011	'type' => Controls_Manager::SLIDER,
2012	'size_units' => ['px', '%'],
2013	'range' => [
2014	'px' => [
2015	'min' => 0,
2016	'max' => 300,
2017	],
2018	'%' => [
2019	'min' => 0,
2020	'max' => 100,
2021	],
2022	],
2023	'default' => [
2024	'unit' => '%',
2025	'size' => 20,
2026	],
2027	'selectors' => [
2028	'{{WRAPPER}} .king-addons-img-accordion-sep-style-2:not(.king-addons-img-accordion-item-display-inline) .inner-block > span' => 'width: {{SIZE}}{{UNIT}};',
2029	'{{WRAPPER}} .king-addons-img-accordion-sep-style-2.king-addons-img-accordion-item-display-inline' => 'width: {{SIZE}}{{UNIT}};',
2030	],
2031	'render_type' => 'template',
2032	'separator' => 'before',
2033	]
2034	);
2035
2036	$this->add_control(
2037	'separator2_height',
2038	[
2039	'label' => esc_html__('Height', 'king-addons'),
2040	'type' => Controls_Manager::SLIDER,
2041	'size_units' => ['px'],
2042	'range' => [
2043	'px' => [
2044	'min' => 0,
2045	'max' => 100,
2046	],
2047	],
2048	'default' => [
2049	'unit' => 'px',
2050	'size' => 2,
2051	],
2052	'selectors' => [
2053	'{{WRAPPER}} .king-addons-img-accordion-sep-style-2 .inner-block > span' => 'border-bottom-width: {{SIZE}}{{UNIT}};',
2054	],
2055	'render_type' => 'template',
2056	]
2057	);
2058
2059	$this->add_control(
2060	'separator2_border_type',
2061	[
2062	'label' => esc_html__('Type', 'king-addons'),
2063	'type' => Controls_Manager::SELECT,
2064	'options' => [
2065	'solid' => esc_html__('Solid', 'king-addons'),
2066	'double' => esc_html__('Double', 'king-addons'),
2067	'dotted' => esc_html__('Dotted', 'king-addons'),
2068	'dashed' => esc_html__('Dashed', 'king-addons'),
2069	'groove' => esc_html__('Groove', 'king-addons'),
2070	],
2071	'default' => 'solid',
2072	'selectors' => [
2073	'{{WRAPPER}} .king-addons-img-accordion-sep-style-2 .inner-block > span' => 'border-bottom-style: {{VALUE}};',
2074	],
2075	'separator' => 'before',
2076	]
2077	);
2078
2079	$this->add_responsive_control(
2080	'separator2_margin',
2081	[
2082	'label' => esc_html__('Margin', 'king-addons'),
2083	'type' => Controls_Manager::DIMENSIONS,
2084	'size_units' => ['px', '%'],
2085	'default' => [
2086	'top' => 15,
2087	'right' => 0,
2088	'bottom' => 15,
2089	'left' => 0,
2090	],
2091	'selectors' => [
2092	'{{WRAPPER}} .king-addons-img-accordion-sep-style-2 .inner-block' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2093	],
2094	'render_type' => 'template',
2095	]
2096	);
2097
2098	$this->add_control(
2099	'separator2_radius',
2100	[
2101	'label' => esc_html__('Border Radius', 'king-addons'),
2102	'type' => Controls_Manager::DIMENSIONS,
2103	'size_units' => ['px', '%'],
2104	'default' => [
2105	'top' => 0,
2106	'right' => 0,
2107	'bottom' => 0,
2108	'left' => 0,
2109	],
2110	'selectors' => [
2111	'{{WRAPPER}} .king-addons-img-accordion-sep-style-2 .inner-block > span' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2112	],
2113	'separator' => 'before',
2114	]
2115	);
2116
2117
2118
2119
2120	$this->end_controls_section();
2121
2122
2123	}
2124
2125
2126	public function get_elements_by_location($location, $settings, $item)
2127	{
2128	$premium = king_addons_freemius()->can_use_premium_code__premium_only();
2129	$locations = [];
2130	foreach ($settings['accordion_elements'] as $data) {
2131	$place = 'over';
2132	$align_vr = $premium ? $data['element_align_vr'] : 'middle';
2133	if (!isset($locations[$place])) $locations[$place] = [];
2134	if (!isset($locations[$place][$align_vr])) $locations[$place][$align_vr] = [];
2135	$locations[$place][$align_vr][] = $data;
2136	}
2137	if (!empty($locations[$location])) {
2138	if ('over' === $location) {
2139	foreach ($locations[$location] as $align => $elements) {
2140	if ('middle' === $align) echo '<div class="king-addons-cv-container"><div class="king-addons-cv-outer"><div class="king-addons-cv-inner">';
2141	echo '<div class="king-addons-img-accordion-media-hover-' . $align . ' elementor-clearfix">';
2142	foreach ($elements as $data) {
2143	$class = 'king-addons-img-accordion-item-' . $data['element_select'];
2144	$class .= ' elementor-repeater-item-' . $data['_id'];
2145	$class .= ' king-addons-img-accordion-item-display-' . $data['element_display'];
2146	$class .= $premium
2147	? ' king-addons-img-accordion-item-align-' . $data['element_align_hr']
2148	: ' king-addons-img-accordion-item-align-center';
2149	$class .= $this->get_animation_class($data, 'element');
2150	$this->get_elements($data['element_select'], $data, $class, $item);
2151	}
2152	echo '</div>';
2153	if ('middle' === $align) echo '</div></div></div>';
2154	}
2155	}
2156	}
2157	}
2158
2159	public function render_media_overlay($settings)
2160	{
2161	echo '<div class="king-addons-img-accordion-hover-bg ' . $this->get_animation_class($settings, 'overlay') . '"></div>';
2162	}
2163
2164	public function get_animation_class($data, $object)
2165	{
2166	$class = '';
2167	/** @noinspection DuplicatedCode */
2168	if ('none' !== $data[$object . '_animation']) {
2169	$class .= ' king-addons-' . $object . '-' . $data[$object . '_animation'];
2170	$class .= ' king-addons-anim-size-' . $data[$object . '_animation_size'];
2171	$class .= ' king-addons-animation-timing-' . $data[$object . '_animation_timing'];
2172	if ('yes' === $data[$object . '_animation_tr']) {
2173	$class .= ' king-addons-anim-transparency';
2174	}
2175	}
2176	return $class;
2177	}
2178
2179	public function render_repeater_title($settings, $class, $item)
2180	{
2181	if (!empty($item['accordion_item_title'])) {
2182	$tags_whitelist = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'div', 'span', 'p'];
2183	$element_title_tag = Core::validateHTMLTags($settings['element_title_tag'], 'h2', $tags_whitelist);
2184	echo '<' . $element_title_tag . ' class="' . esc_attr($class) . '">';
2185	echo '<div class="inner-block"><a class="king-addons-pointer-item">';
2186	echo $item['accordion_item_title'];
2187	echo '</a></div></' . $element_title_tag . '>';
2188	}
2189	}
2190
2191	public function render_repeater_description($class, $item)
2192	{
2193	if ('' === $item['accordion_item_description']) return;
2194	echo '<div class="' . esc_attr($class) . '"><div class="inner-block"><p>' . $item['accordion_item_description'] . '</p></div></div>';
2195	}
2196
2197	public function render_repeater_button($settings, $class, $item)
2198	{
2199	echo '<div class="' . esc_attr($class) . '"><div class="inner-block">';
2200	echo '<a ' . $this->get_render_attribute_string('accordion_btn_url' . $item['_id']) . ' class="king-addons-button-effect ' . $this->get_settings_for_display()['button_animation'] . '">';
2201	if ('before' === $settings['element_extra_icon_pos']) {
2202	echo '<i class="king-addons-img-accordion-extra-icon-left ' . esc_attr($settings['element_extra_icon']['value']) . '"></i>';
2203	}
2204	echo '<span>' . esc_html($item['element_button_text']) . '</span>';
2205	if ('after' === $settings['element_extra_icon_pos']) {
2206	echo '<i class="king-addons-img-accordion-extra-icon-right ' . esc_attr($settings['element_extra_icon']['value']) . '"></i>';
2207	}
2208	echo '</a></div></div>';
2209	}
2210
2211	public function render_repeater_separator($class)
2212	{
2213	echo '<div class="' . esc_attr($class) . ' king-addons-img-accordion-sep-style-2"><div class="inner-block"><span></span></div></div>';
2214	}
2215
2216	public function render_repeater_lightbox($settings, $class, $item)
2217	{
2218	echo '<div class="' . esc_attr($class) . '"><div class="inner-block">';
2219	$lightbox_source = $this->item_bg_image_url;
2220	echo '<div style="opacity:0;" class="king-addons-accordion-image-wrap" data-src="' . esc_attr($lightbox_source) . '">';
2221	echo '<img src="' . esc_url($lightbox_source) . '" alt="' . esc_attr($item['accordion_item_title']) . '"></div>';
2222	echo '<span data-src="' . esc_url($lightbox_source) . '">';
2223	if ('before' === $settings['element_extra_text_pos']) {
2224	echo '<span class="king-addons-img-accordion-extra-text-left">' . esc_html($settings['element_extra_text']) . '</span>';
2225	}
2226	if (!empty($settings['element_lightbox_icon'])) {
2227	echo '<i class="' . esc_attr($settings['element_lightbox_icon']['value']) . '"></i>';
2228	}
2229	if ('after' === $settings['element_extra_text_pos']) {
2230	echo '<span class="king-addons-img-accordion-extra-text-right">' . esc_html($settings['element_extra_text']) . '</span>';
2231	}
2232	echo '</span></div></div>';
2233	}
2234
2235	public function get_elements($type, $settings, $class, $item)
2236	{
2237	switch ($type) {
2238	case 'title':
2239	$this->render_repeater_title($settings, $class, $item);
2240	break;
2241	case 'description':
2242	$this->render_repeater_description($class, $item);
2243	break;
2244	case 'button':
2245	$this->render_repeater_button($settings, $class, $item);
2246	break;
2247	case 'lightbox':
2248	$this->render_repeater_lightbox($settings, $class, $item);
2249	break;
2250	case 'separator':
2251	$this->render_repeater_separator($class);
2252	break;
2253	default:
2254	break;
2255	}
2256	}
2257
2258	public function get_image_effect_class($settings)
2259	{
2260	$premium = king_addons_freemius()->can_use_premium_code__premium_only();
2261	if (!$premium) {
2262	if (in_array($settings['image_effects'], ['pro-zi', 'pro-zo', 'pro-go', 'pro-bo'])) {
2263	$settings['image_effects'] = 'none';
2264	}
2265	}
2266	$class = '';
2267	/** @noinspection DuplicatedCode */
2268	if ('none' !== $settings['image_effects']) {
2269	$class .= ' king-addons-' . $settings['image_effects'];
2270	}
2271	if ('slide' !== $settings['image_effects']) {
2272	$class .= ' king-addons-effect-size-' . $settings['image_effects_size'];
2273	} else {
2274	$class .= ' king-addons-effect-dir-' . $settings['image_effects_direction'];
2275	}
2276	return $class;
2277	}
2278
2279	protected function render()
2280	{
2281	$premium = king_addons_freemius()->can_use_premium_code__premium_only();
2282	$settings = $this->get_settings_for_display();
2283	if (!$premium) {
2284	$settings['lightbox_popup_thumbnails'] = '';
2285	$settings['lightbox_popup_thumbnails_default'] = '';
2286	$settings['lightbox_popup_sharing'] = '';
2287	}
2288	if ($premium) {
2289	$lightbox_settings = [
2290	'selector' => '.king-addons-accordion-image-wrap',
2291	'iframeMaxWidth' => '60%',
2292	'hash' => false,
2293	'autoplay' => $settings['lightbox_popup_autoplay'],
2294	'pause' => $settings['lightbox_popup_pause'] * 1000,
2295	'progressBar' => $settings['lightbox_popup_progressbar'],
2296	'counter' => $settings['lightbox_popup_counter'],
2297	'controls' => $settings['lightbox_popup_arrows'],
2298	'getCaptionFromTitleOrAlt' => $settings['lightbox_popup_captions'],
2299	'thumbnail' => $settings['lightbox_popup_thumbnails'],
2300	'showThumbByDefault' => $settings['lightbox_popup_thumbnails_default'],
2301	'share' => $settings['lightbox_popup_sharing'],
2302	'zoom' => $settings['lightbox_popup_zoom'],
2303	'fullScreen' => $settings['lightbox_popup_fullscreen'],
2304	'download' => $settings['lightbox_popup_download']
2305	];
2306	$this->add_render_attribute('lightbox-settings', ['lightbox' => wp_json_encode($lightbox_settings)]);
2307	}
2308	$no_column = ($settings['accordion_direction'] == 'column' && !$premium) ? ' king-addons-acc-no-column' : '';
2309	?>
2310	<div class="king-addons-image-accordion-wrap <?php echo $no_column; ?>">
2311	<?php if (!$premium) : ?>
2312	<div class="king-addons-image-accordion">
2313	<?php else : ?>
2314	<div class="king-addons-image-accordion" <?php echo $this->get_render_attribute_string('lightbox-settings'); ?>>
2315	<?php endif; ?>
2316	<?php
2317	foreach ($settings['accordion_items'] as $key => $item) :
2318	if (!$premium && $key === 3) break;
2319	if (!empty($item['accordion_item_bg_image']['id'])) {
2320	$image_url = Group_Control_Image_Size::get_attachment_image_src($item['accordion_item_bg_image']['id'], 'accordion_image_size', $settings);
2321	$this->item_bg_image_url = esc_url_raw($image_url);
2322	} elseif (!empty($item['accordion_item_bg_image']['url'])) {
2323	$this->item_bg_image_url = esc_url_raw($item['accordion_item_bg_image']['url']);
2324	} else {
2325	$this->item_bg_image_url = esc_url(Utils::get_placeholder_image_src());
2326	}
2327	// Security fix: Validate and sanitize URLs to prevent XSS
2328	$overlay_link = '';
2329	if ('yes' === $item['wrapper_link'] && isset($item['accordion_btn_url'])) {
2330	$raw_url = $item['accordion_btn_url']['url'];
2331	// Block javascript: and data: URLs that could contain malicious code
2332	if (!preg_match('/^(javascript\|data\|vbscript):/i', $raw_url)) {
2333	$overlay_link = esc_url_raw($raw_url);
2334	}
2335	}
2336
2337	$layout['activeItem'] = [
2338	'activeWidth' => $settings['accordion_active_item_style']['size'],
2339	'defaultActive' => $settings['default_active'],
2340	'interaction' => $premium ? $settings['accordion_interaction'] : 'hover',
2341	'overlayLink' => $overlay_link,
2342	'overlayLinkTarget' => (isset($item['accordion_btn_url']) && $item['accordion_btn_url']['is_external'] === 'on') ? '_blank' : '_self'
2343	];
2344	$this->add_render_attribute('accordion-settings' . $key, [
2345	'class' => ['king-addons-img-accordion-media-hover', 'king-addons-animation-wrap'],
2346	'data-settings' => wp_json_encode($layout),
2347	'data-src' => $this->item_bg_image_url
2348	]);
2349	$render_attribute = $this->get_render_attribute_string('accordion-settings' . $key);
2350	if (!empty($item['accordion_btn_url']['url'])) {
2351	$this->add_link_attributes('accordion_btn_url' . esc_attr($item['_id']), $item['accordion_btn_url']);
2352	}
2353	?>
2354	<div data-src="<?php echo esc_url($this->item_bg_image_url); ?>"
2355	class="king-addons-image-accordion-item elementor-repeater-item-<?php echo esc_attr($item['_id']) . $this->get_image_effect_class($settings); ?>">
2356	<div class="king-addons-accordion-background"
2357	style="background-image:url(<?php echo esc_attr($this->item_bg_image_url); ?>);"></div>
2358	<?php
2359	echo '<div ' . $render_attribute . '>';
2360	$this->render_media_overlay($settings);
2361	$this->get_elements_by_location('over', $settings, $item);
2362	echo '</div>';
2363	?>
2364	</div>
2365	<?php endforeach; ?>
2366	</div>
2367	</div>
2368	<?php
2369	}
2370	}