betterdocs / includes / elementor / widgets / basic / betterdocs-faq-widget.php

betterdocs-faq-widget.php in BetterDocs – AI Documentation, Knowledge Base, MCP Server, Docs, Wikis, FAQ & Chatbot 2.3.5, at includes/elementor/widgets/basic/betterdocs-faq-widget.php

804 lines 31.0 KB

Raw Download Zip

1	<?php
2
3	use Elementor\Controls_Manager;
4	use Elementor\Group_Control_Typography;
5	use Elementor\Widget_Base;
6	use Elementor\Core\Schemes;
7	use Elementor\Group_Control_Text_Shadow;
8	use Elementor\Plugin;
9	use Elementor\Group_Control_Border;
10	use Elementor\Group_Control_Background;
11
12	class Betterdocs_FAQ_Widget extends Widget_Base{
13
14
15	public function get_name()
16	{
17	return 'betterdocs-faq';
18	}
19
20	public function get_title()
21	{
22	return __('BetterDocs FAQ', 'betterdocs');
23	}
24
25	public function get_custom_help_url()
26	{
27	return 'http://betterdocs.co/docs/betterdocs-faq-builder-in-elementor/';
28	}
29
30	public function get_icon()
31	{
32	return 'betterdocs-icon-faq';
33	}
34
35	public function get_categories()
36	{
37	return ['betterdocs-elements'];
38	}
39
40	public function get_keywords()
41	{
42	return ['betterdocs-elements', 'betterdocs', 'docs', 'faq', 'FAQ', 'betterdocs-faq'];
43	}
44
45	protected function register_controls()
46	{
47	$this->start_controls_section(
48	'faq_section_controls',
49	[
50	'label' => __('Layout Options', 'betterdocs')
51	]
52	);
53
54	$this->add_control(
55	'faq_layout_selection',
56	[
57	'label' => __('Select Layout', 'betterdocs'),
58	'type' => Controls_Manager::SELECT2,
59	'options' => [
60	'layout-1' => __('Modern Layout', 'betterdocs'),
61	'layout-2' => __('Classic Layout', 'betterdocs')
62	],
63	'default' => 'layout-1',
64	'label_block' => true
65	]
66	);
67
68	$this->add_control(
69	'faq_layout_section',
70	[
71	'label' => __('FAQ Section', 'betterdocs'),
72	'type' => Controls_Manager::TEXT,
73	'dynamic' => [
74	'active' => true,
75	],
76	'default' => __('Frequently Asked Questions', 'betterdocs'),
77	]
78	);
79
80	$this->add_control(
81	'select_specific_faq',
82	[
83	'label' => __('Include FAQ Groups', 'betterdocs'),
84	'label_block' => true,
85	'type' => Controls_Manager::SELECT2,
86	'options' => BetterDocs_Helper::faq_widget_term_list(),
87	'multiple' => true,
88	'default' => '',
89	'select2options' => [
90	'placeholder' => __('Include FAQ Groups', 'betterdocs'),
91	'allowClear' => true,
92	]
93	]
94	);
95
96	$this->add_control(
97	'exclude_specific_faq',
98	[
99	'label' => __('Exclude FAQ Groups', 'betterdocs'),
100	'label_block' => true,
101	'type' => Controls_Manager::SELECT2,
102	'options' => BetterDocs_Helper::faq_widget_term_list(),
103	'multiple' => true,
104	'default' => '',
105	'select2options' => [
106	'placeholder' => __('Exclude FAQ Groups', 'betterdocs'),
107	'allowClear' => true,
108	]
109	]
110	);
111
112	$this->end_controls_section();
113
114
115	/***** Common Section Style For Both Layouts *****/
116
117	$this->start_controls_section(
118	'faq_section_style',
119	[
120	'label' => __('FAQ Section Title', 'betterdocs'),
121	'tab' => Controls_Manager::TAB_STYLE
122	]
123	);
124
125	$this->add_control(
126	'faq_layout_section_title_color',
127	[
128	'label' => esc_html__('Text Color', 'betterdocs'),
129	'type' => Controls_Manager::COLOR,
130	'selectors' => [
131	'{{WRAPPER}} .betterdocs-faq-section-title' => 'color:{{VALUE}};',
132	]
133	]
134	);
135
136	$this->add_group_control(
137	Group_Control_Typography::get_type(),
138	[
139	'name' => 'faq_layout_section_title_typography',
140	'selector' => '{{WRAPPER}} .betterdocs-faq-section-title'
141	]
142	);
143
144	$this->end_controls_section();
145
146	/************************ Layout 1 Controls ***********************/
147
148	$this->start_controls_section(
149	'faq_box_style_section',
150	[
151	'label' => __('FAQ List', 'betterdocs'),
152	'tab' => Controls_Manager::TAB_STYLE,
153	'condition' => [
154	'faq_layout_selection' => ['layout-1']
155	]
156	]
157	);
158
159	$this->add_responsive_control(
160	'faq_box_padding',
161	[
162	'label' => __('Padding', 'betterdocs'),
163	'type' => Controls_Manager::DIMENSIONS,
164	'size_units' => ['px', '%', 'em'],
165	'selectors' => [
166	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
167	]
168	]
169	);
170
171	$this->add_responsive_control(
172	'faq_box_margin',
173	[
174	'label' => __('Margin', 'betterdocs'),
175	'type' => Controls_Manager::DIMENSIONS,
176	'size_units' => ['px', '%', 'em'],
177	'selectors' => [
178	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
179	]
180	]
181	);
182
183	$this->add_group_control(
184	Group_Control_Typography::get_type(),
185	[
186	'name' => 'faq_box_typography',
187	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-post-name'
188	]
189	);
190
191	$this->add_control(
192	'faq_box_term_title_color',
193	[
194	'label' => esc_html__('Color', 'betterdocs'),
195	'type' => Controls_Manager::COLOR,
196	'selectors' => [
197	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-post-name' => 'color:{{VALUE}};',
198	]
199	]
200	);
201
202	$this->start_controls_tabs('faq_tabs');
203
204	// Normal State Tab
205	$this->start_controls_tab(
206	'faq_box_normal',
207	['label' => esc_html__('Normal', 'betterdocs')]
208	);
209
210	$this->add_group_control(
211	Group_Control_Border::get_type(),
212	[
213	'name' => 'faq_box_border_normal',
214	'label' => esc_html__('Border', 'betterdocs'),
215	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post'
216	]
217	);
218
219	$this->add_group_control(
220	Group_Control_Background::get_type(),
221	[
222	'name' => 'faq_box_background_normal',
223	'label' => esc_html__('Background', 'betterdocs'),
224	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post'
225	]
226	);
227
228	$this->end_controls_tab();
229
230	// Hover State Tab
231	$this->start_controls_tab(
232	'faq_box_hover',
233	['label' => esc_html__('Hover', 'betterdocs')]
234	);
235
236	$this->add_group_control(
237	Group_Control_Border::get_type(),
238	[
239	'name' => 'faq_box_border_hover',
240	'label' => esc_html__('Border', 'betterdocs'),
241	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post:hover'
242	]
243	);
244
245	$this->add_group_control(
246	Group_Control_Background::get_type(),
247	[
248	'name' => 'faq_box_background_hover',
249	'label' => esc_html__('Background', 'betterdocs'),
250	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post:hover'
251	]
252	);
253
254	$this->end_controls_tab();
255
256	$this->end_controls_tabs();
257
258	$this->end_controls_section();
259
260
261	$this->start_controls_section(
262	'faq_box_title_section',
263	[
264	'label' => __('FAQ List Title', 'betterdocs'),
265	'tab' => Controls_Manager::TAB_STYLE,
266	'condition' => [
267	'faq_layout_selection' => ['layout-1']
268	]
269	]
270	);
271
272	$this->add_control(
273	'faq_box_title_color',
274	[
275	'label' => esc_html__('Title Color', 'betterdocs'),
276	'type' => Controls_Manager::COLOR,
277	'selectors' => [
278	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-title h2' => 'color:{{VALUE}};',
279	]
280	]
281	);
282
283	$this->add_control(
284	'faq_box_title_color_hover',
285	[
286	'label' => esc_html__('Title Hover Color', 'betterdocs'),
287	'type' => Controls_Manager::COLOR,
288	'selectors' => [
289	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-title h2:hover' => 'color:{{VALUE}};',
290	]
291	]
292	);
293
294	$this->add_group_control(
295	Group_Control_Typography::get_type(),
296	[
297	'name' => 'faq_box_title_typography',
298	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-title h2'
299	]
300	);
301
302	$this->end_controls_section();
303
304	$this->start_controls_section(
305	'faq_box_content_section',
306	[
307	'label' => __('FAQ Content', 'betterdocs'),
308	'tab' => Controls_Manager::TAB_STYLE,
309	'condition' => [
310	'faq_layout_selection' => ['layout-1']
311	]
312	]
313	);
314
315	$this->add_responsive_control(
316	'faq_box_content_section_padding',
317	[
318	'label' => __('Padding', 'betterdocs'),
319	'type' => Controls_Manager::DIMENSIONS,
320	'size_units' => ['px', '%', 'em'],
321	'selectors' => [
322	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-group .betterdocs-faq-main-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
323	]
324	]
325	);
326
327	$this->add_responsive_control(
328	'faq_box_content_section_margin',
329	[
330	'label' => __('Margin', 'betterdocs'),
331	'type' => Controls_Manager::DIMENSIONS,
332	'size_units' => ['px', '%', 'em'],
333	'selectors' => [
334	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-group .betterdocs-faq-main-content' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
335	]
336	]
337	);
338
339	$this->add_group_control(
340	Group_Control_Background::get_type(),
341	[
342	'name' => 'faq_box_content_section_background',
343	'label' => esc_html__('Background', 'betterdocs'),
344	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-group .betterdocs-faq-main-content'
345	]
346	);
347
348
349	$this->add_group_control(
350	Group_Control_Typography::get_type(),
351	[
352	'name' => 'faq_box_content_section_typography',
353	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-group .betterdocs-faq-main-content'
354	]
355	);
356
357
358	$this->add_control(
359	'faq_box_content_section_color',
360	[
361	'label' => esc_html__('Color', 'betterdocs'),
362	'type' => Controls_Manager::COLOR,
363	'selectors' => [
364	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-group .betterdocs-faq-main-content' => 'color:{{VALUE}};',
365	]
366	]
367	);
368
369
370	$this->end_controls_section();
371
372	$this->start_controls_section(
373	'faq_box_content_icon',
374	[
375	'label' => __('FAQ List Icon', 'betterdocs'),
376	'tab' => Controls_Manager::TAB_STYLE,
377	'condition' => [
378	'faq_layout_selection' => ['layout-1']
379	]
380	]
381	);
382
383	$this->add_responsive_control(
384	'faq_box_content_icon_height',
385	[
386	'label' => esc_html__('Icon Height', 'betterdocs'),
387	'type' => Controls_Manager::SLIDER,
388	'size_units' => ['px', '%', 'em'],
389	'range' => [
390	'px' => [
391	'max' => 500,
392	],
393	],
394	'selectors' => [
395	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};',
396	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};'
397	]
398	]
399	);
400
401	$this->add_responsive_control(
402	'faq_box_content_icon_width',
403	[
404	'label' => esc_html__('Icon Width', 'betterdocs'),
405	'type' => Controls_Manager::SLIDER,
406	'size_units' => ['px', '%', 'em'],
407	'range' => [
408	'px' => [
409	'max' => 500,
410	],
411	],
412	'selectors' => [
413	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};',
414	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};'
415	]
416	]
417	);
418
419	$this->add_control(
420	'faq_box_content_icon_color',
421	[
422	'label' => esc_html__('Icon Color', 'betterdocs'),
423	'type' => Controls_Manager::COLOR,
424	'selectors' => [
425	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus g' => 'fill:{{VALUE}} ! important;',
426	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-1 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus g' => 'fill:{{VALUE}} ! important;',
427	]
428	]
429	);
430
431	$this->end_controls_section();
432
433	/************************ Layout 2 Controls ***********************/
434
435	$this->start_controls_section(
436	'faq_box_style_section_layout_2',
437	[
438	'label' => __('FAQ List', 'betterdocs'),
439	'tab' => Controls_Manager::TAB_STYLE,
440	'condition' => [
441	'faq_layout_selection' => ['layout-2']
442	]
443	]
444	);
445
446	$this->add_responsive_control(
447	'faq_box_padding_layout_2',
448	[
449	'label' => __('Padding', 'betterdocs'),
450	'type' => Controls_Manager::DIMENSIONS,
451	'size_units' => ['px', '%', 'em'],
452	'selectors' => [
453	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
454	]
455	]
456	);
457
458	$this->add_responsive_control(
459	'faq_box_margin_layout_2',
460	[
461	'label' => __('Margin', 'betterdocs'),
462	'type' => Controls_Manager::DIMENSIONS,
463	'size_units' => ['px', '%', 'em'],
464	'selectors' => [
465	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
466	]
467	]
468	);
469
470	$this->add_group_control(
471	Group_Control_Typography::get_type(),
472	[
473	'name' => 'faq_box_typography_layout_2',
474	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-post-layout-2 .betterdocs-faq-post-name-layout-2'
475	]
476	);
477
478
479	$this->add_control(
480	'faq_box_term_title_color_layout_2',
481	[
482	'label' => esc_html__('Color', 'betterdocs'),
483	'type' => Controls_Manager::COLOR,
484	'selectors' => [
485	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post-layout-2 .betterdocs-faq-post-name' => 'color:{{VALUE}};',
486	]
487	]
488	);
489
490
491	$this->start_controls_tabs('faq_tabs_layout_2');
492
493	// Normal State Tab
494	$this->start_controls_tab(
495	'faq_box_normal_layout_2',
496	['label' => esc_html__('Normal', 'betterdocs')]
497	);
498
499	$this->add_group_control(
500	Group_Control_Border::get_type(),
501	[
502	'name' => 'faq_box_border_normal_layout_2',
503	'label' => esc_html__('Border', 'betterdocs'),
504	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2'
505	]
506	);
507
508	$this->add_group_control(
509	Group_Control_Background::get_type(),
510	[
511	'name' => 'faq_box_background_normal_layout_2',
512	'label' => esc_html__('Background', 'betterdocs'),
513	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2'
514	]
515	);
516
517	$this->end_controls_tab();
518
519	// Hover State Tab
520	$this->start_controls_tab(
521	'faq_box_hover_layout_2',
522	['label' => esc_html__('Hover', 'betterdocs')]
523	);
524
525	$this->add_group_control(
526	Group_Control_Border::get_type(),
527	[
528	'name' => 'faq_box_border_hover_layout_2',
529	'label' => esc_html__('Border', 'betterdocs'),
530	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2:hover'
531	]
532	);
533
534	$this->add_group_control(
535	Group_Control_Background::get_type(),
536	[
537	'name' => 'faq_box_background_hover_layout_2',
538	'label' => esc_html__('Background', 'betterdocs'),
539	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2:hover'
540	]
541	);
542
543	$this->end_controls_tab();
544
545	$this->end_controls_tabs();
546
547	$this->end_controls_section();
548
549
550	$this->start_controls_section(
551	'faq_box_title_section_layout_2',
552	[
553	'label' => __('FAQ List Title', 'betterdocs'),
554	'tab' => Controls_Manager::TAB_STYLE,
555	'condition' => [
556	'faq_layout_selection' => ['layout-2']
557	]
558	]
559	);
560
561	$this->add_control(
562	'faq_box_title_color_layout_2',
563	[
564	'label' => esc_html__('Box Title Color', 'betterdocs'),
565	'type' => Controls_Manager::COLOR,
566	'selectors' => [
567	'{{WRAPPER}} .betterdocs-faq-title-layout-2 h2' => 'color:{{VALUE}};',
568	]
569	]
570	);
571
572	$this->add_control(
573	'faq_box_title_color_hover_layout_2',
574	[
575	'label' => esc_html__('Box Title Hover Color', 'betterdocs'),
576	'type' => Controls_Manager::COLOR,
577	'selectors' => [
578	'{{WRAPPER}} .betterdocs-faq-title-layout-2 h2:hover' => 'color:{{VALUE}};',
579	]
580	]
581	);
582
583	$this->add_group_control(
584	Group_Control_Typography::get_type(),
585	[
586	'name' => 'faq_box_title_typography_layout_2',
587	'selector' => '{{WRAPPER}} .betterdocs-faq-title-layout-2 h2'
588	]
589	);
590
591	$this->end_controls_section();
592
593
594	$this->start_controls_section(
595	'faq_box_content_section_layout_2',
596	[
597	'label' => __('FAQ Content', 'betterdocs'),
598	'tab' => Controls_Manager::TAB_STYLE,
599	'condition' => [
600	'faq_layout_selection' => ['layout-2']
601	]
602	]
603	);
604
605	$this->add_responsive_control(
606	'faq_box_content_section_padding_layout_2',
607	[
608	'label' => __('Padding', 'betterdocs'),
609	'type' => Controls_Manager::DIMENSIONS,
610	'size_units' => ['px', '%', 'em'],
611	'selectors' => [
612	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-main-content-layout-2' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
613	]
614	]
615	);
616
617	$this->add_responsive_control(
618	'faq_box_content_section_margin_layout_2',
619	[
620	'label' => __('Margin', 'betterdocs'),
621	'type' => Controls_Manager::DIMENSIONS,
622	'size_units' => ['px', '%', 'em'],
623	'selectors' => [
624	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-main-content-layout-2' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
625	]
626	]
627	);
628
629	$this->add_group_control(
630	Group_Control_Background::get_type(),
631	[
632	'name' => 'faq_box_content_section_background_layout_2',
633	'label' => esc_html__('Background', 'betterdocs'),
634	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-main-content-layout-2'
635	]
636	);
637
638
639	$this->add_group_control(
640	Group_Control_Typography::get_type(),
641	[
642	'name' => 'faq_box_content_section_typography_layout_2',
643	'selector' => '{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-main-content-layout-2'
644	]
645	);
646
647
648	$this->add_control(
649	'faq_box_content_section_color_layout_2',
650	[
651	'label' => esc_html__('Color', 'betterdocs'),
652	'type' => Controls_Manager::COLOR,
653	'selectors' => [
654	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-main-content-layout-2' => 'color:{{VALUE}};',
655	]
656	]
657	);
658
659
660	$this->end_controls_section();
661
662
663	$this->start_controls_section(
664	'faq_box_content_icon_layout_2',
665	[
666	'label' => __('FAQ Icon', 'betterdocs'),
667	'tab' => Controls_Manager::TAB_STYLE,
668	'condition' => [
669	'faq_layout_selection' => ['layout-2']
670	]
671	]
672	);
673
674	$this->add_responsive_control(
675	'faq_box_content_icon_height_layout_2',
676	[
677	'label' => esc_html__('Icon Height', 'betterdocs'),
678	'type' => Controls_Manager::SLIDER,
679	'size_units' => ['px', '%', 'em'],
680	'range' => [
681	'px' => [
682	'max' => 500,
683	],
684	],
685	'selectors' => [
686	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-post-layout-2 .betterdocs-faq-post-layout-2-icon-group .betterdocs-faq-iconplus-layout-2' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};',
687	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-post-layout-2 .betterdocs-faq-post-layout-2-icon-group .betterdocs-faq-iconminus-layout-2' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};'
688	]
689	]
690	);
691
692	$this->add_responsive_control(
693	'faq_box_content_icon_width_layout_2',
694	[
695	'label' => esc_html__('Icon Width', 'betterdocs'),
696	'type' => Controls_Manager::SLIDER,
697	'size_units' => ['px', '%', 'em'],
698	'range' => [
699	'px' => [
700	'max' => 500,
701	],
702	],
703	'selectors' => [
704	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-post-layout-2 .betterdocs-faq-post-layout-2-icon-group .betterdocs-faq-iconplus-layout-2' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};',
705	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-post-layout-2 .betterdocs-faq-post-layout-2-icon-group .betterdocs-faq-iconminus-layout-2' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};'
706	]
707	]
708	);
709
710	$this->add_control(
711	'faq_box_content_icon_color_layout_2',
712	[
713	'label' => esc_html__('Icon Color', 'betterdocs'),
714	'type' => Controls_Manager::COLOR,
715	'selectors' => [
716	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-post-layout-2 .betterdocs-faq-post-layout-2-icon-group .betterdocs-faq-iconplus-layout-2 path' => 'fill:{{VALUE}} ! important;',
717	'{{WRAPPER}} .betterdocs-faq-main-wrapper-layout-2 .betterdocs-faq-list-layout-2 > li .betterdocs-faq-group-layout-2 .betterdocs-faq-post-layout-2 .betterdocs-faq-post-layout-2-icon-group .betterdocs-faq-iconminus-layout-2 path' => 'fill:{{VALUE}} ! important;',
718	]
719	]
720	);
721
722
723	$this->end_controls_section();
724	}
725
726	protected function render()
727	{
728	$control_values = $this->get_settings_for_display();
729
730	$shortcode = '';
731
732	$specific_faqs = ! empty( $control_values['select_specific_faq'] ) ? implode( ',' ,$control_values['select_specific_faq'] ) : '';
733
734	$faqs_exclude = ! empty( $control_values['exclude_specific_faq'] ) ? implode( ',', $control_values['exclude_specific_faq'] ) : '';
735
736
737	$enable_faq_schema = BetterDocs_DB::get_settings('enable_faq_schema') == 1 ? 'true' : '';
738
739	$args = [
740	'groups="'.$specific_faqs.'"',
741	'group_exclude="'.$faqs_exclude.'"',
742	'faq_heading="'.$control_values['faq_layout_section'].'"',
743	'faq_schema="'.$enable_faq_schema.'"',
744	];
745
746	if( $control_values['faq_layout_selection'] === 'layout-1' ) {
747	$shortcode .= do_shortcode('[betterdocs_faq_list_modern '. implode(' ', $args) .']');
748	}
749
750	if( $control_values['faq_layout_selection'] === 'layout-2' ) {
751	$shortcode .= do_shortcode('[betterdocs_faq_list_classic '. implode(' ', $args) .']');
752	}
753
754	if (\Elementor\Plugin::instance()->editor->is_edit_mode()) {
755	$this->render_editor_script();
756	}
757
758	echo $shortcode;
759	}
760
761	protected function render_editor_script()
762	{
763	?>
764	<script>
765	jQuery(document).ready(function($) {
766	$('.betterdocs-faq-post').on('click', function(e) {
767	var current_node = $(this);
768	var active_list = $('.betterdocs-faq-group.active');
769
770	if( ! current_node.parent().hasClass('active') ) {
771	current_node.parent().addClass('active');
772	current_node.children('svg').toggle();
773	current_node.next().slideDown();
774	}
775
776	for( let node of active_list ) {
777	if( $(node).hasClass('active') ) {
778	$(node).removeClass('active');
779	$(node).children('.betterdocs-faq-post').children('svg').toggle();
780	$(node).children('.betterdocs-faq-main-content').slideUp();
781	}
782	}
783	});
784
785	$('.betterdocs-faq-post-layout-2').on('click', function(e) {
786	var current_node = $(this);
787
788	if( ! current_node.parent().hasClass('active') ) {
789	current_node.parent().addClass('active');
790	current_node.children('.betterdocs-faq-post-layout-2-icon-group').children('svg').toggle();
791	current_node.next().slideDown();
792	} else {
793	current_node.parent().removeClass('active');
794	current_node.children('.betterdocs-faq-post-layout-2-icon-group').children('svg').toggle();
795	current_node.next().slideUp();
796	}
797
798	});
799	});
800	</script>
801	<?php
802	}
803
804	}