betterdocs / includes / Editors / Elementor / Widget / Basic / FAQ.php

FAQ.php in BetterDocs – AI Documentation, Knowledge Base, MCP Server, Docs, Wikis, FAQ & Chatbot 3.5.2, at includes/Editors/Elementor/Widget/Basic/FAQ.php

488 lines 19.3 KB

Raw Download Zip

1	<?php
2
3	namespace WPDeveloper\BetterDocs\Editors\Elementor\Widget\Basic;
4	use Elementor\Widget_Base;
5
6	// If this file is called directly, abort.
7	if ( ! defined( 'ABSPATH' ) ) {
8	exit;
9	}
10
11	use Elementor\Group_Control_Background;
12	use Elementor\Plugin as ElementorPlugin;
13	use Elementor\Controls_Manager as Controls_Manager;
14	use WPDeveloper\BetterDocs\Editors\Elementor\Helper;
15	use Elementor\Group_Control_Border as Group_Control_Border;
16	use Elementor\Group_Control_Typography as Group_Control_Typography;
17
18	class FAQ extends Widget_Base {
19
20	public function get_name() {
21	return 'betterdocs-faq';
22	}
23
24	public function get_title() {
25	return __( 'BetterDocs FAQ', 'betterdocs' );
26	}
27
28	public function get_custom_help_url() {
29	return 'http://betterdocs.co/docs/betterdocs-faq-builder-in-elementor/';
30	}
31
32	public function get_icon() {
33	return 'betterdocs-icon-faq';
34	}
35
36	public function get_categories() {
37	return ['betterdocs-elements'];
38	}
39
40	public function get_keywords() {
41	return ['betterdocs-elements', 'betterdocs', 'docs', 'faq', 'FAQ', 'betterdocs-faq'];
42	}
43
44	public function get_style_depends() {
45	return ['betterdocs-faq'];
46	}
47
48	protected function register_controls() {
49	$this->start_controls_section(
50	'faq_section_controls',
51	[
52	'label' => __( 'Layout Options', 'betterdocs' )
53	]
54	);
55
56	$this->add_control(
57	'faq_layout_selection',
58	[
59	'label' => __( 'Select Layout', 'betterdocs' ),
60	'type' => Controls_Manager::SELECT2,
61	'options' => [
62	'layout-1' => __( 'Modern Layout', 'betterdocs' ),
63	'layout-2' => __( 'Classic Layout', 'betterdocs' )
64	],
65	'default' => 'layout-1',
66	'label_block' => true
67	]
68	);
69
70	$this->add_control(
71	'faq_layout_section',
72	[
73	'label' => __( 'FAQ Section', 'betterdocs' ),
74	'type' => Controls_Manager::TEXT,
75	'dynamic' => [
76	'active' => true
77	],
78	'default' => __( 'Frequently Asked Questions', 'betterdocs' )
79	]
80	);
81
82	$terms = betterdocs()->container->get( Helper::class )->get_faq_terms();
83
84	$this->add_control(
85	'select_specific_faq',
86	[
87	'label' => __( 'Include FAQ Groups', 'betterdocs' ),
88	'label_block' => true,
89	'type' => Controls_Manager::SELECT2,
90	'options' => $terms,
91	'multiple' => true,
92	'default' => '',
93	'select2options' => [
94	'placeholder' => __( 'Include FAQ Groups', 'betterdocs' ),
95	'allowClear' => true
96	]
97	]
98	);
99
100	$this->add_control(
101	'exclude_specific_faq',
102	[
103	'label' => __( 'Exclude FAQ Groups', 'betterdocs' ),
104	'label_block' => true,
105	'type' => Controls_Manager::SELECT2,
106	'options' => $terms,
107	'multiple' => true,
108	'default' => '',
109	'select2options' => [
110	'placeholder' => __( 'Exclude FAQ Groups', 'betterdocs' ),
111	'allowClear' => true
112	]
113	]
114	);
115
116	$this->end_controls_section();
117
118	/***** Common Section Style For Both Layouts *****/
119
120	$this->start_controls_section(
121	'faq_section_style',
122	[
123	'label' => __( 'FAQ Section Title', 'betterdocs' ),
124	'tab' => Controls_Manager::TAB_STYLE
125	]
126	);
127
128	$this->add_control(
129	'faq_layout_section_title_color',
130	[
131	'label' => esc_html__( 'Text Color', 'betterdocs' ),
132	'type' => Controls_Manager::COLOR,
133	'selectors' => [
134	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-section-title' => 'color:{{VALUE}};'
135	]
136	]
137	);
138
139	$this->add_group_control(
140	Group_Control_Typography::get_type(),
141	[
142	'name' => 'faq_layout_section_title_typography',
143	'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-section-title'
144	]
145	);
146
147	$this->end_controls_section();
148
149	$this->start_controls_section(
150	'faq_box_title_section',
151	[
152	'label' => __( 'FAQ Group Title', 'betterdocs' ),
153	'tab' => Controls_Manager::TAB_STYLE
154	]
155	);
156
157	$this->add_control(
158	'faq_box_title_color',
159	[
160	'label' => esc_html__( 'Title Color', 'betterdocs' ),
161	'type' => Controls_Manager::COLOR,
162	'selectors' => [
163	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-title h2' => 'color:{{VALUE}};'
164	]
165	]
166	);
167
168	$this->add_control(
169	'faq_box_title_color_hover',
170	[
171	'label' => esc_html__( 'Title Hover Color', 'betterdocs' ),
172	'type' => Controls_Manager::COLOR,
173	'selectors' => [
174	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-title h2:hover' => 'color:{{VALUE}};'
175	]
176	]
177	);
178
179	$this->add_group_control(
180	Group_Control_Typography::get_type(),
181	[
182	'name' => 'faq_box_title_typography',
183	'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-title h2'
184	]
185	);
186
187	$this->end_controls_section();
188
189	$this->start_controls_section(
190	'faq_box_style_section',
191	[
192	'label' => __( 'FAQ List', 'betterdocs' ),
193	'tab' => Controls_Manager::TAB_STYLE
194	]
195	);
196
197	$this->add_responsive_control(
198	'faq_box_padding',
199	[
200	'label' => __( 'Padding', 'betterdocs' ),
201	'type' => Controls_Manager::DIMENSIONS,
202	'size_units' => ['px', '%', 'em'],
203	'selectors' => [
204	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
205	]
206	]
207	);
208
209	$this->add_responsive_control(
210	'faq_box_margin',
211	[
212	'label' => __( 'Margin', 'betterdocs' ),
213	'type' => Controls_Manager::DIMENSIONS,
214	'size_units' => ['px', '%', 'em'],
215	'selectors' => [
216	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
217	]
218	]
219	);
220
221	$this->add_group_control(
222	Group_Control_Typography::get_type(),
223	[
224	'name' => 'faq_box_typography',
225	'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-post-name'
226	]
227	);
228
229	$this->add_control(
230	'faq_box_term_title_color',
231	[
232	'label' => esc_html__( 'Color', 'betterdocs' ),
233	'type' => Controls_Manager::COLOR,
234	'selectors' => [
235	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-post-name' => 'color:{{VALUE}};'
236	]
237	]
238	);
239
240	$this->start_controls_tabs( 'faq_tabs' );
241
242	// Normal State Tab
243	$this->start_controls_tab(
244	'faq_box_normal',
245	['label' => esc_html__( 'Normal', 'betterdocs' )]
246	);
247
248	$this->add_group_control(
249	Group_Control_Border::get_type(),
250	[
251	'name' => 'faq_box_border_normal',
252	'label' => esc_html__( 'Border', 'betterdocs' ),
253	'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post'
254	]
255	);
256
257	$this->add_group_control(
258	Group_Control_Background::get_type(),
259	[
260	'name' => 'faq_box_background_normal',
261	'label' => esc_html__( 'Background', 'betterdocs' ),
262	'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post'
263	]
264	);
265
266	$this->end_controls_tab();
267
268	// Hover State Tab
269	$this->start_controls_tab(
270	'faq_box_hover',
271	['label' => esc_html__( 'Hover', 'betterdocs' )]
272	);
273
274	$this->add_group_control(
275	Group_Control_Border::get_type(),
276	[
277	'name' => 'faq_box_border_hover',
278	'label' => esc_html__( 'Border', 'betterdocs' ),
279	'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post:hover'
280	]
281	);
282
283	$this->add_group_control(
284	Group_Control_Background::get_type(),
285	[
286	'name' => 'faq_box_background_hover',
287	'label' => esc_html__( 'Background', 'betterdocs' ),
288	'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post:hover'
289	]
290	);
291
292	$this->end_controls_tab();
293
294	$this->end_controls_tabs();
295
296	$this->end_controls_section();
297
298	$this->start_controls_section(
299	'faq_box_content_section',
300	[
301	'label' => __( 'FAQ Content', 'betterdocs' ),
302	'tab' => Controls_Manager::TAB_STYLE
303	]
304	);
305
306	$this->add_responsive_control(
307	'faq_box_content_section_padding',
308	[
309	'label' => __( 'Padding', 'betterdocs' ),
310	'type' => Controls_Manager::DIMENSIONS,
311	'size_units' => ['px', '%', 'em'],
312	'selectors' => [
313	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
314	]
315	]
316	);
317
318	$this->add_responsive_control(
319	'faq_box_content_section_margin',
320	[
321	'label' => __( 'Margin', 'betterdocs' ),
322	'type' => Controls_Manager::DIMENSIONS,
323	'size_units' => ['px', '%', 'em'],
324	'selectors' => [
325	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
326	]
327	]
328	);
329
330	$this->add_group_control(
331	Group_Control_Background::get_type(),
332	[
333	'name' => 'faq_box_content_section_background',
334	'label' => esc_html__( 'Background', 'betterdocs' ),
335	'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content'
336	]
337	);
338
339	$this->add_group_control(
340	Group_Control_Typography::get_type(),
341	[
342	'name' => 'faq_box_content_section_typography',
343	'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content'
344	]
345	);
346
347	$this->add_control(
348	'faq_box_content_section_color',
349	[
350	'label' => esc_html__( 'Color', 'betterdocs' ),
351	'type' => Controls_Manager::COLOR,
352	'selectors' => [
353	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content' => 'color:{{VALUE}};'
354	]
355	]
356	);
357
358	$this->end_controls_section();
359
360	$this->start_controls_section(
361	'faq_box_content_icon',
362	[
363	'label' => __( 'FAQ List Icon', 'betterdocs' ),
364	'tab' => Controls_Manager::TAB_STYLE
365	]
366	);
367
368	$this->add_responsive_control(
369	'faq_box_content_icon_height',
370	[
371	'label' => esc_html__( 'Icon Height', 'betterdocs' ),
372	'type' => Controls_Manager::SLIDER,
373	'size_units' => ['px', '%', 'em'],
374	'range' => [
375	'px' => [
376	'max' => 500
377	]
378	],
379	'selectors' => [
380	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};',
381	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};'
382	]
383	]
384	);
385
386	$this->add_responsive_control(
387	'faq_box_content_icon_width',
388	[
389	'label' => esc_html__( 'Icon Width', 'betterdocs' ),
390	'type' => Controls_Manager::SLIDER,
391	'size_units' => ['px', '%', 'em'],
392	'range' => [
393	'px' => [
394	'max' => 500
395	]
396	],
397	'selectors' => [
398	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};',
399	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};'
400	]
401	]
402	);
403
404	$this->add_control(
405	'faq_box_content_icon_color',
406	[
407	'label' => esc_html__( 'Icon Color', 'betterdocs' ),
408	'type' => Controls_Manager::COLOR,
409	'selectors' => [
410	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus path' => 'fill:{{VALUE}} ! important;',
411	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus path' => 'fill:{{VALUE}} ! important;',
412	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus g' => 'stroke:{{VALUE}} ! important;',
413	'{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus g' => 'stroke:{{VALUE}} ! important;'
414	]
415	]
416	);
417
418	$this->end_controls_section();
419	}
420
421	protected function render() {
422	$control_values = $this->get_settings_for_display();
423
424	$specific_faqs = ! empty( $control_values['select_specific_faq'] ) ? implode( ',', $control_values['select_specific_faq'] ) : '';
425
426	$faqs_exclude = ! empty( $control_values['exclude_specific_faq'] ) ? implode( ',', $control_values['exclude_specific_faq'] ) : '';
427
428	betterdocs()->views->get( 'layouts/faq', [
429	'enable' => true,
430	'have_posts' => true,
431	'layout' => $control_values['faq_layout_selection'],
432	'shortcode_attr' => [
433	'group_exclude' => $faqs_exclude,
434	'class' => 'betterdocs-faq-' . $control_values['faq_layout_selection'],
435	'groups' => $specific_faqs,
436	'faq_heading' => $control_values['faq_layout_section']
437	]
438	] );
439
440	if ( ElementorPlugin::instance()->editor->is_edit_mode() ) {
441	$this->render_editor_script();
442	}
443	}
444
445	protected function render_editor_script()
446	{
447	?>
448	<script>
449	jQuery(document).ready(function($) {
450	$('.betterdocs-faq-post').on('click', function(e) {
451	var current_node = $(this);
452	var active_list = $('.betterdocs-faq-group.active');
453
454	if( ! current_node.parent().hasClass('active') ) {
455	current_node.parent().addClass('active');
456	current_node.children('svg').toggle();
457	current_node.next().slideDown();
458	}
459
460	for( let node of active_list ) {
461	if( $(node).hasClass('active') ) {
462	$(node).removeClass('active');
463	$(node).children('.betterdocs-faq-post').children('svg').toggle();
464	$(node).children('.betterdocs-faq-main-content').slideUp();
465	}
466	}
467	});
468
469	$('.betterdocs-faq-post-layout-2').on('click', function(e) {
470	var current_node = $(this);
471
472	if( ! current_node.parent().hasClass('active') ) {
473	current_node.parent().addClass('active');
474	current_node.children('.betterdocs-faq-post-layout-2-icon-group').children('svg').toggle();
475	current_node.next().slideDown();
476	} else {
477	current_node.parent().removeClass('active');
478	current_node.children('.betterdocs-faq-post-layout-2-icon-group').children('svg').toggle();
479	current_node.next().slideUp();
480	}
481
482	});
483	});
484	</script>
485	<?php
486	}
487	}
488