PluginProbe
Ultimate Store Kit – Store Builder Addons for Elementor, WooCommerce Store Builder, EDD Store Builder / 1.6.2
Ultimate Store Kit – Store Builder Addons for Elementor, WooCommerce Store Builder, EDD Store Builder v1.6.2
3.1.4 3.0.8 3.0.9 3.1.0 3.1.2 3.1.3 3.0.7 3.0.5 3.0.4 3.0.3 3.0.2 trunk 1.5.0 1.5.1 1.5.2 1.6.1 1.6.2 1.6.3 1.6.4 2.0.0 2.0.1 2.0.2 2.0.3 2.0.4 2.0.5 All 93 releases
ultimate-store-kit / modules / shiny-carousel / widgets / shiny-carousel.php

shiny-carousel.php in Ultimate Store Kit – Store Builder Addons for Elementor, WooCommerce Store Builder, EDD Store Builder 1.6.2, at modules/shiny-carousel/widgets/shiny-carousel.php

571 lines 22.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2
3 namespace UltimateStoreKit\Modules\ShinyCarousel\Widgets;
4
5 use Elementor\Controls_Manager;
6 use Elementor\Group_Control_Border;
7 use Elementor\Group_Control_Box_Shadow;
8 use Elementor\Group_Control_Background;
9 use Elementor\Group_Control_Typography;
10 use UltimateStoreKit\Base\Module_Base;
11 use UltimateStoreKit\traits\Global_Widget_Controls;
12 use UltimateStoreKit\traits\Global_Widget_Template;
13 use UltimateStoreKit\Includes\Controls\GroupQuery\Group_Control_Query;
14 use WP_Query;
15
16 if (!defined('ABSPATH')) {
17 exit;
18 }
19
20 // Exit if accessed directly
21
22 class Shiny_Carousel extends Module_Base {
23 use Global_Widget_Controls;
24 use Global_Widget_Template;
25 use Group_Control_Query;
26
27 /**
28 * @var \WP_Query
29 */
30 private $_query = null;
31
32 public function get_name() {
33 return 'usk-shiny-carousel';
34 }
35
36 public function get_title() {
37 return esc_html__('Shiny Carousel', 'ultimate-store-kit');
38 }
39
40 public function get_icon() {
41 return 'usk-widget-icon usk-icon-shiny-carousel';
42 }
43
44 public function get_categories() {
45 return ['ultimate-store-kit'];
46 }
47
48 public function get_keywords() {
49 return ['product', 'product-grid', 'table', 'wc'];
50 }
51
52 public function get_script_depends() {
53 return ['micromodal'];
54 }
55
56 public function get_style_depends() {
57 if ($this->usk_is_edit_mode()) {
58 return ['usk-all-styles'];
59 } else {
60 return ['ultimate-store-kit-font', 'usk-shiny-carousel'];
61 }
62 }
63
64 // public function get_custom_help_url() {
65 // return 'https://youtu.be/3VkvEpVaNAM';
66 // }
67 public function get_query() {
68 return $this->_query;
69 }
70 protected function register_controls() {
71
72 $this->start_controls_section(
73 'section_woocommerce_layout',
74 [
75 'label' => esc_html__('Layout', 'ultimate-store-kit'),
76 ]
77 );
78
79 $this->add_responsive_control(
80 'columns',
81 [
82 'label' => esc_html__('Columns', 'ultimate-store-kit'),
83 'type' => Controls_Manager::SELECT,
84 'default' => 3,
85 'tablet_default' => 2,
86 'mobile_default' => 1,
87 'options' => [
88 1 => '1',
89 2 => '2',
90 3 => '3',
91 4 => '4',
92 5 => '5',
93 6 => '6',
94 ],
95 ]
96 );
97 $this->add_responsive_control(
98 'items_gap',
99 [
100 'label' => esc_html__('Item Gap', 'ultimate-store-kit'),
101 'type' => Controls_Manager::SLIDER,
102 'default' => [
103 'size' => 30,
104 ],
105 'range' => [
106 'px' => [
107 'min' => 0,
108 'max' => 100,
109 ],
110 ],
111 'tablet_default' => [
112 'size' => 20,
113 ],
114 'mobile_default' => [
115 'size' => 20,
116 ],
117 ]
118 );
119
120 $this->register_global_controls_grid_layout();
121
122 $this->end_controls_section();
123 $this->start_controls_section(
124 'section_post_query_builder',
125 [
126 'label' => __('Query', 'bdthemes-element-pack'),
127 'tab' => Controls_Manager::TAB_CONTENT,
128 ]
129 );
130 $this->register_query_builder_controls();
131 $this->register_controls_wc_additional();
132 $this->end_controls_section();
133 // $this->register_global_controls_query();
134 $this->register_global_controls_additional();
135 $this->register_global_controls_carousel_navigation();
136 $this->register_global_controls_carousel_settings();
137 $this->start_controls_section(
138 'section_style_item',
139 [
140 'label' => esc_html__('Items', 'ultimate-store-kit'),
141 'tab' => Controls_Manager::TAB_STYLE,
142 ]
143 );
144
145 $this->start_controls_tabs('item_tabs');
146
147 $this->start_controls_tab(
148 'item_tab_normal',
149 [
150 'label' => esc_html__('Normal', 'ultimate-store-kit'),
151 ]
152 );
153
154 $this->add_group_control(
155 Group_Control_Border::get_type(),
156 [
157 'name' => 'item_border',
158 'selector' => '{{WRAPPER}} .usk-shiny-carousel .usk-item',
159 ]
160 );
161
162 $this->add_responsive_control(
163 'item_border_radius',
164 [
165 'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
166 'type' => Controls_Manager::DIMENSIONS,
167 'size_units' => ['px', '%', 'em'],
168 'selectors' => [
169 '{{WRAPPER}} .usk-shiny-carousel .usk-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
170 ],
171 ]
172 );
173
174 $this->add_responsive_control(
175 'item_padding',
176 [
177 'label' => esc_html__('Padding', 'ultimate-store-kit'),
178 'type' => Controls_Manager::DIMENSIONS,
179 'size_units' => ['px', '%', 'em'],
180 'selectors' => [
181 '{{WRAPPER}} .usk-shiny-carousel .usk-item' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
182 ],
183 ]
184 );
185
186 // $this->add_group_control(
187 // Group_Control_Box_Shadow::get_type(),
188 // [
189 // 'name' => 'item_shadow',
190 // 'selector' => '{{WRAPPER}} .usk-shiny-carousel .usk-item',
191 // ]
192 // );
193
194 $this->end_controls_tab();
195
196 $this->start_controls_tab(
197 'item_tab_hover',
198 [
199 'label' => esc_html__('Hover', 'ultimate-store-kit'),
200 ]
201 );
202
203 $this->add_control(
204 'item_hover_border_color',
205 [
206 'label' => esc_html__('Border Color', 'ultimate-store-kit'),
207 'type' => Controls_Manager::COLOR,
208 'selectors' => [
209 '{{WRAPPER}} .usk-shiny-carousel .usk-item:hover' => 'border-color: {{VALUE}}',
210 ],
211 ]
212 );
213
214 // $this->add_group_control(
215 // Group_Control_Box_Shadow::get_type(),
216 // [
217 // 'name' => 'item_hover_shadow',
218 // 'selector' => '{{WRAPPER}} .usk-shiny-carousel .usk-item:hover',
219 // ]
220 // );
221
222 $this->end_controls_tab();
223
224 $this->end_controls_tabs();
225
226 $this->end_controls_section();
227 $this->register_global_controls_grid_image();
228 $this->register_global_controls_content();
229 $this->register_global_controls_title();
230 $this->register_global_controls_category();
231 $this->register_global_controls_price();
232 $this->register_global_controls_rating();
233
234 $this->start_controls_section(
235 'section_style_button',
236 [
237 'label' => esc_html__('Button', 'ultimate-store-kit'),
238 'tab' => Controls_Manager::TAB_STYLE,
239 'condition' => [
240 'show_cart' => 'yes',
241 ],
242 ]
243 );
244
245
246 $this->start_controls_tabs('tabs_button_style');
247
248 $this->start_controls_tab(
249 'tab_button_normal',
250 [
251 'label' => esc_html__('Normal', 'ultimate-store-kit'),
252 ]
253 );
254
255 $this->add_control(
256 'button_text_color',
257 [
258 'label' => esc_html__('Color', 'ultimate-store-kit'),
259 'type' => Controls_Manager::COLOR,
260 'default' => '',
261 'selectors' => [
262 '{{WRAPPER}} .usk-shiny-carousel .usk-carousel .usk-item .usk-item-box .usk-image .usk-button' => 'color: {{VALUE}};',
263 '{{WRAPPER}} .usk-shiny-carousel .usk-carousel .usk-item .usk-item-box .usk-image .added_to_cart' => 'color: {{VALUE}};',
264 '{{WRAPPER}} .usk-shiny-carousel .usk-carousel .usk-item .usk-button.loading::after' => 'border-color: {{VALUE}}'
265 ],
266 ]
267 );
268 $this->add_group_control(
269 Group_Control_Background::get_type(),
270 [
271 'name' => 'btn_background_color',
272 'label' => esc_html__('Background', 'ultimate-store-kit'),
273 'types' => ['classic', 'gradient'],
274 'selector' => '{{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .usk-button, {{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .added_to_cart',
275 ]
276 );
277 $this->add_responsive_control(
278 'button_width',
279 [
280 'label' => esc_html__('Width', 'ultimate-store-kit'),
281 'type' => Controls_Manager::SLIDER,
282 'range' => [
283 'px' => [
284 'min' => 0,
285 'max' => 100,
286 ]
287 ],
288 'selectors' => [
289 '{{WRAPPER}} .usk-shiny-carousel' => '--btn-width: {{SIZE}}%;',
290 ],
291 'separator' => 'before'
292 ]
293 );
294 $this->add_responsive_control(
295 'button_height',
296 [
297 'label' => esc_html__('Height', 'ultimate-store-kit'),
298 'type' => Controls_Manager::SLIDER,
299 'range' => [
300 'px' => [
301 'min' => 20,
302 'max' => 200,
303 'step' => 1,
304 ]
305 ],
306 'selectors' => [
307 '{{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .usk-button, {{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .added_to_cart' => 'height: {{SIZE}}{{UNIT}}; line-height: {{SIZE}}{{UNIT}};',
308 ],
309 ]
310 );
311 $this->add_responsive_control(
312 'button_margin_spacing',
313 [
314 'label' => esc_html__('Bottom Spacing', 'ultimate-store-kit'),
315 'type' => Controls_Manager::SLIDER,
316 'range' => [
317 'px' => [
318 'min' => 0,
319 'max' => 200,
320 'step' => 1,
321 ]
322 ],
323 'default' => [
324 'unit' => 'px',
325 'size' => 0,
326 ],
327 'selectors' => [
328 '{{WRAPPER}} .usk-shiny-carousel .usk-item:hover .usk-item-box .usk-image .added_to_cart' => 'transform: translateY(-{{SIZE}}{{UNIT}});',
329 '{{WRAPPER}} .usk-shiny-carousel .usk-item:hover .usk-item-box .usk-image .usk-button' => 'transform: translateY(-{{SIZE}}{{UNIT}});',
330 ],
331 ]
332 );
333 $this->add_group_control(
334 Group_Control_Border::get_type(),
335 [
336 'name' => 'btn_border',
337 'label' => esc_html__('Border', 'ultimate-store-kit'),
338 'selector' =>
339 '{{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .usk-button, {{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .added_to_cart',
340 ]
341 );
342
343 $this->add_responsive_control(
344 'btn_border_radius',
345 [
346 'label' => esc_html__('Border Radius', 'ultimate-store-kit'),
347 'type' => Controls_Manager::DIMENSIONS,
348 'size_units' => ['px', '%'],
349 'selectors' => [
350 '{{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .usk-button, {{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .added_to_cart' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
351 ],
352 ]
353 );
354 $this->add_group_control(
355 Group_Control_Box_Shadow::get_type(),
356 [
357 'name' => 'button_shadow',
358 'selector' => '{{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .usk-button, {{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .added_to_cart',
359 ]
360 );
361
362 $this->add_group_control(
363 Group_Control_Typography::get_type(),
364 [
365 'name' => 'button_typography',
366 'label' => esc_html__('Typography', 'ultimate-store-kit'),
367 'selector' => '{{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .usk-button, {{WRAPPER}} .usk-shiny-carousel .usk-item-box .usk-image .added_to_cart',
368 'exclude' => ['line_height', 'letter_spacing'],
369 'separator' => 'before',
370 ]
371 );
372 $this->end_controls_tab();
373
374 $this->start_controls_tab(
375 'tab_button_hover',
376 [
377 'label' => esc_html__('Hover', 'ultimate-store-kit'),
378 ]
379 );
380 $this->add_control(
381 'hover_color',
382 [
383 'label' => esc_html__('Color', 'ultimate-store-kit'),
384 'type' => Controls_Manager::COLOR,
385 'selectors' => [
386 '{{WRAPPER}} .usk-shiny-carousel .usk-carousel .usk-item .usk-item-box .usk-image .usk-button:hover, {{WRAPPER}} .usk-shiny-carousel .usk-carousel .usk-item .usk-item-box .usk-image .added_to_cart:hover' => 'color: {{VALUE}};',
387 ],
388 ]
389 );
390
391 $this->add_group_control(
392 Group_Control_Background::get_type(),
393 [
394 'name' => 'btn_hover_bg',
395 'label' => esc_html__('Background', 'ultimate-store-kit'),
396 'types' => ['classic', 'gradient'],
397 'selector' => '{{WRAPPER}} .usk-shiny-carousel .usk-carousel .usk-item .usk-item-box .usk-image .usk-button:hover, {{WRAPPER}} .usk-shiny-carousel .usk-carousel .usk-item .usk-item-box .usk-image .added_to_cart:hover'
398 ]
399 );
400
401 $this->add_control(
402 'button_hover_border_color',
403 [
404 'label' => esc_html__('Border Color', 'ultimate-store-kit'),
405 'type' => Controls_Manager::COLOR,
406 'condition' => [
407 'btn_border_border!' => '',
408 ],
409 'selectors' => [
410 '{{WRAPPER}} .usk-shiny-carousel .usk-carousel .usk-item .usk-item-box .usk-image .usk-button:hover, {{WRAPPER}} .usk-shiny-carousel .usk-carousel .usk-item .usk-item-box .usk-image .added_to_cart:hover' => 'border-color: {{VALUE}};',
411 ],
412 ]
413 );
414
415 $this->end_controls_tab();
416 $this->end_controls_tabs();
417 $this->end_controls_section();
418 $this->register_global_controls_badge();
419 $this->register_global_controls_action_btn();
420 $this->register_global_controls_navigation_style();
421 }
422
423 public function render_image() {
424 global $product;
425 $tooltip_position = 'left';
426 $settings = $this->get_settings_for_display();
427 $gallery_thumbs = $product->get_gallery_image_ids();
428 $product_image = wp_get_attachment_image_url(get_post_thumbnail_id(), $settings['image_size']);
429 if ($gallery_thumbs) {
430 foreach ($gallery_thumbs as $key => $gallery_thumb) {
431 if ($key == 0) :
432 $gallery_image_link = wp_get_attachment_image_url($gallery_thumb, $settings['image_size']);
433 endif;
434 }
435 } else {
436 $gallery_image_link = wp_get_attachment_image_url(get_post_thumbnail_id(), $settings['image_size']);
437 }
438 ?>
439 <div class="usk-image">
440 <a href="<?php echo esc_url(get_permalink()); ?>">
441 <img class="img image-default" src="<?php echo esc_url($product_image); ?>" alt="<?php echo esc_html(get_the_title()); ?>">
442 <img class="img image-hover" src="<?php echo esc_url($gallery_image_link); ?>" alt="<?php echo esc_html(get_the_title()); ?>">
443 </a>
444 <?php $this->render_add_to_cart(); ?>
445 <div class="usk-shoping">
446 <?php $this->register_global_template_add_to_wishlist($tooltip_position); ?>
447 <?php $this->register_global_template_quick_view($product->get_id(), $tooltip_position); ?>
448 </div>
449
450 <div class="usk-badge-label-wrapper">
451 <div class="usk-badge-label-content">
452 <?php $this->register_global_template_badge_label(); ?>
453 </div>
454 </div>
455 </div>
456 <?php
457 }
458 public function render_add_to_cart() {
459 global $product;
460 $settings = $this->get_settings_for_display();
461 if ('yes' == $settings['show_cart']) : ?>
462 <?php if ($product) {
463 $defaults = [
464 'quantity' => 1,
465 'class' => implode(
466 ' ',
467 array_filter(
468 [
469 'usk-button',
470 'product_type_' . $product->get_type(),
471 $product->is_purchasable() && $product->is_in_stock() ? 'add_to_cart_button' : '',
472 $product->supports('ajax_add_to_cart') && $product->is_purchasable() && $product->is_in_stock() ? 'ajax_add_to_cart' : '',
473 ]
474 )
475 ),
476 'attributes' => [
477 'data-product_id' => $product->get_id(),
478 'data-product_sku' => $product->get_sku(),
479 'aria-label' => $product->add_to_cart_description(),
480 'rel' => 'nofollow',
481 ],
482 ];
483 $args = apply_filters('woocommerce_loop_add_to_cart_args', wp_parse_args($defaults), $product);
484 if (isset($args['attributes']['aria-label'])) {
485 $args['attributes']['aria-label'] = wp_strip_all_tags($args['attributes']['aria-label']);
486 }
487 echo wp_kses_post(apply_filters(
488 'woocommerce_loop_add_to_cart_link', // WPCS: XSS ok.
489 sprintf(
490 '<a href="%s" data-quantity="%s" class="%s" %s>%s <i class="button-icon usk-icon-arrow-right-8"></i></a>',
491 esc_url($product->add_to_cart_url()),
492 esc_attr(isset($args['quantity']) ? $args['quantity'] : 1),
493 esc_attr(isset($args['class']) ? $args['class'] : 'button'),
494 isset($args['attributes']) ? wc_implode_html_attributes($args['attributes']) : '',
495 esc_html($product->add_to_cart_text())
496 ),
497 $product,
498 $args
499 ));
500 }; ?>
501 <?php endif;
502 }
503 public function print_price_output($output) {
504 $tags = [
505 'del' => ['aria-hidden' => []],
506 'span' => ['class' => []],
507 'bdi' => [],
508 'ins' => [],
509 ];
510
511 if (isset($output)) {
512 echo wp_kses($output, $tags);
513 }
514 }
515 public function render_loop_item() {
516 $settings = $this->get_settings_for_display();
517 // $wp_query = $this->register_global_template_query();
518 $this->query_product();
519 $wp_query = $this->get_query();
520
521 if ($wp_query->have_posts()) { ?>
522 <?php while ($wp_query->have_posts()) : $wp_query->the_post();
523 global $product;
524 $rating_count = $product->get_rating_count();
525 $average = $product->get_average_rating();
526 $have_rating = ('yes' === $settings['show_rating']) ? 'usk-have-rating' : '';
527 $categories = str_replace(',', '', wc_get_product_category_list($product->get_id()));
528
529 ?>
530 <div class="swiper-slide">
531 <div class="usk-item <?php esc_attr_e($have_rating, 'ultimate-store-kit'); ?>">
532 <div class="usk-item-box">
533 <?php $this->render_image(); ?>
534 <div class="usk-content">
535 <?php if ('yes' == $settings['show_category']) : ?>
536 <?php printf('<%1$s class="usk-category">%2$s</%1$s>', esc_attr($settings['category_tags']), wp_kses_post($categories)); ?>
537 <?php endif; ?>
538 <?php if ('yes' == $settings['show_title']) : ?>
539 <?php printf('<a href="%2$s" class="usk-title"><%1$s class="title">%3$s</%1$s></a>', esc_attr($settings['title_tags']), esc_url($product->get_permalink()), esc_html($product->get_title())); ?>
540 <?php endif; ?>
541 <?php if ('yes' == $settings['show_price']) : ?>
542 <div class="usk-price">
543 <?php $this->print_price_output($product->get_price_html()); ?>
544 </div>
545 <?php endif; ?>
546 <?php if ('yes' == $settings['show_rating']) : ?>
547 <div class="usk-rating">
548 <span><?php echo wp_kses_post($this->register_global_template_wc_rating($average, $rating_count)); ?></span>
549 </div>
550 <?php endif; ?>
551 </div>
552 </div>
553 </div>
554 </div>
555 <?php endwhile;
556 wp_reset_postdata();
557 } else {
558 echo '<div class="usk-alert-warning" usk-alert>' . esc_html__('Ops! There no product to display.', 'ultimate-store-kit') . '</div>';
559 }
560 }
561 public function render() {
562 $this->register_global_template_carousel_header();
563 $this->render_loop_item();
564 $this->usk_register_global_template_carousel_footer();
565 }
566 public function query_product() {
567 $default = $this->getGroupControlQueryArgs();
568 $this->_query = new WP_Query($default);
569 }
570 }
571