pixel-gallery / modules / walden / widgets / walden.php

walden.php in Pixel Gallery Addons for Elementor – Easy Grid, Creative Gallery, Drag and Drop Grid, Custom Grid Layout, Portfolio Gallery trunk, at modules/walden/widgets/walden.php

589 lines 16.9 KB

Raw Download Zip

1	<?php
2
3	namespace PixelGallery\Modules\Walden\Widgets;
4
5	use Elementor\Controls_Manager;
6	use Elementor\Group_Control_Border;
7	use Elementor\Group_Control_Typography;
8	use Elementor\Group_Control_Background;
9	use Elementor\Group_Control_Box_Shadow;
10	use Elementor\Group_Control_Image_Size;
11	use Elementor\Group_Control_Text_Shadow;
12	use Elementor\Icons_Manager;
13	use Elementor\Group_Control_Css_Filter;
14	use Elementor\Group_Control_Text_Stroke;
15	use Elementor\Repeater;
16	use PixelGallery\Utils;
17	use PixelGallery\Base\Module_Base;
18	use PixelGallery\Traits\Global_Widget_Controls;
19
20	if (!defined('ABSPATH')) exit; // Exit if accessed directly
21
22	class Walden extends Module_Base {
23
24	use Global_Widget_Controls;
25
26	public function get_name() {
27	return 'pg-walden';
28	}
29
30	public function get_title() {
31	return BDTPG . esc_html__('Walden', 'pixel-gallery');
32	}
33
34	public function get_icon() {
35	return 'pg-icon-walden';
36	}
37
38	public function get_categories() {
39	return ['pixel-gallery'];
40	}
41
42	public function get_keywords() {
43	return ['walden', 'grid', 'gallery'];
44	}
45
46	public function get_style_depends() {
47	return ['pg-walden'];
48	}
49
50	public function get_script_depends() {
51	if ( true === _is_pg_pro_activated() ) {
52	return ['justified-gallery'];
53	} else {
54	return [];
55	}
56	}
57
58	public function get_custom_help_url() {
59	return 'https://youtu.be/lwkQIcLuE0k';
60	}
61
62	public function has_widget_inner_wrapper(): bool {
63	return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
64	}
65	protected function is_dynamic_content(): bool {
66	return false;
67	}
68
69	protected function register_controls() {
70
71	$this->start_controls_section(
72	'section_layout',
73	[
74	'label' => __('Layout', 'pixel-gallery'),
75	'tab' => Controls_Manager::TAB_CONTENT,
76	]
77	);
78
79	$this->add_control(
80	'layout_style',
81	[
82	'label' => __('Layout Style', 'pixel-gallery'),
83	'type' => Controls_Manager::SELECT,
84	'default' => '1',
85	'options' => [
86	'1' => __('01', 'pixel-gallery'),
87	'2' => __('02', 'pixel-gallery'),
88	],
89	]
90	);
91
92	//Global Grid Controls
93	$this->register_grid_controls('walden');
94	$this->register_global_height_controls('walden');
95
96	/**
97	* Justified Gallery Controls
98	*/
99	$this->register_justified_gallery_controls();
100
101	$this->register_title_tag_controls();
102
103	$this->add_control(
104	'show_follow',
105	[
106	'label' => esc_html__('Show Follow', 'pixel-gallery'),
107	'type' => Controls_Manager::SWITCHER,
108	'default' => 'yes',
109	]
110	);
111
112	$this->add_control(
113	'show_like',
114	[
115	'label' => esc_html__('Show Like', 'pixel-gallery'),
116	'type' => Controls_Manager::SWITCHER,
117	'default' => 'yes',
118	]
119	);
120
121	$this->register_alignment_controls('walden');
122	$this->register_thumbnail_size_controls();
123
124	//Global Lightbox Controls
125	$this->register_lightbox_controls();
126	$this->register_link_target_controls();
127	$this->end_controls_section();
128
129	//Repeater
130	$this->start_controls_section(
131	'section_item_content',
132	[
133	'label' => __('Items', 'pixel-gallery'),
134	'tab' => Controls_Manager::TAB_CONTENT,
135	]
136	);
137	$repeater = new Repeater();
138	$repeater->start_controls_tabs('tabs_item_content');
139	$repeater->start_controls_tab(
140	'tab_item_content',
141	[
142	'label' => esc_html__('Content', 'pixel-gallery'),
143	]
144	);
145	$this->register_repeater_media_controls($repeater);
146	$this->register_repeater_title_controls($repeater);
147
148	$repeater->add_control(
149	'follow',
150	[
151	'label' => esc_html__('Follow', 'pixel-gallery'),
152	'type' => Controls_Manager::TEXT,
153	'dynamic' => ['active' => true],
154	'default' => esc_html__('403', 'pixel-gallery'),
155	'placeholder' => esc_html__('Follow Number', 'pixel-gallery'),
156	'condition' => ['item_hidden' => '']
157	]
158	);
159
160	$repeater->add_control(
161	'like',
162	[
163	'label' => esc_html__('Like', 'pixel-gallery'),
164	'type' => Controls_Manager::TEXT,
165	'dynamic' => ['active' => true],
166	'default' => esc_html__('604', 'pixel-gallery'),
167	'placeholder' => esc_html__('Like Number', 'pixel-gallery'),
168	'condition' => ['item_hidden' => '']
169	]
170	);
171
172	$this->register_repeater_custom_url_controls($repeater);
173	$this->register_repeater_hidden_item_controls($repeater);
174
175	$repeater->end_controls_tab();
176	$repeater->start_controls_tab(
177	'tab_item_grid',
178	[
179	'label' => esc_html__('Grid', 'pixel-gallery'),
180	]
181	);
182	$this->register_repeater_grid_controls($repeater, 'walden');
183	$this->register_repeater_item_height_controls($repeater, 'walden');
184	$repeater->end_controls_tab();
185	$repeater->end_controls_tabs();
186	$this->register_repeater_items_controls($repeater);
187	$this->end_controls_section();
188
189	//Style
190	$this->start_controls_section(
191	'pg_section_style',
192	[
193	'label' => esc_html__('Items', 'pixel-gallery'),
194	'tab' => Controls_Manager::TAB_STYLE,
195	]
196	);
197
198	$this->add_control(
199	'overlay_heading',
200	[
201	'label' => esc_html__('OVERLAY', 'pixel-gallery'),
202	'type' => Controls_Manager::HEADING,
203	]
204	);
205
206	$this->add_control(
207	'primary_overlay_color',
208	[
209	'label' => esc_html__('Primary Color', 'pixel-gallery'),
210	'type' => Controls_Manager::COLOR,
211	'condition' => [
212	'layout_style' => '1',
213	],
214	'selectors' => [
215	'{{WRAPPER}} .pg-walden-grid.pg-walden-effect-style-1 .pg-walden-image-wrap::after' => 'background-color: {{VALUE}};',
216	],
217	]
218	);
219
220	$this->add_control(
221	'secondary_overlay_color',
222	[
223	'label' => esc_html__('Secondary Color', 'pixel-gallery'),
224	'type' => Controls_Manager::COLOR,
225	'condition' => [
226	'layout_style' => '1',
227	],
228	'selectors' => [
229	'{{WRAPPER}} .pg-walden-grid.pg-walden-effect-style-1 .pg-walden-image-wrap::before' => 'background-color: {{VALUE}};',
230	],
231	]
232	);
233
234	$this->add_group_control(
235	Group_Control_Css_Filter::get_type(),
236	[
237	'name' => 'custom_css_filters',
238	'selector' => '{{WRAPPER}} .pg-walden-grid.pg-walden-effect-style-2 .pg-walden-image-wrap::before',
239	'condition' => [
240	'layout_style' => '2',
241	],
242	]
243	);
244
245	$this->start_controls_tabs('tabs_item_style');
246
247	$this->start_controls_tab(
248	'tab_item_normal',
249	[
250	'label' => esc_html__('Normal', 'pixel-gallery'),
251	]
252	);
253
254	$this->add_group_control(
255	Group_Control_Background::get_type(),
256	[
257	'name' => 'item_background',
258	'label' => esc_html__('Background', 'pixel-gallery'),
259	'types' => ['classic', 'gradient'],
260	// phpcs:ignore WordPressVIPMinimum.Performance.WPQueryParams, WordPress.DB.SlowDBQuery -- Intentional bounded query; exclusions/keys are plugin-controlled, not user request input.
261	'exclude' => ['image'],
262	'selector' => '{{WRAPPER}} .pg-walden-grid .pg-walden-item',
263	// 'fields_options' => [
264	// 'background' => [
265	// 'default' => 'classic',
266	// ],
267	// 'color' => [
268	// 'default' => '#F5FCFF',
269	// ],
270	// ],
271	]
272	);
273
274	$this->add_group_control(
275	Group_Control_Border::get_type(),
276	[
277	'name' => 'item_border',
278	'selector' => '{{WRAPPER}} .pg-walden-grid .pg-walden-item',
279	'separator' => 'before',
280	]
281	);
282
283	$this->add_responsive_control(
284	'item_border_radius',
285	[
286	'label' => esc_html__('Border Radius', 'pixel-gallery'),
287	'type' => Controls_Manager::DIMENSIONS,
288	'size_units' => ['px', 'em', '%'],
289	'selectors' => [
290	'{{WRAPPER}} .pg-walden-grid .pg-walden-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
291	],
292	]
293	);
294
295	$this->add_responsive_control(
296	'item_padding',
297	[
298	'label' => esc_html__('Padding', 'pixel-gallery'),
299	'type' => Controls_Manager::DIMENSIONS,
300	'size_units' => ['px', 'em', '%'],
301	'selectors' => [
302	'{{WRAPPER}} .pg-walden-grid .pg-walden-item' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
303	],
304	]
305	);
306
307
308	$this->add_responsive_control(
309	'item_margin',
310	[
311	'label' => esc_html__('Margin', 'pixel-gallery'),
312	'type' => Controls_Manager::DIMENSIONS,
313	'size_units' => ['px', 'em', '%'],
314	'selectors' => [
315	'{{WRAPPER}} .pg-walden-grid .pg-walden-top-content, {{WRAPPER}} .pg-walden-grid .pg-walden-meta' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
316	],
317	]
318	);
319
320	$this->add_group_control(
321	Group_Control_Box_Shadow::get_type(),
322	[
323	'name' => 'item_box_shadow',
324	'selector' => '{{WRAPPER}} .pg-walden-grid .pg-walden-item',
325	]
326	);
327
328	$this->end_controls_tab();
329
330	$this->start_controls_tab(
331	'tab_item_hover',
332	[
333	'label' => esc_html__('Hover', 'pixel-gallery'),
334	]
335	);
336
337	$this->add_group_control(
338	Group_Control_Background::get_type(),
339	[
340	'name' => 'item_hover_background',
341	'label' => esc_html__('Background', 'pixel-gallery'),
342	'types' => ['classic', 'gradient'],
343	// phpcs:ignore WordPressVIPMinimum.Performance.WPQueryParams, WordPress.DB.SlowDBQuery -- Intentional bounded query; exclusions/keys are plugin-controlled, not user request input.
344	'exclude' => ['image'],
345	'selector' => '{{WRAPPER}} .pg-walden-grid .pg-walden-item:hover',
346	]
347	);
348
349	$this->add_control(
350	'item_hover_border_color',
351	[
352	'label' => esc_html__('Border Color', 'pixel-gallery'),
353	'type' => Controls_Manager::COLOR,
354	'condition' => [
355	'item_border_border!' => '',
356	],
357	'selectors' => [
358	'{{WRAPPER}} .pg-walden-grid .pg-walden-item:hover' => 'border-color: {{VALUE}};',
359	],
360	]
361	);
362
363	$this->add_group_control(
364	Group_Control_Box_Shadow::get_type(),
365	[
366	'name' => 'item_hover_box_shadow',
367	'selector' => '{{WRAPPER}} .pg-walden-grid .pg-walden-item:hover',
368	]
369	);
370
371	$this->end_controls_tab();
372
373	$this->end_controls_tabs();
374
375	$this->end_controls_section();
376
377	//Global Title Controls
378	$this->register_title_controls('walden');
379
380	$this->start_controls_section(
381	'section_style_meta',
382	[
383	'label' => __('Meta', 'pixel-gallery'),
384	'tab' => Controls_Manager::TAB_STYLE,
385	'conditions' => [
386	'terms' => [
387	[
388	'name' => 'show_follow',
389	'value' => 'yes',
390	],
391	[
392	'name' => 'show_like',
393	'value' => 'yes',
394	],
395	],
396	],
397	]
398	);
399
400	$this->add_control(
401	'meta_color',
402	[
403	'label' => __('Color', 'pixel-gallery'),
404	'type' => Controls_Manager::COLOR,
405	'selectors' => [
406	'{{WRAPPER}} .pg-walden-grid .pg-walden-follow-btn, {{WRAPPER}} .pg-walden-grid .pg-walden-like-btn' => 'color: {{VALUE}};',
407	],
408	]
409	);
410
411	$this->add_responsive_control(
412	'meta_margin',
413	[
414	'label' => esc_html__('Margin', 'pixel-gallery'),
415	'type' => Controls_Manager::DIMENSIONS,
416	'size_units' => ['px', 'em', '%'],
417	'selectors' => [
418	'{{WRAPPER}} .pg-walden-grid .pg-walden-follow-btn, {{WRAPPER}} .pg-walden-grid .pg-walden-like-btn' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
419	],
420	]
421	);
422
423	$this->add_group_control(
424	Group_Control_Typography::get_type(),
425	[
426	'name' => 'meta_typography',
427	'selector' => '{{WRAPPER}} .pg-walden-grid .pg-walden-follow-btn, {{WRAPPER}} .pg-walden-grid .pg-walden-like-btn',
428	]
429	);
430
431	$this->end_controls_section();
432
433	//Global Readmore Controls
434	$this->register_readmore_controls('walden');
435
436	//Clip Path Controls
437	$this->register_clip_path_controls('walden');
438	}
439
440	public function render_items() {
441	$settings = $this->get_settings_for_display();
442	$id = 'pg-walden-' . $this->get_id();
443	$slide_index = 1;
444	foreach ($settings['items'] as $index => $item) :
445
446	$attr_name = 'grid-item' . $index;
447	$this->add_render_attribute($attr_name, 'class', 'pg-walden-item pg-item elementor-repeater-item-' . esc_attr($item['_id']), true);
448
449	/**
450	* Render Video Inject Here
451	* Video Would be work on Media File & Lightbox
452	* @since 1.0.0
453	*/
454	if ($item['media_type'] == 'video') {
455	$this->render_video_frame($item, $attr_name, $id);
456	}
457
458	?>
459
460	<div <?php $this->print_render_attribute_string($attr_name); ?>>
461	<?php if ($item['item_hidden'] !== 'yes') : ?>
462	<?php $this->render_image_wrap($item, 'walden'); ?>
463	<div class="pg-walden-head-content">
464	<?php $this->render_title($item, 'walden'); ?>
465	</div>
466	<div class="pg-walden-center-content">
467	<?php if ('none' !== $settings['link_to'] && $settings['link_target'] == 'only_button') : ?>
468	<?php $this->render_readmore_icon($item, $index, $id, 'walden'); ?>
469	<?php endif; ?>
470	</div>
471	<div class="pg-walden-bottom-content">
472	<?php if ($settings['show_follow'] == 'yes') : ?>
473	<div class="pg-walden-follow-btn">
474	<i class="pg-icon-preview"></i>
475	<span><?php echo esc_html($item['follow']); ?></span>
476	</div>
477	<?php endif; ?>
478	<?php if ( 'yes' === $settings['show_like'] ) : ?>
479	<div class="pg-walden-like-btn">
480	<i class="pg-icon-heart"></i>
481	<span><?php echo esc_html($item['like']); ?></span>
482	</div>
483	<?php endif; ?>
484	</div>
485	<?php if ('none' !== $settings['link_to'] && $settings['link_target'] == 'whole_item') : ?>
486	<?php $this->render_lightbox_link_url($item, $index, $id); ?>
487	<?php endif; ?>
488	<?php endif; ?>
489	</div>
490
491	<?php
492	$slide_index++;
493	endforeach;
494	}
495
496	public function render() {
497	$settings = $this->get_settings_for_display();
498	$this->add_render_attribute('grid', 'class', 'pg-walden-grid pg-grid pg-walden-effect-style-' . $settings["layout_style"] . '');
499
500	/**
501	* Render Justified Gallery Attributes
502	*/
503	$this->render_justified_gallery_attributes('grid');
504
505	if (isset($settings['pg_in_animation_show']) && ($settings['pg_in_animation_show'] == 'yes')) {
506	$this->add_render_attribute( 'grid', 'class', 'pg-in-animation' );
507	if (isset($settings['pg_in_animation_delay']['size'])) {
508	$this->add_render_attribute( 'grid', 'data-in-animation-delay', $settings['pg_in_animation_delay']['size'] );
509	}
510	}
511
512	?>
513	<div <?php $this->print_render_attribute_string('grid'); ?>>
514	<?php $this->render_items(); ?>
515	</div>
516	<?php
517	}
518	/**
519	* Elementor editor Backbone template.
520	*/
521	protected function content_template() {
522	?>
523	<#
524	var items = settings.items \|\| [];
525	var animDelay = ( settings.pg_in_animation_delay && settings.pg_in_animation_delay.size ) ? settings.pg_in_animation_delay.size : '';
526	var gridClass = 'pg-walden-grid pg-grid';
527	if ( settings.layout_style ) { gridClass += ' pg-walden-effect-style-' + settings.layout_style; }
528	if ( settings.pg_in_animation_show === 'yes' ) { gridClass += ' pg-in-animation'; }
529	#>
530	<div class="{{{ gridClass }}}"
531	<# if ( settings.pg_in_animation_show === 'yes' && animDelay !== '' ) { #> data-in-animation-delay="{{ animDelay }}"<# } #>
532	>
533	<# _.each( items, function( item, index ) {
534	var itemClass = 'pg-walden-item pg-item elementor-repeater-item-' + item._id;
535	#>
536	<div class="{{{ itemClass }}}">
537	<# if ( item.item_hidden !== 'yes' ) { #>
538	<div class="pg-walden-image-wrap bdt-pg-img-mask">
539	<# if ( item.media_type === 'video' ) { #>
540	<# if ( item.poster && item.poster.url ) { #>
541	<img src="{{ item.poster.url }}" alt="{{ item.title }}" class="pg-walden-img">
542	<# } #>
543	<# } else if ( item.image && item.image.url ) { #>
544	<img src="{{ item.image.url }}" alt="{{ item.title }}" class="pg-walden-img">
545	<# } #>
546	<# if ( settings.link_to === 'file' && item.media_type === 'video' ) { #>
547	<span class="pg-video-icon-wrap">
548	<i class="pg-icon-play-circle pg-eicon-play"></i>
549	</span>
550	<# } #>
551	</div>
552	<div class="pg-walden-head-content">
553	<# if ( settings.show_title === 'yes' && item.title ) { #>
554	<# var ttag = settings.title_tag \|\| 'h3'; #>
555	<{{{ ttag }}} class="pg-walden-title">{{{ item.title }}}</{{{ ttag }}}>
556	<# } #>
557	</div>
558	<div class="pg-walden-center-content">
559	<# if ( settings.link_to !== 'none' && ( settings.link_target \|\| 'whole_item' ) === 'only_button' ) { #>
560	<div class="pg-walden-readmore">
561	<?php $this->print_content_template_item_link_prepare( 'walden' ); ?>
562	<?php $this->print_content_template_item_link_wrap_open(); ?>
563	<?php $this->print_content_template_item_link_a_open(); ?>
564	<i class="pg-icon-arrow-right" aria-hidden="true"></i>
565	<?php $this->print_content_template_item_link_a_close(); ?>
566	<?php $this->print_content_template_item_link_wrap_close(); ?>
567	</div>
568	<# } #>
569	</div>
570	<div class="pg-walden-bottom-content">
571	<# if ( settings.show_follow === 'yes' && item.follow ) { #>
572	<div class="pg-walden-follow-btn"><i class="pg-icon-preview"></i><span>{{ item.follow }}</span></div>
573	<# } #>
574	<# if ( settings.show_like === 'yes' && item.like ) { #>
575	<div class="pg-walden-like-btn"><i class="pg-icon-heart"></i><span>{{ item.like }}</span></div>
576	<# } #>
577	</div>
578	<# if ( settings.link_to !== 'none' && ( settings.link_target \|\| 'whole_item' ) === 'whole_item' ) { #>
579	<?php $this->print_content_template_lightbox_overlay( 'walden' ); ?>
580	<# } #>
581	<# } #>
582	</div>
583	<# } ); #>
584	</div>
585	<?php
586	}
587
588	}
589