get_id();
$settings = $this->get_settings_for_display();
$elementor_vp_lg = get_option( 'elementor_viewport_lg' );
$elementor_vp_md = get_option( 'elementor_viewport_md' );
$viewport_lg = ! empty( $elementor_vp_lg ) ? $elementor_vp_lg - 1 : 1023;
$viewport_md = ! empty( $elementor_vp_md ) ? $elementor_vp_md - 1 : 767;
$this->add_render_attribute( 'carousel', 'id', $id );
$this->add_render_attribute( 'carousel', 'class', [ 'upk-' . $name . '-carousel' ] );
if ( 'arrows' == $settings['navigation'] ) {
$this->add_render_attribute( 'carousel', 'class', 'upk-arrows-align-' . $settings['arrows_position'] );
} elseif ( 'dots' == $settings['navigation'] ) {
$this->add_render_attribute( 'carousel', 'class', 'upk-dots-align-' . $settings['dots_position'] );
} elseif ( 'both' == $settings['navigation'] ) {
$this->add_render_attribute( 'carousel', 'class', 'upk-arrows-dots-align-' . $settings['both_position'] );
} elseif ( 'arrows-fraction' == $settings['navigation'] ) {
$this->add_render_attribute( 'carousel', 'class', 'upk-arrows-dots-align-' . $settings['arrows_fraction_position'] );
}
if ( 'arrows-fraction' == $settings['navigation'] ) {
$pagination_type = 'fraction';
} elseif ( 'both' == $settings['navigation'] or 'dots' == $settings['navigation'] ) {
$pagination_type = 'bullets';
} elseif ( 'progressbar' == $settings['navigation'] ) {
$pagination_type = 'progressbar';
} else {
$pagination_type = '';
}
$this->add_render_attribute(
[
'carousel' => [
'data-settings' => [
wp_json_encode( array_filter( [
"autoplay" => ( "yes" == $settings["autoplay"] ) ? [ "delay" => $settings["autoplay_speed"] ] : false,
"loop" => ( $settings["loop"] == "yes" ) ? true : false,
"speed" => $settings["speed"]["size"],
"pauseOnHover" => ( "yes" == $settings["pauseonhover"] ) ? true : false,
"slidesPerView" => isset($settings["columns_mobile"]) ? (int)$settings["columns_mobile"] : 1,
"slidesPerGroup" => isset($settings["slides_to_scroll_mobile"]) ? (int)$settings["slides_to_scroll_mobile"] : 1,
"spaceBetween" => !empty($settings["item_gap_mobile"]["size"]) ? (int)$settings["item_gap_mobile"]["size"] : 0,
"centeredSlides" => ( $settings["centered_slides"] === "yes" ) ? true : false,
"grabCursor" => ( $settings["grab_cursor"] === "yes" ) ? true : false,
"effect" => $settings["skin"],
"observer" => ( $settings["observer"] ) ? true : false,
"observeParents" => ( $settings["observer"] ) ? true : false,
"direction" => $settings['direction'],
"watchSlidesVisibility" => true,
"watchSlidesProgress" => true,
"mousewheel" => ( $settings["mousewheel"] === "yes" ) ? true : false,
"breakpoints" => [
(int) $viewport_md => [
"slidesPerView" => isset($settings["columns_tablet"]) ? (int)$settings["columns_tablet"] : 2,
"spaceBetween" => !empty($settings["item_gap_tablet"]["size"]) ? (int)$settings["item_gap_tablet"]["size"] : 0,
"slidesPerGroup" => isset($settings["slides_to_scroll_tablet"]) ? (int)$settings["slides_to_scroll_tablet"] : 1,
],
(int) $viewport_lg => [
"slidesPerView" => isset($settings["columns"]) ? (int)$settings["columns"] : 3,
"spaceBetween" => !empty($settings["item_gap"]["size"]) ? (int)$settings["item_gap"]["size"] : 0,
"slidesPerGroup" => isset($settings["slides_to_scroll"]) ? (int)$settings["slides_to_scroll"] : 1,
]
],
"navigation" => [
"nextEl" => "#" . $id . " .upk-navigation-next",
"prevEl" => "#" . $id . " .upk-navigation-prev",
],
"pagination" => [
"el" => "#" . $id . " .swiper-pagination",
"type" => $pagination_type,
"clickable" => "true",
'dynamicBullets' => ( "yes" == $settings["dynamic_bullets"] ) ? true : false,
],
"scrollbar" => [
"el" => "#" . $id . " .swiper-scrollbar",
"hide" => "true",
],
'coverflowEffect' => [
'rotate' => ( "yes" == $settings["coverflow_toggle"] ) ? $settings["coverflow_rotate"]["size"] : 50,
'stretch' => ( "yes" == $settings["coverflow_toggle"] ) ? $settings["coverflow_stretch"]["size"] : 0,
'depth' => ( "yes" == $settings["coverflow_toggle"] ) ? $settings["coverflow_depth"]["size"] : 100,
'modifier' => ( "yes" == $settings["coverflow_toggle"] ) ? $settings["coverflow_modifier"]["size"] : 1,
'slideShadows' => true,
],
] ) )
]
]
]
);
$this->add_render_attribute('swiper', 'class', 'swiper-carousel swiper');
}
function render_navigation() {
$settings = $this->get_settings_for_display();
$hide_arrow_on_mobile = $settings['hide_arrow_on_mobile'] ? ' upk-visible@m' : '';
if ( 'arrows' == $settings['navigation'] ) : ?>
get_settings_for_display();
if ( 'dots' == $settings['navigation'] or 'arrows-fraction' == $settings['navigation'] ) : ?>
get_settings_for_display();
$hide_arrow_on_mobile = $settings['hide_arrow_on_mobile'] ? 'upk-visible@m upk-flex' : 'upk-flex';
?>
get_settings_for_display();
$hide_arrow_on_mobile = $settings['hide_arrow_on_mobile'] ? 'upk-visible@m' : '';
?>
get_settings_for_display();
?>
render_both_navigation(); ?>
render_arrows_fraction(); ?>
render_pagination(); ?>
render_navigation(); ?>