'https://diviextended.com/product/all-in-one-carousel-for-divi', 'author' => 'Elicus', 'author_uri' => 'https://elicus.com', ); public function init() { $this->name = esc_html__( 'DE Flipbox Carousel', 'all-in-one-carousel-for-divi' ); $this->child_item_text = esc_html__( 'Flipbox', 'all-in-one-carousel-for-divi' ); $this->main_css_element = '%%order_class%%'; } public function get_settings_modal_toggles() { return array( 'general' => array( 'toggles' => array( 'flipbox_layout' => esc_html__( 'Flipbox Layout', 'all-in-one-carousel-for-divi' ), 'slider_settings' => array( 'title' => esc_html__( 'Slider', 'all-in-one-carousel-for-divi' ), 'sub_toggles' => array( 'general' => array( 'name' => esc_html__( 'General', 'all-in-one-carousel-for-divi' ) ), 'navigation' => array( 'name' => esc_html__( 'Navigation', 'all-in-one-carousel-for-divi' ) ) ), 'tabbed_subtoggles' => true, ), 'flipbox_background' => array( 'title' => esc_html__( 'Flipbox Background', 'all-in-one-carousel-for-divi' ), 'sub_toggles' => array( 'glob_front' => array( 'name' => esc_html__( 'Front', 'all-in-one-carousel-for-divi' ) ), 'glob_back' => array( 'name' => esc_html__( 'Back', 'all-in-one-carousel-for-divi' ) ) ), 'tabbed_subtoggles' => true, ) ), ), 'advanced' => array( 'toggles' => array( 'front_icon_settings' => esc_html__( 'Front Icon Style', 'all-in-one-carousel-for-divi' ), 'back_icon_settings' => esc_html__( 'Back Icon Style', 'all-in-one-carousel-for-divi' ), 'front_image_settings' => esc_html__( 'Front Image Style', 'all-in-one-carousel-for-divi' ), 'back_image_settings' => esc_html__( 'Back Image Style', 'all-in-one-carousel-for-divi' ), 'glob_front_text' => array( 'title' => esc_html__( 'Front Text Style', 'all-in-one-carousel-for-divi' ), 'sub_toggles' => array( 'general' => array( 'name' => esc_html__( 'General', 'all-in-one-carousel-for-divi' ) ), 'title' => array( 'name' => esc_html__( 'Title', 'all-in-one-carousel-for-divi' ) ), 'content' => array( 'name' => esc_html__( 'Content', 'all-in-one-carousel-for-divi' ) ) ), 'tabbed_subtoggles' => true, ), 'glob_back_text' => array( 'title' => esc_html__( 'Back Text Style', 'all-in-one-carousel-for-divi' ), 'sub_toggles' => array( 'general' => array( 'name' => esc_html__( 'General', 'all-in-one-carousel-for-divi' ) ), 'title' => array( 'name' => esc_html__( 'Title', 'all-in-one-carousel-for-divi' ) ), 'content' => array( 'name' => esc_html__( 'Content', 'all-in-one-carousel-for-divi' ) ) ), 'tabbed_subtoggles' => true, ), 'front_style_settings' => esc_html__( 'Front Box Style', 'all-in-one-carousel-for-divi' ), 'back_style_settings' => esc_html__( 'Back Box Style', 'all-in-one-carousel-for-divi' ), 'slider_styles' => array( 'title' => esc_html__( 'Slider', 'all-in-one-carousel-for-divi' ), ), 'slider_dots' => array( 'title' => esc_html__( 'Slider Pagination', 'all-in-one-carousel-for-divi' ), ), ) ) ); } public function get_advanced_fields_config() { return array( 'fonts' => array( 'glob_front_general_settings' => array( 'label' => esc_html__( 'General', 'all-in-one-carousel-for-divi' ), 'css' => array( 'main' => "%%order_class%% .flipbox_front .aioc_module_header, %%order_class%% .flipbox_front .aioc_module_header a, %%order_class%% .flipbox_front .aioc_flipbox_description, %%order_class%% .flipbox_front .aioc_flipbox_description p, %%order_class%% .flipbox_front .aioc_flipbox_icon_image.use_icon", ), 'hide_font' => true, 'hide_font_size' => true, 'hide_font_weight' => true, 'hide_font_style' => true, 'hide_letter_spacing' => true, 'hide_line_height' => true, 'hide_text_color' => true, 'hide_text_shadow' => true, 'important' => 'all', 'tab_slug' => 'advanced', 'toggle_slug' => 'glob_front_text', 'sub_toggle' => 'general', ), 'glob_front_header' => array( 'label' => esc_html__( 'Title', 'all-in-one-carousel-for-divi' ), 'font_size' => array( 'default' => '18px', 'range_settings' => array( 'min' => '1', 'max' => '100', 'step' => '1', ), 'validate_unit' => true, ), 'line_height' => array( 'default' => '1.5em', 'range_settings' => array( 'min' => '0.1', 'max' => '10', 'step' => '0.1', ), ), 'letter_spacing' => array( 'default' => '0px', 'range_settings' => array( 'min' => '0', 'max' => '10', 'step' => '1', ), 'validate_unit' => true, ), 'css' => array( 'main' => "%%order_class%% .flipbox_front .aioc_module_header, %%order_class%% .flipbox_front .aioc_module_header a", ), 'hide_text_align' => true, 'important' => 'all', 'tab_slug' => 'advanced', 'toggle_slug' => 'glob_front_text', 'sub_toggle' => 'title', ), 'glob_front_body' => array( 'label' => esc_html__( 'Body', 'all-in-one-carousel-for-divi' ), 'font_size' => array( 'default' => '14px', 'range_settings' => array( 'min' => '1', 'max' => '100', 'step' => '1', ), 'validate_unit' => true, ), 'line_height' => array( 'default' => '1em', 'range_settings' => array( 'min' => '0', 'max' => '5', 'step' => '0.1', ), ), 'letter_spacing' => array( 'default' => '0px', 'range_settings' => array( 'min' => '0', 'max' => '10', 'step' => '1', ), 'validate_unit' => true, ), 'css' => array( 'main' => "%%order_class%% .flipbox_front .aioc_flipbox_description, %%order_class%% .flipbox_front .aioc_flipbox_description p", ), 'hide_text_align' => true, 'important' => 'all', 'tab_slug' => 'advanced', 'toggle_slug' => 'glob_front_text', 'sub_toggle' => 'content', ), 'glob_back_general_settings' => array( 'label' => esc_html__( 'General', 'all-in-one-carousel-for-divi' ), 'css' => array( 'main' => "%%order_class%% .flipbox_back .aioc_module_header, %%order_class%% .flipbox_back .aioc_module_header a, %%order_class%% .flipbox_back .aioc_flipbox_description, %%order_class%% .flipbox_back .aioc_flipbox_description p, %%order_class%% .flipbox_back .aioc_flipbox_icon_image.use_icon", ), 'hide_font' => true, 'hide_font_size' => true, 'hide_font_weight' => true, 'hide_font_style' => true, 'hide_letter_spacing' => true, 'hide_line_height' => true, 'hide_text_color' => true, 'hide_text_shadow' => true, 'important' => 'all', 'tab_slug' => 'advanced', 'toggle_slug' => 'glob_back_text', 'sub_toggle' => 'general', ), 'glob_back_header' => array( 'label' => esc_html__( 'Title', 'all-in-one-carousel-for-divi' ), 'font_size' => array( 'default' => '18px', 'range_settings' => array( 'min' => '1', 'max' => '100', 'step' => '1', ), 'validate_unit' => true, ), 'line_height' => array( 'default' => '1.5em', 'range_settings' => array( 'min' => '0.1', 'max' => '10', 'step' => '0.1', ), ), 'letter_spacing' => array( 'default' => '0px', 'range_settings' => array( 'min' => '0', 'max' => '10', 'step' => '1', ), 'validate_unit' => true, ), 'css' => array( 'main' => "%%order_class%% .flipbox_back .aioc_module_header, %%order_class%% .flipbox_back .aioc_module_header a", ), 'hide_text_align' => true, 'important' => 'all', 'tab_slug' => 'advanced', 'toggle_slug' => 'glob_back_text', 'sub_toggle' => 'title', ), 'glob_back_body' => array( 'label' => esc_html__( 'Body', 'all-in-one-carousel-for-divi' ), 'font_size' => array( 'default' => '14px', 'range_settings' => array( 'min' => '1', 'max' => '100', 'step' => '1', ), 'validate_unit' => true, ), 'line_height' => array( 'default' => '1em', 'range_settings' => array( 'min' => '0', 'max' => '5', 'step' => '0.1', ), ), 'letter_spacing' => array( 'default' => '0px', 'range_settings' => array( 'min' => '0', 'max' => '10', 'step' => '1', ), 'validate_unit' => true, ), 'css' => array( 'main' => "%%order_class%% .flipbox_back .aioc_flipbox_description, %%order_class%% .flipbox_back .aioc_flipbox_description p", ), 'hide_text_align' => true, 'important' => 'all', 'tab_slug' => 'advanced', 'toggle_slug' => 'glob_back_text', 'sub_toggle' => 'content', ), ), 'carousel_margin_padding' => array( 'slider_container' => array( 'margin_padding' => array( 'css' => array( 'use_margin' => false, 'padding' => "%%order_class%% .aioc_flipbox_carousel_layout > .swiper-container", 'important' => 'all', ), ), ), 'arrows' => array( 'margin_padding' => array( 'css' => array( 'use_margin' => false, 'padding' => "%%order_class%% .aioc_flipbox_carousel_layout > .aioc_swiper_navigation .swiper-button-next, %%order_class%% .aioc_flipbox_carousel_layout > .aioc_swiper_navigation .swiper-button-prev", 'important' => 'all', ), ), ), ), 'margin_padding' => array( 'css' => array( 'main' => "%%order_class%%", 'important' => 'all', ), ), 'borders' => array( 'front_image_border' => array( 'css' => array( 'main' => array( 'border_radii' => "%%order_class%% .flipbox_front .aioc_flipbox_icon_image.use_image img", 'border_styles' => "%%order_class%% .flipbox_front .aioc_flipbox_icon_image.use_image img", ), 'important' => 'all', ), 'label_prefix' => esc_html__( 'Front Image', 'all-in-one-carousel-for-divi' ), 'tab_slug' => 'advanced', 'toggle_slug' => 'front_image_settings', ), 'back_image_border' => array( 'css' => array( 'main' => array( 'border_radii' => "%%order_class%% .flipbox_back .aioc_flipbox_icon_image.use_image img", 'border_styles' => "%%order_class%% .flipbox_back .aioc_flipbox_icon_image.use_image img", ), 'important' => 'all', ), 'label_prefix' => esc_html__( 'Back Image', 'all-in-one-carousel-for-divi' ), 'tab_slug' => 'advanced', 'toggle_slug' => 'back_image_settings', ), 'front_box' => array( 'css' => array( 'main' => array( 'border_radii' => "%%order_class%% .flipbox_front", 'border_styles' => "%%order_class%%.et_pb_with_border .flipbox_front", ), 'important' => 'all', ), 'label_prefix' => esc_html__( 'Front', 'all-in-one-carousel-for-divi' ), 'tab_slug' => 'advanced', 'toggle_slug' => 'front_style_settings', ), 'back_box' => array( 'css' => array( 'main' => array( 'border_radii' => "%%order_class%% .flipbox_back", 'border_styles' => "%%order_class%%.et_pb_with_border .flipbox_back", ), 'important' => 'all', ), 'label_prefix' => esc_html__( 'Back', 'all-in-one-carousel-for-divi' ), 'tab_slug' => 'advanced', 'toggle_slug' => 'back_style_settings', ), 'arrows' => array( 'css' => array( 'main' => array( 'border_radii' => "%%order_class%% .aioc_swiper_navigation .swiper-button-prev, %%order_class%% .aioc_swiper_navigation .swiper-button-next", 'border_styles' => "%%order_class%% .aioc_swiper_navigation .swiper-button-prev, %%order_class%% .aioc_swiper_navigation .swiper-button-next", ), 'important' => 'all', ), 'label_prefix' => esc_html__( 'Arrows', 'all-in-one-carousel-for-divi' ), 'tab_slug' => 'advanced', 'toggle_slug' => 'slider_styles', ), 'default' => array( 'css' => array( 'main' => "%%order_class%%", ), ) ), 'box_shadow' => array( 'front_box' => array( 'css' => array( 'main' => "%%order_class%% .aioc_flipbox_wrapper .flipbox_front", 'important' => 'all', ), 'label_prefix' => esc_html__( 'Front', 'all-in-one-carousel-for-divi' ), 'tab_slug' => 'advanced', 'toggle_slug' => 'front_style_settings', ), 'back_box' => array( 'css' => array( 'main' => "%%order_class%% .aioc_flipbox_wrapper .flipbox_back", 'important' => 'all', ), 'label_prefix' => esc_html__( 'Back', 'all-in-one-carousel-for-divi' ), 'tab_slug' => 'advanced', 'toggle_slug' => 'back_style_settings', ), 'default' => array( 'css' => array( 'main' => "%%order_class%%", ), ), ), 'background' => array( 'css' => array( 'main' => "%%order_class%%", ), ), 'link_options' => false, 'filters' => false, 'text' => false, ); } public function get_fields() { $et_accent_color = et_builder_accent_color(); return array_merge( array( 'flipbox_layout' => array( 'label' => esc_html__( 'Select Layout', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( 'layout1' => esc_html__( 'Flip', 'all-in-one-carousel-for-divi' ), 'layout2' => esc_html__( '3D Cube', 'all-in-one-carousel-for-divi' ), ), 'default' => 'layout1', 'tab_slug' => 'general', 'toggle_slug' => 'flipbox_layout', 'description' => esc_html__( 'Here you can choose the layout for Flip Box.', 'all-in-one-carousel-for-divi' ), ), 'layout1_flip_style' => array( 'label' => esc_html__( 'Flip Direction', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( 'top' => esc_html__( 'Top', 'all-in-one-carousel-for-divi' ), 'bottom' => esc_html__( 'Bottom', 'all-in-one-carousel-for-divi' ), 'left' => esc_html__( 'Left', 'all-in-one-carousel-for-divi' ), 'right' => esc_html__( 'Right', 'all-in-one-carousel-for-divi' ), 'diagonalLeft' => esc_html__( 'Diagonal Left', 'all-in-one-carousel-for-divi' ), 'diagonalRight' => esc_html__( 'Diagonal Right', 'all-in-one-carousel-for-divi' ), 'diagonalLeftInverted' => esc_html__( 'Diagonal Left Inverted', 'all-in-one-carousel-for-divi' ), 'diagonalRightInverted' => esc_html__( 'Diagonal Right Inverted', 'all-in-one-carousel-for-divi' ), ), 'show_if' => array( 'flipbox_layout' => 'layout1', ), 'default' => 'top', 'tab_slug' => 'general', 'toggle_slug' => 'flipbox_layout', 'description' => esc_html__( 'Here you can choose the flip direction.', 'all-in-one-carousel-for-divi' ), ), 'layout1_3d_depth' => array( 'label' => esc_html__( '3D Depth Effect', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'layout', 'options' => array( 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ), ), 'show_if' => array( 'flipbox_layout' => 'layout1', ), 'default' => 'on', 'tab_slug' => 'general', 'toggle_slug' => 'flipbox_layout', 'description' => esc_html__( 'This option enable 3D depth effect on flip.', 'all-in-one-carousel-for-divi' ), ), 'layout1_shake_effect' => array( 'label' => esc_html__( 'Shake on Flip', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'layout', 'options' => array( 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ), ), 'show_if' => array( 'flipbox_layout' => 'layout1', ), 'default' => 'off', 'tab_slug' => 'general', 'toggle_slug' => 'flipbox_layout', 'description' => esc_html__( 'This option will enable shake effect on flip.', 'all-in-one-carousel-for-divi' ), ), 'layout2_flip_style' => array( 'label' => esc_html__( 'Entrance Direction', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( 'top' => esc_html__( 'Top', 'all-in-one-carousel-for-divi' ), 'bottom' => esc_html__( 'Bottom', 'all-in-one-carousel-for-divi' ), 'left' => esc_html__( 'Left', 'all-in-one-carousel-for-divi' ), 'right' => esc_html__( 'Right', 'all-in-one-carousel-for-divi' ), ), 'show_if' => array( 'flipbox_layout' => 'layout2', ), 'default' => 'top', 'tab_slug' => 'general', 'toggle_slug' => 'flipbox_layout', 'description' => esc_html__( 'Here you can choose the entrance direction of the back part.', 'all-in-one-carousel-for-divi' ), ), 'flip_speed' => array( 'label' => esc_html__( 'Flip Speed(in ms)', 'all-in-one-carousel-for-divi' ), 'type' => 'range', 'option_category' => 'layout', 'validate_unit' => true, 'range_settings' => array( 'min' => '100', 'max' => '10000', 'step' => '100', ), 'default' => '700ms', 'tab_slug' => 'general', 'toggle_slug' => 'flipbox_layout', 'description' => esc_html__( 'Define the Flip speed(in ms).', 'all-in-one-carousel-for-divi' ), ), 'slide_effect' => array( 'label' => esc_html__( 'Slide Effect', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( 'slide' => esc_html__( 'Slide', 'all-in-one-carousel-for-divi' ), 'coverflow' => esc_html__( 'Coverflow', 'all-in-one-carousel-for-divi' ), 'fade' => esc_html__( 'Fade', 'all-in-one-carousel-for-divi' ), ), 'default' => 'slide', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'Here you can choose the slide animation effect.', 'all-in-one-carousel-for-divi' ), ), 'slides_per_view' => array( 'label' => esc_html__( 'Slides Per View', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( '1' => esc_html__( '1', 'all-in-one-carousel-for-divi' ), '2' => esc_html__( '2', 'all-in-one-carousel-for-divi' ), '3' => esc_html__( '3', 'all-in-one-carousel-for-divi' ), '4' => esc_html__( '4', 'all-in-one-carousel-for-divi' ), '5' => esc_html__( '5', 'all-in-one-carousel-for-divi' ), '6' => esc_html__( '6', 'all-in-one-carousel-for-divi' ), '7' => esc_html__( '7', 'all-in-one-carousel-for-divi' ), '8' => esc_html__( '8', 'all-in-one-carousel-for-divi' ), '9' => esc_html__( '9', 'all-in-one-carousel-for-divi' ), '10' => esc_html__( '10', 'all-in-one-carousel-for-divi' ), ), 'default' => '3', 'default_on_front' => '3', 'mobile_options' => true, 'show_if' => array( 'slide_effect' => array( 'slide', 'coverflow' ), ), 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'Here you can choose the number of products to display per slide.', 'all-in-one-carousel-for-divi' ), ), 'slides_per_group' => array( 'label' => esc_html__( 'Number of Slides Per Group', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( '1' => esc_html__( '1', 'all-in-one-carousel-for-divi' ), '2' => esc_html__( '2', 'all-in-one-carousel-for-divi' ), '3' => esc_html__( '3', 'all-in-one-carousel-for-divi' ), '4' => esc_html__( '4', 'all-in-one-carousel-for-divi' ), '5' => esc_html__( '5', 'all-in-one-carousel-for-divi' ), '6' => esc_html__( '6', 'all-in-one-carousel-for-divi' ), '7' => esc_html__( '7', 'all-in-one-carousel-for-divi' ), '8' => esc_html__( '8', 'all-in-one-carousel-for-divi' ), '9' => esc_html__( '9', 'all-in-one-carousel-for-divi' ), '10' => esc_html__( '10', 'all-in-one-carousel-for-divi' ), ), 'default' => '1', 'mobile_options' => true, 'show_if' => array( 'slide_effect' => array( 'slide' ), ), 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'Here you can choose the number of slides per group to slide by.', 'all-in-one-carousel-for-divi' ), ), 'space_between_slides' => array( 'label' => esc_html__( 'Space between Slides', 'all-in-one-carousel-for-divi' ), 'type' => 'range', 'option_category' => 'layout', 'range_settings' => array( 'min' => '10', 'max' => '100', 'step' => '1', ), 'show_if' => array( 'slide_effect' => array( 'slide', 'coverflow' ), ), 'fixed_unit' => 'px', 'default' => '20px', 'mobile_options' => true, 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'Move the slider or input the value to increse or decrease the space between slides.', 'all-in-one-carousel-for-divi' ), ), 'enable_coverflow_shadow' => array( 'label' => esc_html__( 'Enable Slide Shadow', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ), 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), ), 'default' => 'off', 'show_if' => array( 'slide_effect' => 'coverflow', ), 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'Enable Slide Shadow For Coverflow Effect.', 'all-in-one-carousel-for-divi' ), ), 'coverflow_shadow_color' => array( 'label' => esc_html__( 'Shadow Color', 'all-in-one-carousel-for-divi' ), 'type' => 'color-alpha', 'custom_color' => true, 'show_if' => array( 'slide_effect' => 'coverflow', 'enable_coverflow_shadow' => 'on', ), 'default' => '#ccc', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'Here you can select color for the Shadow.', 'all-in-one-carousel-for-divi' ), ), 'coverflow_rotate' => array( 'label' => esc_html__( 'Coverflow Rotate', 'all-in-one-carousel-for-divi' ), 'type' => 'range', 'option_category' => 'font_option', 'range_settings' => array( 'min' => '1', 'max' => '360', 'step' => '1', ), 'unitless' => true, 'show_if' => array( 'slide_effect' => 'coverflow', ), 'default' => '40', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'Coverflow Rotate Slide.', 'all-in-one-carousel-for-divi' ), ), 'coverflow_depth' => array( 'label' => esc_html__( 'Coverflow Depth', 'all-in-one-carousel-for-divi' ), 'type' => 'range', 'option_category' => 'font_option', 'range_settings' => array( 'min' => '1', 'max' => '1000', 'step' => '1', ), 'unitless' => true, 'show_if' => array( 'slide_effect' => 'coverflow', ), 'default' => '100', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'Coverflow Depth Slide.', 'all-in-one-carousel-for-divi' ), ), // 'equalize_slides_height' => array( // 'label' => esc_html__( 'Equalize Slides Height', 'all-in-one-carousel-for-divi' ), // 'type' => 'yes_no_button', // 'option_category' => 'configuration', // 'options' => array( // 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ), // 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), // ), // 'default' => 'on', // 'default_on_front' => 'on', // 'tab_slug' => 'general', // 'toggle_slug' => 'slider_settings', // 'sub_toggle' => 'general', // 'description' => esc_html__( 'Choose whether or not equalize slides height.', 'all-in-one-carousel-for-divi' ), // ), 'slider_loop' => array( 'label' => esc_html__( 'Enable Loop', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ), 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), ), 'default' => 'off', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'Here you can enable loop for the slides.', 'all-in-one-carousel-for-divi' ), ), 'autoplay' => array( 'label' => esc_html__( 'Autoplay', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ), 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), ), 'default' => 'off', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'This controls the auto play the slider.', 'all-in-one-carousel-for-divi' ), ), 'enable_linear_transition' => array( 'label' => esc_html__( 'Enable Linear Transition', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ), 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), ), 'default' => 'off', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'Here you can choose whether or not to enable linear transition between slides.', 'all-in-one-carousel-for-divi' ), ), 'autoplay_speed' => array( 'label' => esc_html__( 'Autoplay Delay', 'all-in-one-carousel-for-divi' ), 'type' => 'text', 'option_category' => 'configuration', 'default' => '3000', 'show_if' => array( 'autoplay' => 'on', ), 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'This controls the time of the slide before the transition.', 'all-in-one-carousel-for-divi' ), ), 'slide_transition_duration' => array( 'label' => esc_html__( 'Transition Duration', 'all-in-one-carousel-for-divi' ), 'type' => 'text', 'option_category' => 'configuration', 'default' => '1000', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'general', 'description' => esc_html__( 'Here you can specify the duration of transition for each slide in miliseconds.', 'all-in-one-carousel-for-divi' ), ), 'show_arrow' => array( 'label' => esc_html__( 'Show Arrows', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ), 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), ), 'default' => 'off', 'default_on_front' => 'off', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'navigation', 'description' => esc_html__( 'Choose whether or not the previous & next arrows should be visible.', 'all-in-one-carousel-for-divi' ), ), 'previous_slide_arrow' => array( 'label' => esc_html__( 'Previous Arrow', 'all-in-one-carousel-for-divi' ), 'type' => 'select_icon', 'option_category' => 'basic_option', 'class' => array( 'et-pb-font-icon', ), 'show_if' => array( 'show_arrow' => 'on', ), 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'navigation', 'description' => esc_html__( 'Here you can select the icon to be used for the previous slide navigation.', 'all-in-one-carousel-for-divi' ), ), 'next_slide_arrow' => array( 'label' => esc_html__( 'Next Arrow', 'all-in-one-carousel-for-divi' ), 'type' => 'select_icon', 'option_category' => 'basic_option', 'class' => array( 'et-pb-font-icon', ), 'show_if' => array( 'show_arrow' => 'on', ), 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'navigation', 'description' => esc_html__( 'Here you can select the icon to be used for the next slide navigation.', 'all-in-one-carousel-for-divi' ), ), 'show_arrow_on_hover' => array( 'label' => esc_html__( 'Show Arrows On Hover', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ), 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), ), 'show_if' => array( 'show_arrow' => 'on', ), 'default' => 'off', 'default_on_front' => 'off', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'navigation', 'description' => esc_html__( 'Choose whether or not the previous and next arrows should be visible.', 'all-in-one-carousel-for-divi' ), ), 'arrows_position' => array( 'label' => esc_html__( 'Arrows Position', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( 'inside' => esc_html__( 'Inside', 'all-in-one-carousel-for-divi' ), 'outside' => esc_html__( 'Outside', 'all-in-one-carousel-for-divi' ), 'top_left' => esc_html__( 'Top Left', 'all-in-one-carousel-for-divi' ), 'top_right' => esc_html__( 'Top Right', 'all-in-one-carousel-for-divi' ), 'top_center' => esc_html__( 'Top Center', 'all-in-one-carousel-for-divi' ), 'bottom_left' => esc_html__( 'Bottom Left', 'all-in-one-carousel-for-divi' ), 'bottom_right' => esc_html__( 'Bottom Right', 'all-in-one-carousel-for-divi' ), 'bottom_center' => esc_html__( 'Bottom Center', 'all-in-one-carousel-for-divi' ), ), 'default' => 'inside', 'mobile_options' => true, 'show_if' => array( 'show_arrow' => 'on', ), 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'navigation', 'description' => esc_html__( 'Here you can choose the arrows position.', 'all-in-one-carousel-for-divi' ), ), 'show_control_dot' => array( 'label' => esc_html__( 'Show Dots Pagination', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ), 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), ), 'default' => 'off', 'default_on_front' => 'off', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'navigation', 'description' => esc_html__( 'This setting will turn on and off the pagination of the slider.', 'all-in-one-carousel-for-divi' ), ), 'control_dot_style' => array( 'label' => esc_html__( 'Dots Pagination Style', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( 'solid_dot' => esc_html__( 'Solid Dot', 'all-in-one-carousel-for-divi' ), 'transparent_dot' => esc_html__( 'Transparent Dot', 'all-in-one-carousel-for-divi' ), 'stretched_dot' => esc_html__( 'Stretched Dot', 'all-in-one-carousel-for-divi' ), 'line' => esc_html__( 'Line', 'all-in-one-carousel-for-divi' ), 'rounded_line' => esc_html__( 'Rounded Line', 'all-in-one-carousel-for-divi' ), 'square_dot' => esc_html__( 'Squared Dot', 'all-in-one-carousel-for-divi' ), 'number_dot' => esc_html__( 'Number Dot', 'all-in-one-carousel-for-divi' ), ), 'show_if' => array( 'show_control_dot' => 'on', ), 'default' => 'solid_dot', 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'navigation', 'description' => esc_html__( 'control dot style', 'all-in-one-carousel-for-divi' ), ), 'enable_dynamic_dots' => array( 'label' => esc_html__( 'Enable Dynamic Dots', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ), 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), ), 'default' => 'off', 'show_if' => array( 'show_control_dot' => 'on', 'control_dot_style' => array( 'solid_dot', 'transparent_dot', 'square_dot', 'number_dot' ), ), 'tab_slug' => 'general', 'toggle_slug' => 'slider_settings', 'sub_toggle' => 'navigation', 'description' => esc_html__( 'This setting will turn on and off the dynamic pagination of the slider.', 'all-in-one-carousel-for-divi' ), ), 'glob_front_background_color' => array( 'label' => esc_html__( 'Front Background', 'all-in-one-carousel-for-divi' ), 'type' => 'background-field', 'base_name' => 'glob_front_background', 'context' => 'glob_front_background_color', 'custom_color' => true, 'background_fields' => $this->generate_background_options( 'glob_front_background', 'button', 'general', 'flipbox_background', 'glob_front_background_color' ), 'mobile_options' => true, 'tab_slug' => 'general', 'toggle_slug' => 'flipbox_background', 'sub_toggle' => 'glob_front', 'description' => esc_html__( 'Adjust the background style of the frontside of your flip box by customizing the background color, gradient, and image.', 'all-in-one-carousel-for-divi' ), ), 'glob_back_background_color' => array( 'label' => esc_html__( 'Back Background', 'all-in-one-carousel-for-divi' ), 'type' => 'background-field', 'base_name' => 'glob_back_background', 'context' => 'glob_back_background_color', 'custom_color' => true, 'background_fields' => $this->generate_background_options( 'glob_back_background', 'button', 'general', 'flipbox_background', 'glob_back_background_color' ), 'mobile_options' => true, 'tab_slug' => 'general', 'toggle_slug' => 'flipbox_background', 'sub_toggle' => 'glob_back', 'description' => esc_html__( 'Adjust the background style of the backside of your flip box by customizing the background color, gradient, and image.', 'all-in-one-carousel-for-divi' ), ), 'front_icon_placement' => array( 'label' => esc_html__( 'Image/Icon Placement', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( 'top' => esc_html__( 'Top', 'all-in-one-carousel-for-divi' ), 'left' => esc_html__( 'Left', 'all-in-one-carousel-for-divi' ), 'right' => esc_html__( 'Right', 'all-in-one-carousel-for-divi' ), ), 'default' => 'top', 'tab_slug' => 'advanced', 'toggle_slug' => 'front_icon_settings', 'description' => esc_html__( 'Here you can choose where to place the icon.', 'all-in-one-carousel-for-divi' ), ), 'front_icon_color' => array( 'label' => esc_html__( 'Icon Color', 'all-in-one-carousel-for-divi' ), 'type' => 'color-alpha', 'default' => $et_accent_color, 'tab_slug' => 'advanced', 'toggle_slug' => 'front_icon_settings', 'description' => esc_html__('Here you can define a custom color for your icon.', 'all-in-one-carousel-for-divi'), ), 'front_use_icon_font_size' => array( 'label' => esc_html__( 'Use Icon Font Size', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'font_option', 'options' => array( 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ) ), 'default' => 'off', 'tab_slug' => 'advanced', 'toggle_slug' => 'front_icon_settings', ), 'front_icon_font_size' => array( 'label' => esc_html__( 'Icon Font Size', 'all-in-one-carousel-for-divi' ), 'type' => 'range', 'option_category' => 'font_option', 'range_settings' => array( 'min' => '1', 'max' => '120', 'step' => '1', ), 'mobile_options' => true, 'show_if' => array( 'front_use_icon_font_size' => 'on', ), 'default' => '32px', 'tab_slug' => 'advanced', 'toggle_slug' => 'front_icon_settings', ), 'back_icon_placement' => array( 'label' => esc_html__( 'Image/Icon Placement', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( 'top' => esc_html__( 'Top', 'all-in-one-carousel-for-divi' ), 'left' => esc_html__( 'Left', 'all-in-one-carousel-for-divi' ), 'right' => esc_html__( 'Right', 'all-in-one-carousel-for-divi' ), ), 'default' => 'top', 'tab_slug' => 'advanced', 'toggle_slug' => 'back_icon_settings', 'description' => esc_html__( 'Here you can choose where to place the icon.', 'all-in-one-carousel-for-divi' ), ), 'back_icon_color' => array( 'label' => esc_html__( 'Icon Color', 'all-in-one-carousel-for-divi' ), 'type' => 'color-alpha', 'default' => $et_accent_color, 'tab_slug' => 'advanced', 'toggle_slug' => 'back_icon_settings', 'description' => esc_html__('Here you can define a custom color for your icon.', 'all-in-one-carousel-for-divi'), ), 'back_use_icon_font_size' => array( 'label' => esc_html__( 'Use Icon Font Size', 'all-in-one-carousel-for-divi' ), 'type' => 'yes_no_button', 'option_category' => 'font_option', 'options' => array( 'off' => esc_html__( 'No', 'all-in-one-carousel-for-divi' ), 'on' => esc_html__( 'Yes', 'all-in-one-carousel-for-divi' ) ), 'default' => 'off', 'tab_slug' => 'advanced', 'toggle_slug' => 'back_icon_settings', ), 'back_icon_font_size' => array( 'label' => esc_html__( 'Icon Font Size', 'all-in-one-carousel-for-divi' ), 'type' => 'range', 'option_category' => 'font_option', 'range_settings' => array( 'min' => '1', 'max' => '120', 'step' => '1', ), 'mobile_options' => true, 'show_if' => array( 'back_use_icon_font_size' => 'on', ), 'default' => '32px', 'tab_slug' => 'advanced', 'toggle_slug' => 'back_icon_settings', ), 'front_image_max_width' => array( 'label' => esc_html__( 'Front Image Width', 'all-in-one-carousel-for-divi' ), 'type' => 'range', 'option_category' => 'layout', 'mobile_options' => true, 'validate_unit' => true, 'allow_empty' => true, 'range_settings' => array( 'min' => '0', 'max' => '1100', 'step' => '1', ), 'default' => '100px', 'tab_slug' => 'advanced', 'toggle_slug' => 'front_image_settings', 'description' => esc_html__( 'Here you can set the minimum width of front image.', 'all-in-one-carousel-for-divi' ), ), 'front_image_alignment' => array( 'label' => esc_html__( 'Front Image Alignment', 'all-in-one-carousel-for-divi' ), 'type' => 'text_align', 'option_category' => 'layout', 'options' => et_builder_get_text_orientation_options( array( 'justified' ) ), 'mobile_options' => true, 'show_if' => array( 'front_icon_placement' => 'top' ), 'default' => 'center', 'tab_slug' => 'advanced', 'toggle_slug' => 'front_image_settings', 'description' => esc_html__( 'Here you can set the alignment of front image.', 'all-in-one-carousel-for-divi' ), ), 'back_image_max_width' => array( 'label' => esc_html__( 'Back Image Width', 'all-in-one-carousel-for-divi' ), 'type' => 'range', 'option_category' => 'layout', 'mobile_options' => true, 'validate_unit' => true, 'allow_empty' => true, 'range_settings' => array( 'min' => '0', 'max' => '1100', 'step' => '1', ), 'default' => '100px', 'tab_slug' => 'advanced', 'toggle_slug' => 'back_image_settings', 'description' => esc_html__( 'Here you can set the minimum width of front image.', 'all-in-one-carousel-for-divi' ), ), 'back_image_alignment' => array( 'label' => esc_html__( 'Back Image Alignment', 'all-in-one-carousel-for-divi' ), 'type' => 'text_align', 'option_category' => 'layout', 'options' => et_builder_get_text_orientation_options( array( 'justified' ) ), 'mobile_options' => true, 'show_if' => array( 'back_icon_placement' => 'top' ), 'default' => 'center', 'tab_slug' => 'advanced', 'toggle_slug' => 'back_image_settings', 'description' => esc_html__( 'Here you can set the alignment of front image.', 'all-in-one-carousel-for-divi' ), ), 'front_content_align' => array( 'label' => esc_html__( 'Front Content Alignment', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'configuration', 'options' => array( 'top' => esc_html__( 'Top', 'all-in-one-carousel-for-divi' ), 'center' => esc_html__( 'Center', 'all-in-one-carousel-for-divi' ), 'bottom' => esc_html__( 'Bottom', 'all-in-one-carousel-for-divi' ), ), 'default' => 'center', 'tab_slug' => 'advanced', 'toggle_slug' => 'front_style_settings', 'description' => esc_html__( 'This controls the content alignment of front box.', 'all-in-one-carousel-for-divi' ), ), 'back_content_align' => array( 'label' => esc_html__( 'Back Content Alignment', 'all-in-one-carousel-for-divi' ), 'type' => 'select', 'option_category' => 'configuration', 'options' => array( 'top' => esc_html__( 'Top', 'all-in-one-carousel-for-divi' ), 'center' => esc_html__( 'Center', 'all-in-one-carousel-for-divi' ), 'bottom' => esc_html__( 'Bottom', 'all-in-one-carousel-for-divi' ), ), 'default' => 'center', 'tab_slug' => 'advanced', 'toggle_slug' => 'back_style_settings', 'description' => esc_html__( 'This controls the content alignment of back box.', 'all-in-one-carousel-for-divi' ), ), 'arrows_custom_padding' => array( 'label' => esc_html__( 'Arrows Padding', 'all-in-one-carousel-for-divi' ), 'type' => 'custom_padding', 'option_category' => 'layout', 'show_if' => array( 'show_arrow' => 'on', ), 'default' => '5px|10px|5px|10px|true|true', 'default_on_front' => '5px|10px|5px|10px|true|true', 'mobile_options' => true, 'hover' => false, 'tab_slug' => 'advanced', 'toggle_slug' => 'slider_styles', 'description' => esc_html__( 'Padding adds extra space to the inside of the element, increasing the distance between the edge of the element and its inner contents.', 'all-in-one-carousel-for-divi' ), ), 'arrow_font_size' => array( 'label' => esc_html__( 'Arrow Font Size', 'all-in-one-carousel-for-divi' ), 'type' => 'range', 'option_category' => 'layout', 'range_settings' => array( 'min' => '10', 'max' => '100', 'step' => '1', ), 'show_if' => array( 'show_arrow' => 'on', ), 'default' => '24px', 'tab_slug' => 'advanced', 'toggle_slug' => 'slider_styles', 'description' => esc_html__( 'Here you can choose the arrow font size.', 'all-in-one-carousel-for-divi' ), ), 'arrow_color' => array( 'label' => esc_html__( 'Arrow Color', 'all-in-one-carousel-for-divi' ), 'type' => 'color-alpha', 'custom_color' => true, 'show_if' => array( 'show_arrow' => 'on', ), 'hover' => 'tabs', 'tab_slug' => 'advanced', 'toggle_slug' => 'slider_styles', 'description' => esc_html__( 'Here you can define color for the arrow', 'all-in-one-carousel-for-divi' ), ), 'arrow_background_color' => array( 'label' => esc_html__( 'Arrow Background', 'all-in-one-carousel-for-divi' ), 'type' => 'color-alpha', 'custom_color' => true, 'show_if' => array( 'show_arrow' => 'on', ), 'hover' => 'tabs', 'tab_slug' => 'advanced', 'toggle_slug' => 'slider_styles', 'description' => esc_html__( 'Here you can choose a custom color to be used for the shape background of arrows.', 'all-in-one-carousel-for-divi' ), ), 'control_dot_active_color' => array( 'label' => esc_html__( 'Active Dot Pagination Color', 'all-in-one-carousel-for-divi' ), 'type' => 'color-alpha', 'custom_color' => true, 'show_if' => array( 'show_control_dot' => 'on', ), 'default' => '#000000', 'tab_slug' => 'advanced', 'toggle_slug' => 'slider_dots', 'description' => esc_html__( 'Here you can define color for the active pagination item.', 'all-in-one-carousel-for-divi' ), ), 'control_dot_inactive_color' => array( 'label' => esc_html__( 'Inactive Dot Pagination Color', 'all-in-one-carousel-for-divi' ), 'type' => 'color-alpha', 'custom_color' => true, 'show_if' => array( 'show_control_dot' => 'on', ), 'default' => '#cccccc', 'tab_slug' => 'advanced', 'toggle_slug' => 'slider_dots', 'description' => esc_html__( 'Here you can define color for the inactive pagination item.', 'all-in-one-carousel-for-divi' ), ), 'number_dot_text_color' => array( 'label' => esc_html__( 'Number Dot Color', 'all-in-one-carousel-for-divi' ), 'type' => 'color-alpha', 'custom_color' => true, 'show_if' => array( 'show_control_dot' => 'on', 'control_dot_style' => 'number_dot', ), 'default' => '#ffffff', 'tab_slug' => 'advanced', 'toggle_slug' => 'slider_dots', 'description' => esc_html__( 'Here you can define color for the number of pagination item.', 'all-in-one-carousel-for-divi' ), ), 'slider_container_custom_padding' => array( 'label' => esc_html__( 'Slider Container Padding', 'all-in-one-carousel-for-divi' ), 'type' => 'custom_padding', 'option_category' => 'layout', 'default' => '|20px||20px|true|true', 'default_on_front' => '|20px||20px|true|true', 'mobile_options' => true, 'hover' => false, 'tab_slug' => 'advanced', 'toggle_slug' => 'margin_padding', 'description' => esc_html__( 'Padding adds extra space to the inside of the element, increasing the distance between the edge of the element and its inner contents.', 'all-in-one-carousel-for-divi' ), ), ), $this->generate_background_options( 'glob_front_background', 'skip', 'general', 'flipbox_background', 'glob_front_background_color' ), $this->generate_background_options( 'glob_back_background', 'skip', 'general', 'flipbox_background', 'glob_back_background_color' ) ); } public function before_render() { global $aioc_flipbox_layout, $aioc_back_button_icon; $aioc_flipbox_layout = $this->props['flipbox_layout']; $is_responsive = et_pb_responsive_options()->is_responsive_enabled( $this->props, 'slides_per_view' ); if ( ! $is_responsive ) { $slides_per_view = $this->props['slides_per_view']; if ( 'slide' === $this->props['slide_effect'] ) { $slides_per_view_tablet = $slides_per_view < 3 ? $slides_per_view : 2; $slides_per_view_mobile = 1; } else if ( 'coverflow' === $this->props['slide_effect'] ) { $slides_per_view_tablet = 3; $slides_per_view_mobile = 1; } if ( isset( $slides_per_view_tablet ) && '' !== $slides_per_view_tablet ) { $this->props['slides_per_view_tablet'] = $slides_per_view_tablet; } if ( isset( $slides_per_view_mobile ) && '' !== $slides_per_view_mobile ) { $this->props['slides_per_view_phone'] = $slides_per_view_mobile; } } } public function render( $attrs, $content, $render_slug ) { $flipbox_layout = esc_attr( $this->props['flipbox_layout'] ); $front_icon_placement = esc_attr( $this->props['front_icon_placement'] ); $back_icon_placement = esc_attr( $this->props['back_icon_placement'] ); $front_content_align = esc_attr( $this->props['front_content_align'] ); $back_content_align = esc_attr( $this->props['back_content_align'] ); $flip_speed = esc_attr( $this->props['flip_speed'] ); $layout1_shake_effect = esc_attr( $this->props['layout1_shake_effect'] ); $layout1_flip_style = esc_attr( $this->props['layout1_flip_style'] ); $layout2_flip_style = esc_attr( $this->props['layout2_flip_style'] ); $layout1_3d_depth = esc_attr( $this->props['layout1_3d_depth'] ); $flip_direction = ( 'layout2' === $flipbox_layout ) ? $layout2_flip_style : $layout1_flip_style; $output = ''; if ( $this->content && '' !== $this->content ) { wp_enqueue_script( 'elicus-images-loaded-script' ); wp_enqueue_script( 'elicus-swiper-script' ); wp_enqueue_style( 'elicus-swiper-style' ); wp_enqueue_style( 'aioc-swiper-style' ); $file = et_is_builder_plugin_active() ? 'style-dbp' : 'style'; wp_enqueue_style( 'aioc-flipbox-carousel-style', ALL_IN_ONE_CAROUSEL_FOR_DIVI_PATH . 'includes/modules/FlipboxCarousel/' . $file . '.min.css', array(), '1.0.0' ); wp_enqueue_script( 'aioc-flipbox-carousel-script', ALL_IN_ONE_CAROUSEL_FOR_DIVI_PATH . 'includes/modules/FlipboxCarousel/aioc-flipbox-custom.min.js', array('jquery'), '1.0.1', true ); $wrap_classes = [ 'aioc_swiper_wrapper', $flipbox_layout ]; $wrap_classes[] = sprintf( 'front_side_position_%1$s', esc_attr( $front_icon_placement ) ); $wrap_classes[] = sprintf( 'back_side_position_%1$s', esc_attr( $back_icon_placement ) ); $wrap_classes[] = sprintf( 'front_content_%1$s', esc_attr( $front_content_align ) ); $wrap_classes[] = sprintf( 'back_content_%1$s', esc_attr( $back_content_align ) ); // if ( 'on' === $this->props['equalize_slides_height'] ) { // $wrapClasses[] = 'equal-slide-height'; // } // Carousel. $carousel = sprintf( '
', implode( ' ', $wrap_classes ), esc_attr( $flip_direction ) ); $carousel .= '
'; $carousel .= '
'; $carousel .= $this->content; $carousel .= '
'; // Navigation controls. $show_arrow = esc_attr( $this->props['show_arrow'] ); if ( 'on' === $show_arrow ) { $next = sprintf( '
', '' !== $this->props['next_slide_arrow'] ? sprintf( ' data-next_slide_arrow="%1$s"', esc_attr( et_pb_process_font_icon( $this->props['next_slide_arrow'] ) ) ) : '' ); $prev = sprintf( '
', '' !== $this->props['previous_slide_arrow'] ? sprintf( ' data-previous_slide_arrow="%1$s"', esc_attr( et_pb_process_font_icon( $this->props['previous_slide_arrow'] ) ) ) : '' ); $arrows_position = et_pb_responsive_options()->get_property_values( $this->props, 'arrows_position' ); $arrows_position = array_filter( $arrows_position ); if ( ! empty( $arrows_position ) ) { $arrows_position_data = ''; foreach( $arrows_position as $device => $value ) { $arrows_position_data .= ' data-arrows_' . $device . '="' . $value . '"'; } } $carousel .= sprintf( '
%1$s %2$s
', $next, $prev, ! empty( $arrows_position_data ) ? $arrows_position_data : '' ); } $carousel .= '
'; // Dot controls. $control_dot = ''; $show_control_dot = $this->props['show_control_dot']; $control_dot_style = $this->props['control_dot_style']; if ( 'on' === $show_control_dot ) { $carousel .= sprintf( '
', esc_attr( $control_dot_style ) ); } $carousel .= '
'; $script = $this->aioc_render_flipbox_carousel_script(); $output = $carousel . $script; if ( 'layout1' === $flipbox_layout ) { if ( 'on' === $layout1_shake_effect ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_side.el-transition, %%order_class%% .layout1 .aioc_flipbox_wrapper.el-transition', 'declaration' => sprintf( '-webkit-transition: transform %1$sms cubic-bezier(0.3, 0.9, 0.40, 1.3);', intval( $flip_speed ) ) ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_side.el-transition, %%order_class%% .layout1 .aioc_flipbox_wrapper.el-transition', 'declaration' => sprintf( '-moz-transition: transform %1$sms cubic-bezier(0.3, 0.9, 0.40, 1.3);', intval( $flip_speed ) ) ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_side.el-transition, %%order_class%% .layout1 .aioc_flipbox_wrapper.el-transition', 'declaration' => sprintf( 'transition: transform %1$sms cubic-bezier(0.3, 0.9, 0.40, 1.3);', intval( $flip_speed ) ) ) ); } else { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_side.el-transition, %%order_class%% .layout1 .aioc_flipbox_wrapper.el-transition', 'declaration' => sprintf( '-webkit-transition: transform %1$sms cubic-bezier(.5, .3, .3, 1);', intval( $flip_speed ) ) ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_side.el-transition, %%order_class%% .layout1 .aioc_flipbox_wrapper.el-transition', 'declaration' => sprintf( '-moz-transition: transform %1$sms cubic-bezier(.5, .3, .3, 1);', intval( $flip_speed ) ) ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_side.el-transition, %%order_class%% .layout1 .aioc_flipbox_wrapper.el-transition', 'declaration' => sprintf( 'transition: transform %1$sms cubic-bezier(.5, .3, .3, 1);', intval( $flip_speed ) ) ) ); } if ( 'on' === $layout1_3d_depth ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_flipbox_wrapper .flipbox_inner', 'declaration' => sprintf( '-webkit-transform: translateZ(50px) scale(0.95);' ) ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_flipbox_wrapper .flipbox_inner', 'declaration' => sprintf( '-moz-transform: translateZ(50px) scale(0.95);' ) ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_flipbox_wrapper .flipbox_inner', 'declaration' => sprintf( 'transform: translateZ(50px) scale(0.95);' ) ) ); } } if ( 'layout2' === $flipbox_layout ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .layout2 .aioc_flipbox_wrapper.el-transition, %%order_class%% .layout2 .aioc_flipbox_carousel_item:hover .aioc_flipbox_wrapper.el-transition', 'declaration' => sprintf( '-webkit-transition: transform %1$sms ease;', intval( $flip_speed ) ) ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .layout2 .aioc_flipbox_wrapper.el-transition, %%order_class%% .layout2 .aioc_flipbox_carousel_item:hover .aioc_flipbox_wrapper.el-transition', 'declaration' => sprintf( '-moz-transition: transform %1$sms ease;', intval( $flip_speed ) ) ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .layout2 .aioc_flipbox_wrapper.el-transition, %%order_class%% .layout2 .aioc_flipbox_carousel_item:hover .aioc_flipbox_wrapper.el-transition', 'declaration' => sprintf( 'transition: transform %1$sms ease;', intval( $flip_speed ) ) ) ); } // Icon styles. if ( 'on' === $this->props['front_use_icon_font_size'] ) { $front_icon_font_size = et_pb_responsive_options()->get_property_values( $this->props, 'front_icon_font_size' ); et_pb_responsive_options()->generate_responsive_css( $front_icon_font_size, '%%order_class%% .flipbox_front .et-pb-icon', 'font-size', $render_slug, '!important;', 'range' ); } if ( 'on' === $this->props['back_use_icon_font_size'] ) { $back_icon_font_size = et_pb_responsive_options()->get_property_values( $this->props, 'back_icon_font_size' ); et_pb_responsive_options()->generate_responsive_css( $back_icon_font_size, '%%order_class%% .flipbox_back .et-pb-icon', 'font-size', $render_slug, '!important;', 'range' ); } if ( ! empty( $this->props['front_icon_color'] ) ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_front .et-pb-icon', 'declaration' => sprintf( 'color: %1$s;', esc_attr( $this->props['front_icon_color'] ) ) ) ); } if ( ! empty( $this->props['back_icon_color'] ) ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_back .et-pb-icon', 'declaration' => sprintf( 'color: %1$s;', esc_attr( $this->props['back_icon_color'] ) ) ) ); } // Icon Images css. $front_image_max_width = et_pb_responsive_options()->get_property_values( $this->props, 'front_image_max_width' ); if ( ! empty( array_filter( $front_image_max_width ) ) ) { et_pb_responsive_options()->generate_responsive_css( $front_image_max_width, '%%order_class%% .flipbox_front .aioc_flipbox_icon_image', 'width', $render_slug, '!important;', 'range' ); } $back_image_max_width = et_pb_responsive_options()->get_property_values( $this->props, 'back_image_max_width' ); if ( ! empty( array_filter( $back_image_max_width ) ) ) { et_pb_responsive_options()->generate_responsive_css( $back_image_max_width, '%%order_class%% .flipbox_back .aioc_flipbox_icon_image', 'width', $render_slug, '!important;', 'range' ); } $image_alignment_styles = array( 'left' => 'margin-left: 0px !important; margin-right: auto !important; text-align: left;', 'center' => 'margin-left: auto !important; margin-right: auto !important; text-align: center;', 'right' => 'margin-left: auto !important; margin-right: 0px !important; text-align: right;', ); if ( 'top' === $front_icon_placement ) { $front_image_alignment = $this->props['front_image_alignment']; if ( isset( $image_alignment_styles[$front_image_alignment] ) ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_front .aioc_flipbox_icon_image', 'declaration' => $image_alignment_styles[$front_image_alignment] ) ); } $front_image_alignment_tablet = $this->props['front_image_alignment_tablet']; if ( isset( $image_alignment_styles[$front_image_alignment_tablet] ) ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_front .aioc_flipbox_icon_image', 'declaration' => $image_alignment_styles[$front_image_alignment_tablet], 'media_query' => self::get_media_query( 'max_width_980' ), ) ); } $front_image_alignment_phone = $this->props['front_image_alignment_phone']; if ( isset( $image_alignment_styles[$front_image_alignment_phone] ) ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_front .aioc_flipbox_icon_image', 'declaration' => $image_alignment_styles[$front_image_alignment_phone], 'media_query' => self::get_media_query( 'max_width_767' ), ) ); } } if ( 'top' === $back_icon_placement ) { $back_image_alignment = $this->props['back_image_alignment']; if ( isset( $image_alignment_styles[$back_image_alignment] ) ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_back .aioc_flipbox_icon_image', 'declaration' => $image_alignment_styles[$back_image_alignment] ) ); } $back_image_alignment_tablet = $this->props['back_image_alignment_tablet']; if ( isset( $image_alignment_styles[$back_image_alignment_tablet] ) ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_back .aioc_flipbox_icon_image', 'declaration' => $image_alignment_styles[$back_image_alignment_tablet], 'media_query' => self::get_media_query( 'max_width_980' ), ) ); } $back_image_alignment_phone = $this->props['back_image_alignment_phone']; if ( isset( $image_alignment_styles[$back_image_alignment_phone] ) ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .flipbox_back .aioc_flipbox_icon_image', 'declaration' => $image_alignment_styles[$back_image_alignment_phone], 'media_query' => self::get_media_query( 'max_width_767' ), ) ); } } // Slider arrows. if ( 'on' === $show_arrow ) { // Slider next icons. if ( '' !== $this->props['next_slide_arrow'] ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_navigation .swiper-button-next::after', 'declaration' => 'content: attr(data-next_slide_arrow);', ) ); if ( class_exists( 'ET_Builder_Module_Helper_Style_Processor' ) && method_exists( 'ET_Builder_Module_Helper_Style_Processor', 'process_extended_icon' ) ) { $this->generate_styles( array( 'utility_arg' => 'icon_font_family', 'render_slug' => $render_slug, 'base_attr_name' => 'next_slide_arrow', 'important' => true, 'selector' => '%%order_class%% .aioc_swiper_navigation .swiper-button-next::after', 'processor' => array( 'ET_Builder_Module_Helper_Style_Processor', 'process_extended_icon' ), ) ); } } // Slider previous icon. if ( '' !== $this->props['previous_slide_arrow'] ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_navigation .swiper-button-prev::after', 'declaration' => 'content: attr(data-previous_slide_arrow);', ) ); if ( class_exists( 'ET_Builder_Module_Helper_Style_Processor' ) && method_exists( 'ET_Builder_Module_Helper_Style_Processor', 'process_extended_icon' ) ) { $this->generate_styles( array( 'utility_arg' => 'icon_font_family', 'render_slug' => $render_slug, 'base_attr_name' => 'previous_slide_arrow', 'important' => true, 'selector' => '%%order_class%% .aioc_swiper_navigation .swiper-button-prev::after', 'processor' => array( 'ET_Builder_Module_Helper_Style_Processor', 'process_extended_icon' ), ) ); } } $show_arrow_on_hover = $this->props['show_arrow_on_hover']; if ( 'on' === $show_arrow_on_hover ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_navigation .swiper-button-prev', 'declaration' => 'visibility: hidden; opacity: 0; transition: all 300ms ease;', ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_navigation .swiper-button-next', 'declaration' => 'visibility: hidden; opacity: 0; transition: all 300ms ease;', ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%%:hover .aioc_swiper_navigation .swiper-button-prev, %%order_class%%:hover .aioc_swiper_navigation .swiper-button-next', 'declaration' => 'visibility: visible; opacity: 1;', ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%%:hover .aioc_swiper_navigation .swiper-button-prev.swiper-button-disabled, %%order_class%%:hover .aioc_swiper_navigation .swiper-button-next.swiper-button-disabled', 'declaration' => 'opacity: 0.35;', ) ); // Outside Slider. self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_arrows_outside .swiper-button-prev', 'declaration' => 'left: 50px;', ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_arrows_outside .swiper-button-next', 'declaration' => 'right: 50px;', ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%%:hover .aioc_arrows_outside .swiper-button-prev', 'declaration' => 'left: 0;', ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%%:hover .aioc_arrows_outside .swiper-button-next', 'declaration' => 'right: 0;', ) ); // Inside Slider. self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_arrows_inside .swiper-button-prev', 'declaration' => 'left: -50px;', ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_arrows_inside .swiper-button-next', 'declaration' => 'right: -50px;', ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%%:hover .aioc_arrows_inside .swiper-button-prev', 'declaration' => 'left: 0;', ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%%:hover .aioc_arrows_inside .swiper-button-next', 'declaration' => 'right: 0;', ) ); } $arrow_color = $this->props['arrow_color']; if ( $arrow_color ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_navigation .swiper-button-prev, %%order_class%% .aioc_swiper_navigation .swiper-button-next', 'declaration' => sprintf( 'color: %1$s !important;', esc_attr( $arrow_color ) ), ) ); } $arrow_color_hover = $this->get_hover_value( 'arrow_color' ); if ( $arrow_color_hover ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_navigation .swiper-button-prev:hover, %%order_class%% .aioc_swiper_navigation .swiper-button-next:hover', 'declaration' => sprintf( 'color: %1$s !important;', esc_attr( $arrow_color_hover ) ), ) ); } // Font size for arrows $arrow_font_size = et_pb_responsive_options()->get_property_values( $this->props, 'arrow_font_size' ); if ( ! empty( array_filter( $arrow_font_size ) ) ) { et_pb_responsive_options()->generate_responsive_css( $arrow_font_size, '%%order_class%% .aioc_swiper_navigation .swiper-button-prev, %%order_class%% .aioc_swiper_navigation .swiper-button-next', 'font-size', $render_slug, '!important;', 'range' ); } $arrow_background_color = $this->props['arrow_background_color']; if ( '' !== $arrow_background_color ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_navigation .swiper-button-prev, %%order_class%% .aioc_swiper_navigation .swiper-button-next', 'declaration' => sprintf( 'background: %1$s !important;', esc_attr( $arrow_background_color ) ), ) ); } $arrow_background_color_hover = $this->get_hover_value( 'arrow_background_color' ); if ( '' !== $arrow_background_color_hover ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_navigation .swiper-button-prev:hover, %%order_class%% .aioc_swiper_navigation .swiper-button-next:hover', 'declaration' => sprintf( 'background: %1$s !important;', esc_attr( $arrow_background_color_hover ) ), ) ); } } if ( 'on' === $show_control_dot ) { $control_dot_inactive_color = $this->props['control_dot_inactive_color']; if ( $control_dot_inactive_color ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_pagination .swiper-pagination-bullet', 'declaration' => sprintf( 'background: %1$s !important;', esc_attr( $control_dot_inactive_color ) ), ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_pagination .transparent_dot .swiper-pagination-bullet', 'declaration' => sprintf( 'border-color: %1$s;', esc_attr( $control_dot_inactive_color ) ), ) ); } $control_dot_active_color = $this->props['control_dot_active_color']; if ( $control_dot_active_color ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_pagination .swiper-pagination-bullet.swiper-pagination-bullet-active', 'declaration' => sprintf( 'background: %1$s !important;', esc_attr( $control_dot_active_color ) ), ) ); } $slide_transition_duration = $this->props['control_dot_active_color']; if ( 'stretched_dot' === $control_dot_style && $slide_transition_duration ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .aioc_swiper_pagination .stretched_dot .swiper-pagination-bullet', 'declaration' => sprintf( 'transition: all %1$sms ease;', intval( $slide_transition_duration ) ), ) ); } $number_dot_text_color = $this->props['number_dot_text_color']; if ( ! empty( $number_dot_text_color ) ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .swiper-pagination-bullet.number-bullet', 'declaration' => sprintf( 'color: %1$s;', esc_attr( $number_dot_text_color ) ), ) ); } } $enable_coverflow_shadow = $this->props['enable_coverflow_shadow']; if ( 'on' === $enable_coverflow_shadow ) { $coverflow_shadow_color = $this->props['coverflow_shadow_color']; self::set_style( $render_slug, array( 'selector' => '%%order_class%% .swiper-container-3d .swiper-slide-shadow-left', 'declaration' => sprintf( 'background-image: linear-gradient(to left,%1$s,rgba(0,0,0,0)) !important;', esc_attr( $coverflow_shadow_color ) ), ) ); self::set_style( $render_slug, array( 'selector' => '%%order_class%% .swiper-container-3d .swiper-slide-shadow-right', 'declaration' => sprintf( 'background-image: linear-gradient(to right,%1$s,rgba(0,0,0,0)) !important;', esc_attr( $coverflow_shadow_color ) ), ) ); } else { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .swiper-container-3d .swiper-slide-shadow-left, %%order_class%% .swiper-container-3d .swiper-slide-shadow-right', 'declaration' => 'background-image: none !important;', ) ); } $enable_linear_transition = $this->props['enable_linear_transition']; if ( 'on' === $enable_linear_transition ) { self::set_style( $render_slug, array( 'selector' => '%%order_class%% .swiper-wrapper', 'declaration' => 'transition-timing-function : linear !important;', ) ); } $args = array( 'render_slug' => $render_slug, 'props' => $this->props, 'fields' => $this->fields_unprocessed, 'module' => $this, 'backgrounds' => array( 'glob_front_background' => array( 'normal' => "{$this->main_css_element} .flipbox_front", 'hover' => "{$this->main_css_element} .flipbox_front:hover", ), 'glob_back_background' => array( 'normal' => "{$this->main_css_element} .flipbox_back", 'hover' => "{$this->main_css_element} .flipbox_back:hover", ), ), ); AIOC_Helper::process_background( $args ); $fields = array( 'carousel_margin_padding' ); AIOC_Helper::process_advanced_margin_padding_css( $this, $render_slug, $this->margin_padding, $fields ); } else { $output = '
'; $output = '

