shopbuilder / app / Elementor / Widgets / Controls / ProductImagesSettings.php

ProductImagesSettings.php in ShopBuilder – WooCommerce Builder For Elementor 2.2.2, at app/Elementor/Widgets/Controls/ProductImagesSettings.php

584 lines 15.6 KB

Raw Download Zip

1	<?php
2	/**
3	* Main ProductImagesSettings class.
4	*
5	* @package RadiusTheme\SB
6	*/
7
8	namespace RadiusTheme\SB\Elementor\Widgets\Controls;
9
10	use Elementor\Controls_Manager;
11	use RadiusTheme\SB\Helpers\Fns;
12
13	// Do not allow directly accessing this file.
14	if ( ! defined( 'ABSPATH' ) ) {
15	exit( 'This script cannot be accessed directly.' );
16	}
17
18
19	/**
20	* Product Image Settings class
21	*/
22	class ProductImagesSettings {
23
24	/**
25	* Widget Control Selectors
26	*
27	* @var array
28	*/
29	private static $selectors = [];
30	/**
31	* Widget Field
32	*
33	* @return array
34	*/
35	public static function widget_fields( $widget ) {
36	self::$selectors = $widget->selectors;
37	return self::general_section() +
38	self::image() +
39	self::flash_sale( $widget ) +
40	self::zoom_icon();
41	}
42
43	/**
44	* Widget Field
45	*
46	* @return array
47	*/
48	public static function general_section() {
49	$fields = [
50	'image_general_section_start' => [
51	'mode' => 'section_start',
52	'label' => esc_html__( 'General', 'shopbuilder' ),
53	],
54
55	'sale_flash_badge' => [
56	'label' => esc_html__( 'Show Flash Sale?', 'shopbuilder' ),
57	'type' => 'switch',
58	'description' => esc_html__( 'Switch on to show Flash Sale.', 'shopbuilder' ),
59	'default' => 'yes',
60	],
61
62	'show_module_badges' => [
63	'label' => esc_html__( 'Show Badges?', 'shopbuilder' ),
64	'type' => 'switch',
65	'description' => esc_html__( 'Switch on to show the Badges form from the Module..', 'shopbuilder' ),
66	'default' => 'yes',
67	],
68	'show_thumbnails' => [
69	'label' => esc_html__( 'Show Thumbnails?', 'shopbuilder' ),
70	'type' => 'switch',
71	'description' => esc_html__( 'Switch on to show Thumbnails.', 'shopbuilder' ),
72	'default' => 'yes',
73	],
74
75	'show_zoom' => [
76	'label' => esc_html__( 'Show Zoom Icon?', 'shopbuilder' ),
77	'type' => 'switch',
78	'description' => esc_html__( 'Switch on to show Zoom Icon.', 'shopbuilder' ),
79	'default' => 'yes',
80	],
81	'lightbox_icon' => [
82	'label' => esc_html__( 'Icon', 'shopbuilder' ),
83	'type' => 'icons',
84	'fa4compatibility' => 'icon',
85	'default' => [
86	'value' => 'fas fa-expand-alt',
87	'library' => 'fa-solid',
88	],
89	'condition' => [
90	'show_zoom' => 'yes',
91	],
92	],
93	'image_general_section_end' => [
94	'mode' => 'section_end',
95	],
96	];
97
98	if ( function_exists( 'rtwpvg' ) && rtwpvg()->active_pro() ) {
99	$image_layout = [
100	'image_layout' => [
101	'type' => 'rtsb-image-selector',
102	'label' => esc_html__( 'Image Layout', 'shopbuilder' ),
103	'description' => esc_html__( 'Please choose image layout. The layout display the change after reload.', 'shopbuilder' ),
104	'options' => [
105	'bottom' => [
106	'title' => esc_html__( 'Gallery Bottom', 'shopbuilder' ),
107	'url' => esc_url( rtsb()->get_assets_uri( 'images/layout/image-layout-gallery-bottom-2.png' ) ),
108	],
109	'left' => [
110	'title' => esc_html__( 'Gallery left', 'shopbuilder' ),
111	'url' => esc_url( rtsb()->get_assets_uri( 'images/layout/image-layout-gallery-left-2.png' ) ),
112	],
113	'right' => [
114	'title' => esc_html__( 'Gallery Right', 'shopbuilder' ),
115	'url' => esc_url( rtsb()->get_assets_uri( 'images/layout/image-layout-gallery-right-2.png' ) ),
116	],
117	'grid' => [
118	'title' => esc_html__( 'Gallery Grid', 'shopbuilder' ),
119	'url' => esc_url( rtsb()->get_assets_uri( 'images/layout/image-layout-gallery-grid-2.png' ) ),
120	],
121	],
122	'default' => 'bottom',
123	],
124	];
125	$fields = Fns::insert_controls( 'image_general_section_start', $fields, $image_layout, true );
126
127	}
128
129	return $fields;
130	}
131
132	/**
133	* Widget Field
134	*
135	* @return array
136	*/
137	public static function image() {
138	$fields = [
139	'image_section_start' => [
140	'mode' => 'section_start',
141	'label' => esc_html__( 'Product Image', 'shopbuilder' ),
142	],
143	'image_width' => [
144	'label' => esc_html__( 'Image Width', 'shopbuilder' ),
145	'type' => 'slider',
146	'size_units' => [ '%', 'px' ],
147	'range' => [
148	'%' => [
149	'min' => 0,
150	'max' => 100,
151	'step' => 1,
152	],
153	'px' => [
154	'min' => 0,
155	'max' => 2000,
156	'step' => 1,
157	],
158	],
159	'default' => [
160	'unit' => '%',
161	],
162	'separator' => 'default',
163	'selectors' => [
164	self::$selectors['image_width'] => 'width: {{SIZE}}{{UNIT}} !important;',
165	],
166	],
167	'image_border_radius' => [
168	'label' => esc_html__( 'Border Radius', 'shopbuilder' ),
169	'type' => 'slider',
170	'size_units' => [ 'px', '%' ],
171	'range' => [
172	'px' => [
173	'min' => 0,
174	'max' => 100,
175	'step' => 1,
176	],
177	'%' => [
178	'min' => 0,
179	'max' => 100,
180	'step' => 1,
181	],
182	],
183	'selectors' => [
184	self::$selectors['image_border_radius'] => 'border-radius: {{SIZE}}{{UNIT}} !important;',
185	],
186	],
187	'gallery_thumbs_style' => [
188	'type' => 'html',
189	'raw' => sprintf(
190	'<h3 class="rtsb-elementor-group-heading">%s</h3>',
191	esc_html__( 'Gallery Thumbnails', 'shopbuilder' )
192	),
193	'content_classes' => 'elementor-panel-heading-title',
194	],
195
196	'gallery_thumbs_column_gap' => [
197	'mode' => 'responsive',
198	'label' => esc_html__( 'Thumbnail Gap', 'shopbuilder' ),
199	'description' => esc_html__( 'Gallery Thumbnails Gap Is required.', 'shopbuilder' ),
200	'render_type' => 'template',
201	'type' => 'slider',
202	'range' => [
203	'px' => [
204	'min' => 0,
205	'max' => 100,
206	'step' => 1,
207	],
208	],
209	'default' => [
210	'unit' => 'px',
211	'size' => 10,
212	],
213	'desktop_default' => [
214	'size' => 10,
215	'unit' => 'px',
216	],
217	'tablet_default' => [
218	'size' => 10,
219	'unit' => 'px',
220	],
221	'mobile_default' => [
222	'size' => 10,
223	'unit' => 'px',
224	],
225	'selectors' => [
226	':root' => '--rtwpvg-thumbnail-gap:{{SIZE}}{{UNIT}};',
227	],
228	],
229	'gallery_thumbs_column' => [
230	'mode' => 'responsive',
231	'label' => esc_html__( 'Column', 'shopbuilder' ),
232	'description' => esc_html__( 'Above Control the Gallery Thumbnails Gap is required.', 'shopbuilder' ),
233	'type' => 'slider',
234	'range' => [
235	'px' => [
236	'min' => 2,
237	'max' => 8,
238	'step' => 1,
239	],
240	],
241	'default' => [
242	'unit' => 'px',
243	'size' => 6,
244	],
245	'desktop_default' => [
246	'size' => 5,
247	'unit' => 'px',
248	],
249	'tablet_default' => [
250	'size' => 4,
251	'unit' => 'px',
252	],
253	'mobile_default' => [
254	'size' => 3,
255	'unit' => 'px',
256	],
257	'selectors' => [
258	self::$selectors['gallery_thumbs_column'] => 'width: calc(100%/{{SIZE}} - ( {{gallery_thumbs_column_gap.size}}{{gallery_thumbs_column_gap.unit}} / {{SIZE}} ) * ({{SIZE}} - 1 ) );flex: 0 0 auto;max-width: initial;',
259	],
260	],
261	'gallery_image_gap_with_main' => [
262	'mode' => 'responsive',
263	'label' => esc_html__( 'Gap with main image', 'shopbuilder' ),
264	'type' => 'slider',
265	'range' => [
266	'px' => [
267	'min' => 0,
268	'max' => 200,
269	'step' => 1,
270	],
271	],
272	'default' => [
273	'unit' => 'px',
274	'size' => 10,
275	],
276	'selectors' => [
277	':root' => '--rtwpvg-thumbnail-gap-with-main:{{SIZE}}{{UNIT}};',
278	// self::$selectors['gallery_image_gap_with_main']['margin-top'] => 'margin-top: {{SIZE}}{{UNIT}};',
279	// self::$selectors['gallery_image_gap_with_main']['rtwpvg-thumb-mb'] => 'margin-bottom: {{SIZE}}{{UNIT}};',
280	// self::$selectors['gallery_image_gap_with_main']['rtwpvg-thumb-ml'] => 'margin-left: {{SIZE}}{{UNIT}};',
281	// self::$selectors['gallery_image_gap_with_main']['rtwpvg-thumb-mr'] => 'margin-right: {{SIZE}}{{UNIT}};',
282	],
283	],
284	'thumb_border' => [
285	'mode' => 'group',
286	'type' => 'border',
287	'selector' => self::$selectors['thumb_border'],
288	'size_units' => [ 'px' ],
289	],
290	'thumbs_border_radius' => [
291	'label' => esc_html__( 'Border Radius', 'shopbuilder' ),
292	'type' => 'slider',
293	'size_units' => [ 'px', '%' ],
294	'range' => [
295	'px' => [
296	'min' => 0,
297	'max' => 100,
298	'step' => 1,
299	],
300	'%' => [
301	'min' => 0,
302	'max' => 100,
303	'step' => 1,
304	],
305	],
306	'selectors' => [
307	self::$selectors['thumbs_border_radius'] => 'border-radius: {{SIZE}}{{UNIT}}',
308	],
309	],
310	'image_section_end' => [
311	'mode' => 'section_end',
312	],
313	];
314	if ( function_exists( 'rtwpvg' ) ) {
315	unset( $fields['gallery_thumbs_column']['selectors'] );
316	// unset( $fields['gallery_thumbs_column_gap'] );
317	}
318	return $fields;
319	}
320	/**
321	* Widget Field
322	*
323	* @return array
324	*/
325	public static function flash_sale( $widget ) {
326	$fields = ProductFlashSale::flash_sale( $widget );
327
328	$fields['flash_sale_section_start']['condition'] = [
329	'sale_flash_badge' => 'yes',
330	];
331
332	$extra_controls = [];
333
334	$extra_controls['flash_sale_position'] = [
335	'label' => esc_html__( 'Position', 'shopbuilder' ),
336	'type' => 'choose',
337	'options' => [
338	'left' => [
339	'title' => esc_html__( 'Left', 'shopbuilder' ),
340	'icon' => 'eicon-h-align-left',
341	],
342	'right' => [
343	'title' => esc_html__( 'Right', 'shopbuilder' ),
344	'icon' => 'eicon-h-align-right',
345	],
346	],
347	'default' => 'left',
348	'separator' => 'before',
349	];
350
351	$extra_controls['flash_sale_position_horizontal'] = [
352	'label' => esc_html__( 'Horizontal', 'shopbuilder' ),
353	'type' => 'slider',
354	'size_units' => [ 'px', '%' ],
355	'range' => [
356	'px' => [
357	'min' => -100,
358	'max' => 100,
359	'step' => 5,
360	],
361	'%' => [
362	'min' => 0,
363	'max' => 100,
364	],
365	],
366	'default' => [
367	'unit' => 'px',
368	'size' => 0,
369	],
370	'selectors' => [
371	$widget->selectors['flash_sale_position_horizontal'] => '{{flash_sale_position.VALUE}}: {{SIZE}}{{UNIT}};position: absolute;z-index: 2;',
372	],
373	];
374	$extra_controls['flash_sale_position_vertical'] = [
375	'label' => esc_html__( 'Vertical', 'shopbuilder' ),
376	'type' => 'slider',
377	'size_units' => [ 'px', '%' ],
378	'range' => [
379	'px' => [
380	'min' => -100,
381	'max' => 100,
382	'step' => 5,
383	],
384	'%' => [
385	'min' => 0,
386	'max' => 100,
387	],
388	],
389	'default' => [
390	'unit' => 'px',
391	'size' => 0,
392	],
393	'selectors' => [
394	$widget->selectors['flash_sale_position_vertical'] => 'top: {{SIZE}}{{UNIT}};position: absolute;z-index: 2;',
395	],
396	];
397
398	$fields = Fns::insert_controls( 'flash_sale_badge_border_radius', $fields, $extra_controls );
399
400	return $fields;
401	}
402	/**
403	* Widget Field
404	*
405	* @return array
406	*/
407	public static function zoom_icon() {
408	$fields = [
409	'zoom_section_start' => [
410	'mode' => 'section_start',
411	'label' => esc_html__( 'Image Zoom', 'shopbuilder' ),
412	'tab' => 'style',
413	'condition' => [
414	'show_zoom' => 'yes',
415	],
416	],
417	'zoom_color' => [
418	'label' => esc_html__( 'Color', 'shopbuilder' ),
419	'type' => 'color',
420
421	'separator' => 'default',
422	'selectors' => [
423	self::$selectors['zoom_color'] => 'color: {{VALUE}};',
424	],
425	],
426	'zoom_bg_color' => [
427	'label' => esc_html__( 'Background Color', 'shopbuilder' ),
428	'type' => 'color',
429	'selectors' => [
430	self::$selectors['zoom_bg_color'] => 'background-color: {{VALUE}};',
431	],
432	],
433	'zoom_icon_size' => [
434	'label' => esc_html__( 'Icon Size (px)', 'shopbuilder' ),
435	'type' => 'slider',
436	'size_units' => [ 'px' ],
437	'range' => [
438	'px' => [
439	'min' => 0,
440	'max' => 50,
441	'step' => 1,
442	],
443	],
444	'selectors' => [
445	self::$selectors['zoom_icon_size'] => 'font-size: {{SIZE}}{{UNIT}};',
446	],
447	'separator' => 'before',
448	],
449	'zoom_badge_width' => [
450	'label' => esc_html__( 'Badge Width (px)', 'shopbuilder' ),
451	'type' => 'slider',
452	'size_units' => [ 'px' ],
453	'range' => [
454	'px' => [
455	'min' => 15,
456	'max' => 100,
457	'step' => 1,
458	],
459	],
460	'selectors' => [
461	self::$selectors['zoom_badge_width'] => 'width: {{SIZE}}{{UNIT}};min-width: initial;',
462	],
463	],
464	'zoom_badge_height' => [
465	'label' => esc_html__( 'Badge Height (px)', 'shopbuilder' ),
466	'type' => 'slider',
467	'size_units' => [ 'px' ],
468	'range' => [
469	'px' => [
470	'min' => 15,
471	'max' => 100,
472	'step' => 1,
473	],
474	],
475	'selectors' => [
476	self::$selectors['zoom_badge_height'] => 'height: {{SIZE}}{{UNIT}};min-height: initial;',
477	],
478	],
479	'zoom_badge_border_radius' => [
480	'label' => esc_html__( 'Badge Border Radius (px)', 'shopbuilder' ),
481	'type' => 'slider',
482	'size_units' => [ 'px', '%' ],
483	'range' => [
484	'px' => [
485	'min' => 0,
486	'max' => 100,
487	'step' => 1,
488	],
489	'%' => [
490	'min' => 0,
491	'max' => 100,
492	'step' => 1,
493	],
494	],
495	'selectors' => [
496	self::$selectors['zoom_badge_border_radius'] => 'border-radius: {{SIZE}}{{UNIT}};',
497	],
498	],
499	'zoom_padding' => [
500	'label' => esc_html__( 'Padding (px)', 'shopbuilder' ),
501	'type' => 'dimensions',
502	'mode' => 'responsive',
503	'size_units' => [ 'px' ],
504	'default' => [
505	'top' => '0',
506	'right' => '0',
507	'bottom' => '0',
508	'left' => '0',
509	'unit' => 'px',
510	'isLinked' => true,
511	],
512	'selectors' => [
513	self::$selectors['zoom_padding'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
514	],
515	],
516	'zoom_position' => [
517	'label' => esc_html__( 'Position', 'shopbuilder' ),
518	'type' => 'choose',
519	'options' => [
520	'left' => [
521	'title' => esc_html__( 'Left', 'shopbuilder' ),
522	'icon' => 'eicon-h-align-left',
523	],
524	'right' => [
525	'title' => esc_html__( 'Right', 'shopbuilder' ),
526	'icon' => 'eicon-h-align-right',
527	],
528	],
529	'default' => 'right',
530	'separator' => 'before',
531	],
532	'zoom_position_horizontal' => [
533	'label' => esc_html__( 'Horizontal', 'shopbuilder' ),
534	'type' => 'slider',
535	'size_units' => [ 'px', '%' ],
536	'range' => [
537	'px' => [
538	'min' => -200,
539	'max' => 200,
540	'step' => 5,
541	],
542	'%' => [
543	'min' => 0,
544	'max' => 100,
545	],
546	],
547
548	'selectors' => [
549	self::$selectors['zoom_position_horizontal']['zoom_position'] => '{{zoom_position.VALUE}}: {{SIZE}}{{UNIT}};',
550	self::$selectors['zoom_position_horizontal']['rtwpvg-tr-br'] => 'right: {{SIZE}}{{UNIT}};',
551	self::$selectors['zoom_position_horizontal']['rtwpvg-tl-bl'] => 'left: {{SIZE}}{{UNIT}};',
552	],
553	],
554	'zoom_position_vertical' => [
555	'label' => esc_html__( 'Vertical', 'shopbuilder' ),
556	'type' => 'slider',
557	'size_units' => [ 'px', '%' ],
558	'range' => [
559	'px' => [
560	'min' => -200,
561	'max' => 200,
562	'step' => 5,
563	],
564	'%' => [
565	'min' => 0,
566	'max' => 100,
567	],
568	],
569	'selectors' => [
570	self::$selectors['zoom_position_vertical']['zoom-icon-top'] => 'top: {{SIZE}}{{UNIT}};',
571	self::$selectors['zoom_position_vertical']['zoom-icon-bottom'] . ':is(.rtwpvg-trigger-position-bottom-right, .rtwpvg-trigger-position-bottom-left)' => 'bottom: {{SIZE}}{{UNIT}};',
572	],
573	],
574	'zoom_section_end' => [
575	'mode' => 'section_end',
576	],
577	];
578	if ( function_exists( 'rtwpvg' ) ) {
579	unset( $fields['zoom_position'] );
580	}
581	return $fields;
582	}
583	}
584