gallery.php — Shortcodes and extra features for Phlox theme 2.17.14

auxin-elements / includes / elementor / widgets / gallery.php

auxin-elements / includes / elementor / widgets Last commit date

gallery.php

558 lines

1	<?php
2	namespace Auxin\Plugin\CoreElements\Elementor\Elements;
3
4	use Elementor\Widget_Base;
5	use Elementor\Controls_Manager;
6	use Elementor\Core\Kits\Documents\Tabs\Global_Colors;
7	use Elementor\Group_Control_Border;
8
9
10	if ( ! defined( 'ABSPATH' ) ) {
11	exit; // Exit if accessed directly.
12	}
13
14	/**
15	* Elementor 'gallery' widget.
16	*
17	* Elementor widget that displays an 'gallery' with lightbox.
18	*
19	* @since 1.0.0
20	*/
21	class Gallery extends Widget_Base {
22
23	/**
24	* Get widget name.
25	*
26	* Retrieve 'gallery' widget name.
27	*
28	* @since 1.0.0
29	* @access public
30	*
31	* @return string Widget name.
32	*/
33	public function get_name() {
34	return 'aux-gallery';
35	}
36
37	/**
38	* Get widget title.
39	*
40	* Retrieve 'gallery' widget title.
41	*
42	* @since 1.0.0
43	* @access public
44	*
45	* @return string Widget title.
46	*/
47	public function get_title() {
48	return __( 'Modern Gallery', 'auxin-elements' );
49	}
50
51	public function has_widget_inner_wrapper(): bool {
52	return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
53	}
54
55
56	/**
57	* Get widget icon.
58	*
59	* Retrieve 'gallery' widget icon.
60	*
61	* @since 1.0.0
62	* @access public
63	*
64	* @return string Widget icon.
65	*/
66	public function get_icon() {
67	return 'eicon-gallery-grid auxin-badge';
68	}
69
70	/**
71	* Get widget categories.
72	*
73	* Retrieve 'gallery' widget icon.
74	*
75	* @since 1.0.0
76	* @access public
77	*
78	* @return string Widget icon.
79	*/
80	public function get_categories() {
81	return array( 'auxin-core' );
82	}
83
84	/**
85	* Register 'gallery' widget controls.
86	*
87	* Adds different input fields to allow the user to change and customize the widget settings.
88	*
89	* @since 1.0.0
90	* @access protected
91	*/
92	protected function register_controls() {
93
94	$this->start_controls_section(
95	'section_gallery',
96	array(
97	'label' => __( 'Gallery Images', 'auxin-elements' ),
98	)
99	);
100
101	$this->add_control(
102	'wp_gallery',
103	array(
104	'label' => __( 'Add Images', 'auxin-elements' ),
105	'type' => Controls_Manager::GALLERY,
106	'show_label' => false,
107	'dynamic' => array(
108	'active' => true,
109	)
110	)
111	);
112
113	$this->add_control(
114	'layout',
115	array(
116	'label' => __( 'Gallery layout', 'auxin-elements' ),
117	'type' => Controls_Manager::SELECT,
118	'default' => 'grid',
119	'options' => array(
120	'grid' => __( 'Grid', 'auxin-elements' ),
121	'masonry' => __( 'Masonry', 'auxin-elements' ),
122	'tiles' => __( 'Tiles', 'auxin-elements' ),
123	),
124	)
125	);
126
127	$this->add_control(
128	'tile_style_pattern',
129	array(
130	'label' => __( 'Tile styles', 'auxin-elements' ),
131	'type' => Controls_Manager::SELECT,
132	'default' => 'default',
133	'options' => array(
134	'default' => __( 'Default', 'auxin-elements' ),
135	'pattern-1' => __( 'Pattern 1', 'auxin-elements' ),
136	'pattern-2' => __( 'Pattern 2', 'auxin-elements' ),
137	'pattern-3' => __( 'Pattern 3', 'auxin-elements' ),
138	'pattern-4' => __( 'Pattern 4', 'auxin-elements' ),
139	'pattern-5' => __( 'Pattern 5', 'auxin-elements' ),
140	'pattern-6' => __( 'Pattern 6', 'auxin-elements' ),
141	'pattern-7' => __( 'Pattern 7', 'auxin-elements' )
142	),
143	'condition' => array(
144	'layout' => 'tiles',
145	),
146	)
147	);
148
149	$gallery_columns = range( 1, 6 );
150	$gallery_columns = array_combine( $gallery_columns, $gallery_columns );
151
152	$this->add_responsive_control(
153	'columns',
154	array(
155	'label' => __( 'Columns', 'auxin-elements' ),
156	'type' => Controls_Manager::SELECT,
157	'default' => '4',
158	'tablet_default' => '2',
159	'mobile_default' => '1',
160	'options' => $gallery_columns,
161	'condition' => array(
162	'layout' => array('masonry','grid')
163	)
164	)
165	);
166
167	$this->add_control(
168	'space',
169	array(
170	'label' => __( 'Image spacing', 'auxin-elements' ),
171	'type' => Controls_Manager::SLIDER,
172	'default' => array(
173	'size' => 10,
174	),
175	'range' => array(
176	'px' => array(
177	'min' => 0,
178	'max' => 40,
179	'step' => 1,
180	)
181	),
182	'condition' => array(
183	'layout' => array('masonry','grid', 'tiles')
184	)
185	)
186	);
187
188	$this->add_responsive_control(
189	'image_aspect_ratio',
190	array(
191	'label' => __( 'Image aspect ratio', 'auxin-elements' ),
192	'type' => Controls_Manager::SLIDER,
193	'default' => array(
194	'size' => 0.75,
195	),
196	'range' => array(
197	'px' => array(
198	'min' => 0.1,
199	'max' => 2,
200	'step' => 0.01,
201	)
202	),
203	'selectors' => array(
204	'{{WRAPPER}} .aux-layout-masonry .aux-frame-ratio' => 'padding-bottom:calc( {{SIZE}} * 100% )'
205	),
206	'condition' => array(
207	'layout' => 'grid'
208	)
209	)
210	);
211
212	$this->add_control(
213	'link',
214	array(
215	'label' => __( 'Link to', 'auxin-elements' ),
216	'type' => Controls_Manager::SELECT,
217	'default' => 'lightbox',
218	'options' => array(
219	'file' => __( 'Media File', 'auxin-elements' ),
220	'attachment' => __( 'Attachment Page', 'auxin-elements' ),
221	'lightbox' => __( 'Lightbox', 'auxin-elements' ),
222	'none' => __( 'None', 'auxin-elements' )
223	),
224	)
225	);
226
227	$this->add_control(
228	'pagination',
229	array(
230	'label' => __( 'Pagination', 'auxin-elements' ),
231	'type' => Controls_Manager::SWITCHER,
232	'label_off' => __( 'On', 'auxin-elements' ),
233	'label_on' => __( 'Off', 'auxin-elements' ),
234	'default' => 'no'
235	)
236	);
237
238	$this->add_control(
239	'lazyload',
240	array(
241	'label' => __( 'Enable lazyload', 'auxin-elements' ),
242	'type' => Controls_Manager::SWITCHER,
243	'label_off' => __( 'On', 'auxin-elements' ),
244	'label_on' => __( 'Off', 'auxin-elements' ),
245	'default' => 'no',
246	'condition' => array(
247	'pagination' => 'yes'
248	)
249	)
250	);
251
252	$this->add_control(
253	'perpage',
254	array(
255	'label' => __( 'Images per page', 'auxin-elements' ),
256	'type' => Controls_Manager::SLIDER,
257	'range' => array(
258	'px' => array(
259	'max' => 100,
260	)
261	),
262	'default' => array(
263	'size' => 24,
264	),
265	'condition' => array(
266	'pagination' => 'yes'
267	)
268	)
269	);
270
271	$this->add_control(
272	'wp_order',
273	array(
274	'label' => __( 'Order by query', 'auxin-elements' ),
275	'type' => Controls_Manager::SWITCHER,
276	'label_off' => __( 'On', 'auxin-elements' ),
277	'label_on' => __( 'Off', 'auxin-elements' ),
278	'default' => 'no'
279	)
280	);
281
282	$this->add_control(
283	'order',
284	array(
285	'label' => __( 'Order', 'auxin-elements' ),
286	'type' => Controls_Manager::SELECT,
287	'default' => 'ASC',
288	'options' => array(
289	'ASC' => __( 'ASC', 'auxin-elements' ),
290	'DESC' => __( 'DESC', 'auxin-elements' )
291	),
292	'condition' => array(
293	'wp_order' => 'yes',
294	)
295	)
296	);
297
298	$this->add_control(
299	'orderby',
300	array(
301	'label' => __( 'Order images by', 'auxin-elements' ),
302	'type' => Controls_Manager::SELECT,
303	'default' => 'menu_order ID',
304	'options' => array(
305	'menu_order ID' => __( 'Menu Order', 'auxin-elements' ),
306	'date' => __( 'date', 'auxin-elements' ),
307	'ID' => __( 'ID', 'auxin-elements' ),
308	'none' => __( 'None', 'auxin-elements' )
309	),
310	'condition' => array(
311	'wp_order' => 'yes',
312	)
313	)
314	);
315
316	$this->end_controls_section();
317
318	/*$this->start_controls_section(
319	'section_caption',
320	array(
321	'label' => __( 'Caption', 'auxin-elements' ),
322	'tab' => Controls_Manager::TAB_STYLE,
323	)
324	);
325
326	$this->add_control(
327	'caption_display',
328	array(
329	'label' => __( 'Display', 'auxin-elements' ),
330	'type' => Controls_Manager::SELECT,
331	'default' => '',
332	'options' => array(
333	'yes' => __( 'Show', 'auxin-elements' ),
334	'no' => __( 'Hide', 'auxin-elements' ),
335	),
336	'selectors' => array(
337	'{{WRAPPER}} .gallery-item .gallery-caption' => 'display: {{VALUE}};',
338	)
339	)
340	);
341
342	$this->add_control(
343	'caption_align',
344	array(
345	'label' => __( 'Alignment', 'auxin-elements' ),
346	'type' => Controls_Manager::CHOOSE,
347	'options' => array(
348	'left' => array(
349	'title' => __( 'Left', 'auxin-elements' ),
350	'icon' => 'eicon-text-align-left',
351	),
352	'center' => array(
353	'title' => __( 'Center', 'auxin-elements' ),
354	'icon' => 'eicon-text-align-center',
355	),
356	'right' => array(
357	'title' => __( 'Right', 'auxin-elements' ),
358	'icon' => 'eicon-text-align-right',
359	),
360	'justify' => array(
361	'title' => __( 'Justified', 'auxin-elements' ),
362	'icon' => 'fa fa-align-justify',
363	),
364	),
365	'default' => 'center',
366	'selectors' => array(
367	'{{WRAPPER}} .gallery-item .gallery-caption' => 'text-align: {{VALUE}};',
368	),
369	'condition' => array(
370	'caption_display' => 'yes'
371	),
372	)
373	);
374
375	$this->add_control(
376	'caption_color',
377	array(
378	'label' => __( 'Text Color', 'auxin-elements' ),
379	'type' => Controls_Manager::COLOR,
380	'default' => '',
381	'selectors' => array(
382	'{{WRAPPER}} .gallery-item .gallery-caption' => 'color: {{VALUE}};',
383	),
384	'condition' => array(
385	'caption_display' => 'yes'
386	),
387	)
388	);
389
390	$this->add_group_control(
391	Group_Control_Typography::get_type(),
392	array(
393	'name' => 'typography',
394	'global' => [
395	'default' => Global_Typography::TYPOGRAPHY_TEXT,
396	],
397	'selector' => '{{WRAPPER}} .gallery-item .gallery-caption',
398	'condition' => array(
399	'caption_display' => 'yes'
400	),
401	)
402	);
403
404	$this->end_controls_section();*/
405
406	$this->start_controls_section(
407	'section_image_hover',
408	array(
409	'label' => __( 'Image Hover', 'auxin-elements' ),
410	'tab' => Controls_Manager::TAB_STYLE
411	)
412	);
413
414	$this->add_control(
415	'image_hover_overlay_color',
416	array(
417	'label' => __( 'Image hover overlay color', 'auxin-elements' ),
418	'type' => Controls_Manager::COLOR,
419	'global' => [
420	'default' => Global_Colors::COLOR_ACCENT,
421	],
422	'default' => 'rgba(0, 0, 0, 0.7)',
423	'selectors' => array(
424	'{{WRAPPER}} .aux-gallery-container .aux-frame-darken::after' => 'background-color: {{VALUE}}'
425	)
426	)
427	);
428
429	$this->add_control(
430	'image_hover_transition_duration',
431	array(
432	'label' => __( 'Image hover transition duration (milliseconds)', 'auxin-elements' ),
433	'type' => Controls_Manager::SLIDER,
434	'default' => array(
435	'size' => 1000,
436	),
437	'range' => array(
438	'px' => array(
439	'min' => 0,
440	'max' => 5000,
441	'step' => 10
442	)
443	),
444	'selectors' => array(
445	'{{WRAPPER}} .aux-gallery-container .aux-frame-darken::after, {{WRAPPER}} .aux-gallery-container .aux-frame-mask-plain' => 'transition-duration:{{SIZE}}ms;'
446	)
447	)
448	);
449
450	$this->add_control(
451	'image_hover_zoom',
452	array(
453	'label' => __( 'Image hover zoom', 'auxin-elements' ),
454	'type' => Controls_Manager::SLIDER,
455	'default' => array(
456	'size' => 120,
457	),
458	'range' => array(
459	'px' => array(
460	'min' => 0,
461	'max' => 250,
462	'step' => 1
463	)
464	),
465	'selectors' => array(
466	'{{WRAPPER}} .aux-gallery-container .aux-hover-active:hover .aux-frame-mask-plain' =>
467	'-webkit-transform: perspective(1000) translateZ(-{{SIZE}}px); transform: perspective(1000) translateZ(-{{SIZE}}px);'
468	)
469	)
470	);
471
472	$this->end_controls_section();
473
474
475	$this->start_controls_section(
476	'section_image_border',
477	array(
478	'label' => __( 'Image Border', 'auxin-elements' ),
479	'tab' => Controls_Manager::TAB_STYLE
480	)
481	);
482
483	$this->add_group_control(
484	Group_Control_Border::get_type(),
485	array(
486	'name' => 'image_border',
487	'selector' => '{{WRAPPER}} .aux-gallery-container .gallery-item .aux-frame-ratio-inner',
488	'separator' => 'before'
489	)
490	);
491
492	$this->add_control(
493	'image_border_radius',
494	array(
495	'label' => __( 'Border Radius', 'auxin-elements' ),
496	'type' => Controls_Manager::DIMENSIONS,
497	'size_units' => array( 'px', '%' ),
498	'selectors' => array(
499	'{{WRAPPER}} .aux-gallery-container .gallery-item .aux-frame-ratio-inner' => 'overflow:hidden;',
500	'{{WRAPPER}} .aux-gallery-container .gallery-item .aux-frame-ratio-inner, {{WRAPPER}} .aux-gallery-container .aux-frame-ratio-inner:after' => 'border-radius:{{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
501	)
502	)
503	);
504
505	$this->end_controls_section();
506	}
507
508	/**
509	* Render image box widget output on the frontend.
510	*
511	* Written in PHP and used to generate the final HTML.
512	*
513	* @since 1.0.0
514	* @access protected
515	*/
516	protected function render() {
517	global $post;
518	$settings = $this->get_settings_for_display();
519
520	if ( ! $settings['wp_gallery'] ) {
521	return;
522	}
523
524	$ids = wp_list_pluck( $settings['wp_gallery'], 'id' );
525	$perpage = !empty( $settings['perpage']['size'] ) ? $settings['perpage']['size'] : 24;
526
527	$tablet_columns = !empty( $settings['columns_tablet'] ) ? $settings['columns_tablet'] : 2;
528	$mobile_columns = !empty( $settings['columns_mobile'] ) ? $settings['columns_mobile'] : 1;
529
530	// Gallery attributes
531	$args = array(
532	//'default_image_size' => 'medium',
533	'include' => $ids,
534	'order' => $settings['order'],
535	'orderby' => $settings['orderby'],
536	'columns' => $settings['columns'],
537	'tablet_cnum' => $tablet_columns,
538	'phone_cnum' => $mobile_columns,
539	'space' => $settings['space']['size'],
540	'image_aspect_ratio' => !empty( $settings['image_aspect_ratio']['size'] ) ? $settings['image_aspect_ratio']['size'] : 0.75,
541	'layout' => $settings['layout'],
542	'tile_style_pattern' => $settings['tile_style_pattern'],
543	'link' => $settings['link'],
544	'perpage' => $perpage,
545	'pagination' => $settings['pagination'],
546	'lazyload' => $settings['lazyload'],
547	'wp_order' => $settings['wp_order']
548	// 'caption_display' => $settings['caption_display'],
549	// 'caption_align' => $settings['caption_align'],
550	// 'caption_color' => $settings['caption_color']
551	);
552
553	// render the markup using element base fallback
554	echo auxin_widget_gallery_callback( $args );
555	}
556
557	}
558