' . esc_html__( 'No Result Found!', 'all-in-one-carousel-for-divi' ) . '

'; $output .= '

' . esc_html__( 'The carousel you requested could not be found. Try changing your module settings or add some new flipbox.', 'all-in-one-carousel-for-divi' ) . '

'; $output .= '
'; } return et_core_intentionally_unescaped( $output, 'html' ); } /** * This function dynamically creates script parameters according to the user settings * * @return string * */ public function aioc_render_flipbox_carousel_script() { // Get order class $order_class = $this->get_module_order_class( 'aioc_flipbox_carousel' ); $slides_per_view = 1; $slides_per_view_ipad = 1; $slides_per_view_mobile = 1; $space_between_slides = 0; $space_between_slides_ipad = 0; $space_between_slides_mobile = 0; $slidesPerGroup = 1; $slidesPerGroupIpad = 1; $slidesPerGroupMobile = 1; $slidesPerGroupSkip = 0; $slidesPerGroupSkipIpad = 0; $slidesPerGroupSkipMobile = 0; $slide_effect = esc_attr( $this->props['slide_effect'] ); if ( in_array( $slide_effect, array( 'slide', 'coverflow' ), true ) ) { $slides_per_view_arr = et_pb_responsive_options()->get_property_values( $this->props, 'slides_per_view', '', true ); $slides_per_view = $slides_per_view_arr['desktop']; $slides_per_view_ipad = ('' !== $slides_per_view_arr['tablet']) ? $slides_per_view_arr['tablet'] : $this->props['slides_per_view_tablet']; $slides_per_view_mobile = ('' !== $slides_per_view_arr['phone']) ? $slides_per_view_arr['phone'] : $this->props['slides_per_view_phone']; $space_between_slides_arr = et_pb_responsive_options()->get_property_values( $this->props, 'space_between_slides', '', true ); $space_between_slides = $space_between_slides_arr['desktop']; $space_between_slides_ipad = ('' !== $space_between_slides_arr['tablet']) ? $space_between_slides_arr['tablet'] : $space_between_slides; $space_between_slides_mobile = ('' !== $space_between_slides_arr['phone']) ? $space_between_slides_arr['phone'] : $space_between_slides_ipad; $slides_per_group = et_pb_responsive_options()->get_property_values( $this->props, 'slides_per_group', '', true ); $slidesPerGroup = $slides_per_group['desktop']; $slidesPerGroupIpad = ('' !== $slides_per_group['tablet']) ? $slides_per_group['tablet'] : $slidesPerGroup; $slidesPerGroupMobile = ('' !== $slides_per_group['phone']) ? $slides_per_group['phone'] : $slidesPerGroupIpad; if ( $slides_per_view > $slidesPerGroup && 1 !== $slidesPerGroup ) { $slidesPerGroupSkip = $slides_per_view - $slidesPerGroup; } if ( $slides_per_view_ipad > $slidesPerGroupIpad && 1 !== $slidesPerGroupIpad ) { $slidesPerGroupSkipIpad = $slides_per_view_ipad - $slidesPerGroupIpad; } if ( $slides_per_view_mobile > $slidesPerGroupMobile && 1 !== $slidesPerGroupMobile ) { $slidesPerGroupSkipMobile = $slides_per_view_mobile - $slidesPerGroupMobile; } } $arrows = 'false'; if ( isset($this->props['show_arrow']) && 'on' === $this->props['show_arrow'] ) { $arrows = "{ nextEl: '." . esc_attr( $order_class ) . " .aioc_flipbox_carousel_layout > .aioc_swiper_navigation .swiper-button-next', prevEl: '." . esc_attr( $order_class ) . " .aioc_flipbox_carousel_layout > .aioc_swiper_navigation .swiper-button-prev', }"; } $dots = 'false'; if ( isset($this->props['show_control_dot']) && 'on' === $this->props['show_control_dot'] ) { $number_dot = 'false'; if ( 'number_dot' === $this->props['control_dot_style'] ) { $number_dot = "function (index, className) { return '' + (index + 1) + ' '; }"; } $dynamic_bullets = 'on' === $this->props['enable_dynamic_dots'] && in_array( $this->props['control_dot_style'], array( 'solid_dot', 'transparent_dot', 'square_dot', 'number_dot' ), true ) ? 'true' : 'false'; $dots = "{ el: '." . esc_attr( $order_class ) . " .aioc_flipbox_carousel_layout + .aioc_swiper_pagination .swiper-pagination', dynamicBullets: " . $dynamic_bullets . ", clickable: true, renderBullet: " . $number_dot . ", }"; } $autoplay = esc_attr( $this->props['autoplay'] ); $autoplaySlides = 0; if ( 'on' === $autoplay ) { $autoplay_speed = ( isset( $this->props['autoplay_speed'] ) ) ? intval( $this->props['autoplay_speed'] ) : 3000; $autoplaySlides = '{ delay:' . $autoplay_speed . ', disableOnInteraction: true }'; } $cube = 'false'; if ( 'cube' === $slide_effect ) { $cube = '{ shadow: false, slideShadows: false }'; } $coverflow = 'false'; if ( 'coverflow' === $slide_effect ) { $enable_coverflow_shadow = ('on' === $this->props['enable_coverflow_shadow']) ? 'true' : 'false'; $coverflow_rotate = intval( $this->props['coverflow_rotate'] ); $coverflow_depth = intval( $this->props['coverflow_depth'] ); $coverflow = '{ rotate: ' . $coverflow_rotate . ', stretch: 0, depth: ' . $coverflow_depth . ', modifier: 1, slideShadows : ' . $enable_coverflow_shadow . ', }'; } $fade = 'false'; if ( 'fade' === $slide_effect ) { $fade = '{ crossFade: true }'; } $transition_duration = intval( $this->props['slide_transition_duration'] ); $transition_duration = '' !== $transition_duration || 0 !== $transition_duration ? $transition_duration : 1000; $loop = ( $this->props['slider_loop'] && 'on' === esc_attr($this->props['slider_loop']) ) ? 'true' : 'false'; $script = ''; return $script; } } new AIOC_FlipboxCarousel;