add_control( 'visibility', array( 'label' => esc_html__( 'Visibility', 'bella-beauty' ), 'description' => esc_html__( 'This setting will be applied after save and reload.', 'bella-beauty' ), 'type' => Controls_Manager::SWITCHER, 'label_off' => esc_html__( 'Hide', 'bella-beauty' ), 'label_on' => esc_html__( 'Show', 'bella-beauty' ), 'default' => 'no', ) ); $this->add_control( 'container_heading_control', array( 'label' => __( 'Container', 'bella-beauty' ), 'type' => Controls_Manager::HEADING, 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', ), ) ); $this->add_var_group_control( '', self::VAR_BACKGROUND, array( 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', ), ) ); $this->add_responsive_control( 'entrance_animation', array( 'label' => esc_html__( 'Entrance Animation', 'bella-beauty' ), 'type' => Controls_Manager::SELECT, 'label_block' => true, 'options' => array( 'fade-out' => esc_html__( 'Fade In', 'bella-beauty' ), 'fade-out-down' => esc_html__( 'Fade In Down', 'bella-beauty' ), 'fade-out-right' => esc_html__( 'Fade In Right', 'bella-beauty' ), 'fade-out-up' => esc_html__( 'Fade In Up', 'bella-beauty' ), 'fade-out-left' => esc_html__( 'Fade In Left', 'bella-beauty' ), 'zoom-out' => esc_html__( 'Zoom In', 'bella-beauty' ), 'slide-out-down' => esc_html__( 'Slide In Down', 'bella-beauty' ), 'slide-out-right' => esc_html__( 'Slide In Right', 'bella-beauty' ), 'slide-out-up' => esc_html__( 'Slide In Up', 'bella-beauty' ), 'slide-out-left' => esc_html__( 'Slide In Left', 'bella-beauty' ), ), 'selectors' => array( ':root' => '--' . $this->get_control_prefix_parameter( '', 'entrance_animation' ) . ': cmsmasters-page-preloader-transition-{{VALUE}};', ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', ), ) ); $this->add_responsive_control( 'exit_animation', array( 'label' => esc_html__( 'Exit Animation', 'bella-beauty' ), 'type' => Controls_Manager::SELECT, 'label_block' => true, 'options' => array( 'fade-in' => esc_html__( 'Fade Out', 'bella-beauty' ), 'fade-in-down' => esc_html__( 'Fade Out Down', 'bella-beauty' ), 'fade-in-right' => esc_html__( 'Fade Out Right', 'bella-beauty' ), 'fade-in-up' => esc_html__( 'Fade Out Up', 'bella-beauty' ), 'fade-in-left' => esc_html__( 'Fade Out Left', 'bella-beauty' ), 'zoom-in' => esc_html__( 'Zoom Out', 'bella-beauty' ), 'slide-in-down' => esc_html__( 'Slide Out Down', 'bella-beauty' ), 'slide-in-right' => esc_html__( 'Slide Out Right', 'bella-beauty' ), 'slide-in-up' => esc_html__( 'Slide Out Up', 'bella-beauty' ), 'slide-in-left' => esc_html__( 'Slide Out Left', 'bella-beauty' ), ), 'selectors' => array( ':root' => '--' . $this->get_control_prefix_parameter( '', 'exit_animation' ) . ': cmsmasters-page-preloader-transition-{{VALUE}};', ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', ), ) ); $this->add_control( 'animation_duration', array( 'label' => esc_html__( 'Animation Duration', 'bella-beauty' ) . ' (ms)', 'type' => Controls_Manager::SLIDER, 'range' => array( 'px' => array( 'min' => 0, 'max' => 5000, 'step' => 50, ), ), 'selectors' => array( ':root' => '--' . $this->get_control_prefix_parameter( '', 'animation_duration' ) . ': {{SIZE}}ms;', ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', ), ) ); $this->add_control( 'preloader_divider_control', array( 'type' => Controls_Manager::DIVIDER, 'style' => 'thick', 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', ), ) ); $this->add_control( 'preloader_heading_control', array( 'label' => __( 'Preloader', 'bella-beauty' ), 'type' => Controls_Manager::HEADING, 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', ), ) ); $this->add_control( 'preloader_type', array( 'label' => esc_html__( 'Type', 'bella-beauty' ), 'description' => esc_html__( 'This setting will be applied after save and reload.', 'bella-beauty' ), 'type' => Controls_Manager::SELECT, 'options' => array( 'none' => esc_html__( 'None', 'bella-beauty' ), 'animation' => esc_html__( 'Animation', 'bella-beauty' ), 'icon' => esc_html__( 'Icon', 'bella-beauty' ), 'image' => esc_html__( 'Image', 'bella-beauty' ), ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', ), ) ); $this->add_control( 'preloader_icon', array( 'label' => esc_html__( 'Icon', 'bella-beauty' ), 'description' => esc_html__( 'This setting will be applied after save and reload.', 'bella-beauty' ), 'type' => Controls_Manager::ICONS, 'default' => array( 'value' => 'fas fa-spinner', 'library' => 'fa-solid', ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', $this->get_control_id_parameter( '', 'preloader_type' ) => 'icon', ), ) ); $this->add_control( 'preloader_image', array( 'label' => esc_html__( 'Image', 'bella-beauty' ), 'description' => esc_html__( 'This setting will be applied after save and reload.', 'bella-beauty' ), 'type' => Controls_Manager::MEDIA, 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', $this->get_control_id_parameter( '', 'preloader_type' ) => 'image', ), ) ); $this->add_control( 'preloader_animation_type', array( 'label' => esc_html__( 'Animation', 'bella-beauty' ), 'description' => esc_html__( 'This setting will be applied after save and reload.', 'bella-beauty' ), 'type' => Controls_Manager::SELECT, 'options' => array( 'circle' => esc_html__( 'Circle', 'bella-beauty' ), 'circle-dashed' => esc_html__( 'Circle Dashed', 'bella-beauty' ), 'bouncing-dots' => esc_html__( 'Bouncing Dots', 'bella-beauty' ), 'pulsing-dots' => esc_html__( 'Pulsing Dots', 'bella-beauty' ), 'pulse' => esc_html__( 'Pulse', 'bella-beauty' ), 'overlap' => esc_html__( 'Overlap', 'bella-beauty' ), 'spinners' => esc_html__( 'Spinners', 'bella-beauty' ), 'nested-spinners' => esc_html__( 'Nested Spinners', 'bella-beauty' ), 'opposing-nested-spinners' => esc_html__( 'Opposing Nested Spinners', 'bella-beauty' ), 'opposing-nested-rings' => esc_html__( 'Opposing Nested Rings', 'bella-beauty' ), 'progress-bar' => esc_html__( 'Progress Bar', 'bella-beauty' ), 'two-way-progress-bar' => esc_html__( 'Two Way Progress Bar', 'bella-beauty' ), 'repeating-bar' => esc_html__( 'Repeating Bar', 'bella-beauty' ), ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', $this->get_control_id_parameter( '', 'preloader_type' ) => 'animation', ), ) ); $this->add_control( 'preloader_animation', array( 'label' => esc_html__( 'Animation', 'bella-beauty' ), 'type' => Controls_Manager::SELECT, 'default' => '', 'options' => array( '' => esc_html__( 'None', 'bella-beauty' ), 'eicon-spin' => esc_html__( 'Spinning', 'bella-beauty' ), 'bounce' => esc_html__( 'Bounce', 'bella-beauty' ), 'flash' => esc_html__( 'Flash', 'bella-beauty' ), 'pulse' => esc_html__( 'Pulse', 'bella-beauty' ), 'rubberBand' => esc_html__( 'Rubber Band', 'bella-beauty' ), 'shake' => esc_html__( 'Shake', 'bella-beauty' ), 'headShake' => esc_html__( 'Head Shake', 'bella-beauty' ), 'swing' => esc_html__( 'Swing', 'bella-beauty' ), 'tada' => esc_html__( 'Tada', 'bella-beauty' ), 'wobble' => esc_html__( 'Wobble', 'bella-beauty' ), 'jello' => esc_html__( 'Jello', 'bella-beauty' ), ), 'selectors' => array( ':root' => '--' . $this->get_control_prefix_parameter( '', 'preloader_animation' ) . ': {{VALUE}};', ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', $this->get_control_id_parameter( '', 'preloader_type' ) => array( 'icon', 'image' ), ), ) ); $this->add_control( 'preloader_animation_duration', array( 'label' => esc_html__( 'Animation Duration', 'bella-beauty' ) . ' (ms)', 'type' => Controls_Manager::SLIDER, 'range' => array( 'px' => array( 'min' => 0, 'max' => 5000, 'step' => 50, ), ), 'selectors' => array( ':root' => '--' . $this->get_control_prefix_parameter( '', 'preloader_animation_duration' ) . ': {{SIZE}}ms;', ), 'conditions' => array( 'relation' => 'and', 'terms' => array( array( 'name' => $this->get_control_id_parameter( '', 'visibility' ), 'operator' => '=', 'value' => 'yes', ), array( 'relation' => 'or', 'terms' => array( array( 'name' => $this->get_control_id_parameter( '', 'preloader_type' ), 'operator' => 'in', 'value' => array( 'image', 'icon', ), ), array( 'relation' => 'and', 'terms' => array( array( 'name' => $this->get_control_id_parameter( '', 'preloader_type' ), 'operator' => '=', 'value' => 'animation', ), array( 'name' => $this->get_control_id_parameter( '', 'preloader_animation_type' ), 'operator' => 'in', 'value' => array( 'circle', 'circle-dashed', 'bouncing-dots', 'pulsing-dots', 'spinners', 'nested-spinners', 'opposing-nested-spinners', 'opposing-nested-rings', 'progress-bar', 'two-way-progress-bar', 'repeating-bar', ), ), ), ), ), ), ), ), ) ); $this->add_control( 'preloader_color', array( 'label' => esc_html__( 'Color', 'bella-beauty' ), 'type' => Controls_Manager::COLOR, 'selectors' => array( ':root' => '--' . $this->get_control_prefix_parameter( '', 'preloader_color' ) . ': {{VALUE}};', ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', $this->get_control_id_parameter( '', 'preloader_type' ) => array( 'icon', 'animation' ), ), ) ); $this->add_responsive_control( 'preloader_size', array( 'label' => esc_html__( 'Size', 'bella-beauty' ), 'type' => Controls_Manager::SLIDER, 'size_units' => array( 'px' ), 'range' => array( 'px' => array( 'min' => 0, 'max' => 300, 'step' => 1, ), ), 'selectors' => array( ':root' => '--' . $this->get_control_prefix_parameter( '', 'preloader_size' ) . ': {{SIZE}}{{UNIT}};', ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', $this->get_control_id_parameter( '', 'preloader_type' ) => array( 'icon', 'animation' ), ), ) ); $this->add_responsive_control( 'preloader_rotate', array( 'label' => esc_html__( 'Rotate', 'bella-beauty' ), 'type' => Controls_Manager::SLIDER, 'size_units' => array( 'deg', 'grad', 'rad', 'turn' ), 'selectors' => array( ':root' => '--' . $this->get_control_prefix_parameter( '', 'preloader_rotate' ) . ': {{SIZE}}{{UNIT}};', ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', $this->get_control_id_parameter( '', 'preloader_type' ) => 'icon', $this->get_control_id_parameter( '', 'preloader_animation' ) . '!' => array( 'eicon-spin', 'bounce', 'pulse', 'rubberBand', 'shake', 'headShake', 'swing', 'tada', 'wobble', 'jello', ), ), ) ); $this->add_responsive_control( 'preloader_width', array( 'label' => esc_html__( 'Width', 'bella-beauty' ), 'type' => Controls_Manager::SLIDER, 'size_units' => array( 'px', '%', 'em', 'rem', 'vw', 'custom' ), 'range' => array( '%' => array( 'min' => 1, 'max' => 100, ), 'px' => array( 'min' => 1, 'max' => 1000, ), 'vw' => array( 'min' => 1, 'max' => 100, ), ), 'selectors' => array( ':root' => '--' . $this->get_control_prefix_parameter( '', 'preloader_width' ) . ': {{SIZE}}{{UNIT}};', ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', $this->get_control_id_parameter( '', 'preloader_type' ) => 'image', ), ) ); $this->add_responsive_control( 'preloader_max_width', array( 'label' => esc_html__( 'Max Width', 'bella-beauty' ), 'type' => Controls_Manager::SLIDER, 'size_units' => array( 'px', '%', 'em', 'rem', 'vw', 'custom' ), 'range' => array( '%' => array( 'min' => 1, 'max' => 100, ), 'px' => array( 'min' => 1, 'max' => 1000, ), 'vw' => array( 'min' => 1, 'max' => 100, ), ), 'selectors' => array( ':root' => '--' . $this->get_control_prefix_parameter( '', 'preloader_max_width' ) . ': {{SIZE}}{{UNIT}};', ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', $this->get_control_id_parameter( '', 'preloader_type' ) => 'image', ), ) ); $this->add_responsive_control( 'preloader_opacity', array( 'label' => esc_html__( 'Opacity', 'bella-beauty' ), 'type' => Controls_Manager::SLIDER, 'range' => array( 'px' => array( 'min' => 0, 'max' => 1, 'step' => .1, ), ), 'selectors' => array( ':root' => '--' . $this->get_control_prefix_parameter( '', 'preloader_opacity' ) . ': {{SIZE}};', ), 'condition' => array( $this->get_control_id_parameter( '', 'visibility' ) => 'yes', $this->get_control_id_parameter( '', 'preloader_type' ) => 'image', ), ) ); $this->add_control( 'apply_settings', array( 'label_block' => true, 'show_label' => false, 'type' => Controls_Manager::BUTTON, 'text' => esc_html__( 'Save & Reload', 'bella-beauty' ), 'event' => 'cmsmasters:theme_settings:apply_settings', 'separator' => 'before', ) ); } }