%2$s%4$s %3$s',
$attributes,
$label,
$required,
isset( $field['no_colon'] ) && true === $field['no_colon'] ? '' : ':'
);
return $label;
}
/**
* Get svg icon as string
*
* @param string icon name
*
* @return string div-wrapped svg icon
*/
function get_icon( $icon_name ) {
$all_svg_icons = et_pb_get_svg_icons_list();
$icon = isset( $all_svg_icons[ $icon_name ] ) ? $all_svg_icons[ $icon_name ] : '';
if ( '' === $icon ) {
return '';
}
return '
';
}
/**
* Get structure of background UI tabs
*
* @return array
*/
function get_background_fields_structure( $base_name = 'background') {
$is_background_attr = 'background' === $base_name;
$use_background_color_gradient = $is_background_attr ? 'use_background_color_gradient' : "{$base_name}_use_color_gradient";
$prefix = $is_background_attr ? '' : "{$base_name}_";
$structure = array(
'color' => array(
"{$base_name}_color",
),
'gradient' => array(
"{$base_name}_color_gradient_start",
"{$base_name}_color_gradient_end",
$use_background_color_gradient,
"{$base_name}_color_gradient_type",
"{$base_name}_color_gradient_direction",
"{$base_name}_color_gradient_direction_radial",
"{$base_name}_color_gradient_start_position",
"{$base_name}_color_gradient_end_position",
"{$base_name}_color_gradient_overlays_image",
),
'image' => array(
"{$base_name}_image",
"{$prefix}parallax",
"{$prefix}parallax_method",
"{$base_name}_size",
"{$base_name}_position",
"{$base_name}_repeat",
"{$base_name}_blend",
),
'video' => array(
"{$base_name}_video_mp4",
"{$base_name}_video_webm",
"{$base_name}_video_width",
"{$base_name}_video_height",
"{$prefix}allow_player_pause",
"{$base_name}_video_pause_outside_viewport",
),
);
if ( $is_background_attr ) {
$structure['color'][] = 'use_background_color';
$structure['image'][] = 'bg_img'; // Column
}
return $structure;
}
/**
* Get list of background fields names in one dimensional array
*
* @return array
*/
function get_background_fields_names() {
$background_structure = $this->get_background_fields_structure();
$fields_names = array();
foreach ( $background_structure as $tab_name ) {
foreach ( $tab_name as $field_name ) {
$fields_names[] = $field_name;
}
}
return $fields_names;
}
/**
* Get / extract background fields from all modules fields
*
* @param array all modules fields
*
* @return array background fields multidimensional array grouped based on its tab
*/
function get_background_fields( $all_fields, $base_name = 'background' ) {
$background_fields_structure = $this->get_background_fields_structure( $base_name );
$background_tab_names = array_keys( $background_fields_structure );
$background_fields = array_fill_keys( $background_tab_names, array() );
foreach ( $all_fields as $field_name => $field ) {
// Multiple foreaches seem overkill. Use single foreach with little bit if conditions
// redundancy to get background fields grouped into multi-dimensional tab-based array
if ( in_array( $field_name, $background_fields_structure['color'] ) ) {
$background_fields['color'][$field_name] = $field;
}
if ( in_array( $field_name, $background_fields_structure['gradient'] ) ) {
$background_fields['gradient'][$field_name] = $field;
}
if ( in_array( $field_name, $background_fields_structure['image'] ) ) {
$background_fields['image'][$field_name] = $field;
}
if ( in_array( $field_name, $background_fields_structure['video'] ) ) {
$background_fields['video'][$field_name] = $field;
}
}
return $background_fields;
}
/**
* Generate background fields based on base name
*
* @param string background base name
* @param string background tab name
* @param string field's tab slug
* @param string field's toggle slug
*
* @return array of background fields
*/
function generate_background_options( $base_name = 'background', $background_tab, $tab_slug, $toggle_slug ) {
$baseless_prefix = 'background' === $base_name ? '' : "{$base_name}_";
$options = array();
// Not included on skip background tab because background-field is expected to be registered under "background_color" field
if ( in_array( $background_tab, array( 'all', 'button', 'color' ) ) ) {
$options["{$base_name}_color"] = array(
'label' => esc_html__( 'Background Color', 'et_builder' ),
'type' => 'color-alpha',
'option_category' => 'configuration',
'custom_color' => true,
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'color',
);
}
if ( in_array( $background_tab, array( 'all', 'button', 'skip', 'gradient' ) ) ) {
$use_background_color_gradient_name = 'background' === $base_name ? 'use_background_color_gradient' : "{$base_name}_use_color_gradient";
$options[ $use_background_color_gradient_name ] = array(
'label' => esc_html__( 'Use Background Color Gradient', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'yes_no_button',
'option_category' => 'configuration',
'options' => array(
'off' => esc_html__( 'No', 'et_builder' ),
'on' => esc_html__( 'Yes', 'et_builder' ),
),
'default' => 'off',
'shortcode_default' => 'off',
'default_on_child' => true,
'affects' => array(
"{$base_name}_color_gradient_start",
"{$base_name}_color_gradient_end",
"{$base_name}_color_gradient_start_position",
"{$base_name}_color_gradient_end_position",
"{$base_name}_color_gradient_type",
"{$base_name}_color_gradient_overlays_image",
),
'description' => '',
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'use_color_gradient',
);
$options["{$base_name}_color_gradient_start"] = array(
'label' => esc_html__( 'Gradient Start', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'color-alpha',
'option_category' => 'configuration',
'description' => '',
'depends_show_if' => 'on',
'default' => ET_Global_Settings::get_value( 'all_background_gradient_start' ),
'shortcode_default' => ET_Global_Settings::get_value( 'all_background_gradient_start' ),
'default_on_child' => true,
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'color_gradient_start',
);
$options["{$base_name}_color_gradient_end"] = array(
'label' => esc_html__( 'Gradient End', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'color-alpha',
'option_category' => 'configuration',
'description' => '',
'depends_show_if' => 'on',
'default' => ET_Global_Settings::get_value( 'all_background_gradient_end' ),
'shortcode_default' => ET_Global_Settings::get_value( 'all_background_gradient_end' ),
'default_on_child' => true,
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'color_gradient_end',
);
$options["{$base_name}_color_gradient_type"] = array(
'label' => esc_html__( 'Gradient Type', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'select',
'option_category' => 'configuration',
'options' => array(
'linear' => esc_html__( 'Linear', 'et_builder' ),
'radial' => esc_html__( 'Radial', 'et_builder' ),
),
'affects' => array(
"{$base_name}_color_gradient_direction",
"{$base_name}_color_gradient_direction_radial"
),
'default' => ET_Global_Settings::get_value( 'all_background_gradient_type' ),
'shortcode_default' => ET_Global_Settings::get_value( 'all_background_gradient_type' ),
'default_on_child' => true,
'description' => '',
'depends_show_if' => 'on',
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'color_gradient_type',
);
$options["{$base_name}_color_gradient_direction"] = array(
'label' => esc_html__( 'Gradient Direction', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'range',
'option_category' => 'configuration',
'range_settings' => array(
'min' => 1,
'max' => 360,
'step' => 1,
),
'default' => ET_Global_Settings::get_value( 'all_background_gradient_direction' ),
'shortcode_default' => ET_Global_Settings::get_value( 'all_background_gradient_direction' ),
'default_on_child' => true,
'validate_unit' => true,
'fixed_unit' => 'deg',
'fixed_range' => true,
'depends_show_if' => 'linear',
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'color_gradient_direction',
);
$options["{$base_name}_color_gradient_direction_radial"] = array(
'label' => esc_html__( 'Radial Direction', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'select',
'option_category' => 'configuration',
'options' => array(
'center' => esc_html__( 'Center', 'et_builder' ),
'top left' => esc_html__( 'Top Left', 'et_builder' ),
'top' => esc_html__( 'Top', 'et_builder' ),
'top right' => esc_html__( 'Top Right', 'et_builder' ),
'right' => esc_html__( 'Right', 'et_builder' ),
'bottom right' => esc_html__( 'Bottom Right', 'et_builder' ),
'bottom' => esc_html__( 'Bottom', 'et_builder' ),
'bottom left' => esc_html__( 'Bottom Left', 'et_builder' ),
'left' => esc_html__( 'Left', 'et_builder' ),
),
'default' => ET_Global_Settings::get_value( 'all_background_gradient_direction_radial' ),
'shortcode_default' => ET_Global_Settings::get_value( 'all_background_gradient_direction_radial' ),
'default_on_child' => true,
'description' => '',
'depends_show_if' => 'radial',
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'color_gradient_direction_radial',
);
$options["{$base_name}_color_gradient_start_position"] = array(
'label' => esc_html__( 'Start Position', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'range',
'option_category' => 'configuration',
'range_settings' => array(
'min' => 0,
'max' => 100,
'step' => 1,
),
'default' => ET_Global_Settings::get_value( 'all_background_gradient_start_position' ),
'shortcode_default' => ET_Global_Settings::get_value( 'all_background_gradient_start_position' ),
'default_on_child' => true,
'validate_unit' => true,
'fixed_unit' => '%',
'fixed_range' => true,
'depends_show_if' => 'on',
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'color_gradient_start_position',
);
$options["{$base_name}_color_gradient_end_position"] = array(
'label' => esc_html__( 'End Position', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'range',
'option_category' => 'configuration',
'range_settings' => array(
'min' => 0,
'max' => 100,
'step' => 1,
),
'default' => ET_Global_Settings::get_value( 'all_background_gradient_end_position' ),
'shortcode_default' => ET_Global_Settings::get_value( 'all_background_gradient_end_position' ),
'default_on_child' => true,
'validate_unit' => true,
'fixed_unit' => '%',
'fixed_range' => true,
'depends_show_if' => 'on',
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'color_gradient_end_position',
);
$options["${base_name}_color_gradient_overlays_image"] = array(
'label' => esc_html__( 'Place Gradient Above Background Image', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'yes_no_button',
'option_category' => 'configuration',
'options' => array(
'off' => esc_html__( 'No', 'et_builder' ),
'on' => esc_html__( 'Yes', 'et_builder' ),
),
'default' => ET_Global_Settings::get_value( 'all_background_gradient_overlays_image' ),
'shortcode_default' => ET_Global_Settings::get_value( 'all_background_gradient_overlays_image' ),
'default_on_child' => true,
'description' => esc_html__( 'If enabled, gradient will be positioned on top of background-image', 'et_builder' ),
'depends_show_if' => 'on',
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'color_gradient_overlays_image',
);
}
if ( in_array( $background_tab, array( 'all', 'button', 'skip', 'image' ) ) ) {
$options["{$base_name}_image"] = array(
'label' => esc_html__( 'Background Image', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'upload',
'option_category' => 'configuration',
'upload_button_text' => esc_attr__( 'Upload an image', 'et_builder' ),
'choose_text' => esc_attr__( 'Choose a Background Image', 'et_builder' ),
'update_text' => esc_attr__( 'Set As Background', 'et_builder' ),
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'image',
);
if ( 'button' !== $background_tab ) {
$options["${baseless_prefix}parallax"] = array(
'label' => esc_html__( 'Use Parallax Effect', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'yes_no_button',
'option_category' => 'configuration',
'options' => array(
'off' => esc_html__( 'No', 'et_builder' ),
'on' => esc_html__( 'Yes', 'et_builder' ),
),
'default' => 'off',
'default_on_child' => true,
'affects' => array(
"${baseless_prefix}parallax_method",
"{$base_name}_size",
"{$base_name}_position",
"{$base_name}_repeat",
"{$base_name}_blend",
),
'description' => esc_html__( 'If enabled, your background image will stay fixed as your scroll, creating a fun parallax-like effect.', 'et_builder' ),
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'parallax',
);
$options["${baseless_prefix}parallax_method"] = array(
'label' => esc_html__( 'Parallax Method', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'select',
'option_category' => 'configuration',
'options' => array(
'on' => esc_html__( 'True Parallax', 'et_builder' ),
'off' => esc_html__( 'CSS', 'et_builder' ),
),
'default' => isset( $this->fields_defaults["${baseless_prefix}parallax_method"][0] ) ? $this->fields_defaults["${baseless_prefix}parallax_method"][0] : 'on',
'default_on_child' => true,
'depends_show_if' => 'on',
'description' => esc_html__( 'Define the method, used for the parallax effect.', 'et_builder' ),
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'parallax_method',
);
}
$options["{$base_name}_size"] = array(
'label' => esc_html__( 'Background Image Size', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'select',
'option_category' => 'layout',
'options' => array(
'cover' => esc_html__( 'Cover', 'et_builder' ),
'contain' => esc_html__( 'Fit', 'et_builder' ),
'initial' => esc_html__( 'Actual Size', 'et_builder' ),
),
'default' => 'cover',
'default_on_child'=> true,
'depends_show_if' => 'off',
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'size',
);
$options["{$base_name}_position"] = array(
'label' => esc_html__( 'Background Image Position', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'select',
'option_category' => 'layout',
'options' => array(
'top_left' => esc_html__( 'Top Left', 'et_builder' ),
'top_center' => esc_html__( 'Top Center', 'et_builder' ),
'top_right' => esc_html__( 'Top Right', 'et_builder' ),
'center_left' => esc_html__( 'Center Left', 'et_builder' ),
'center' => esc_html__( 'Center', 'et_builder' ),
'center_right' => esc_html__( 'Center Right', 'et_builder' ),
'bottom_left' => esc_html__( 'Bottom Left', 'et_builder' ),
'bottom_center' => esc_html__( 'Bottom Center', 'et_builder' ),
'bottom_right' => esc_html__( 'Bottom Right', 'et_builder' ),
),
'default' => 'center',
'default_on_child' => true,
'depends_show_if' => 'off',
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'position',
);
$options["{$base_name}_repeat"] = array(
'label' => esc_html__( 'Background Image Repeat', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'select',
'option_category' => 'layout',
'options' => array(
'no-repeat' => esc_html__( 'No Repeat', 'et_builder' ),
'repeat' => esc_html__( 'Repeat', 'et_builder' ),
'repeat-x' => esc_html__( 'Repeat X (horizontal)', 'et_builder' ),
'repeat-y' => esc_html__( 'Repeat Y (vertical)', 'et_builder' ),
'space' => esc_html__( 'Space', 'et_builder' ),
'round' => esc_html__( 'Round', 'et_builder' ),
),
'default' => 'no-repeat',
'default_on_child' => true,
'depends_show_if' => 'off',
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'repeat',
);
$options["{$base_name}_blend"] = array(
'label' => esc_html__( 'Background Image Blend', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'select',
'option_category' => 'layout',
'options' => array(
'normal' => esc_html__( 'Normal', 'et_builder' ),
'multiply' => esc_html__( 'Multiply', 'et_builder' ),
'screen' => esc_html__( 'Screen', 'et_builder' ),
'overlay' => esc_html__( 'Overlay', 'et_builder' ),
'darken' => esc_html__( 'Darken', 'et_builder' ),
'lighten' => esc_html__( 'Lighten', 'et_builder' ),
'color-dodge' => esc_html__( 'Color Dodge', 'et_builder' ),
'color-burn' => esc_html__( 'Color Burn', 'et_builder' ),
'hard-light' => esc_html__( 'Hard Light', 'et_builder' ),
'soft-light' => esc_html__( 'Soft Light', 'et_builder' ),
'difference' => esc_html__( 'Difference', 'et_builder' ),
'exclusion' => esc_html__( 'Exclusion', 'et_builder' ),
'hue' => esc_html__( 'Hue', 'et_builder' ),
'saturation' => esc_html__( 'Saturation', 'et_builder' ),
'color' => esc_html__( 'Color', 'et_builder' ),
'luminosity' => esc_html__( 'Luminosity', 'et_builder' ),
),
'default' => 'normal',
'default_on_child' => true,
'depends_show_if' => 'off',
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'blend',
);
}
if ( in_array( $background_tab, array( 'all', 'skip', 'video' ) ) ) {
$options["{$base_name}_video_mp4"] = array(
'label' => esc_html__( 'Background Video MP4', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'upload',
'option_category' => 'configuration',
'data_type' => 'video',
'upload_button_text' => esc_attr__( 'Upload a video', 'et_builder' ),
'choose_text' => esc_attr__( 'Choose a Background Video MP4 File', 'et_builder' ),
'update_text' => esc_attr__( 'Set As Background Video', 'et_builder' ),
'description' => et_get_safe_localization( __( 'All videos should be uploaded in both .MP4 .WEBM formats to ensure maximum compatibility in all browsers. Upload the .MP4 version here. Important Note: Video backgrounds are disabled from mobile devices. Instead, your background image will be used. For this reason, you should define both a background image and a background video to ensure best results.', 'et_builder' ) ),
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'computed_affects' => array(
"__video_{$base_name}",
),
'field_template' => 'video_mp4',
);
$options["{$base_name}_video_webm"] = array(
'label' => esc_html__( 'Background Video Webm', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'upload',
'option_category' => 'configuration',
'data_type' => 'video',
'upload_button_text' => esc_attr__( 'Upload a video', 'et_builder' ),
'choose_text' => esc_attr__( 'Choose a Background Video WEBM File', 'et_builder' ),
'update_text' => esc_attr__( 'Set As Background Video', 'et_builder' ),
'description' => et_get_safe_localization( __( 'All videos should be uploaded in both .MP4 .WEBM formats to ensure maximum compatibility in all browsers. Upload the .WEBM version here. Important Note: Video backgrounds are disabled from mobile devices. Instead, your background image will be used. For this reason, you should define both a background image and a background video to ensure best results.', 'et_builder' ) ),
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'computed_affects' => array(
"__video_{$base_name}",
),
'field_template' => 'video_webm',
);
$options["{$base_name}_video_width"] = array(
'label' => esc_html__( 'Background Video Width', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'text',
'option_category' => 'configuration',
'description' => esc_html__( 'In order for videos to be sized correctly, you must input the exact width (in pixels) of your video here.', 'et_builder' ),
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'computed_affects' => array(
"__video_{$base_name}",
),
'field_template' => 'video_width',
);
$options["{$base_name}_video_height"] = array(
'label' => esc_html__( 'Background Video Height', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'text',
'option_category' => 'configuration',
'description' => esc_html__( 'In order for videos to be sized correctly, you must input the exact height (in pixels) of your video here.', 'et_builder' ),
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'computed_affects' => array(
"__video_{$base_name}",
),
'field_template' => 'video_height',
);
$options["${baseless_prefix}allow_player_pause"] = array(
'label' => esc_html__( 'Pause Video When Another Video Plays', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'yes_no_button',
'option_category' => 'configuration',
'options' => array(
'off' => esc_html__( 'No', 'et_builder' ),
'on' => esc_html__( 'Yes', 'et_builder' ),
),
'default' => 'off',
'default_on_child' => true,
'description' => esc_html__( 'Allow video to be paused by other players when they begin playing', 'et_builder' ),
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'allow_player_pause',
);
$options["${base_name}_video_pause_outside_viewport"] = array(
'label' => esc_html__( 'Pause Video While Not In View', 'et_builder' ),
'type' => 'skip' === $background_tab ? 'skip' : 'yes_no_button',
'option_category' => 'configuration',
'options' => array(
'off' => esc_html__( 'No', 'et_builder' ),
'on' => esc_html__( 'Yes', 'et_builder' ),
),
'default' => 'on',
'default_on_child' => true,
'description' => esc_html__( 'Allow video to be paused while it is not in the visible area.', 'et_builder' ),
'tab_slug' => $tab_slug,
'toggle_slug' => $toggle_slug,
'field_template' => 'video_pause_outside_viewport',
);
$options["__video_{$base_name}"] = array(
'type' => 'computed',
'computed_callback' => array( 'ET_Builder_Element', "get_video_background" ),
'computed_depends_on' => array(
"{$base_name}_video_mp4",
"{$base_name}_video_webm",
"{$base_name}_video_width",
"{$base_name}_video_height",
),
'computed_minimum' => array(
"{$base_name}_video_mp4",
"{$base_name}_video_webm",
),
'computed_variables' => array(
'base_name' => $base_name,
),
);
}
return $options;
}
/**
* Get string of background fields UI. Used in place of background_color fields UI
*
* @param array list of all module fields
*
* @return string background fields UI
*/
function wrap_settings_background_fields( $all_fields, $base_name = 'background' ) {
$tab_structure = $this->get_background_fields_structure( $base_name );
$tab_names = array_keys( $tab_structure );
$background_fields = $this->get_background_fields( $all_fields, $base_name );
// Concatenate background fields UI
$background = '';
// Label
$background .= sprintf(
'',
esc_html__( 'Background:', 'et_builder' )
);
// Field wrapper
$background .= sprintf(
'',
esc_attr( $base_name )
);
$tab_names_processed = array();
foreach ( $tab_names as $tab_nav_name ) {
if ( ! empty( $background_fields[ $tab_nav_name ] ) ) {
$tab_names_processed[] = sanitize_text_field( $tab_nav_name );
}
}
// Tab Nav
$background .= sprintf( '<%%= window.et_builder.options_template_output("background_tabs_nav",%1$s) %%>', json_encode( $tab_names_processed ) );
// Tabs
foreach ( $tab_names as $tab_name ) {
$background .= sprintf(
'
',
esc_attr( $tab_name )
);
// Get tab's fields
$tab_fields = $background_fields[ $tab_name ];
// Render gradient tab's preview
if ( 'gradient' === $tab_name ) {
$background .= '<%= window.et_builder.options_template_output("background_gradient_buttons") %>';
}
// Tab's fields
foreach ( $tab_fields as $tab_field_name => $tab_field ) {
if ( 'skip' === $tab_field['type'] ) {
continue;
}
$preview_class = '';
// Append field name
$tab_field['name'] = $tab_field_name;
// Append preview class name
if ( in_array( $tab_field['name'], array( "{$base_name}_color", "{$base_name}_image", "{$base_name}_url", "{$base_name}_video_mp4", "{$base_name}_video_webm" ) ) ) {
$tab_field['has_preview'] = true;
$preview_class = ' et-pb-option--has-preview';
}
// Prepare field list attribute
$depends = false;
$depends_attr = '';
if ( isset( $tab_field['depends_show_if'] ) || isset( $tab_field['depends_show_if_not'] ) ) {
$depends = true;
if ( isset( $tab_field['depends_show_if_not'] ) ) {
$depends_show_if_not = is_array( $tab_field['depends_show_if_not'] ) ? implode( ',', $tab_field['depends_show_if_not'] ) : $tab_field['depends_show_if_not'];
$depends_attr = sprintf( ' data-depends_show_if_not="%s"', esc_attr( $depends_show_if_not ) );
} else {
$depends_attr = sprintf( ' data-depends_show_if="%s"', esc_attr( $tab_field['depends_show_if'] ) );
}
}
// Append fields UI
$background .= sprintf(
'
',
esc_attr( $tab_field_name ),
esc_attr( $preview_class ),
$depends_attr,
esc_attr( $tab_field['name'] ),
$tab_field['name'] === "{$base_name}_color" && 'background' !== $base_name ? 'et-pb-option-main' : 'et-pb-option',
isset( $tab_field['field_template'] ) ? esc_attr( $tab_field['field_template'] ) : ''
);
$background .= $this->wrap_settings_option_label( $tab_field );
$background .= $this->wrap_settings_option_field( $tab_field );
$background .= '
';
}
$background .= '
';
}
// End of field wrapper
$background .= '
%1$s
',
html_entity_decode( esc_html( $field['message'] ) ),
esc_attr( $field['name'] ),
esc_attr( $field['display_if'] )
);
break;
case 'tiny_mce':
if ( ! empty( $field['tiny_mce_html_mode'] ) ) {
$field['class'] .= ' html_mode';
}
$main_content_property_name = $main_content_field_name = 'et_pb_content_new';
if ( isset( $this->type ) && 'child' === $this->type ) {
$main_content_property_name = "data.{$main_content_property_name}";
}
$field_el .= sprintf(
'<%%= typeof( %2$s ) !== \'undefined\' ? %2$s : \'\' %%>
',
esc_attr( $main_content_field_name ),
esc_html( $main_content_property_name )
);
break;
case 'codemirror':
case 'textarea':
case 'custom_css':
case 'options_list':
$field_custom_value = esc_html( $field_name );
if ( in_array( $field['type'], array( 'custom_css', 'options_list' ) ) ) {
$field_custom_value .= '.replace( /\|\|/g, "\n" ).replace( /%22/g, """ ).replace( /%92/g, "\\\" )';
$field_custom_value .= '.replace( /%91/g, "[" ).replace( /%93/g, "]" )';
}
if ( in_array( $field_name, array( 'et_pb_raw_content', 'et_pb_custom_message' ) ) ) {
// escape html to make sure it's not rendered inside the Textarea field in Settings Modal.
$field_custom_value = sprintf( '_.escape( %1$s )', $field_custom_value );
}
$field_el .= sprintf(
'',
esc_attr( $field['class'] ),
esc_attr( $field['id'] ),
esc_html( $field_name ),
et_esc_previously( $field_custom_value )
);
if ( 'options_list' === $field['type'] ) {
$radio_check = '';
$row_class = 'et_options_list_row';
if ( isset( $field['checkbox'] ) && true === $field['checkbox'] ) {
$radio_check = '';
$row_class .= ' et_options_list_row_checkbox';
}
if ( isset( $field['radio'] ) && true === $field['radio'] ) {
$radio_check = '';
$row_class .= ' et_options_list_row_radio';
}
$field_el = sprintf(
'',
esc_attr( $field['class'] ),
esc_attr( $field['id'] ),
esc_html( $field_name ),
et_esc_previously( $field_custom_value ),
esc_attr( $row_class ),
$radio_check,
esc_html__( 'Add New Item', 'et_builder' )
);
}
break;
case 'conditional_logic':
$field_custom_value = esc_html( $field_name );
$field_custom_value .= '.replace( /\|\|/g, "\n" ).replace( /%22/g, """ ).replace( /%92/g, "\\\" )';
$field_custom_value .= '.replace( /%91/g, "[" ).replace( /%93/g, "]" )';
$field_selects = sprintf(
'
',
esc_html__( 'equals', 'et_builder' ),
esc_html__( 'does not equal', 'et_builder' ),
esc_html__( 'is greater than', 'et_builder' ),
esc_html__( 'is less than', 'et_builder' ),
esc_html__( 'contains', 'et_builder' ),
esc_html__( 'does not contain', 'et_builder' ),
esc_html__( 'is empty', 'et_builder' ),
esc_html__( 'is not empty', 'et_builder' )
);
$field_el = sprintf(
'',
esc_attr( $field['class'] ),
esc_attr( $field['id'] ),
esc_html( $field_name ),
et_esc_previously( $field_custom_value ),
$field_selects,
esc_html__( 'checked', 'et_builder' ),
esc_html__( 'not checked', 'et_builder' ),
esc_html__( 'Add New Rule', 'et_builder' )
);
break;
case 'text_align':
case 'select':
case 'divider':
case 'yes_no_button':
case 'multiple_buttons':
case 'font':
case 'select_with_option_groups':
if ( 'font' === $field['type'] ) {
$field['id'] .= '_select';
$field_name .= '_select';
$field['class'] .= ' et-pb-helper-field';
$field['options'] = array();
}
if ( 'text_align' === $field['type'] ) {
$field['class'] = 'et-pb-text-align-select';
}
$button_options = array();
if ( 'yes_no_button' === $field['type'] ) {
$button_options = isset( $field['button_options'] ) ? $field['button_options'] : array();
}
if ( isset( $field['default'] ) ) {
$attributes .= sprintf( ' data-default="%1$s"', esc_attr( $default ) );
}
//If default is an array, then $default_value value is an js expression, so it doesn't need to be encoded
//In other case it needs to be encoded
$select_default = $default_is_arr ? $default_value : json_encode( $default_value );
if ( 'font' === $field['type'] ) {
$group_label = isset( $field['group_label'] ) ? $field['group_label'] : '';
$select = $this->render_font_select( $field_name, $field['id'], $group_label );
} else if ( 'multiple_buttons' === $field['type'] ) {
if ( isset( $field['toggleable'] ) && $field['toggleable'] ) {
$attributes .= ' data-toggleable="yes"';
}
if ( isset( $field['multi_selection'] ) && $field['multi_selection'] ) {
$attributes .= ' data-multi="yes"';
}
$select = $this->render_multiple_buttons( $field_name, $field['options'], $field['id'], $field['class'], $attributes, $value, $default_value );
} else {
$select = $this->render_select( $field_name, $field['options'], $field['id'], $field['class'], $attributes, $field['type'], $button_options, $select_default, $only_options );
}
if ( $only_options ) {
$field_el = $select;
} else {
$field_el .= $select;
}
if ( 'font' === $field['type'] ) {
$font_style_button_html = sprintf(
'<%%= window.et_builder.options_template_output("font_buttons",%1$s) %%>',
json_encode( array( 'italic', 'uppercase', 'capitalize', 'underline', 'line_through' ) )
);
$field_el .= sprintf(
'
%1$s
',
$font_style_button_html
);
$field_el .= '<%= window.et_builder.options_template_output("font_line_styles") %>';
$field_el .= $hidden_field;
}
if ( 'text_align' === $field['type'] ) {
$text_align_options = ! empty( $field[ 'options' ] ) ? array_keys( $field[ 'options' ] ) : array( 'left', 'center', 'right', 'justified' );
$is_module_alignment = in_array( $field['name'], array( 'et_pb_module_alignment', 'et_pb_button_alignment' ) ) || ( isset( $field['options_icon'] ) && 'module_align' === $field['options_icon'] );
$text_align_style_button_html = sprintf(
'<%%= window.et_builder.options_text_align_buttons_output(%1$s, "%2$s") %%>',
json_encode( $text_align_options ),
$is_module_alignment ? 'module' : 'text'
);
$field_el .= sprintf(
'
%1$s
',
$text_align_style_button_html
);
$field_el .= $hidden_field;
}
if ( 'select_with_option_groups' === $field['type'] ) {
$field_el .= $hidden_field;
}
break;
case 'select_animation':
$options = $field['options'];
$animation_buttons_array = array();
foreach ( $options as $option_name => $option_title ) {
$animation_buttons_array[ $option_name ] = sanitize_text_field( $option_title );
}
$animation_buttons = sprintf( '<%%= window.et_builder.options_template_output("animation_buttons",%1$s) %%>', json_encode( $animation_buttons_array ) );
$field_el = sprintf(
'
%1$s
%2$s
',
$animation_buttons,
$hidden_field
);
break;
case 'presets_shadow':
case 'select_box_shadow':
case 'presets':
$presets = $field['presets'];
$presets_buttons = '';
foreach ( $presets as $preset ) {
$fields = isset( $preset['fields'] )
? htmlspecialchars( json_encode( $preset['fields'] ), ENT_QUOTES, 'UTF-8' )
: '[]';
$presets_buttons .= sprintf(
'',
esc_attr( $preset['value'] ),
esc_attr( $fields )
);
if ( isset( $preset['title'] ) && ! empty( $preset['title'] ) ) {
$presets_buttons .= sprintf(
'%1$s',
$preset['title']
);
}
if ( isset( $preset['icon'] ) && ! empty( $preset['icon'] ) ) {
$presets_buttons .= sprintf(
'%1$s',
$this->get_icon( $preset['icon'] )
);
}
if ( isset( $preset['content'] ) && ! empty( $preset['content'] ) ) {
if ( is_array( $preset['content'] ) ) {
$content = isset( $preset['content']['content'] ) ? $preset['content']['content'] : '';
$class = isset( $preset['content']['class'] ) ? ' ' . $preset['content']['class'] : '';
} else {
$content = $preset['content'];
$class = '';
}
$presets_buttons .= sprintf(
'%1$s',
$content,
$class
);
}
$presets_buttons .= '
';
}
$field_el = sprintf(
'
%1$s
%2$s
',
$presets_buttons,
$hidden_field,
esc_attr( $field['type'] )
);
break;
case 'color':
case 'color-alpha':
$field['default'] = ! empty( $field['default'] ) ? $field['default'] : '';
if ( $is_custom_color && ( ! isset( $field['default'] ) || '' === $field['default'] ) ) {
$field['default'] = '';
}
$default = ! empty( $field['default'] ) && ! $is_custom_color ? sprintf( ' data-default-color="%1$s" data-default="%1$s"', esc_attr( $field['default'] ) ) : '';
$color_id = sprintf( ' id="%1$s"', esc_attr( $field['id'] ) );
$color_value_html = '<%%- typeof( %1$s ) !== \'undefined\' && %1$s !== \'\' ? %1$s : \'%2$s\' %%>';
$main_color_value = sprintf( $color_value_html, esc_attr( $field_name ), $field['default'] );
$hidden_color_value = sprintf( $color_value_html, esc_attr( $field_name ), '' );
$has_preview = isset( $field['has_preview'] ) && $field['has_preview'];
$field_el = sprintf(
'
%4$s',
( ! $is_custom_color || $has_preview ? $color_id : '' ),
$main_color_value,
$default,
( ! empty( $field['additional_code'] ) ? $field['additional_code'] : '' ),
( 'color-alpha' === $field['type'] ? ' et-pb-color-picker-hex-alpha' : '' ),
( 'color-alpha' === $field['type'] ? ' data-alpha="true"' : '' ),
( 'color' === $field['type'] ? ' maxlength="7"' : '' ),
( ! $is_custom_color ? ' et-pb-main-setting' : '' ),
esc_attr__( 'Hex Value', 'et_builder' ),
$has_preview ? esc_attr( ' et-pb-color-picker-hex-has-preview' ) : ''
);
if ( $is_custom_color && ! $has_preview ) {
$field_el = sprintf(
'%1$s
%2$s
%5$s
',
esc_html__( 'Choose Custom Color', 'et_builder' ),
$field_el,
$color_id,
$hidden_color_value,
$reset_button_html,
$attributes
);
}
break;
case 'upload':
$field_data_type = ! empty( $field['data_type'] ) ? $field['data_type'] : 'image';
$field['upload_button_text'] = ! empty( $field['upload_button_text'] ) ? $field['upload_button_text'] : esc_attr__( 'Upload', 'et_builder' );
$field['choose_text'] = ! empty( $field['choose_text'] ) ? $field['choose_text'] : esc_attr__( 'Choose image', 'et_builder' );
$field['update_text'] = ! empty( $field['update_text'] ) ? $field['update_text'] : esc_attr__( 'Set image', 'et_builder' );
$field['class'] = ! empty( $field['class'] ) ? ' ' . $field['class'] : '';
$field_additional_button = ! empty( $field['additional_button'] ) ? "\n\t\t\t\t\t" . $field['additional_button'] : '';
$field_el .= sprintf(
'
%7$s',
esc_attr( $field['id'] ),
esc_attr( $field_name ),
esc_attr( $field['upload_button_text'] ),
esc_attr( $field['choose_text'] ),
esc_attr( $field['update_text'] ),
esc_attr( $field_data_type ),
$field_additional_button,
esc_attr( $field['class'] ),
$attributes
);
break;
case 'checkbox':
$field_el .= sprintf(
'>',
esc_attr( $field['name'] ),
esc_attr( $field['id'] )
);
break;
case 'multiple_checkboxes' :
$checkboxes_set = '';
if ( ! empty( $field['options'] ) ) {
foreach( $field['options'] as $option_value => $option_label ) {
$checkboxes_set .= sprintf(
'%3$s
',
esc_attr( $option_value ),
esc_html( $option_label ),
"\n\t\t\t\t\t"
);
}
}
// additional option for disable_on option for backward compatibility
if ( isset( $field['additional_att'] ) && 'disable_on' === $field['additional_att'] ) {
$et_pb_disabled_value = sprintf(
$value_html,
esc_attr( 'et_pb_disabled' ),
esc_attr( 'et_pb_disabled' ),
''
);
$checkboxes_set .= sprintf(
'',
$et_pb_disabled_value
);
}
$field_el .= $checkboxes_set . $hidden_field . '
';
break;
case 'hidden':
$field_el .= $hidden_field;
break;
case 'custom_margin':
case 'custom_padding':
$custom_margin_class = "";
// Fill the array of values for tablet and phone
if ( $need_mobile_options ) {
$mobile_values_array = array();
$has_saved_value = array();
$mobile_desktop_class = ' et_pb_setting_mobile et_pb_setting_mobile_desktop et_pb_setting_mobile_active';
$mobile_desktop_data = ' data-device="desktop"';
foreach( array( 'tablet', 'phone' ) as $device ) {
$mobile_values_array[] = sprintf(
$value_html,
esc_attr( $field_name . '_' . $device ),
esc_attr( $field_name . '_' . $device ),
$default_value
);
$has_saved_value[] = sprintf( ' data-has_saved_value="<%%- typeof( %1$s ) !== \'undefined\' ? \'yes\' : \'no\' %%>" ',
esc_attr( $field_name . '_' . $device )
);
}
$value_last_edited = sprintf(
$value_html,
esc_attr( $field_name . '_last_edited' ),
esc_attr( $field_name . '_last_edited' ),
''
);
// additional field to save the last edited field which will be opened automatically
$additional_mobile_fields = sprintf( '',
esc_attr( $field_name . '_last_edited' ),
$value_last_edited
);
}
// Add auto_important class to field which automatically append !important tag
if ( isset( $this->advanced_options['custom_margin_padding']['css']['important'] ) ) {
$custom_margin_class .= " auto_important";
}
$has_responsive_affects = isset( $field['responsive_affects'] );
$single_fields_settings = array(
'side' => '',
'label' => '',
'need_mobile' => $need_mobile_options ? 'need_mobile' : '',
'class' => esc_attr( $custom_margin_class ),
);
$field_el .= sprintf(
'
%6$s
%7$s
%8$s
%9$s
%10$s
%13$s
',
esc_attr( $field['name'] ),
esc_attr( $field['id'] ),
$value,
$attributes,
esc_attr( $default ), // #5
! isset( $field['sides'] ) || ( ! empty( $field['sides'] ) && in_array( 'top', $field['sides'] ) ) ?
sprintf( '<%%= window.et_builder.options_template_output("padding",%1$s) %%>',
json_encode( array_merge( $single_fields_settings, array(
'side' => 'top',
'label' => esc_html__( 'Top', 'et_builder' ),
) ) )
) : '',
! isset( $field['sides'] ) || ( ! empty( $field['sides'] ) && in_array( 'right', $field['sides'] ) ) ?
sprintf( '<%%= window.et_builder.options_template_output("padding",%1$s) %%>',
json_encode( array_merge( $single_fields_settings, array(
'side' => 'right',
'label' => esc_html__( 'Right', 'et_builder' ),
) ) )
) : '',
! isset( $field['sides'] ) || ( ! empty( $field['sides'] ) && in_array( 'bottom', $field['sides'] ) ) ?
sprintf( '<%%= window.et_builder.options_template_output("padding",%1$s) %%>',
json_encode( array_merge( $single_fields_settings, array(
'side' => 'bottom',
'label' => esc_html__( 'Bottom', 'et_builder' ),
) ) )
) : '',
! isset( $field['sides'] ) || ( ! empty( $field['sides'] ) && in_array( 'left', $field['sides'] ) ) ?
sprintf( '<%%= window.et_builder.options_template_output("padding",%1$s) %%>',
json_encode( array_merge( $single_fields_settings, array(
'side' => 'left',
'label' => esc_html__( 'Left', 'et_builder' ),
) ) )
) : '',
$need_mobile_options ?
sprintf(
'
',
esc_attr( $field['name'] ),
esc_attr( $field['id'] ),
$attributes,
esc_attr( $default ),
$mobile_values_array[0],
$mobile_values_array[1],
$has_saved_value[0],
$has_saved_value[1],
$has_responsive_affects ? ' et-pb-responsive-affects' : ''
)
: '', // #10
$need_mobile_options ? esc_attr( $mobile_desktop_class ) : '',
$need_mobile_options ? $mobile_desktop_data : '',
$need_mobile_options ? $additional_mobile_fields : '',
$has_responsive_affects ? ' et-pb-responsive-affects' : '' // #14
);
break;
case 'text':
case 'number':
case 'date_picker':
case 'range':
default:
$validate_number = isset( $field['number_validation'] ) && $field['number_validation'] ? true : false;
if ( 'date_picker' === $field['type'] ) {
$field['class'] .= ' et-pb-date-time-picker';
}
$field['class'] .= 'range' === $field['type'] ? ' et-pb-range-input' : ' et-pb-main-setting';
$type = in_array( $field['type'], array( 'text', 'number' ) ) ? $field['type'] : 'text';
$field_el .= sprintf(
'%7$s',
esc_attr( $field['id'] ),
esc_attr( $field['class'] ),
$value,
$attributes,
( $validate_number ? ' et-validate-number' : '' ),
( $validate_number ? ' maxlength="3"' : '' ),
( ! empty( $field['additional_button'] ) ? $field['additional_button'] : '' ),
( '' !== $default
? sprintf( ' data-default="%1$s"', esc_attr( $default ) )
: ''
),
$need_mobile_options ? ' et_pb_setting_mobile et_pb_setting_mobile_active et_pb_setting_mobile_desktop' : '',
$need_mobile_options ? ' data-device="desktop"' : '',
$type
);
// generate additional fields for mobile settings switcher if needed
if ( $need_mobile_options ) {
$additional_fields = '';
foreach( array( 'tablet', 'phone' ) as $device_type ) {
$value_mobile = sprintf(
$value_html,
esc_attr( $field_name . '_' . $device_type ),
esc_attr( $field_name . '_' . $device_type ),
$default_value
);
// additional data attribute to handle default values for the responsive options
$has_saved_value = sprintf( ' data-has_saved_value="<%%- typeof( %1$s ) !== \'undefined\' ? \'yes\' : \'no\' %%>" ',
esc_attr( $field_name . '_' . $device_type )
);
$additional_fields .= sprintf( '%7$s',
$value_mobile,
esc_attr( $field['id'] ) . '_' . $device_type,
esc_attr( $field['class'] ),
$attributes,
( $validate_number ? ' et-validate-number' : '' ), // #5
( $validate_number ? ' maxlength="3"' : '' ),
( ! empty( $field['additional_button'] ) ? $field['additional_button'] : '' ),
( '' !== $default
? sprintf( ' data-default="%1$s"', esc_attr( $default ) )
: ''
),
esc_attr( $device_type ),
$has_saved_value, // #10,
$type
);
}
$value_last_edited = sprintf(
$value_html,
esc_attr( $field_name . '_last_edited' ),
esc_attr( $field_name . '_last_edited' ),
''
);
$class_last_edited = array(
'et_pb_mobile_last_edited_field',
);
$attrs = '';
if ( ! empty( $field['responsive_affects'] ) ) {
$class_last_edited[] = 'et-pb-responsive-affects';
$attrs .= sprintf(
' data-responsive-affects="%1$s" data-responsive-desktop-name="%2$s"',
esc_attr( implode( ', ', $field['responsive_affects'] ) ),
esc_attr( $field['name'] )
);
}
// additional field to save the last edited field which will be opened automatically
$additional_fields .= sprintf( '',
esc_attr( $field_name . '_last_edited' ),
$value_last_edited,
esc_attr( implode( ' ', $class_last_edited ) ),
$attrs
);
}
if ( 'range' === $field['type'] ) {
$range_value_html = $default_is_arr
? ' value="<%%- typeof( %1$s ) !== \'undefined\' ? %2$s :parseFloat(%3$s) %%>" '
: ' value="<%%- typeof( %1$s ) !== \'undefined\' ? %2$s : parseFloat(\'%3$s\') %%>" ';
$value = sprintf(
$range_value_html,
esc_attr( $field_name ),
esc_attr( sprintf( 'parseFloat( %1$s )', $field_name ) ),
$default_value
);
$fixed_range = isset($field['fixed_range']) && $field['fixed_range'];
$range_settings_html = '';
$range_properties = apply_filters( 'et_builder_range_properties', array( 'min', 'max', 'step' ) );
foreach ( $range_properties as $property ) {
if ( isset( $field['range_settings'][ $property ] ) ) {
$range_settings_html .= sprintf( ' %2$s="%1$s"',
esc_attr( $field['range_settings'][ $property ] ),
esc_html( $property )
);
}
}
$range_el = sprintf(
'',
$value,
esc_attr( $default ),
$range_settings_html,
$need_mobile_options ? ' et_pb_setting_mobile et_pb_setting_mobile_desktop et_pb_setting_mobile_active' : '',
$need_mobile_options ? ' data-device="desktop"' : '',
$fixed_range ? ' et-pb-fixed-range' : ''
);
if ( $need_mobile_options ) {
foreach( array( 'tablet', 'phone' ) as $device_type ) {
// additional data attribute to handle default values for the responsive options
$has_saved_value = sprintf( ' data-has_saved_value="<%%- typeof( %1$s ) !== \'undefined\' ? \'yes\' : \'no\' %%>" ',
esc_attr( $field_name . '_' . $device_type )
);
$value_mobile_range = sprintf(
$value_html,
esc_attr( $field_name . '_' . $device_type ),
esc_attr( sprintf( 'parseFloat( %1$s )', $field_name . '_' . $device_type ) ),
$default_value
);
$range_el .= sprintf(
'',
esc_attr( $default ),
$range_settings_html,
esc_attr( $device_type ),
$value_mobile_range,
$has_saved_value,
$fixed_range ? ' et-pb-fixed-range' : ''
);
}
}
$field_el = $range_el . "\n" . $field_el;
}
if ( $need_mobile_options ) {
$field_el = $field_el . $additional_fields;
}
break;
}
if ( isset( $field['has_preview'] ) && $field['has_preview'] ) {
$field_el = sprintf(
'<%%= window.et_builder.options_template_output("option_preview_buttons") %%>
%1$s',
$field_el
);
}
if ( $need_mobile_options ) {
$field_el = $mobile_settings_tabs . "\n" . $field_el;
$field_el .= '';
}
if ( isset( $field['type'] ) && isset( $field['tab_slug'] ) && 'advanced' === $field['tab_slug'] && ! $is_custom_color ) {
$field_el .= $reset_button_html;
}
if ( isset( $field['after'] ) && ! $only_options ) {
$field_el .= $this->render_field_before_after_element( $field['after'] );
}
return "\t" . $field_el;
}
public function render_field_before_after_element( $elements ) {
$field_el = '';
$elements = is_array( $elements ) ? $elements : array( $elements );
foreach ( $elements as $element ) {
$attributes = '';
if ( ! empty( $element['attributes'] ) ) {
$this->process_html_attributes( $element, $attributes );
}
switch ( $element['type'] ) {
case 'button':
$class = isset( $element['class'] ) ? esc_attr( $element['class'] ) : '';
$text = isset( $element['text'] ) ? et_esc_previously( $element['text'] ) : '';
$field_el .= sprintf( '', $class, $attributes, $text );
break;
}
}
return $field_el;
}
function render_font_select( $name, $id = '', $group_label ) {
$options_output = '<%= window.et_builder.fonts_template() %>';
$font_weight_output = '<%= window.et_builder.fonts_weight_template() %>';
$output = sprintf(
'
%5$s',
esc_attr( $name ),
( ! empty( $id ) ? sprintf(' id="%s"', esc_attr( $id ) ) : '' ),
$options_output . "\n\t\t\t\t\t",
esc_html__( 'Recent', 'et_builder' ),
$font_weight_output,
esc_attr( $group_label )
);
return $output;
}
function render_select( $name, $options, $id = '', $class = '', $attributes = '', $field_type = '', $button_options = array(), $default = '', $only_options = false ) {
$options_output = '';
$processed_options = $options;
if ( 'select_with_option_groups' === $field_type ) {
foreach ( $processed_options as $option_group_name => $option_group ) {
$option_group_name = esc_attr( $option_group_name );
$options_output .= '0' !== $option_group_name ? "' : '';
}
$class = rtrim( $class );
$name = $id = '';
} else {
$class = rtrim( 'et-pb-main-setting ' . $class );
$options_output .= sprintf( '<%%= window.et_builder.options_template_output("select",%1$s,this.model.toJSON()) %%>',
sprintf(
'{select_name: "%1$s", list: %2$s, default: %3$s, }',
$name,
json_encode($options),
$default
)
);
}
$output = sprintf(
'%6$s
%7$s',
esc_attr( $name ),
( ! empty( $id ) ? sprintf(' id="%s"', esc_attr( $id ) ) : '' ),
( ! empty( $class ) ? esc_attr( $class ) : '' ),
( ! empty( $attributes ) ? $attributes : '' ),
$options_output . "\n\t\t\t\t\t",
'yes_no_button' === $field_type ?
sprintf(
'
%1$s',
sprintf( '<%%= window.et_builder.options_template_output("yes_no_button",%1$s) %%>',
json_encode( array(
'on' => esc_html( $processed_options['on'] ),
'off' => esc_html( $processed_options['off'] ),
) )
),
( ! empty( $button_options['button_type'] ) && 'equal' === $button_options['button_type'] ? ' et_pb_button_equal_sides' : '' )
) : '',
'yes_no_button' === $field_type ? '
' : '',
esc_attr( $field_type ),
'' !== $name ? sprintf( ' data-saved_value="<%%= typeof( %1$s ) !== \'undefined\' ? %1$s : \'\' %%>"', esc_attr( $name ) ) : ''
);
return $only_options ? $options_output : $output;
}
function render_multiple_buttons( $name, $options, $id = '', $class = '', $attributes = '', $value = '', $default = '' ) {
$class = rtrim( 'et-pb-main-setting ' . $class );
$output = sprintf(
'
%6$s
',
esc_attr( $id ),
esc_attr( $class ),
$value,
$attributes,
( '' !== $default
? sprintf( ' data-default=%1$s', esc_attr( $default ) )
: ''
),
sprintf( '<%%= window.et_builder.options_template_output("multiple_buttons",%1$s) %%>',
json_encode( $options )
),
esc_attr( $name )
);
return $output;
}
function get_main_tabs() {
$tabs = array(
'general' => esc_html__( 'Content', 'et_builder' ),
'advanced' => esc_html__( 'Design', 'et_builder' ),
'custom_css' => esc_html__( 'Advanced', 'et_builder' ),
);
return apply_filters( 'et_builder_main_tabs', $tabs );
}
function get_validation_attr_rules() {
return array(
'minlength',
'maxlength',
'min',
'max',
);
}
function get_validation_class_rules() {
return array(
'required',
'email',
'url',
'date',
'dateISO',
'number',
'digits',
'creditcard',
);
}
function sort_fields( $fields ) {
$tabs_fields = array();
$sorted_fields = array();
$i = 0;
// Sort fields array by tab name
foreach ( $fields as $field_slug => $field_options ) {
$field_options['_order_number'] = $i;
$tab_slug = ! empty( $field_options['tab_slug'] ) ? $field_options['tab_slug'] : 'general';
$tabs_fields[ $tab_slug ][ $field_slug ] = $field_options;
$i++;
}
// Sort fields within tabs by priority
foreach ( $tabs_fields as $tab_fields ) {
uasort( $tab_fields, array( 'self', 'compare_by_priority' ) );
$sorted_fields = array_merge( $sorted_fields, $tab_fields );
}
return $sorted_fields;
}
function get_options() {
$output = '';
$tab_output = '';
$tab_slug = '';
$toggle_slug = '';
$toggle_all_options_slug = 'all_options';
$toggles_used = isset( $this->options_toggles );
$tabs_output = array( 'general' => array() );
$all_fields = $this->sort_fields( $this->_get_fields() );
$all_fields_keys = array_keys( $all_fields );
$background_fields_names = $this->get_background_fields_names();
$module_has_background_color_field = in_array( 'background_color', $all_fields_keys );
foreach( $all_fields as $field_name => $field ) {
if ( ! empty( $field['type'] ) && ( 'skip' === $field['type'] || 'computed' === $field['type'] ) ) {
continue;
}
// add only options allowed for current user
if (
( ! et_pb_is_allowed( 'edit_colors' ) && ( ! empty( $field['type'] ) && in_array( $field['type'], array( 'color', 'color-alpha' ) ) || ( ! empty( $field['option_category'] ) && 'color_option' === $field['option_category'] ) ) )
||
( ! et_pb_is_allowed( 'edit_content' ) && ! empty( $field['option_category'] ) && 'basic_option' === $field['option_category'] )
||
( ! et_pb_is_allowed( 'edit_layout' ) && ! empty( $field['option_category'] ) && 'layout' === $field['option_category'] )
||
( ! et_pb_is_allowed( 'edit_configuration' ) && ! empty( $field['option_category'] ) && 'configuration' === $field['option_category'] )
||
( ! et_pb_is_allowed( 'edit_fonts' ) && ! empty( $field['option_category'] ) && ( 'font_option' === $field['option_category'] || ( 'button' === $field['option_category'] && ! empty( $field['type'] ) && 'font' === $field['type'] ) ) )
||
( ! et_pb_is_allowed( 'edit_buttons' ) && ! empty( $field['option_category'] ) && 'button' === $field['option_category'] )
) {
continue;
}
$option_output = '';
if ( 'background_color' === $field_name ) {
// append background UI
$option_output .= $this->wrap_settings_background_fields( $all_fields );
} elseif ( $module_has_background_color_field && in_array( $field_name , $background_fields_names ) ) {
// remove background-related fields from setting modals since it'll be printed by background UI
continue;
} else {
// append normal fields
$option_output .= $this->wrap_settings_option_label( $field );
$option_output .= $this->wrap_settings_option_field( $field );
}
$tab_slug = ! empty( $field['tab_slug'] ) ? $field['tab_slug'] : 'general';
$is_toggle_option = isset( $field['toggle_slug'] ) && $toggles_used && isset( $this->options_toggles[ $tab_slug ] );
$toggle_slug = $is_toggle_option ? $field['toggle_slug'] : $toggle_all_options_slug;
$sub_toggle_slug = 'all_options' !== $toggle_slug && isset( $field['sub_toggle'] ) && '' !== $field['sub_toggle'] ? $field['sub_toggle'] : 'main';
$tabs_output[ $tab_slug ][ $toggle_slug ][ $sub_toggle_slug ][] = $this->wrap_settings_option( $option_output, $field );
}
// make sure that custom_css tab is the last item in array
if ( isset( $tabs_output['custom_css'] ) ) {
$custom_css_output = $tabs_output['custom_css'];
unset( $tabs_output['custom_css'] );
$tabs_output['custom_css'] = $custom_css_output;
}
foreach ( $tabs_output as $tab_slug => $tab_settings ) {
// Add only tabs allowed for current user
if ( ! et_pb_is_allowed( $tab_slug . '_settings' ) ) {
continue;
}
$tab_output = '';
$this->used_tabs[] = $tab_slug;
$i = 0;
if ( isset( $tabs_output[ $tab_slug ] ) ) {
if ( isset( $this->options_toggles[ $tab_slug ] ) ) {
$this->options_toggles[ $tab_slug ]['toggles'] = self::et_pb_order_toggles_by_priority( $this->options_toggles[ $tab_slug ]['toggles'] );
foreach ( $this->options_toggles[ $tab_slug ]['toggles'] as $toggle_slug => $toggle_data ) {
$toggle_heading = is_array( $toggle_data ) ? $toggle_data['title'] : $toggle_data;
if ( ! isset( $tabs_output[ $tab_slug ][ $toggle_slug ] ) ) {
continue;
}
$i++;
$toggle_output = '';
$is_accordion_enabled = isset( $this->options_toggles[ $tab_slug ]['settings']['bb_toggles_enabeld'] ) && $this->options_toggles[ $tab_slug ]['settings']['bb_toggles_enabled'] ? true : false;
$is_tabbed_subtoggles = isset( $toggle_data['tabbed_subtoggles'] );
$is_bb_icons_support = isset( $toggle_data['bb_icons_support'] );
$subtoggle_tabs_nav = '';
if ( is_array( $toggle_data ) && ! empty( $toggle_data ) ) {
if ( ! isset( $toggle_data['sub_toggles'] ) ) {
$toggle_data['sub_toggles'] = array( 'main' => '' );
}
foreach( $toggle_data['sub_toggles'] as $sub_toggle_id => $sub_toggle_data ) {
if ( ! isset( $tabs_output[ $tab_slug ][ $toggle_slug ][ $sub_toggle_id ] ) ) {
continue;
}
if ( $is_tabbed_subtoggles ) {
$subtoggle_tabs_nav .= sprintf(
'%2$s',
$sub_toggle_id,
$is_bb_icons_support ? '' : esc_html( $sub_toggle_data['name'] ),
$is_bb_icons_support ? sprintf( ' subtoggle_tabs_nav_icon subtoggle_tabs_nav_icon-%1$s', esc_attr( $sub_toggle_data['icon'] ) ) : ''
);
}
$subtoggle_options = '';
foreach ( $tabs_output[ $tab_slug ][ $toggle_slug ][ $sub_toggle_id ] as $toggle_option_output ) {
$subtoggle_options .= $toggle_option_output;
}
if ( 'main' === $sub_toggle_id ) {
$toggle_output .= $subtoggle_options;
} else {
$toggle_output .= sprintf(
'
%1$s
',
$subtoggle_options,
$is_tabbed_subtoggles ? ' et_pb_tabbed_subtoggle' : '',
$is_tabbed_subtoggles ? sprintf( ' data-tab_id="%1$s"', esc_attr( $sub_toggle_id ) ) : ''
);
}
}
} else {
foreach ( $tabs_output[ $tab_slug ][ $toggle_slug ] as $toggle_option_id => $toggle_option_data ) {
foreach( $toggle_option_data as $toggle_option_output ) {
$toggle_output .= $toggle_option_output;
}
}
}
if ( '' === $toggle_output ) {
continue;
}
$toggle_output = sprintf(
'',
esc_html( $toggle_heading ),
$toggle_output,
( $is_accordion_enabled ? ' et-pb-options-toggle-enabled' : ' et-pb-options-toggle-disabled' ),
( 1 === $i && $is_accordion_enabled ? ' et-pb-option-toggle-content-open' : '' ),
$is_tabbed_subtoggles ? ' et_pb_contains_tabbed_subtoggle' : '',
$is_tabbed_subtoggles && '' !== $subtoggle_tabs_nav ? sprintf( '', $subtoggle_tabs_nav ) : ''
);
$tab_output .= $toggle_output;
}
}
if ( isset( $tabs_output[ $tab_slug ][ $toggle_all_options_slug ] ) ) {
foreach ( $tabs_output[ $tab_slug ][ $toggle_all_options_slug ] as $no_toggle_option_data ) {
foreach( $no_toggle_option_data as $subtoggle_id => $no_toggle_option_output ) {
$tab_output .= $no_toggle_option_output;
}
}
}
}
$output .= sprintf(
'
%3$s
%2$s
',
esc_attr( $tab_slug ),
$tab_output,
( 'general' === $tab_slug ? $this->children_settings() : '' )
);
}
// return error message if no tabs allowed for current user
if ( '' === $output ) {
$output = esc_html__( "You don't have sufficient permissions to access the settings", 'et_builder' );
}
return $output;
}
function children_settings() {
$output = '';
if ( ! empty( $this->child_slug ) ) {
$output = sprintf(
'%6$s
<%%= typeof( et_pb_content_new )!== \'undefined\' && \'\' !== et_pb_content_new.trim() ? et_pb_content_new : \'%7$s\' %%>
%4$s
%5$s',
esc_attr( $this->child_slug ),
esc_html( $this->add_new_child_text() ),
esc_html__( 'Content', 'et_builder' ),
esc_html__( 'Here you can define the content that will be placed within the current tab.', 'et_builder' ),
"\n\n",
"\t",
$this->predefined_child_modules()
);
}
return $output;
}
function add_new_child_text() {
$child_slug = ! empty( $this->child_item_text ) ? $this->child_item_text : '';
$child_slug = '' === $child_slug ? esc_html__( 'Add New Item', 'et_builder' ) : sprintf( esc_html__( 'Add New %s', 'et_builder' ), $child_slug );
return $child_slug;
}
function wrap_settings( $output ) {
$tabs_output = '';
$i = 0;
$tabs = array();
// General Settings Tab should be added to all modules if allowed
if ( et_pb_is_allowed( 'general_settings' ) ) {
$tabs['general'] = isset( $this->main_tabs['general'] ) ? $this->main_tabs['general'] : esc_html__( 'General Settings', 'et_builder' );
}
foreach ( $this->used_tabs as $tab_slug ) {
if ( 'general' === $tab_slug ) {
continue;
}
// Add only tabs allowed for current user
if ( et_pb_is_allowed( $tab_slug . '_settings' ) ) {
$tabs[ $tab_slug ] = $this->main_tabs[ $tab_slug ];
}
}
$tabs_array = array();
$tabs_json = '';
foreach ( $tabs as $tab_slug => $tab_name ) {
$i++;
$tabs_array[$i] = array(
'slug' => $tab_slug,
'label' => $tab_name,
);
$tabs_json = json_encode( $tabs_array );
}
$tabs_output = sprintf( '<%%= window.et_builder.options_tabs_output(%1$s) %%>', $tabs_json );
$preview_tabs_output = '<%= window.et_builder.preview_tabs_output() %>';
$output = sprintf(
'%2$s
%3$s
%1$s
',
$output,
$tabs_output,
$preview_tabs_output
);
return sprintf(
'%2$s%1$s
%3$s',
"\n\t\t" . $output,
"\n\t\t",
"\n"
);
}
function wrap_validation_form( $output ) {
return '';
}
/**
* Get this module's shortcode fields mapped to their default values.
*
* @since 1.0
*
* @param array $values Optional. Shortcode fields mapped to custom values to be considered
* when determining default values of fields that have a `default_from`
* path defined.
*
* @return array
*/
function get_shortcode_fields( $values = array() ) {
$fields = array();
foreach( $this->process_fields( $this->fields_unprocessed ) as $field_name => $field ) {
$value = '';
if ( isset( $field['composite_type'], $field['composite_structure'] ) ) {
require_once ET_BUILDER_DIR . 'module/field/attribute/composite/Parser.php';
$composite_atts = ET_Builder_Module_Field_Attribute_Composite_Parser::parse( $field['composite_type'], $field['composite_structure'] );
$fields = array_merge( $fields, $composite_atts );
} else {
if ( isset( $field['shortcode_default'] ) ) {
$value = $field['shortcode_default'];
} else if( isset( $field['default'] ) ) {
$value = $field['default'];
}
$fields[ $field_name ] = $value;
}
}
$fields['disabled'] = 'off';
$fields['disabled_on'] = '';
$fields['global_module'] = '';
$fields['temp_global_module'] = '';
$fields['global_parent'] = '';
$fields['temp_global_parent'] = '';
$fields['saved_tabs'] = '';
$fields['ab_subject'] = '';
$fields['ab_subject_id'] = '';
$fields['ab_goal'] = '';
$fields['locked'] = '';
$fields['template_type'] = '';
$fields['inline_fonts'] = '';
$fields['collapsed'] = '';
return $fields;
}
function get_module_data_attributes() {
$attributes = apply_filters(
"{$this->slug}_data_attributes",
array(),
$this->shortcode_atts,
$this->shortcode_callback_num()
);
$data_attributes = '';
if ( ! empty( $attributes ) ) {
foreach ( $attributes as $name => $value ) {
$data_attributes .= sprintf(
' data-%1$s="%2$s"',
sanitize_title( $name ),
esc_attr( $value )
);
}
}
return $data_attributes;
}
function build_microtemplate() {
$this->validation_in_use = false;
$template_output = '';
if ( 'child' === $this->type ) {
$id_attr = sprintf( 'et-builder-advanced-setting-%s', $this->slug );
} else {
$id_attr = sprintf( 'et-builder-%s-module-template', $this->slug );
}
if ( ! isset( $this->settings_text ) ) {
$settings_text = sprintf(
__( '%1$s %2$s Settings', 'et_builder' ),
esc_html( $this->name ),
'child' === $this->type ? esc_html__( 'Item', 'et_builder' ) : esc_html__( 'Module', 'et_builder' )
);
} else {
$settings_text = $this->settings_text;
}
if ( file_exists( ET_BUILDER_DIR . 'microtemplates/' . $this->slug . '.php' ) ) {
ob_start();
include ET_BUILDER_DIR . 'microtemplates/' . $this->slug . '.php';
$output = ob_get_clean();
} else {
$output = $this->get_options();
}
$output = $this->wrap_settings( $output );
if ( $this->validation_in_use ) {
$output = $this->wrap_validation_form( $output );
}
$template_output = sprintf(
'',
esc_attr( $id_attr ),
esc_html( $settings_text ),
$output
);
if ( $this->type == 'child' ) {
$title_var = esc_js( $this->child_title_var );
$title_var = false === strpos( $title_var, 'et_pb_' ) ? 'et_pb_'. $title_var : $title_var;
$title_fallback_var = esc_js( $this->child_title_fallback_var );
$title_fallback_var = false === strpos( $title_fallback_var, 'et_pb_' ) ? 'et_pb_'. $title_fallback_var : $title_fallback_var;
$add_new_text = isset( $this->advanced_setting_title_text ) ? $this->advanced_setting_title_text : $this->add_new_child_text();
$template_output .= sprintf(
'%6$s%5$s',
esc_attr( $this->slug ),
esc_html( $title_var ),
esc_html( $title_fallback_var ),
esc_html( $add_new_text ),
"\n\n",
"\t"
);
}
return $template_output;
}
function get_gradient( $args ) {
$defaults = apply_filters( 'et_pb_default_gradient', array(
'type' => ET_Global_Settings::get_value( 'all_background_gradient_type' ),
'direction' => ET_Global_Settings::get_value( 'all_background_gradient_direction' ),
'radial_direction' => ET_Global_Settings::get_value( 'all_background_gradient_direction_radial' ),
'color_start' => ET_Global_Settings::get_value( 'all_background_gradient_start' ),
'color_end' => ET_Global_Settings::get_value( 'all_background_gradient_end' ),
'start_position' => ET_Global_Settings::get_value( 'all_background_gradient_start_position' ),
'end_position' => ET_Global_Settings::get_value( 'all_background_gradient_end_position' ),
) );
$args = wp_parse_args( array_filter( $args ), $defaults );
$direction = $args['type'] === 'linear' ? $args['direction'] : "circle at {$args['radial_direction']}";
$start_position = et_sanitize_input_unit( $args['start_position'], false, '%' );
$end_Position = et_sanitize_input_unit( $args['end_position'], false, '%');
return esc_html( "{$args['type']}-gradient(
{$direction},
{$args['color_start']} ${start_position},
{$args['color_end']} ${end_Position}
)" );
}
function get_rel_values() {
return array(
'bookmark',
'external',
'nofollow',
'noreferrer',
'noopener',
);
}
function get_rel_attributes( $saved_value, $add_tag = true ) {
$rel_attributes = array();
if ( $saved_value ) {
$rel_values = $this->get_rel_values();
$selected_rels = explode( '|', $saved_value );
foreach ( $selected_rels as $index => $selected_rel ) {
if ( ! $selected_rel || 'off' === $selected_rel ) {
continue;
}
$rel_attributes[] = $rel_values[ $index ];
}
}
$attr = empty( $rel_attributes ) ? '' : implode( ' ', $rel_attributes );
return ( $add_tag && '' !== $attr ) ? sprintf( ' rel="%1$s"', esc_attr( $attr ) ) : $attr;
}
function get_text_orientation() {
$text_orientation = isset( $this->shortcode_atts['text_orientation'] ) ? $this->shortcode_atts['text_orientation'] : '';
return et_pb_get_alignment( $text_orientation );
}
function get_text_orientation_classname( $print_default = false ) {
$text_orientation = $this->get_text_orientation();
// Should be `justified` instead of justify in classname.
$text_orientation = 'justify' === $text_orientation ? 'justified' : $text_orientation;
$default_classname = $print_default ? ' et_pb_text_align_left' : '';
return '' !== $text_orientation ? " et_pb_text_align_{$text_orientation}" : $default_classname;
}
// intended to be overridden as needed
function get_max_width_additional_css() {
return '';
}
/**
* Get type of element
*/
public function get_type() {
return $this->type;
}
/**
* Remove suffix of a string
*/
function remove_suffix( $string, $separator = '_' ) {
$stringAsArray = explode( $separator, $string );
array_pop( $stringAsArray );
return implode( $separator, $stringAsArray );
}
/**
* process the fields.
* @param string $function_name String of the function_name
* @return void
*/
function process_additional_options( $function_name ) {
if ( ! isset( $this->advanced_options ) ) {
return false;
}
$this->process_advanced_fonts_options( $function_name );
// Process Text Shadow CSS
$this->text_shadow->process_advanced_css( $this, $function_name );
$this->process_advanced_background_options( $function_name );
$this->process_advanced_text_options( $function_name );
$this->process_advanced_border_options( $function_name );
$this->process_advanced_filter_options( $function_name );
$this->process_max_width_options( $function_name );
$this->process_advanced_custom_margin_options( $function_name );
$this->process_advanced_button_options( $function_name );
$this->process_box_shadow( $function_name );
}
function process_inline_fonts_option( $fonts_list ) {
if ( '' === $fonts_list ) {
return;
}
$fonts_list_array = explode( ',', $fonts_list );
foreach( $fonts_list_array as $font_name ) {
et_builder_enqueue_font( $font_name );
}
}
function process_advanced_fonts_options( $function_name ) {
if ( ! isset( $this->advanced_options['fonts'] ) ) {
return;
}
$font_options = array();
$slugs = array(
'font',
'font_size',
'text_color',
'letter_spacing',
'line_height',
'text_align',
);
$mobile_options_slugs = array(
'font_size_tablet',
'font_size_phone',
'line_height_tablet',
'line_height_phone',
'letter_spacing_tablet',
'letter_spacing_phone',
);
$slugs = array_merge( $slugs, $mobile_options_slugs ); // merge all slugs into single array to define them in one place
// Separetely defined and merged *_last_edited slugs. It needs to be merged as reference but shouldn't be looped for calling mobile attributes
$mobile_options_last_edited_slugs = array(
'font_size_last_edited',
'line_height_last_edited',
'letter_spacing_last_edited',
);
$slugs = array_merge( $slugs, $mobile_options_last_edited_slugs );
foreach ( $this->advanced_options['fonts'] as $option_name => $option_settings ) {
$style = '';
$important_options = array();
$is_important_set = isset( $option_settings['css']['important'] );
$is_placeholder = isset( $option_settings['css']['placeholder'] );
$use_global_important = $is_important_set && 'all' === $option_settings['css']['important'];
if ( ! $use_global_important && $is_important_set && 'plugin_only' === $option_settings['css']['important'] && et_is_builder_plugin_active() ) {
$use_global_important = true;
}
if ( $is_important_set && is_array( $option_settings['css']['important'] ) ) {
$important_options = $option_settings['css']['important'];
if ( et_is_builder_plugin_active() && in_array( 'plugin_all', $option_settings['css']['important'] ) ) {
$use_global_important = true;
}
}
foreach ( $slugs as $font_option_slug ) {
if ( isset( $this->shortcode_atts["{$option_name}_{$font_option_slug}"] ) ) {
$font_options["{$option_name}_{$font_option_slug}"] = $this->shortcode_atts["{$option_name}_{$font_option_slug}"];
}
}
$field_key = "{$option_name}_{$slugs[0]}";
$global_setting_name = $this->get_global_setting_name( $field_key );
$global_setting_value = ET_Global_Settings::get_value( $global_setting_name );
$field_option_value = isset( $font_options[ $field_key ] ) ? $font_options[ $field_key ] : '';
if ( '' !== $field_option_value || ! $global_setting_value ) {
$important = in_array( 'font', $important_options ) || $use_global_important ? ' !important' : '';
$font_styles = et_builder_set_element_font( $field_option_value, ( '' !== $important ), $global_setting_value );
if ( isset( $option_settings['css']['font'] ) ) {
self::set_style( $function_name, array(
'selector' => $option_settings['css']['font'],
'declaration' => rtrim( $font_styles ),
'priority' => $this->_style_priority,
) );
} else {
$style .= $font_styles;
}
}
$size_option_name = "{$option_name}_{$slugs[1]}";
$default_size = isset( $this->fields_unprocessed[ $size_option_name ]['default'] ) ? $this->fields_unprocessed[ $size_option_name ]['default'] : '';
if ( isset( $font_options[ $size_option_name ] ) && ! in_array( trim( $font_options[ $size_option_name ] ), array( '', 'px', $default_size ) ) ) {
$important = in_array( 'size', $important_options ) || $use_global_important ? ' !important' : '';
$style .= sprintf(
'font-size: %1$s%2$s; ',
esc_html( et_builder_process_range_value( $font_options[ $size_option_name ] ) ),
esc_html( $important )
);
}
$text_color_option_name = "{$option_name}_{$slugs[2]}";
if ( isset( $font_options[ $text_color_option_name ] ) && '' !== $font_options[ $text_color_option_name ] ) {
// handle the value from old option
$old_option_ref = isset( $option_settings['text_color'] ) && isset( $option_settings['text_color']['old_option_ref'] ) ? $option_settings['text_color']['old_option_ref'] : '';
$old_option_val = '' !== $old_option_ref && isset( $this->shortcode_atts[ $old_option_ref ] ) ? $this->shortcode_atts[ $old_option_ref ] : '';
$default_value = '' !== $old_option_val && isset( $option_settings['text_color'] ) && isset( $option_settings['text_color']['default'] ) ? $option_settings['text_color']['default'] : '';
$important = ' !important';
if ( $default_value !== $font_options[ $text_color_option_name ] ) {
if ( isset( $option_settings['css']['color'] ) ) {
self::set_style( $function_name, array(
'selector' => $option_settings['css']['color'],
'declaration' => sprintf(
'color: %1$s%2$s;',
esc_html( $font_options[ $text_color_option_name ] ),
esc_html( $important )
),
'priority' => $this->_style_priority,
) );
} else {
$style .= sprintf(
'color: %1$s%2$s; ',
esc_html( $font_options[ $text_color_option_name ] ),
esc_html( $important )
);
}
}
}
$letter_spacing_option_name = "{$option_name}_{$slugs[3]}";
$default_letter_spacing = isset( $this->fields_unprocessed[ $letter_spacing_option_name ]['default'] ) ? $this->fields_unprocessed[ $letter_spacing_option_name ]['default'] : '';
if ( isset( $font_options[ $letter_spacing_option_name ] ) && ! in_array( trim( $font_options[ $letter_spacing_option_name ] ), array( '', 'px', $default_letter_spacing ) ) ) {
$important = in_array( 'letter-spacing', $important_options ) || $use_global_important ? ' !important' : '';
$style .= sprintf(
'letter-spacing: %1$s%2$s; ',
esc_html( et_builder_process_range_value( $font_options[ $letter_spacing_option_name ] ) ),
esc_html( $important )
);
if ( isset( $option_settings['css']['letter_spacing'] ) ) {
self::set_style( $function_name, array(
'selector' => $option_settings['css']['letter_spacing'],
'declaration' => sprintf(
'letter-spacing: %1$s%2$s;',
esc_html( et_builder_process_range_value( $font_options[ $letter_spacing_option_name ], 'letter_spacing' ) ),
esc_html( $important )
),
'priority' => $this->_style_priority,
) );
}
}
$line_height_option_name = "{$option_name}_{$slugs[4]}";
if ( isset( $font_options[ $line_height_option_name ] ) ) {
$default_line_height = isset( $this->fields_unprocessed[ $line_height_option_name ]['default'] ) ? $this->fields_unprocessed[ $line_height_option_name ]['default'] : '';
if ( ! in_array( trim( $font_options[ $line_height_option_name ] ), array( '', 'px', $default_line_height ) ) ) {
$important = in_array( 'line-height', $important_options ) || $use_global_important ? ' !important' : '';
$style .= sprintf(
'line-height: %1$s%2$s; ',
esc_html( et_builder_process_range_value( $font_options[ $line_height_option_name ], 'line_height' ) ),
esc_html( $important )
);
if ( isset( $option_settings['css']['line_height'] ) ) {
self::set_style( $function_name, array(
'selector' => $option_settings['css']['line_height'],
'declaration' => sprintf(
'line-height: %1$s%2$s;',
esc_html( et_builder_process_range_value( $font_options[ $line_height_option_name ], 'line_height' ) ),
esc_html( $important )
),
'priority' => $this->_style_priority,
) );
}
}
}
$text_align_option_name = "{$option_name}_{$slugs[5]}";
if ( isset( $font_options[ $text_align_option_name ] ) && '' !== $font_options[ $text_align_option_name ] ) {
$important = in_array( 'text-align', $important_options ) || $use_global_important ? ' !important' : '';
$text_align = et_pb_get_alignment( $font_options[ $text_align_option_name ] );
if ( isset( $option_settings['css']['text_align'] ) ) {
self::set_style( $function_name, array(
'selector' => $option_settings['css']['text_align'],
'declaration' => sprintf(
'text-align: %1$s%2$s;',
esc_html( $text_align ),
esc_html( $important )
),
'priority' => $this->_style_priority,
) );
} else {
$style .= sprintf(
'text-align: %1$s%2$s; ',
esc_html( $text_align ),
esc_html( $important )
);
}
}
if ( isset( $option_settings['use_all_caps'] ) && $option_settings['use_all_caps'] && 'on' === $this->shortcode_atts["{$option_name}_all_caps"] ) {
$important = in_array( 'all_caps', $important_options ) || $use_global_important ? ' !important' : '';
$style .= sprintf( 'text-transform: uppercase%1$s; ', esc_html( $important ) );
}
if ( '' !== $style ) {
$css_element = ! empty( $option_settings['css']['main'] ) ? $option_settings['css']['main'] : $this->main_css_element;
// use different selector for plugin if defined
if ( et_is_builder_plugin_active() && ! empty( $option_settings['css']['plugin_main'] ) ) {
$css_element = $option_settings['css']['plugin_main'];
}
// $css_element might be an array, for example to apply the css for placeholders
if ( is_array( $css_element ) ) {
foreach( $css_element as $selector ) {
self::set_style( $function_name, array(
'selector' => $selector,
'declaration' => rtrim( $style ),
'priority' => $this->_style_priority,
) );
}
} else {
self::set_style( $function_name, array(
'selector' => $css_element,
'declaration' => rtrim( $style ),
'priority' => $this->_style_priority,
) );
if ( $is_placeholder ) {
self::set_style( $function_name, array(
'selector' => $css_element . '::-webkit-input-placeholder',
'declaration' => rtrim( $style ),
'priority' => $this->_style_priority,
) );
self::set_style( $function_name, array(
'selector' => $css_element . '::-moz-placeholder',
'declaration' => rtrim( $style ),
'priority' => $this->_style_priority,
) );
self::set_style( $function_name, array(
'selector' => $css_element . '::-ms-input-placeholder',
'declaration' => rtrim( $style ),
'priority' => $this->_style_priority,
) );
}
}
}
// process mobile options
foreach( $mobile_options_slugs as $mobile_option ) {
$current_option_name = "{$option_name}_{$mobile_option}";
if ( isset( $font_options[ $current_option_name ] ) && '' !== $font_options[ $current_option_name ] ) {
$current_desktop_option = $this->remove_suffix($mobile_option);
$current_last_edited_slug = "{$option_name}_{$current_desktop_option}_last_edited";
$current_last_edited = isset( $font_options[ $current_last_edited_slug ] ) ? $font_options[ $current_last_edited_slug ] : '';
$current_responsive_status = et_pb_get_responsive_status( $current_last_edited );
// Don't print mobile styles if responsive UI isn't toggled on
if ( ! $current_responsive_status ) {
continue;
}
$current_media_query = false === strpos( $mobile_option, 'phone' ) ? 'max_width_980' : 'max_width_767';
$main_option_name = str_replace( array( '_tablet', '_phone' ), '', $mobile_option );
$css_property = str_replace( '_', '-', $main_option_name );
$css_option_name = 'font-size' === $css_property ? 'size' : $css_property;
$important = in_array( $css_option_name, $important_options ) || $use_global_important ? ' !important' : '';
// Allow specific selector tablet and mobile, simply add _tablet or _phone suffix
if ( isset( $option_settings['css'][ $mobile_option ] ) && "" !== $option_settings['css'][ $mobile_option ] ) {
$selector = $option_settings['css'][ $mobile_option ];
} elseif ( isset( $option_settings['css'][ $main_option_name ] ) || isset( $option_settings['css']['main'] ) ) {
$selector = isset( $option_settings['css'][ $main_option_name ] ) ? $option_settings['css'][ $main_option_name ] : $option_settings['css']['main'];
} elseif ( et_is_builder_plugin_active() && ! empty( $option_settings['css']['plugin_main'] ) ) {
$selector = $option_settings['css']['plugin_main'];
} else {
$selector = $this->main_css_element;
}
// $selector might be an array, for example to apply the css for placeholders
if ( is_array( $selector ) ) {
foreach( $selector as $selector_item ) {
self::set_style( $function_name, array(
'selector' => $selector_item,
'declaration' => sprintf(
'%1$s: %2$s%3$s;',
esc_html( $css_property ),
esc_html( et_builder_process_range_value( $font_options[ $current_option_name ] ) ),
esc_html( $important )
),
'priority' => $this->_style_priority,
'media_query' => ET_Builder_Element::get_media_query( $current_media_query ),
) );
}
} else {
self::set_style( $function_name, array(
'selector' => $selector,
'declaration' => sprintf(
'%1$s: %2$s%3$s;',
esc_html( $css_property ),
esc_html( et_builder_process_range_value( $font_options[ $current_option_name ] ) ),
esc_html( $important )
),
'priority' => $this->_style_priority,
'media_query' => ET_Builder_Element::get_media_query( $current_media_query ),
) );
if ( $is_placeholder ) {
self::set_style( $function_name, array(
'selector' => $selector . '::-webkit-input-placeholder',
'declaration' => sprintf(
'%1$s: %2$s%3$s;',
esc_html( $css_property ),
esc_html( et_builder_process_range_value( $font_options[ $current_option_name ] ) ),
esc_html( $important )
),
'priority' => $this->_style_priority,
'media_query' => ET_Builder_Element::get_media_query( $current_media_query ),
) );
self::set_style( $function_name, array(
'selector' => $selector . '::-moz-placeholder',
'declaration' => sprintf(
'%1$s: %2$s%3$s;',
esc_html( $css_property ),
esc_html( et_builder_process_range_value( $font_options[ $current_option_name ] ) ),
esc_html( $important )
),
'priority' => $this->_style_priority,
'media_query' => ET_Builder_Element::get_media_query( $current_media_query ),
) );
self::set_style( $function_name, array(
'selector' => $selector . '::-ms-input-placeholder',
'declaration' => sprintf(
'%1$s: %2$s%3$s;',
esc_html( $css_property ),
esc_html( et_builder_process_range_value( $font_options[ $current_option_name ] ) ),
esc_html( $important )
),
'priority' => $this->_style_priority,
'media_query' => ET_Builder_Element::get_media_query( $current_media_query ),
) );
}
}
}
}
}
}
function process_advanced_background_options( $function_name ) {
if ( ! isset( $this->advanced_options['background'] ) ) {
return;
}
$style = '';
$settings = $this->advanced_options['background'];
$important = isset( $settings['css']['important'] ) && $settings['css']['important'] ? ' !important' : '';
// Possible values for use_background_* variables are true, false, or 'fields_only'
$use_background_color_gradient_options = $this->advanced_options['background']['use_background_color_gradient'];
$use_background_image_options = $this->advanced_options['background']['use_background_image'];
$use_background_color_options = $this->advanced_options['background']['use_background_color'];
$background_images = array();
if ( $use_background_color_gradient_options && 'fields_only' !== $use_background_color_gradient_options ) {
$use_background_color_gradient = $this->shortcode_atts['use_background_color_gradient'];
$background_color_gradient_type = $this->shortcode_atts['background_color_gradient_type'];
$background_color_gradient_direction = $this->shortcode_atts['background_color_gradient_direction'];
$background_color_gradient_direction_radial = $this->shortcode_atts['background_color_gradient_direction_radial'];
$background_color_gradient_start = $this->shortcode_atts['background_color_gradient_start'];
$background_color_gradient_end = $this->shortcode_atts['background_color_gradient_end'];
$background_color_gradient_start_position = $this->shortcode_atts['background_color_gradient_start_position'];
$background_color_gradient_end_position = $this->shortcode_atts['background_color_gradient_end_position'];
$background_color_gradient_overlays_image = $this->shortcode_atts['background_color_gradient_overlays_image'];
if ( 'on' === $use_background_color_gradient ) {
$has_background_color_gradient = true;
$background_images[] = $this->get_gradient( array(
'type' => $background_color_gradient_type,
'direction' => $background_color_gradient_direction,
'radial_direction' => $background_color_gradient_direction_radial,
'color_start' => $background_color_gradient_start,
'color_end' => $background_color_gradient_end,
'start_position' => $background_color_gradient_start_position,
'end_position' => $background_color_gradient_end_position,
) );
}
}
if ( $use_background_image_options && 'fields_only' !== $use_background_image_options ) {
$background_image = $this->shortcode_atts['background_image'];
$background_size_default = isset( $this->fields_unprocessed[ 'background_size' ]['default'] ) ? $this->fields_unprocessed[ 'background_size' ]['default'] : '';
$background_size = $this->shortcode_atts['background_size'];
$background_position_default = isset( $this->fields_unprocessed[ 'background_position' ]['default'] ) ? $this->fields_unprocessed[ 'background_position' ]['default'] : '';
$background_position = $this->shortcode_atts['background_position'];
$background_repeat_default = isset( $this->fields_unprocessed[ 'background_repeat' ]['default'] ) ? $this->fields_unprocessed[ 'background_repeat' ]['default'] : '';
$background_repeat = $this->shortcode_atts['background_repeat'];
$background_blend_default = isset( $this->fields_unprocessed[ 'background_blend' ]['default'] ) ? $this->fields_unprocessed[ 'background_blend' ]['default'] : '';
$background_blend = $this->shortcode_atts['background_blend'];
$parallax = $this->shortcode_atts['parallax'];
if ( $this->featured_image_background ) {
$featured_image = isset( $this->shortcode_atts['featured_image'] ) ? $this->shortcode_atts['featured_image'] : '';
$featured_placement = isset( $this->shortcode_atts['featured_placement'] ) ? $this->shortcode_atts['featured_placement'] : '';
$featured_image_src_obj = wp_get_attachment_image_src( get_post_thumbnail_id( get_the_ID() ), 'full' );
$featured_image_src = isset( $featured_image_src_obj[0] ) ? $featured_image_src_obj[0] : '';
if ( 'on' === $featured_image && 'background' === $featured_placement && '' !== $featured_image_src ) {
$background_image = $featured_image_src;
}
}
if ( '' !== $background_image && 'on' !== $parallax ) {
$has_background_image = true;
$background_images[] = sprintf( 'url(%1$s)', esc_html( $background_image ) );
if ( '' !== $background_size && $background_size_default !== $background_size ) {
$style .= sprintf(
'background-size: %1$s; ',
esc_html( $background_size )
);
}
if ( '' !== $background_position && $background_position_default !== $background_position ) {
$style .= sprintf(
'background-position: %1$s; ',
esc_html( str_replace( '_', ' ', $background_position ) )
);
}
if ( '' !== $background_repeat && $background_repeat_default !== $background_repeat ) {
$style .= sprintf(
'background-repeat: %1$s; ',
esc_html( $background_repeat )
);
}
if ( '' !== $background_blend && $background_blend_default !== $background_blend ) {
$style .= sprintf(
'background-blend-mode: %1$s; ',
esc_html( $background_blend )
);
// Force background-color: initial;
if ( isset( $has_background_color_gradient, $has_background_image ) ) {
$style .= sprintf( 'background-color: initial%1$s; ', esc_html( $important ) );
}
}
}
}
if ( ! empty( $background_images ) ) {
// The browsers stack the images in the opposite order to what you'd expect.
if ( 'on' !== $background_color_gradient_overlays_image ) {
$background_images = array_reverse( $background_images );
}
$style .= sprintf(
'background-image: %1$s%2$s;',
esc_html( join( ', ', $background_images ) ),
$important
);
}
if ( $use_background_color_options && 'fields_only' !== $use_background_color_options ) {
if ( ! isset( $has_background_color_gradient, $has_background_image ) ) {
$background_color = $this->shortcode_atts['background_color'];
if ( '' !== $background_color ) {
$style .= sprintf(
'background-color: %1$s%2$s; ',
esc_html( $background_color ),
esc_html( $important )
);
}
}
}
if ( '' !== $style ) {
$css_element = ! empty( $settings['css']['main'] ) ? $settings['css']['main'] : $this->main_css_element;
self::set_style( $function_name, array(
'selector' => $css_element,
'declaration' => rtrim( $style ),
'priority' => $this->_style_priority,
) );
}
}
function process_advanced_text_options( $function_name ) {
if ( ! isset( $this->advanced_options['text'] ) ) {
return;
}
$text_options = $this->advanced_options['text'];
if ( isset( $text_options['css'] ) && is_array( $text_options['css'] ) ) {
$text_css = $text_options['css'];
$text_orientation_default = isset( $this->fields_unprocessed['text_orientation']['default'] ) ? $this->fields_unprocessed['text_orientation']['default'] : '';
$text_orientation = $this->get_text_orientation() !== $text_orientation_default ? $this->get_text_orientation() : '';
// Normally, text orientation attr adds et_pb_text_align_* class name to its module wrapper
// In some cases, it needs to target particular children inside the module. Thus, only prints
// styling if selector is given
if ( isset( $text_css['text_orientation'] ) && '' !== $text_orientation ) {
self::set_style( $function_name, array(
'selector' => $text_css['text_orientation'],
'declaration' => sprintf( 'text-align: %1$s;', esc_attr( $text_orientation ) ),
'priority' => $this->_style_priority,
) );
}
}
}
/**
* Adds Rounded Corners and Border Styles styles to the page custom css code
* Can be overridden in child classes to add more css code from multiple border options. For example for the entire module
* container and for the image within the module.
*/
function process_advanced_border_options( $function_name ) {
global $et_fb_processing_shortcode_object;
$border_field = ET_Builder_Module_Fields_Factory::get( 'Border' );
$border_options = self::$data_utils->array_get( $this->advanced_options, 'border', array() );
if ( $this->slug !== $function_name ) {
// This module's shortcode callback is being used to render another module (like accordion item uses toggle ) so we need to make
// sure border option overrides are taken from the other module instead of this one.
$fields = self::get_advanced_fields( $this->get_post_type(), 'all', $function_name );
$border_options = self::$data_utils->array_get( $fields, 'advanced_common.border', array() );
}
// Do not add overflow:hidden for some modules.
$overflow = ! in_array( $function_name,
array(
'et_pb_social_media_follow',
'et_pb_social_media_follow_network',
'et_pb_fullwidth_menu',
)
);
self::set_style( $function_name, array(
'selector' => self::$data_utils->array_get( $border_options, 'css.main.border_radii', $this->main_css_element ),
'declaration' => $border_field->get_radii_style( $this->shortcode_atts, $this->advanced_options, '', $overflow ),
'priority' => $this->_style_priority,
) );
self::set_style( $function_name, array(
'selector' => self::$data_utils->array_get( $border_options, 'css.main.border_styles', $this->main_css_element ),
'declaration' => $border_field->get_borders_style( $this->shortcode_atts, $this->advanced_options ),
'priority' => $this->_style_priority,
) );
if ( ! $et_fb_processing_shortcode_object && $border_field->needs_border_reset_class( $function_name, $this->shortcode_atts ) ) {
add_filter( "{$function_name}_shortcode_output", array( $border_field, 'add_border_reset_class' ), 10, 2 );
}
}
/**
* Adds Filter styles to the page custom css code
*
* Wrapper for `generate_css_filters` used for module defaults
*/
function process_advanced_filter_options( $function_name ) {
return $this->generate_css_filters( $function_name );
}
function process_max_width_options( $function_name ) {
if ( ! isset( $this->advanced_options['max_width'] ) ) {
return;
}
// Usage setting
$setting_defaults = array(
'use_max_width' => true,
'use_module_alignment' => true,
);
$this->advanced_options['max_width'] = wp_parse_args( $this->advanced_options['max_width'], $setting_defaults );
$is_max_width_customized = false;
// Max width
if ( $this->advanced_options['max_width']['use_max_width'] ) {
$max_width_default = $this->fields_unprocessed['max_width']['default'];
$max_width = $this->shortcode_atts['max_width'] !== $max_width_default ? $this->shortcode_atts['max_width'] : '';
$max_width_tablet = $this->shortcode_atts['max_width_tablet'] !== $max_width_default ? $this->shortcode_atts['max_width_tablet'] : '';
$max_width_phone = $this->shortcode_atts['max_width_phone'] !== $max_width_default ? $this->shortcode_atts['max_width_phone'] : '';
$max_width_last_edited = $this->shortcode_atts['max_width_last_edited'];
if ( '' !== $max_width_tablet || '' !== $max_width_phone || '' !== $max_width ) {
$max_width_options = $this->advanced_options['max_width'];
$max_width_options_css = isset( $max_width_options['css'] ) ? $max_width_options['css'] : array();
$max_width_responsive_active = et_pb_get_responsive_status( $max_width_last_edited );
$selector = isset( $max_width_options_css['main'] ) ? $max_width_options_css['main'] : '%%order_class%%';
$additional_css = $this->get_max_width_additional_css();
$max_width_attrs = array( 'max_width' );
// Append !important tag
if ( isset( $max_width_options_css['important'] ) ) {
$additional_css = ' !important;';
}
if ( $max_width_responsive_active ) {
$max_width_values = array(
'desktop_only' => $max_width,
'tablet' => $max_width_tablet,
'phone' => $max_width_phone,
);
$max_width_attrs = array_merge( $max_width_attrs, array( 'max_width_tablet', 'max_width_phone' ) );
} else {
$max_width_values = array(
'desktop' => $max_width,
);
}
// Update $is_max_width_customized if one of max_width* value is modified
foreach ( $max_width_attrs as $max_width_attr ) {
if ( $is_max_width_customized ) {
break;
}
if ( ! in_array( $this->shortcode_atts[ $max_width_attr ], array( '', '100%' ) ) ) {
$is_max_width_customized = true;
}
}
et_pb_generate_responsive_css(
$max_width_values,
$selector,
'max-width',
$function_name,
$additional_css
);
}
}
// Module Alignment
if ( $this->advanced_options['max_width']['use_module_alignment'] ) {
$module_alignment_styles = array(
'left' => 'margin-left: 0px !important; margin-right: auto !important;',
'center' => 'margin-left: auto !important; margin-right: auto !important;',
'right' => 'margin-left: auto !important; margin-right: 0px !important;',
);
$module_alignment = isset( $this->shortcode_atts['module_alignment'] ) ? $this->shortcode_atts['module_alignment'] : '';
if ( ( $is_max_width_customized || ! $this->advanced_options['max_width']['use_max_width'] ) && isset( $module_alignment_styles[ $module_alignment ] ) ) {
$module_alignment_selector = isset( $this->advanced_options['max_width']['css'] ) && isset( $this->advanced_options['max_width']['css']['module_alignment'] ) ? $this->advanced_options['max_width']['css']['module_alignment'] : '%%order_class%%.et_pb_module';
self::set_style( $function_name, array(
'selector' => $module_alignment_selector,
'declaration' => $module_alignment_styles[ $module_alignment ],
'priority' => 20,
) );
}
}
}
function process_advanced_custom_margin_options( $function_name ) {
if ( ! isset( $this->advanced_options['custom_margin_padding'] ) ) {
return;
}
$style = '';
$style_padding = '';
$style_margin = '';
$style_mobile = array();
$style_mobile_padding = array();
$style_mobile_margin = array();
$important_options = array();
$is_important_set = isset( $this->advanced_options['custom_margin_padding']['css']['important'] );
$use_global_important = $is_important_set && 'all' === $this->advanced_options['custom_margin_padding']['css']['important'];
$css = isset( $this->advanced_options['custom_margin_padding']['css'] ) ? $this->advanced_options['custom_margin_padding']['css'] : array();
$item_mappings = array(
'top' => 0,
'right' => 1,
'bottom' => 2,
'left' => 3,
);
if ( $is_important_set && is_array( $this->advanced_options['custom_margin_padding']['css']['important'] ) ) {
$important_options = $this->advanced_options['custom_margin_padding']['css']['important'];
}
$custom_margin = $this->advanced_options['custom_margin_padding']['use_margin'] ? $this->shortcode_atts['custom_margin'] : '';
$custom_padding = $this->advanced_options['custom_margin_padding']['use_padding'] ? $this->shortcode_atts['custom_padding'] : '';
$custom_margin_responsive_active = isset( $this->shortcode_atts['custom_margin_last_edited'] ) ? et_pb_get_responsive_status( $this->shortcode_atts['custom_margin_last_edited'] ) : false;
$custom_margin_mobile = $custom_margin_responsive_active && $this->advanced_options['custom_margin_padding']['use_margin'] && ( isset( $this->shortcode_atts['custom_margin_tablet'] ) || isset( $this->shortcode_atts['custom_margin_phone'] ) )
? array (
'tablet' => isset( $this->shortcode_atts['custom_margin_tablet'] ) ? $this->shortcode_atts['custom_margin_tablet'] : '',
'phone' => isset( $this->shortcode_atts['custom_margin_phone'] ) ? $this->shortcode_atts['custom_margin_phone'] : '',
)
: '';
$custom_padding_responsive_active = isset( $this->shortcode_atts['custom_padding_last_edited'] ) ? et_pb_get_responsive_status( $this->shortcode_atts['custom_padding_last_edited'] ) : false;
$custom_padding_mobile = $custom_padding_responsive_active && $this->advanced_options['custom_margin_padding']['use_padding'] && ( isset( $this->shortcode_atts['custom_padding_tablet'] ) || isset( $this->shortcode_atts['custom_padding_phone'] ) )
? array (
'tablet' => isset( $this->shortcode_atts['custom_padding_tablet'] ) ? $this->shortcode_atts['custom_padding_tablet'] : '',
'phone' => isset( $this->shortcode_atts['custom_padding_phone'] ) ? $this->shortcode_atts['custom_padding_phone'] : '',
)
: '';
if ( '' !== $custom_padding || ! empty( $custom_padding_mobile ) ) {
$important = in_array( 'custom_padding', $important_options ) || $use_global_important ? true : false;
$has_padding_selector = isset( $this->advanced_options['custom_margin_padding']['css'] ) && isset( $this->advanced_options['custom_margin_padding']['css']['padding'] );
$padding_styling = '' !== $custom_padding ? et_builder_get_element_style_css( $custom_padding, 'padding', $important ) : '';
if ( $has_padding_selector ) {
$style_padding .= $padding_styling;
} else {
$style .= $padding_styling;
}
if ( ! empty( $custom_padding_mobile ) ) {
foreach ( $custom_padding_mobile as $device => $settings ) {
$padding_mobile_styling = '' !== $settings ? et_builder_get_element_style_css( $settings, 'padding', $important ) : '';
if ( $has_padding_selector ) {
$style_mobile_padding[ $device ][] = $padding_mobile_styling;
} else {
$style_mobile[ $device ][] = $padding_mobile_styling;
}
}
}
// Selective Paddings
$selective_paddings = array_filter( array(
'top' => isset( $css['padding-top'] ) ? $css['padding-top'] : false,
'right' => isset( $css['padding-right'] ) ? $css['padding-right'] : false,
'bottom' => isset( $css['padding-bottom'] ) ? $css['padding-bottom'] : false,
'left' => isset( $css['padding-left'] ) ? $css['padding-left'] : false,
) );
// Only run the following if selective-padding selector is defined
if ( ! empty( $selective_paddings ) ) {
// Loop each padding sides. Selective padding works by creating filtered custom_margin value on the fly, then pass it to existin declaration builder
// Ie custom_padding = 10px|10px|10px|10px. Selective padding for padding-top works by creating 10px||| value on the fly then pass it to declaration builder
foreach ( $selective_paddings as $corner => $selective_padding_selectors ) {
// Default selective padding value: empty on all sides
$selective_padding = array( '', '', '', '' );
// Get padding order key. Expected order: top|right|bottom|left
$selective_padding_key = $item_mappings[ $corner ];
// Explode custom padding value into array
$selective_padding_array = explode( '|', $custom_padding );
// Pick current padding side's value
$selective_padding_value = isset( $selective_padding_array[ $selective_padding_key ] ) ? $selective_padding_array[ $selective_padding_key ] : '';
// Set selective padding value to $selective_padding
$selective_padding[ $selective_padding_key ] = $selective_padding_value;
// If selective padding for current side is found, set style for it
$selective_padding = array_filter( $selective_padding );
if ( ! empty( $selective_padding ) ) {
self::set_style( $function_name, array(
'selector' => $selective_padding_selectors,
'declaration' => rtrim( et_builder_get_element_style_css( implode( '|', $selective_padding ), 'padding' ) ),
'priority' => $this->_style_priority,
) );
}
// Check wheter responsive padding is activated and padding has mobile value
if ( $custom_padding_responsive_active && is_array( $custom_padding_mobile ) ) {
// Assume no mobile padding value first
$has_selective_padding_mobile = false;
// Set default selective padding mobile
$selective_padding_mobile = array(
'tablet' => array( '', '', '', '' ),
'phone' => array( '', '', '', '' ),
);
// Loop padding mobile. This results per-breakpoint padding value
foreach ( $custom_padding_mobile as $breakpoint => $custom_padding_device ) {
// Explode per-breakpoint padding value into array
$custom_padding_device_array = explode( '|', $custom_padding_device );
// Get current padding side value on current breakpoint
$selective_padding_mobile_value = isset( $custom_padding_device_array[ $selective_padding_key ] ) ? $custom_padding_device_array[ $selective_padding_key ] : '';
// Set picked value into current padding side on current breakpoint
$selective_padding_mobile[ $breakpoint ][ $selective_padding_key ] = $selective_padding_mobile_value;
// If the side of padding on current breakpoint has value, build CSS declaration for it mark selective padding mobile as exist
$selective_padding_mobile[ $breakpoint ] = array_filter( $selective_padding_mobile[ $breakpoint ] );
if ( ! empty( $selective_padding_mobile[ $breakpoint ] ) ) {
$selective_padding_mobile[ $breakpoint ] = array( et_builder_get_element_style_css( implode( '|', $selective_padding_mobile[ $breakpoint ] ), 'padding' ) );
$has_selective_padding_mobile = true;
}
}
// Set style for selective padding on mobile
if ( $has_selective_padding_mobile ) {
$this->process_advanced_mobile_margin_options(
$function_name,
$selective_padding_mobile,
$selective_padding_selectors
);
}
}
}
}
}
if ( '' !== $custom_margin || ! empty( $custom_margin_mobile ) ) {
$important = in_array( 'custom_margin', $important_options ) || $use_global_important ? true : false;
$has_margin_selector = isset( $this->advanced_options['custom_margin_padding']['css'] ) && isset( $this->advanced_options['custom_margin_padding']['css']['margin'] );
$margin_styling = '' !== $custom_margin ? et_builder_get_element_style_css( $custom_margin, 'margin', $important ) : '';
if ( $has_margin_selector ) {
$style_margin .= $margin_styling;
} else {
$style .= $margin_styling;
}
if ( ! empty( $custom_margin_mobile ) ) {
foreach ( $custom_margin_mobile as $device => $settings ) {
$margin_mobile_styling = '' !== $settings ? et_builder_get_element_style_css( $settings, 'margin', $important ) : '';
if ( $has_margin_selector ) {
$style_mobile_margin[ $device ][] = $margin_mobile_styling;
} else {
$style_mobile[ $device ][] = $margin_mobile_styling;
}
}
}
}
if ( '' !== $style_padding ) {
$css_element_padding = $this->advanced_options['custom_margin_padding']['css']['padding'];
self::set_style( $function_name, array(
'selector' => $css_element_padding,
'declaration' => rtrim( $style_padding ),
'priority' => $this->_style_priority,
) );
}
if ( '' !== $style_margin ) {
$css_element_margin = $this->advanced_options['custom_margin_padding']['css']['margin'];
self::set_style( $function_name, array(
'selector' => $css_element_margin,
'declaration' => rtrim( $style_margin ),
'priority' => $this->_style_priority,
) );
}
if ( '' !== $style ) {
$css_element = ! empty( $this->advanced_options['custom_margin_padding']['css']['main'] ) ? $this->advanced_options['custom_margin_padding']['css']['main'] : $this->main_css_element;
self::set_style( $function_name, array(
'selector' => $css_element,
'declaration' => rtrim( $style ),
'priority' => $this->_style_priority,
) );
}
if ( ! empty( $style_mobile_padding ) ) {
$this->process_advanced_mobile_margin_options(
$function_name,
$style_mobile_padding,
$this->advanced_options['custom_margin_padding']['css']['padding']
);
}
if ( ! empty( $style_mobile_margin ) ) {
$this->process_advanced_mobile_margin_options(
$function_name,
$style_mobile_margin,
$this->advanced_options['custom_margin_padding']['css']['margin']
);
}
if ( ! empty( $style_mobile ) ) {
$css_element = ! empty( $this->advanced_options['custom_margin_padding']['css']['main'] ) ? $this->advanced_options['custom_margin_padding']['css']['main'] : $this->main_css_element;
$this->process_advanced_mobile_margin_options(
$function_name,
$style_mobile,
$css_element
);
}
}
function process_advanced_mobile_margin_options( $function_name, $style_mobile, $css_element ) {
foreach( $style_mobile as $device => $style ) {
if ( ! empty( $style ) ) {
$current_media_query = 'tablet' === $device ? 'max_width_980' : 'max_width_767';
$current_media_css = '';
foreach( $style as $css_code ) {
$current_media_css .= $css_code;
}
if ( '' === $current_media_css ) {
continue;
}
self::set_style( $function_name, array(
'selector' => $css_element,
'declaration' => rtrim( $current_media_css ),
'priority' => $this->_style_priority,
'media_query' => ET_Builder_Element::get_media_query( $current_media_query ),
) );
}
}
}
function process_advanced_button_options( $function_name ) {
if ( ! isset( $this->advanced_options['button'] ) ) {
return;
}
foreach ( $this->advanced_options['button'] as $option_name => $option_settings ) {
$button_custom = $this->shortcode_atts["custom_{$option_name}"];
$button_text_size = $this->shortcode_atts["{$option_name}_text_size"];
$button_text_size_tablet = $this->shortcode_atts["{$option_name}_text_size_tablet"];
$button_text_size_phone = $this->shortcode_atts["{$option_name}_text_size_phone"];
$button_text_size_last_edited = $this->shortcode_atts["{$option_name}_text_size_last_edited"];
$button_text_color = $this->shortcode_atts["{$option_name}_text_color"];
$button_bg_color = $this->shortcode_atts["{$option_name}_bg_color"];
$button_border_width = $this->shortcode_atts["{$option_name}_border_width"];
$button_border_color = $this->shortcode_atts["{$option_name}_border_color"];
$button_border_radius = $this->shortcode_atts["{$option_name}_border_radius"];
$button_font = $this->shortcode_atts["{$option_name}_font"];
$button_letter_spacing = $this->shortcode_atts["{$option_name}_letter_spacing"];
$button_letter_spacing_tablet = $this->shortcode_atts["{$option_name}_letter_spacing_tablet"];
$button_letter_spacing_phone = $this->shortcode_atts["{$option_name}_letter_spacing_phone"];
$button_letter_spacing_last_edited = $this->shortcode_atts["{$option_name}_letter_spacing_last_edited"];
$button_use_icon = $this->shortcode_atts["{$option_name}_use_icon"];
$button_icon = $this->shortcode_atts["{$option_name}_icon"];
$button_icon_color = $this->shortcode_atts["{$option_name}_icon_color"];
$button_icon_placement = $this->shortcode_atts["{$option_name}_icon_placement"];
$button_on_hover = $this->shortcode_atts["{$option_name}_on_hover"];
$button_text_color_hover = $this->shortcode_atts["{$option_name}_text_color_hover"];
$button_bg_color_hover = $this->shortcode_atts["{$option_name}_bg_color_hover"];
$button_border_color_hover = $this->shortcode_atts["{$option_name}_border_color_hover"];
$button_border_radius_hover = $this->shortcode_atts["{$option_name}_border_radius_hover"];
$button_letter_spacing_hover = $this->shortcode_atts["{$option_name}_letter_spacing_hover"];
$button_letter_spacing_hover_tablet = $this->shortcode_atts["{$option_name}_letter_spacing_hover_tablet"];
$button_letter_spacing_hover_phone = $this->shortcode_atts["{$option_name}_letter_spacing_hover_phone"];
$button_letter_spacing_hover_last_edited = $this->shortcode_atts["{$option_name}_letter_spacing_hover_last_edited"];
$button_icon_pseudo_selector = $button_icon_placement === 'left' ? ':before' : ':after';
// Specific selector needs to be explicitly defined to make button alignment works
if ( isset( $option_settings['use_alignment'] ) && $option_settings['use_alignment'] && isset( $option_settings['css'] ) && isset( $option_settings['css']['alignment'] ) ) {
$button_alignment = $this->shortcode_atts["{$option_name}_alignment"];
$button_alignment_selector = $option_settings['css']['alignment'];
if ( '' !== $button_alignment && '' !== $button_alignment_selector ) {
self::set_style( $function_name, array(
'selector' => $button_alignment_selector,
'declaration' => "text-align: {$button_alignment};",
) );
}
}
if ( 'on' === $button_custom ) {
$is_default_button_text_size = $this->_is_field_default( 'button_text_size', $button_text_size );
$is_default_button_icon_placement = $this->_is_field_default( 'button_icon_placement', $button_icon_placement );
$is_default_button_on_hover = $this->_is_field_default( 'button_on_hover', $button_on_hover );
$is_default_button_icon = $this->_is_field_default( 'button_icon', $button_icon );
$is_default_hover_placement = $is_default_button_on_hover && $is_default_button_icon_placement;
$button_text_size_processed = $is_default_button_text_size ? '20px' : et_builder_process_range_value( $button_text_size );
$button_border_radius_processed = '' !== $button_border_radius && 'px' !== $button_border_radius ? et_builder_process_range_value( $button_border_radius ) : '';
$button_border_radius_hover_processed = '' !== $button_border_radius_hover && 'px' !== $button_border_radius_hover ? et_builder_process_range_value( $button_border_radius_hover ) : '';
$button_use_icon = '' === $button_use_icon ? 'on' : $button_use_icon;
$css_element = ! empty( $option_settings['css']['main'] ) ? $option_settings['css']['main'] : $this->main_css_element . ' .et_pb_button';
if ( et_is_builder_plugin_active() && ! empty( $option_settings['css']['plugin_main'] ) ) {
$css_element = $option_settings['css']['plugin_main'];
}
$css_element_processed = et_is_builder_plugin_active() ? $css_element : 'body #page-container ' . $css_element;
if ( et_is_builder_plugin_active() ) {
$button_bg_color .= '' !== $button_bg_color ? ' !important' : '';
$button_border_radius_processed .= '' !== $button_border_radius_processed ? ' !important' : '';
$button_border_radius_hover_processed .= '' !== $button_border_radius_hover_processed ? ' !important' : '';
}
$global_use_icon_value = et_builder_option( 'all_buttons_icon' );
$main_element_styles_padding_important = 'no' === $global_use_icon_value && 'off' !== $button_use_icon;
$main_element_styles = sprintf(
'%1$s
%2$s
%3$s
%4$s
%5$s
%6$s
%7$s
%8$s
%9$s',
'' !== $button_text_color ? sprintf( 'color:%1$s !important;', $button_text_color ) : '',
'' !== $button_bg_color && 'et_pb_button' !== $this->slug ? sprintf( 'background:%1$s;', $button_bg_color ) : '',
'' !== $button_border_width && 'px' !== $button_border_width ? sprintf( 'border-width:%1$s !important;', et_builder_process_range_value( $button_border_width ) ) : '',
'' !== $button_border_color ? sprintf( 'border-color:%1$s;', $button_border_color ) : '',
'' !== $button_border_radius_processed ? sprintf( 'border-radius:%1$s;', $button_border_radius_processed ) : '',
'' !== $button_letter_spacing && 'px' !== $button_letter_spacing ? sprintf( 'letter-spacing:%1$s;', et_builder_process_range_value( $button_letter_spacing ) ) : '',
! $is_default_button_text_size ? sprintf( 'font-size:%1$s;', $button_text_size_processed ) : '',
'' !== $button_font ? et_builder_set_element_font( $button_font, true ) : '',
'off' === $button_on_hover ?
sprintf( 'padding-left:%1$s%3$s; padding-right: %2$s%3$s;',
'left' === $button_icon_placement ? '2em' : '0.7em',
'left' === $button_icon_placement ? '0.7em' : '2em',
$main_element_styles_padding_important ? ' !important' : ''
)
: ''
);
self::set_style( $function_name, array(
'selector' => $css_element_processed,
'declaration' => rtrim( $main_element_styles ),
) );
// if button has default icon position or disabled globally and not enabled in module then no padding css should be generated.
$on_hover_padding = $is_default_button_icon_placement || ('default' === $button_use_icon && 'no' === $global_use_icon_value)
? ''
: sprintf( 'padding-left:%1$s%3$s; padding-right: %2$s%3$s;',
'left' === $button_icon_placement ? '2em' : '0.7em',
'left' === $button_icon_placement ? '0.7em' : '2em',
$main_element_styles_padding_important ? ' !important' : ''
);
// Avoid adding useless style when value equals its default
$button_letter_spacing_hover = $this->_is_field_default('button_letter_spacing_hover', $button_letter_spacing_hover) ? '' : $button_letter_spacing_hover;
$main_element_styles_hover = sprintf(
'%1$s
%2$s
%3$s
%4$s
%5$s
%6$s',
'' !== $button_text_color_hover ? sprintf( 'color:%1$s !important;', $button_text_color_hover ) : '',
'' !== $button_bg_color_hover ? sprintf( 'background:%1$s !important;', $button_bg_color_hover ) : '',
'' !== $button_border_color_hover ? sprintf( 'border-color:%1$s !important;', $button_border_color_hover ) : '',
'' !== $button_border_radius_hover_processed ? sprintf( 'border-radius:%1$s;', $button_border_radius_hover_processed ) : '',
'' !== $button_letter_spacing_hover && 'px' !== $button_letter_spacing_hover ? sprintf( 'letter-spacing:%1$s;', et_builder_process_range_value( $button_letter_spacing_hover ) ) : '',
'off' === $button_on_hover ? '' : $on_hover_padding
);
self::set_style( $function_name, array(
'selector' => $css_element_processed . ':hover',
'declaration' => rtrim( $main_element_styles_hover ),
) );
if ( 'off' === $button_use_icon ) {
$main_element_styles_after = 'display:none !important;';
$no_icon_styles = 'padding: 0.3em 1em !important;';
$selector = sprintf( '%1$s:before, %1$s:after', $css_element_processed );
self::set_style( $function_name, array(
'selector' => $css_element . ',' . $css_element . ':hover',
'declaration' => rtrim( $no_icon_styles ),
) );
} else {
$button_icon_code = '' !== $button_icon ? str_replace( ';', '', str_replace( '&#x', '', html_entity_decode( et_pb_process_font_icon( $button_icon ) ) ) ) : '';
if ( '' !== $button_text_size_processed ) {
$button_icon_size = '35' !== $button_icon_code ? '1em' : '1.6em';
}
$main_element_styles_after = sprintf(
'%1$s
%2$s
%3$s
%4$s
%5$s
%6$s
%7$s',
'' !== $button_icon_color ? sprintf( 'color:%1$s;', $button_icon_color ) : '',
'' !== $button_icon_code ?
sprintf( 'line-height:%1$s;', '35' !== $button_icon_code ? '1.7em' : '1em' )
: '',
'' !== $button_icon_code ? sprintf( 'font-size:%1$s !important;', $button_icon_size ) : '',
$is_default_hover_placement ? '' : sprintf( 'opacity:%1$s;', 'off' !== $button_on_hover ? '0' : '1' ),
'off' !== $button_on_hover && '' !== $button_icon_code ?
sprintf( 'margin-left: %1$s; %2$s: auto;',
'left' === $button_icon_placement ? '-1.3em' : '-1em',
'left' === $button_icon_placement ? 'right' : 'left'
)
: '',
'off' === $button_on_hover ?
sprintf( 'margin-left: %1$s; %2$s:auto;',
'left' === $button_icon_placement ? '-1.3em' : '.3em',
'left' === $button_icon_placement ? 'right' : 'left'
)
: '',
( ! $is_default_button_icon_placement && in_array( $button_use_icon , array( 'default', 'on' ) ) ? 'display: inline-block;' : '' )
);
// Reverse icon position
if ( 'left' === $button_icon_placement ) {
$button_icon_left_content = '' !== $button_icon_code ? 'content: attr(data-icon);' : '';
self::set_style( $function_name, array(
'selector' => $css_element_processed . ':after',
'declaration' => 'display: none;',
) );
if ( et_is_builder_plugin_active() ) {
self::set_style( $function_name, array(
'selector' => '.et_pb_row ' . $css_element_processed . ':hover',
'declaration' => 'padding-right: 1em; padding-left: 2em;',
) );
}
self::set_style( $function_name, array(
'selector' => $css_element_processed . ':before',
'declaration' => $button_icon_left_content . ' ; font-family: "ETmodules" !important;',
) );
}
// if button has default icon/hover/placement and disabled globally or not enabled in module then no :after:hover css should be generated.
if ( ! ( $is_default_button_icon && $is_default_hover_placement ) &&
( 'default' !== $button_use_icon || 'no' !== $global_use_icon_value ) ) {
$hover_after_styles = sprintf(
'%1$s
%2$s
%3$s',
'' !== $button_icon_code ?
sprintf( 'margin-left:%1$s;', '35' !== $button_icon_code ? '.3em' : '0' )
: '',
'' !== $button_icon_code ?
sprintf( '%1$s: auto; margin-left: %2$s;',
'left' === $button_icon_placement ? 'right' : 'left',
'left' === $button_icon_placement ? '-1.3em' : '.3em'
)
: '',
'off' !== $button_on_hover ? 'opacity: 1;' : ''
);
self::set_style( $function_name, array(
'selector' => $css_element_processed . ':hover' . $button_icon_pseudo_selector,
'declaration' => rtrim( $hover_after_styles ),
) );
}
if ( '' === $button_icon && ! $is_default_button_text_size ) {
$default_icons_size = '1.6em';
$custom_icon_size = $button_text_size_processed;
self::set_style( $function_name, array(
'selector' => $css_element_processed . $button_icon_pseudo_selector,
'declaration' => sprintf( 'font-size:%1$s;', $default_icons_size ),
) );
self::set_style( $function_name, array(
'selector' => 'body.et_button_custom_icon #page-container ' . $css_element . $button_icon_pseudo_selector,
'declaration' => sprintf( 'font-size:%1$s;', $custom_icon_size ),
) );
}
$selector = $css_element_processed . $button_icon_pseudo_selector;
}
foreach( array( 'tablet', 'phone' ) as $device ) {
$current_media_query = 'tablet' === $device ? 'max_width_980' : 'max_width_767';
$current_text_size = 'tablet' === $device ? et_builder_process_range_value( $button_text_size_tablet ) : et_builder_process_range_value( $button_text_size_phone );
$current_letter_spacing = 'tablet' === $device ? et_builder_process_range_value( $button_letter_spacing_tablet ) : et_builder_process_range_value( $button_letter_spacing_phone );
$current_letter_spacing_hover = 'tablet' === $device ? et_builder_process_range_value( $button_letter_spacing_hover_tablet ) : et_builder_process_range_value( $button_letter_spacing_hover_phone );
$current_text_size_responsive_active = et_pb_get_responsive_status( $button_text_size_last_edited );
$current_letter_spacing_responsive_active = et_pb_get_responsive_status( $button_letter_spacing_last_edited );
$current_letter_spacing_hover_responsive_active = et_pb_get_responsive_status( $button_letter_spacing_hover_last_edited );
if ( ( '' !== $current_text_size && '0px' !== $current_text_size ) || '' !== $current_letter_spacing ) {
self::set_style( $function_name, array(
'selector' => $css_element_processed . ',' . $css_element_processed . $button_icon_pseudo_selector,
'declaration' => sprintf(
'%1$s
%2$s',
$current_text_size_responsive_active && '' !== $current_text_size && '0px' !== $current_text_size ? sprintf( 'font-size:%1$s !important;', $current_text_size ) : '',
$current_letter_spacing_responsive_active && '' !== $current_letter_spacing ? sprintf( 'letter-spacing:%1$s;', $current_letter_spacing ) : ''
),
'media_query' => ET_Builder_Element::get_media_query( $current_media_query ),
) );
}
if ( $current_letter_spacing_hover_responsive_active && '' !== $current_letter_spacing_hover ) {
self::set_style( $function_name, array(
'selector' => $css_element_processed . ':hover',
'declaration' => sprintf(
'letter-spacing:%1$s;',
$current_letter_spacing_hover
),
'media_query' => ET_Builder_Element::get_media_query( $current_media_query ),
) );
}
}
self::set_style( $function_name, array(
'selector' => $selector,
'declaration' => rtrim( $main_element_styles_after ),
) );
// Background Options Styling
$background_base_name = "{$option_name}_bg";
$background_images = array();
$background_prefix = "{$background_base_name}_";
$background_style = '';
// Background Gradient
$use_background_color_gradient = $this->shortcode_atts["{$background_prefix}use_color_gradient"];
$background_color_gradient_type = $this->shortcode_atts["{$background_prefix}color_gradient_type"];
$background_color_gradient_direction = $this->shortcode_atts["{$background_prefix}color_gradient_direction"];
$background_color_gradient_direction_radial = $this->shortcode_atts["{$background_prefix}color_gradient_direction_radial"];
$background_color_gradient_start = $this->shortcode_atts["{$background_prefix}color_gradient_start"];
$background_color_gradient_end = $this->shortcode_atts["{$background_prefix}color_gradient_end"];
$background_color_gradient_start_position = $this->shortcode_atts["{$background_prefix}color_gradient_start_position"];
$background_color_gradient_end_position = $this->shortcode_atts["{$background_prefix}color_gradient_end_position"];
$background_color_gradient_overlays_image = $this->shortcode_atts["{$background_prefix}color_gradient_overlays_image"];
if ( 'on' === $use_background_color_gradient ) {
$has_background_color_gradient = true;
$background_images[] = $this->get_gradient( array(
'type' => $background_color_gradient_type,
'direction' => $background_color_gradient_direction,
'radial_direction' => $background_color_gradient_direction_radial,
'color_start' => $background_color_gradient_start,
'color_end' => $background_color_gradient_end,
'start_position' => $background_color_gradient_start_position,
'end_position' => $background_color_gradient_end_position,
) );
}
// Background Image
$background_image = $this->shortcode_atts["{$background_prefix}image"];
$background_size_default = isset( $this->fields_unprocessed["{$background_prefix}size"]["default"] ) ? $this->fields_unprocessed[ "{$background_prefix}size" ]["default"] : "";
$background_size = $this->shortcode_atts["{$background_prefix}size"];
$background_position_default = isset( $this->fields_unprocessed["{$background_prefix}position"]["default"] ) ? $this->fields_unprocessed[ "{$background_prefix}position" ]["default"] : "";
$background_position = $this->shortcode_atts["{$background_prefix}position"];
$background_repeat_default = isset( $this->fields_unprocessed["{$background_prefix}repeat"]["default"] ) ? $this->fields_unprocessed[ "{$background_prefix}repeat" ]["default"] : "";
$background_repeat = $this->shortcode_atts["{$background_prefix}repeat"];
$background_blend_default = isset( $this->fields_unprocessed["{$background_prefix}blend"]["default"] ) ? $this->fields_unprocessed[ "{$background_prefix}blend" ]["default"] : "";
$background_blend = $this->shortcode_atts["{$background_prefix}blend"];
$parallax = $this->shortcode_atts["{$background_prefix}parallax"];
if ( '' !== $background_image && 'on' !== $parallax ) {
$has_background_image = true;
$background_images[] = sprintf( 'url(%1$s)', esc_html( $background_image ) );
if ( '' !== $background_size && $background_size_default !== $background_size ) {
$background_style .= sprintf(
'background-size: %1$s; ',
esc_html( $background_size )
);
}
if ( '' !== $background_position && $background_position_default !== $background_position ) {
$background_style .= sprintf(
'background-position: %1$s; ',
esc_html( str_replace( '_', ' ', $background_position ) )
);
}
if ( '' !== $background_repeat && $background_repeat_default !== $background_repeat ) {
$background_style .= sprintf(
'background-repeat: %1$s; ',
esc_html( $background_repeat )
);
}
if ( '' !== $background_blend && $background_blend_default !== $background_blend ) {
$background_style .= sprintf(
'background-blend-mode: %1$s; ',
esc_html( $background_blend )
);
// Force background-color: initial;
if ( isset( $has_background_color_gradient, $has_background_image ) ) {
$background_style .= sprintf( 'background-color: initial%1$s; ', esc_html( ' !important' ) );
}
}
}
if ( ! empty( $background_images ) ) {
// The browsers stack the images in the opposite order to what you'd expect.
if ( 'on' !== $background_color_gradient_overlays_image ) {
$background_images = array_reverse( $background_images );
}
$background_style .= sprintf(
'background-image: %1$s !important;',
esc_html( join( ', ', $background_images ) )
);
}
// Reset color if gradient and image is used together
if ( ! isset( $has_background_color_gradient, $has_background_image ) ) {
$background_color = $this->shortcode_atts["{$background_prefix}color"];
if ( '' !== $background_color ) {
$background_style .= sprintf(
'background-color: %1$s; ',
esc_html( $background_color )
);
}
}
if ( '' !== $background_style ) {
self::set_style( $function_name, array(
'selector' => $css_element_processed,
'declaration' => rtrim( $background_style ),
'priority' => $this->_style_priority,
) );
}
}
}
}
function process_custom_css_options( $function_name ) {
if ( empty( $this->custom_css_options ) ) {
return false;
}
foreach ( $this->custom_css_options as $slug => $option ) {
$css = $this->shortcode_atts["custom_css_{$slug}"];
$order_class = isset( $this->main_css_element ) && count( explode( ' ', $this->main_css_element ) ) === 1 ? $selector = $this->main_css_element : '%%order_class%%';
$selector = ! empty( $option['selector'] ) ? $option['selector'] : '';
if ( false === strpos( $selector, '%%order_class%%' ) ) {
if ( ! ( isset( $option['no_space_before_selector'] ) && $option['no_space_before_selector'] ) && '' !== $selector ) {
$selector = " {$selector}";
}
$selector = "{$order_class}{$selector}";
}
if ( '' !== $css ) {
self::set_style( $function_name, array(
'selector' => $selector,
'declaration' => trim( $css ),
) );
}
}
}
function process_box_shadow( $function_name ) {
/**
* @var ET_Builder_Module_Field_BoxShadow $boxShadow
*/
$boxShadow = ET_Builder_Module_Fields_Factory::get( 'BoxShadow' );
self::set_style( $function_name, array(
'selector' => '%%order_class%%',
'declaration' => $boxShadow->get_value( $this->shortcode_atts )
) );
}
function make_options_filterable() {
if ( isset( $this->advanced_options ) ) {
$this->advanced_options = apply_filters(
"{$this->slug}_advanced_options",
$this->advanced_options,
$this->slug,
$this->main_css_element
);
}
if ( isset( $this->custom_css_options ) ) {
$this->custom_css_options = apply_filters(
"{$this->slug}_custom_css_options",
$this->custom_css_options,
$this->slug,
$this->main_css_element
);
}
}
function disable_wptexturize( $shortcodes ) {
$shortcodes[] = $this->slug;
return $shortcodes;
}
static function compare_by_priority( $a, $b ) {
$a_priority = ! empty( $a['priority'] ) ? (int) $a['priority'] : self::DEFAULT_PRIORITY;
$b_priority = ! empty( $b['priority'] ) ? (int) $b['priority'] : self::DEFAULT_PRIORITY;
if ( isset( $a['_order_number'], $b['_order_number'] ) && ( $a_priority === $b_priority ) ) {
return $a['_order_number'] - $b['_order_number'];
}
return $a_priority - $b_priority;
}
/*
* Reorder toggles based on the priority with respect to manually ordered items with no priority
*
*/
static function et_pb_order_toggles_by_priority( $toggles_array ) {
if ( empty( $toggles_array ) ) {
return array();
}
$high_priority_toggles = array();
$low_priority_toggles = array();
$manually_ordered_toggles = array();
// fill 3 arrays based on priority
foreach ( $toggles_array as $toggle_id => $toggle_data ) {
if ( isset( $toggle_data['priority'] ) ) {
if ( $toggle_data['priority'] < 10 ) {
$high_priority_toggles[ $toggle_id ] = $toggle_data;
} else {
$low_priority_toggles[ $toggle_id ] = $toggle_data;
}
} else {
// keep the original order of options without priority defined
$manually_ordered_toggles[ $toggle_id ] = $toggle_data;
}
}
// order high and low priority toggles
uasort( $high_priority_toggles, array( 'self', 'compare_by_priority' ) );
uasort( $low_priority_toggles, array( 'self', 'compare_by_priority' ) );
// merge 3 arrays to get the correct order of toggles.
return array_merge( $high_priority_toggles, $manually_ordered_toggles, $low_priority_toggles );
}
static function compare_by_name( $a, $b ) {
return strcasecmp( $a->name, $b->name );
}
static function get_modules_count( $post_type ) {
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
$overall_count = count( $parent_modules ) + count( $child_modules );
return $overall_count;
}
static function get_modules_js_array( $post_type ) {
$modules = array();
$parent_modules = self::get_parent_modules( $post_type );
if ( ! empty( $parent_modules ) ) {
/**
* Sort modules alphabetically by name.
*/
$sorted_modules = $parent_modules;
uasort( $sorted_modules, array( 'self', 'compare_by_name' ) );
foreach( $sorted_modules as $module ) {
/**
* Replace single and double quotes with %% and || respectively
* to avoid js conflicts
*/
$module_name = str_replace( array( '"', '"', '"', '"' ) , '%%', $module->name );
$module_name = str_replace( array( "'", ''', ''' ) , '||', $module_name );
$modules[] = sprintf(
'{ "title" : "%1$s", "label" : "%2$s"%3$s}',
esc_js( $module_name ),
esc_js( $module->slug ),
( isset( $module->fullwidth ) && $module->fullwidth ? ', "fullwidth_only" : "on"' : '' )
);
}
}
return '[' . implode( ',', $modules ) . ']';
}
static function get_shortcodes_with_children( $post_type ) {
$shortcodes = array();
if ( ! empty( self::$parent_modules[ $post_type ] ) ) {
foreach( self::$parent_modules[ $post_type ] as $module ) {
if ( ! empty( $module->child_slug ) ) {
$shortcodes[] = sprintf(
'"%1$s":"%2$s"',
esc_js( $module->slug ),
esc_js( $module->child_slug )
);
}
}
}
return '{' . implode( ',', $shortcodes ) . '}';
}
static function get_modules_array( $post_type = '', $include_child = false, $fb_ignore_unsupported = false ) {
$modules = array();
if ( ! empty( $post_type ) ) {
$parent_modules = self::get_parent_modules( $post_type );
if ( $include_child ) {
$parent_modules = array_merge( $parent_modules, self::get_child_modules( $post_type ));
}
if ( ! empty( $parent_modules ) ) {
$sorted_modules = $parent_modules;
}
} else {
$parent_modules = self::get_parent_modules();
if ( $include_child ) {
$parent_modules = array_merge( $parent_modules, self::get_child_modules());
}
if ( ! empty( $parent_modules ) ) {
$all_modules = array();
foreach( $parent_modules as $post_type => $post_type_modules ) {
foreach ( $post_type_modules as $module_slug => $module ) {
$all_modules[ $module_slug ] = $module;
}
}
$sorted_modules = $all_modules;
}
}
if ( ! empty( $sorted_modules ) ) {
/**
* Sort modules alphabetically by name.
*/
uasort( $sorted_modules, array( 'self', 'compare_by_name' ) );
foreach( $sorted_modules as $module ) {
if ( $fb_ignore_unsupported && ( ! isset( $module->fb_support ) || ! $module->fb_support ) ) {
continue;
}
/**
* Replace single and double quotes with %% and || respectively
* to avoid js conflicts
*/
$module_name = str_replace( '"', '%%', $module->name );
$module_name = str_replace( "'", '||', $module_name );
$_module = array(
'title' => esc_attr( $module_name ),
'label' => esc_attr( $module->slug ),
'is_parent' => $module->type === 'child' ? 'off' : 'on',
'fb_support' => isset( $module->fb_support ) && $module->fb_support ? 'on' : 'off',
);
if ( isset( $module->fullwidth ) && $module->fullwidth ) {
$_module['fullwidth_only'] = 'on';
}
$modules[] = $_module;
}
}
return $modules;
}
static function get_fb_unsupported_modules() {
$parent_modules = self::get_parent_modules();
$unsupported_modules_array = array();
foreach( $parent_modules as $post_type => $post_type_modules ) {
foreach ( $post_type_modules as $module_slug => $module ) {
if ( ! isset( $module->fb_support ) || ! $module->fb_support ) {
$unsupported_modules_array[] = $module_slug;
}
}
}
return array_unique( $unsupported_modules_array );
}
static function get_parent_shortcodes( $post_type ) {
$shortcodes = array();
$parent_modules = self::get_parent_modules( $post_type );
if ( ! empty( $parent_modules ) ) {
foreach( $parent_modules as $module ) {
$shortcodes[] = $module->slug;
}
}
return implode( '|', $shortcodes );
}
static function get_child_shortcodes( $post_type ) {
$shortcodes = array();
$child_modules = self::get_child_modules( $post_type );
if ( ! empty( $child_modules ) ) {
foreach( $child_modules as $module ) {
if ( ! empty( $module->slug ) ) {
$shortcodes[] = $module->slug;
}
}
}
return implode( '|', $shortcodes );
}
static function get_child_slugs( $post_type ) {
$child_slugs = array();
$child_modules = self::get_parent_modules( $post_type );
if ( ! empty( $child_modules ) ) {
foreach( $child_modules as $module ) {
if ( ! empty( $module->child_slug ) ) {
$child_slugs[ $module->slug ] = $module->child_slug;
}
}
}
return $child_slugs;
}
static function get_raw_content_shortcodes( $post_type ) {
$shortcodes = array();
$parent_modules = self::get_parent_modules( $post_type );
if ( ! empty( $parent_modules ) ) {
foreach( $parent_modules as $module ) {
if ( isset( $module->use_row_content ) && $module->use_row_content ) {
$shortcodes[] = $module->slug;
}
}
}
$child_modules = self::get_child_modules( $post_type );
if ( ! empty( $child_modules ) ) {
foreach( $child_modules as $module ) {
if ( isset( $module->use_row_content ) && $module->use_row_content ) {
$shortcodes[] = $module->slug;
}
}
}
return implode( '|', $shortcodes );
}
static function get_modules_templates( $post_type, $slugs_array ) {
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
$all_modules = array_merge( $parent_modules, $child_modules );
$templates_array = array();
if ( empty( $slugs_array ) ) {
return;
}
foreach ( $slugs_array as $slug ) {
if ( ! isset( $all_modules[ $slug ] ) ) {
return '';
}
$module = $all_modules[ $slug ];
$templates_array[] = array(
'slug' => $slug,
'template' => $module->build_microtemplate(),
);
}
if ( ET_BUILDER_OPTIMIZE_TEMPLATES ) {
$templates_array = array(
'templates' => $templates_array,
'unique' => self::$_unique_bb_keys_values,
);
}
return $templates_array;
}
static function output_templates( $post_type = '', $start_from = 0, $amount = 999 ) {
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
$all_modules = array_merge( $parent_modules, $child_modules );
$modules_names = array_keys( $all_modules );
$output = array();
$output['templates'] = array();
if ( ! empty( $all_modules ) ) {
for ( $i = 0; $i < ET_BUILDER_AJAX_TEMPLATES_AMOUNT; $i++ ) {
if ( isset( $modules_names[ $i ] ) ) {
$module = $all_modules[ $modules_names[ $i ] ];
$output['templates'][ $module->slug ] = self::optimize_bb_chunk( $module->build_microtemplate() );
} else {
break;
}
}
}
if ( ET_BUILDER_OPTIMIZE_TEMPLATES ) {
$output['unique'] = self::$_unique_bb_keys_values;
}
return $output;
}
static function get_structure_module_slugs() {
if ( ! empty( self::$structure_module_slugs ) ) {
return self::$structure_module_slugs;
}
$structure_modules = self::get_structure_modules();
self::$structure_module_slugs = array();
foreach( $structure_modules as $structural_module ) {
self::$structure_module_slugs[] = $structural_module->slug;
}
return self::$structure_module_slugs;
}
static function get_structure_modules() {
if ( ! empty( self::$structure_modules ) ) {
return self::$structure_modules;
}
$parent_modules = self::get_parent_modules( 'et_pb_layout' );
self::$structure_modules = array();
foreach ( $parent_modules as $parent_module ) {
if ( isset( $parent_module->is_structure_element ) && $parent_module->is_structure_element ) {
self::$structure_modules[] = $parent_module;
}
}
return self::$structure_modules;
}
static function get_parent_modules( $post_type = '' ) {
if ( ! empty( $post_type ) ) {
$parent_modules = ! empty( self::$parent_modules[ $post_type ] ) ? self::$parent_modules[ $post_type ] : array();
} else {
$parent_modules = self::$parent_modules;
}
return apply_filters( 'et_builder_get_parent_modules', $parent_modules, $post_type );
}
static function get_child_modules( $post_type = '' ) {
if ( ! empty( $post_type ) ) {
$child_modules = ! empty( self::$child_modules[ $post_type ] ) ? self::$child_modules[ $post_type ] : array();
} else {
$child_modules = self::$child_modules;
}
return apply_filters( 'et_builder_get_child_modules', $child_modules, $post_type );
}
static function get_fields_defaults( $post_type = '', $mode = 'all' ) {
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
switch ( $mode ) {
case 'parent':
$_modules = $parent_modules;
break;
case 'child':
$_modules = $child_modules;
break;
default:
$_modules = array_merge( $parent_modules, $child_modules );
break;
}
$module_fields_defaults = array();
foreach( $_modules as $_module_slug => $_module ) {
// skip modules without fb support
if ( ! $_module->fb_support ) {
continue;
}
$module_fields_defaults[ $_module_slug ] = isset( $_module->fields_defaults ) ? $_module->fields_defaults : array();
$module_fields_defaults[ $_module_slug ]['defaultProps'] = array();
$child_items_default_fields = array( 'advanced_setting_title_text', 'child_title_fallback_var', 'child_title_var' );
foreach( $child_items_default_fields as $single_field ) {
if ( isset( $_module->$single_field ) ) {
$module_fields_defaults[ $_module_slug ]['defaultProps'][ $single_field ] = $_module->$single_field ;
}
}
}
return $module_fields_defaults;
}
static function get_featured_image_background_modules( $post_type = '' ) {
$parent_modules = self::get_parent_modules( $post_type );
$featured_image_background_modules = array();
foreach ( $parent_modules as $slug => $parent_module ) {
if ( $parent_module->featured_image_background ) {
$featured_image_background_modules[] = $slug;
}
}
return apply_filters( 'et_pb_featured_image_background_modules', $featured_image_background_modules );
}
static function get_defaults( $post_type = '', $mode = 'all' ) {
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
switch ( $mode ) {
case 'parent':
$_modules = $parent_modules;
break;
case 'child':
$_modules = $child_modules;
break;
default:
$_modules = array_merge( $parent_modules, $child_modules );
break;
}
$module_defaults = array();
foreach( $_modules as $_module_slug => $_module ) {
// skip modules without fb support
if ( ! $_module->fb_support ) {
continue;
}
$module_defaults[ $_module_slug ] = isset( $_module->defaults ) ? $_module->defaults : array();
}
return $module_defaults;
}
static function get_toggles( $post_type ) {
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
$toggles_array = array();
$_modules = array_merge( $parent_modules, $child_modules );
foreach( $_modules as $_module_slug => $_module ) {
// skip modules without fb support
if ( ! $_module->fb_support ) {
continue;
}
$toggles_array[ $_module_slug ] = isset( $_module->options_toggles ) ? $_module->options_toggles : array();
foreach( array( 'general', 'advanced', 'custom_css' ) as $tab ) {
// sort toggles by priority
if ( isset( $toggles_array[ $_module_slug ][ $tab ]['toggles'] ) ) {
$toggles_array[ $_module_slug ][ $tab ]['toggles'] = self::et_pb_order_toggles_by_priority( $toggles_array[ $_module_slug ][ $tab ]['toggles'] );
}
}
}
return $toggles_array;
}
static function get_all_fields( $post_type = '' ) {
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
$_modules = array_merge( $parent_modules, $child_modules );
$module_fields = array();
foreach( $_modules as $_module_slug => $_module ) {
// skip modules without fb support
if ( ! $_module->fb_support ) {
continue;
}
$dependables = array();
$_module->force_unwhitelisted_fields = true;
$_module->set_fields();
$_module->_add_additional_fields();
$_module->_add_custom_css_fields();
$_module->_maybe_add_defaults();
foreach ( $_module->fields_unprocessed as $field_key => $field ) {
// do not add the fields with 'skip' type. These fields used for rendering shortcode on Front End only
if ( isset( $field['type'] ) && 'skip' === $field['type'] ) {
continue;
}
$field['name'] = $field_key;
$module_fields[ $_module_slug ][ $field_key ] = $field;
}
}
return $module_fields;
}
static function get_general_fields( $post_type = '', $mode = 'all', $module_type = 'all' ) {
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
switch ( $mode ) {
case 'parent':
$_modules = $parent_modules;
break;
case 'child':
$_modules = $child_modules;
break;
default:
$_modules = array_merge( $parent_modules, $child_modules );
break;
}
$module_fields = array();
foreach( $_modules as $_module_slug => $_module ) {
// skip modules without fb support
if ( ! $_module->fb_support ) {
continue;
}
// filter modules by slug if needed
if ( 'all' !== $module_type && $module_type !== $_module_slug ) {
continue;
}
$dependables = array();
foreach ( $_module->fields_unprocessed as $field_key => $field ) {
if ( isset( $field['affects'] ) ) {
$dependables[ $field_key ] = $field['affects'];
}
if ( isset( $field['tab_slug'] ) && 'general' !== $field['tab_slug'] ) {
continue;
}
$field['name'] = $field_key;
$module_fields[ $_module_slug ][ $field_key ] = $field;
}
if ( ! empty( $dependables ) ) {
foreach ( $dependables as $dependable_field => $affects ) {
foreach ( $affects as $affect ) {
// Avoid pushing depends_to attributte to non-existent module field data
if ( ! isset( $module_fields[ $_module_slug ][ $affect ] ) ) {
continue;
}
$module_fields[ $_module_slug ][ $affect ]['depends_to'][] = $dependable_field;
}
}
}
}
if ( 'all' !== $module_type ) {
return $module_fields[ $module_type ];
}
return $module_fields;
}
static function get_advanced_fields( $post_type = '', $mode = 'all', $module_type = 'all' ) {
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
switch ( $mode ) {
case 'parent':
$_modules = $parent_modules;
break;
case 'child':
$_modules = $child_modules;
break;
default:
$_modules = array_merge( $parent_modules, $child_modules );
break;
}
$module_fields = array();
foreach( $_modules as $_module_slug => $_module ) {
// filter modules by slug if needed
if ( 'all' !== $module_type && $module_type !== $_module_slug ) {
continue;
}
$dependables = array();
foreach ( $_module->fields_unprocessed as $field_key => $field ) {
// do not add the fields with 'skip' type. These fields used for rendering shortcode on Front End only
if ( isset( $field['type'] ) && 'skip' === $field['type'] ) {
continue;
}
if ( isset( $field['affects'] ) ) {
$dependables[ $field_key ] = $field['affects'];
}
if ( ! isset( $field['tab_slug'] ) || 'advanced' !== $field['tab_slug'] ) {
continue;
}
if ( isset( $field['default'] ) ) {
$module_fields[ $_module_slug ]['advanced_defaults'][ $field_key ] = $field['default'];
}
$field['name'] = $field_key;
$module_fields[ $_module_slug ][ $field_key ] = $field;
}
if ( ! empty( $dependables ) ) {
foreach ( $dependables as $dependable_field => $affects ) {
foreach ( $affects as $affect ) {
if ( isset( $module_fields[ $_module_slug ][ $affect ] ) ) {
$module_fields[ $_module_slug ][ $affect ]['depends_to'][] = $dependable_field;
}
}
}
}
if ( ! empty( $_module->advanced_options ) ) {
$module_fields[ $_module_slug ]['advanced_common'] = $_module->advanced_options;
if ( isset( $_module->advanced_options['border']['border_styles'] ) ) {
$module_fields[ $_module_slug ]['border_styles'] = array_merge( $module_fields[ $_module_slug ]['border_styles'], $_module->advanced_options['border']['border_styles'] );
}
if ( isset( $_module->advanced_options['border']['border_radii'] ) ) {
$module_fileds[ $_module_slug ]['border_radii'] = array_merge( $module_fields[ $_module_slug ]['border_radii'], $_module->advanced_options['border']['border_radii'] );
}
}
}
if ( 'all' !== $module_type ) {
return $module_fields[ $module_type ];
}
return $module_fields;
}
static function get_custom_css_fields( $post_type = '', $mode = 'all', $module_type = 'all' ) {
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
switch ( $mode ) {
case 'parent':
$_modules = $parent_modules;
break;
case 'child':
$_modules = $child_modules;
break;
default:
$_modules = array_merge( $parent_modules, $child_modules );
break;
}
$module_fields = array();
$custom_css_unwanted_types = array( 'custom_css', 'column_settings_css', 'column_settings_css_fields', 'column_settings_custom_css' );
foreach( $_modules as $_module_slug => $_module ) {
// filter modules by slug if needed
if ( 'all' !== $module_type && $module_type !== $_module_slug ) {
continue;
}
$dependables = array();
$module_fields[ $_module_slug ] = $_module->custom_css_options;
// Automatically added module ID and module class fields to setting modal's CSS tab
if ( ! empty( $_module->fields_unprocessed ) ) {
foreach ( $_module->fields_unprocessed as $field_unprocessed_key => $field_unprocessed ) {
if ( isset( $field_unprocessed['tab_slug'] ) && 'custom_css' === $field_unprocessed['tab_slug'] &&
isset( $field_unprocessed['type'] ) && ! in_array( $field_unprocessed['type'], $custom_css_unwanted_types ) ) {
$module_fields[ $_module_slug ][ $field_unprocessed_key ] = $field_unprocessed;
if ( isset( $field_unprocessed['affects'] ) ) {
$dependables[ $field_unprocessed_key ] = $field_unprocessed['affects'];
}
}
}
if ( ! empty( $dependables ) ) {
foreach ( $dependables as $dependable_field => $affects ) {
foreach ( $affects as $affect ) {
if ( isset( $module_fields[ $_module_slug ][ $affect ] ) ) {
$module_fields[ $_module_slug ][ $affect ]['depends_to'][] = $dependable_field;
}
}
}
}
}
}
if ( 'all' !== $module_type ) {
return $module_fields[ $module_type ];
}
return $module_fields;
}
static function get_module_fields( $post_type, $module ) {
$_modules = array_merge( self::get_parent_modules( $post_type ), self::get_child_modules( $post_type ) );
if ( ! empty( $_modules[ $module ] ) ) {
return $_modules[ $module ]->fields_unprocessed;
}
return false;
}
static function get_parent_module_fields( $post_type, $module ) {
if ( ! empty( self::$parent_modules[ $post_type ][ $module ] ) ) {
return self::$parent_modules[ $post_type ][ $module ]->get_fields();
}
return false;
}
static function get_child_module_fields( $post_type, $module ) {
if ( ! empty( self::$child_modules[ $post_type ][ $module ] ) ) {
return self::$child_modules[ $post_type ][ $module ]->get_fields();
}
return false;
}
static function get_parent_module_field( $post_type, $module, $field ) {
$fields = self::get_parent_module_fields( $post_type, $module );
if ( ! empty( $fields[ $field ] ) ) {
return $fields[ $field ];
}
return false;
}
static function get_font_icon_fields( $post_type = '' ) {
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
$_modules = array_merge( $parent_modules, $child_modules );
$module_fields = array();
foreach ( $_modules as $module_name => $module ) {
foreach ($module->fields_unprocessed as $module_field_name => $module_field) {
if ( isset( $module_field['renderer'] ) && 'et_pb_get_font_icon_list' === $module_field['renderer'] ) {
$module_fields[ $module_name ][ $module_field_name ] = true;
}
}
}
return $module_fields;
}
static function get_media_quries( $for_js=false ) {
$media_queries = array(
'min_width_1405' => '@media only screen and ( min-width: 1405px )',
'1100_1405' => '@media only screen and ( min-width: 1100px ) and ( max-width: 1405px)',
'981_1405' => '@media only screen and ( min-width: 981px ) and ( max-width: 1405px)',
'981_1100' => '@media only screen and ( min-width: 981px ) and ( max-width: 1100px )',
'min_width_981' => '@media only screen and ( min-width: 981px )',
'max_width_980' => '@media only screen and ( max-width: 980px )',
'768_980' => '@media only screen and ( min-width: 768px ) and ( max-width: 980px )',
'max_width_767' => '@media only screen and ( max-width: 767px )',
'max_width_479' => '@media only screen and ( max-width: 479px )',
);
$media_queries['mobile'] = $media_queries['max_width_767'];
$media_queries = apply_filters( 'et_builder_media_queries', $media_queries );
if ( 'for_js' === $for_js ) {
$processed_queries = array();
foreach ( $media_queries as $key => $value ) {
$processed_queries[] = array( $key, $value );
}
} else {
$processed_queries = $media_queries;
}
return $processed_queries;
}
static function set_media_queries() {
self::$media_queries = self::get_media_quries();
}
static function get_media_query( $name ) {
if ( ! isset( self::$media_queries[ $name ] ) ) {
return false;
}
return self::$media_queries[ $name ];
}
static function get_style( $internal = false ) {
// use appropriate array depending on which styles we need
$styles_array = $internal ? self::$internal_modules_styles : self::$styles;
if ( empty( $styles_array ) ) {
return '';
}
global $et_user_fonts_queue;
$output = '';
if ( ! empty( $et_user_fonts_queue ) ) {
$output .= et_builder_enqueue_user_fonts( $et_user_fonts_queue );
}
$styles_by_media_queries = $styles_array;
$styles_count = (int) count( $styles_by_media_queries );
$media_queries_order = array_merge( array( 'general' ), array_values( self::$media_queries ) );
// make sure styles in the array ordered by media query correctly from bigger to smaller screensize
$styles_by_media_queries_sorted = array_merge( array_flip( $media_queries_order ), $styles_by_media_queries );
foreach ( $styles_by_media_queries_sorted as $media_query => $styles ) {
// skip wrong values which were added during the array sorting
if ( ! is_array( $styles ) ) {
continue;
}
$media_query_output = '';
$wrap_into_media_query = 'general' !== $media_query;
// sort styles by priority
uasort( $styles, array( 'self', 'compare_by_priority' ) );
// get each rule in a media query
foreach ( $styles as $selector => $settings ) {
$media_query_output .= sprintf(
'%3$s%4$s%1$s { %2$s }',
$selector,
$settings['declaration'],
"\n",
( $wrap_into_media_query ? "\t" : '' )
);
}
// All css rules that don't use media queries are assigned to the "general" key.
// Wrap all non-general settings into media query.
if ( $wrap_into_media_query ) {
$media_query_output = sprintf(
'%3$s%3$s%1$s {%2$s%3$s}',
$media_query,
$media_query_output,
"\n"
);
}
$output .= $media_query_output;
}
return $output;
}
static function get_column_video_background( $args = array(), $conditional_tags = array(), $current_page = array() ) {
if ( empty( $args ) ) {
return false;
}
$formatted_args = array();
foreach ( $args as $key => $value) {
$key_length = strlen( $key );
$formatted_args[ substr( $key, 0, ( $key_length - 2 ) ) ] = $value;
}
return self::get_video_background( $formatted_args, $conditional_tags, $current_page );
}
static function get_video_background( $args = array(), $conditional_tags = array(), $current_page = array() ) {
$base_name = isset( $args['computed_variables'] ) && isset( $args['computed_variables']['base_name'] ) ? $args['computed_variables']['base_name'] : 'background';
$defaults = array(
"{$base_name}_video_mp4" => '',
"{$base_name}_video_webm" => '',
"{$base_name}_video_width" => '',
"{$base_name}_video_height" => '',
);
$args = wp_parse_args( $args, $defaults );
if ( '' === $args["{$base_name}_video_mp4"] && '' === $args["{$base_name}_video_webm"] ) {
return false;
}
return do_shortcode( sprintf( '
',
( '' !== $args["{$base_name}_video_mp4"] ? sprintf( '', esc_url( $args["{$base_name}_video_mp4"] ) ) : '' ),
( '' !== $args["{$base_name}_video_webm"] ? sprintf( '', esc_url( $args["{$base_name}_video_webm"] ) ) : '' ),
( '' !== $args["{$base_name}_video_width"] ? sprintf( ' width="%s"', esc_attr( intval( $args["{$base_name}_video_width"] ) ) ) : '' ),
( '' !== $args["{$base_name}_video_height"] ? sprintf( ' height="%s"', esc_attr( intval( $args["{$base_name}_video_height"] ) ) ) : '' )
) );
}
static function clean_internal_modules_styles( $need_internal_styles = true ) {
// clean the styles array
self::$internal_modules_styles = array();
// set the flag to make sure new styles will be saved to the correct place
self::$prepare_internal_styles = $need_internal_styles;
// generate unique number to make sure module classes will be unique if shortcode is generated via ajax
self::$internal_modules_counter = rand( 10000, 99999 );
}
/**
* Set the field dependencies based on the `show_if` or `show_if_not` key from the
* field.
* @param string $slug The module's slug. ie `et_pb_section`
* @param string $field_id The field id. id `background_color`
* @param array $field_info Associative array of the field's data.
*/
protected static function set_field_dependencies( $slug, $field_id, $field_info ) {
// bail if the field_info is not an array.
if ( ! is_array( $field_info ) ) {
return;
}
// otherwise we keep going.
foreach ( array( 'show_if', 'show_if_not' ) as $dependency_type ) {
if ( ! isset( $field_info[ $dependency_type ] ) ) {
continue;
}
if ( ! self::$data_utils->is_assoc_array( $field_info[ $dependency_type ] ) ) {
continue;
}
foreach ( $field_info[ $dependency_type ] as $dependency => $value ) {
// dependency -> dependent (eg. et_pb_signup.provider.affects.first_name_field.show_if: mailchimp)
$address = array( $slug, $dependency, 'affects', $field_id, $dependency_type );
self::$data_utils->array_set( self::$field_dependencies, $address, $value );
// dependent -> dependency (eg. et_pb_signup.first_name_field.show_if.provider: mailchimp)
$address = array( $slug, $field_id, $dependency_type, $dependency );
self::$data_utils->array_set( self::$field_dependencies, $address, $value );
}
}
}
public static function get_field_dependencies( $post_type ) {
if ( self::$field_dependencies ) {
return self::$field_dependencies;
}
$parent_modules = self::get_parent_modules( $post_type );
$child_modules = self::get_child_modules( $post_type );
$all_modules = array_merge( $parent_modules, $child_modules );
foreach ( $all_modules as $module_slug => $module ) {
// Get all the fields.
$all_fields = $module->sort_fields( $module->_get_fields() );
foreach ( $all_fields as $field_id => $field_info ) {
if ( isset( $field_info['type'] ) && 'composite' === $field_info['type'] ) {
foreach ( $field_info['composite_structure'] as $field ) {
foreach ( $field['controls'] as $control => $data ) {
self::set_field_dependencies( $module_slug, $control, $data );
}
}
}
self::set_field_dependencies( $module_slug, $field_id, $field_info );
}
}
return self::$field_dependencies;
}
static function set_style( $function_name, $style ) {
$declaration = rtrim($style['declaration']);
if ( empty($declaration) ) {
// Do not add empty declarations
return;
}
$builder_post_types = et_builder_get_builder_post_types();
$allowed_post_types = apply_filters( 'et_builder_set_style_allowed_post_types', $builder_post_types );
if ( $builder_post_types != $allowed_post_types ) {
$matches = array_intersect( $allowed_post_types, array_keys( self::$_module_slugs_by_post_type ) );
$allowed = false;
foreach ( $matches as $post_type ) {
if ( ! isset( self::$_module_slugs_by_post_type[ $post_type ] ) ) {
continue;
}
if ( in_array( $function_name, self::$_module_slugs_by_post_type[ $post_type ] ) ) {
$allowed = true;
break;
}
}
if ( ! $allowed ) {
return;
}
}
global $et_pb_rendering_column_content;
// do not process all the styles if FB enabled. Only those for modules without fb support and styles for the internal modules from Blog/Slider
if ( et_fb_is_enabled() && ! in_array( $function_name, self::get_fb_unsupported_modules() ) && ! $et_pb_rendering_column_content ) {
return;
}
$order_class_name = self::get_module_order_class( $function_name );
$selector = str_replace( '%%order_class%%', ".{$order_class_name}", $style['selector'] );
$selector = str_replace( '%order_class%', ".{$order_class_name}", $selector );
if ( false !== strpos( $selector, '%%parent_class%%' ) ) {
$parent_class = str_replace( '_item', '', $function_name );
$selector = str_replace( '%%parent_class%%', ".{$parent_class}", $selector );
}
$selector = apply_filters( 'et_pb_set_style_selector', $selector, $function_name );
// Prepend .et_divi_builder class before all CSS rules in the Divi Builder plugin
if ( et_is_builder_plugin_active() ) {
$selector = ".et_divi_builder #et_builder_outer_content $selector";
// add the prefix for all the selectors in a string.
$selector = str_replace( ',', ',.et_divi_builder #et_builder_outer_content ', $selector );
}
// New lines are saved as || in CSS Custom settings, remove them
$declaration = preg_replace( '/(\|\|)/i', '', $declaration );
$media_query = isset( $style[ 'media_query' ] ) ? $style[ 'media_query' ] : 'general';
// prepare styles for internal content. Used in Blog/Slider modules if they contain Divi modules
if ( $et_pb_rendering_column_content && self::$prepare_internal_styles ) {
if ( isset( self::$internal_modules_styles[ $media_query ][ $selector ]['declaration'] ) ) {
self::$internal_modules_styles[ $media_query ][ $selector ]['declaration'] = sprintf(
'%1$s %2$s',
self::$internal_modules_styles[ $media_query ][ $selector ]['declaration'],
$declaration
);
} else {
self::$internal_modules_styles[ $media_query ][ $selector ]['declaration'] = $declaration;
}
if ( isset( $style['priority'] ) ) {
self::$internal_modules_styles[ $media_query ][ $selector ]['priority'] = (int) $style['priority'];
}
} else {
if ( isset( self::$styles[ $media_query ][ $selector ]['declaration'] ) ) {
self::$styles[ $media_query ][ $selector ]['declaration'] = sprintf(
'%1$s %2$s',
self::$styles[ $media_query ][ $selector ]['declaration'],
$declaration
);
} else {
self::$styles[ $media_query ][ $selector ]['declaration'] = $declaration;
}
if ( isset( $style['priority'] ) ) {
self::$styles[ $media_query ][ $selector ]['priority'] = (int) $style['priority'];
}
}
}
static function get_module_order_class( $function_name ) {
global $et_pb_rendering_column_content;
// determine whether we need to get the internal module class or regular
$get_inner_module_class = $et_pb_rendering_column_content;
if ( $get_inner_module_class ) {
if ( ! isset( self::$inner_modules_order[ $function_name ] ) ) {
return false;
}
} else {
if ( ! isset( self::$modules_order[ $function_name ] ) ) {
return false;
}
}
$shortcode_order_num = $get_inner_module_class ? self::$inner_modules_order[ $function_name ] : self::$modules_order[ $function_name ];
$order_class_name = sprintf( '%1$s_%2$s', $function_name, $shortcode_order_num );
return $order_class_name;
}
static function set_order_class( $function_name ) {
global $et_pb_rendering_column_content;
// determine whether we need to update the internal module class or regular
$process_inner_module_class = $et_pb_rendering_column_content;
if ( $process_inner_module_class ) {
if ( ! isset( self::$inner_modules_order ) ) {
self::$inner_modules_order = array();
}
self::$inner_modules_order[ $function_name ] = isset( self::$inner_modules_order[ $function_name ] ) ? (int) self::$inner_modules_order[ $function_name ] + 1 : self::$internal_modules_counter;
} else {
if ( ! isset( self::$modules_order ) ) {
self::$modules_order = array();
}
self::$modules_order[ $function_name ] = isset( self::$modules_order[ $function_name ] ) ? (int) self::$modules_order[ $function_name ] + 1 : 0;
}
}
static function add_module_order_class( $module_class, $function_name ) {
$order_class_name = self::get_module_order_class( $function_name );
return "{$module_class} {$order_class_name}";
}
function video_background( $args = array(), $base_name = 'background' ) {
$attr_prefix = "{$base_name}_";
$custom_prefix = 'background' === $base_name ? '' : "{$base_name}_";
if ( ! empty( $args ) ) {
$background_video = self::get_video_background( $args );
$pause_outside_viewport = isset( $args[ "{$attr_prefix}video_pause_outside_viewport" ] ) ? $args[ "{$attr_prefix}video_pause_outside_viewport" ] : '';
$allow_player_pause = isset( $args[ "{$custom_prefix}allow_player_pause" ] ) ? $args[ "{$custom_prefix}allow_player_pause" ] : 'off';
} else {
$background_video = self::get_video_background( array(
"{$attr_prefix}video_mp4" => isset( $this->shortcode_atts["{$attr_prefix}video_mp4"] ) ? $this->shortcode_atts["{$attr_prefix}video_mp4"] : '',
"{$attr_prefix}video_webm" => isset( $this->shortcode_atts["{$attr_prefix}video_webm"] ) ? $this->shortcode_atts["{$attr_prefix}video_webm"] : '',
"{$attr_prefix}video_width" => isset( $this->shortcode_atts["{$attr_prefix}video_width"] ) ? $this->shortcode_atts["{$attr_prefix}video_width"] : '',
"{$attr_prefix}video_height" => isset( $this->shortcode_atts["{$attr_prefix}video_height"] ) ? $this->shortcode_atts["{$attr_prefix}video_height"] : '',
'computed_variables' => array(
'base_name' => $base_name,
),
) );
$pause_outside_viewport = isset( $this->shortcode_atts["{$attr_prefix}video_pause_outside_viewport"] ) ? $this->shortcode_atts["{$attr_prefix}video_pause_outside_viewport"] : '';
$allow_player_pause = isset( $this->shortcode_atts["{$custom_prefix}allow_player_pause"] ) ? $this->shortcode_atts["{$custom_prefix}allow_player_pause"] : 'off';
}
$video_background = '';
if ( $background_video ) {
$video_background = sprintf(
'
%1$s
',
$background_video,
( 'on' === $allow_player_pause ? ' et_pb_allow_player_pause' : '' ),
( 'off' === $pause_outside_viewport ? ' et_pb_video_play_outside_viewport' : '' )
);
wp_enqueue_style( 'wp-mediaelement' );
wp_enqueue_script( 'wp-mediaelement' );
}
return $video_background;
}
function get_parallax_image_background( $base_name = 'background' ) {
$attr_prefix = "{$base_name}_";
$custom_prefix = 'background' === $base_name ? '' : "{$base_name}_";
$background_image = $this->shortcode_atts["{$attr_prefix}image"];
$parallax = $this->shortcode_atts["{$custom_prefix}parallax"];
$parallax_method = $this->shortcode_atts["{$custom_prefix}parallax_method"];
$parallax_background = '';
if ( $this->featured_image_background ) {
$featured_image = isset( $this->shortcode_atts['featured_image'] ) ? $this->shortcode_atts['featured_image'] : '';
$featured_placement = isset( $this->shortcode_atts['featured_placement'] ) ? $this->shortcode_atts['featured_placement'] : '';
$featured_image_src_obj = wp_get_attachment_image_src( get_post_thumbnail_id( get_the_ID() ), 'full' );
$featured_image_src = isset( $featured_image_src_obj[0] ) ? $featured_image_src_obj[0] : '';
if ( 'on' === $featured_image && 'background' === $featured_placement && '' !== $featured_image_src ) {
$background_image = $featured_image_src;
}
}
if ( '' !== $background_image && 'on' == $parallax ) {
$parallax_classname = array( 'et_parallax_bg' );
if ( 'off' === $parallax_method ) {
$parallax_classname[] = 'et_pb_parallax_css';
}
$parallax_background = sprintf(
'',
esc_attr( implode( ' ', $parallax_classname ) ),
esc_url( $background_image )
);
}
return $parallax_background;
}
/**
* Generate CSS Filters
* Check our shortcode arguments for CSS `filter` properties. If found, set the style rules for this block. (This
* function reads options set by the 'Filters' and 'Image Filters' builder menu fields.)
*
* @param string $function_name Builder module's function name (keeps the CSS rules straight)
* @param string $prefix Optional string prepended to the field name (i.e., `filter_saturate` -> `child_filter_saturate`)
* @param mixed $selectors Array or string containing all target DOM element(s), ID(s), and/or class(es)
*
* @return string Any additional CSS classes (added if filters were applied).
*/
function generate_css_filters( $function_name = '', $prefix = '', $selectors = array('%%order_class%%') ) {
if ( '' === $function_name ) {
ET_Core_Logger::error( '$function_name is required.' );
return;
}
// If `$selectors` is a string, convert to an array before we continue
$selectors_prepared = $selectors;
if ( ! is_array( $selectors ) ) {
$selectors_prepared = explode( ',', et_intentionally_unescaped( $selectors, 'fixed_string' ) );
}
$additional_classes = '';
// If we don't have a target selector, get out now
if ( ! $selectors_prepared ) {
return $additional_classes;
}
// Blend Mode
$mix_blend_mode = self::$data_utils->array_get( $this->shortcode_atts, "{$prefix}mix_blend_mode", '' );
// Filters
$filter = array(
'hue_rotate' => self::$data_utils->array_get( $this->shortcode_atts, "{$prefix}filter_hue_rotate", ''),
'saturate' => self::$data_utils->array_get( $this->shortcode_atts, "{$prefix}filter_saturate", ''),
'brightness' => self::$data_utils->array_get( $this->shortcode_atts, "{$prefix}filter_brightness", ''),
'contrast' => self::$data_utils->array_get( $this->shortcode_atts, "{$prefix}filter_contrast", ''),
'invert' => self::$data_utils->array_get( $this->shortcode_atts, "{$prefix}filter_invert", ''),
'sepia' => self::$data_utils->array_get( $this->shortcode_atts, "{$prefix}filter_sepia", ''),
'opacity' => self::$data_utils->array_get( $this->shortcode_atts, "{$prefix}filter_opacity", ''),
'blur' => self::$data_utils->array_get( $this->shortcode_atts, "{$prefix}filter_blur", ''),
);
// Remove any filters with null or default values
$filter = array_filter( $filter, 'strlen' );
// Optional: CSS `mix-blend-mode` rule
$mix_blend_mode_default = ET_Global_Settings::get_value( 'all_mix_blend_mode', 'default' );
if ( $mix_blend_mode && $mix_blend_mode !== $mix_blend_mode_default ) {
foreach ( $selectors_prepared as $selector ) {
ET_Builder_Element::set_style( $function_name, array(
'selector' => $selector,
'declaration' => sprintf(
'mix-blend-mode: %1$s;',
esc_html( $mix_blend_mode )
),
) );
}
$additional_classes .= ' et_pb_css_mix_blend_mode';
} else if ( 'et_pb_column' === $function_name ) {
// Columns need to pass through
$additional_classes .= ' et_pb_css_mix_blend_mode_passthrough';
}
// Optional: CSS `filter` rule
if ( empty( $filter ) ) {
return $additional_classes;
}
$css_value = '';
$css_value_fb_hover = '';
foreach ( $filter as $label => $value ) {
// Check against our default settings, and only append the rule if it differs
if ( ET_Global_Settings::get_value( 'all_filter_' . $label, 'default' ) === $value ) {
continue;
}
$value = et_sanitize_input_unit( $value, false, 'deg' );
$label_css_format = str_replace( '_', '-', $label );
// Construct string of all CSS Filter values
$css_value .= esc_html( " ${label_css_format}(${value})" );
// Construct Visual Builder hover rules
if ( ! in_array( $label, array( 'opacity', 'blur' ) ) ) {
// Skip those, because they mess with VB controls
$css_value_fb_hover .= esc_html( " ${label_css_format}(${value})" );
}
}
// Append our new CSS rules
if ( trim( $css_value ) ) {
foreach ( $selectors_prepared as $selector ) {
ET_Builder_Element::set_style( $function_name, array(
'selector' => $selector,
'declaration' => sprintf(
'filter: %1$s;',
$css_value
),
) );
}
$additional_classes .= ' et_pb_css_filters';
}
// If we have VB hover-friendly CSS rules, we'll gather those and append them here
if ( trim( $css_value_fb_hover ) ) {
foreach ( $selectors_prepared as $selector ) {
$selector_hover = str_replace(
'%%order_class%%',
'html:not(.et_fb_edit_enabled) #et-fb-app %%order_class%%:hover',
$selector
);
ET_Builder_Element::set_style( $function_name, array(
'selector' => $selector_hover,
'declaration' => sprintf(
'filter: %1$s;',
$css_value_fb_hover
),
) );
}
$additional_classes .= ' et_pb_css_filters_hover';
}
return $additional_classes;
}
/**
* Convert smart quotes and & entity to their applicable characters
*
* @param string $text Input text
*
* @return string
*/
static function convert_smart_quotes_and_amp( $text ) {
$smart_quotes = array(
'“',
'”',
'″',
'‘',
'’',
''',
'&',
);
$replacements = array(
'"',
'"',
'"',
''',
''',
''',
'&',
);
if ( 'fr_FR' === get_locale() ) {
$french_smart_quotes = array(
' »',
'″>',
);
$french_replacements = array(
'"',
'">',
);
$smart_quotes = array_merge( $smart_quotes, $french_smart_quotes );
$replacements = array_merge( $replacements, $french_replacements );
}
$text = str_replace( $smart_quotes, $replacements, $text );
return $text;
}
public function process_multiple_checkboxes_field_value( $value_map, $value ) {
$result = array();
$index = 0;
foreach ( explode( '|', $value ) as $checkbox_value ) {
if ( 'on' === $checkbox_value ) {
$result[] = $value_map[ $index ];
}
$index++;
}
return implode( '|', $result );
}
}
do_action( 'et_pagebuilder_module_init' );
class ET_Builder_Module extends ET_Builder_Element {}
class ET_Builder_Structure_Element extends ET_Builder_Element {
public $is_structure_element = true;
function wrap_settings_option( $option_output, $field ) {
$field_type = ! empty( $field['type'] ) ? $field['type'] : '';
switch( $field_type ) {
case 'column_settings_background' :
$output = $this->generate_columns_settings_background();
break;
case 'column_settings_padding' :
$output = $this->generate_columns_settings_padding();
break;
case 'column_settings_css_fields' :
$output = $this->generate_columns_settings_css_fields();
break;
case 'column_settings_css' :
$output = $this->generate_columns_settings_css();
break;
default:
$depends = false;
if ( isset( $field['depends_show_if'] ) || isset( $field['depends_show_if_not'] ) ) {
$depends = true;
if ( isset( $field['depends_show_if_not'] ) ) {
$depends_show_if_not = is_array( $field['depends_show_if_not'] ) ? implode( ',', $field['depends_show_if_not'] ) : $field['depends_show_if_not'];
$depends_attr = sprintf( ' data-depends_show_if_not="%s"', esc_attr( $depends_show_if_not ) );
} else {
$depends_attr = sprintf( ' data-depends_show_if="%s"', esc_attr( $field['depends_show_if'] ) );
}
}
// Overriding background color's attribute, turning it into appropriate background attributes
if ( isset( $field['type'] ) && isset( $field['name' ] ) && in_array( $field['name'], array( 'background_color' ) ) ) {
$field['type'] = 'background';
// Appending background class
if ( isset( $field['option_class'] ) ) {
$field['option_class'] .= ' et-pb-option--background';
} else {
$field['option_class'] = 'et-pb-option--background';
}
// Removing depends default variable which hides background color for unified background field UI
$depends = false;
if ( isset( $field['depends_default'] ) ) {
unset( $field['depends_default'] );
}
}
$output = sprintf(
'%6$s%5$s
%7$s',
( ! empty( $field['type'] ) && 'tiny_mce' == $field['type'] ? ' et-pb-option-main-content' : '' ),
( ( $depends || isset( $field['depends_default'] ) ) ? ' et-pb-depends' : '' ),
( ! empty( $field['type'] ) && 'hidden' == $field['type'] ? ' et_pb_hidden' : '' ),
( $depends ? $depends_attr : '' ),
"\n\t\t\t\t" . $option_output . "\n\t\t\t",
"\t",
"\n\n\t\t",
( ! empty( $field['type'] ) && 'hidden' == $field['type'] ? esc_attr( sprintf( ' et-pb-option-%1$s', $field['name'] ) ) : '' ),
( ! empty( $field['option_class'] ) ? ' ' . $field['option_class'] : '' ),
isset( $field['specialty_only'] ) && 'yes' === $field['specialty_only'] ? ' et-pb-specialty-only-option' : '',
isset( $field['type'] ) ? esc_attr( $field['type'] ) : ''
);
break;
}
return self::get_unique_bb_key( $output );
}
function generate_column_vars_css() {
$output = '';
for ( $i = 1; $i < 5; $i++ ) {
$output .= sprintf(
'case %1$s :
current_module_id_value = typeof et_pb_module_id_%1$s !== \'undefined\' ? et_pb_module_id_%1$s : \'\',
current_module_class_value = typeof et_pb_module_class_%1$s !== \'undefined\' ? et_pb_module_class_%1$s : \'\',
current_custom_css_before_value = typeof et_pb_custom_css_before_%1$s !== \'undefined\' ? et_pb_custom_css_before_%1$s : \'\',
current_custom_css_main_value = typeof et_pb_custom_css_main_%1$s !== \'undefined\' ? et_pb_custom_css_main_%1$s : \'\',
current_custom_css_after_value = typeof et_pb_custom_css_after_%1$s !== \'undefined\' ? et_pb_custom_css_after_%1$s : \'\';
break; ',
esc_attr( $i )
);
}
return $output;
}
function generate_column_vars_bg() {
$output = '';
for ( $i = 1; $i < 5; $i++ ) {
$output .= sprintf(
'case %1$s :
current_value_bg = typeof et_pb_background_color_%1$s !== \'undefined\' ? et_pb_background_color_%1$s : \'\',
current_value_bg_img = typeof et_pb_bg_img_%1$s !== \'undefined\' ? et_pb_bg_img_%1$s : \'\';
current_background_size_cover = typeof et_pb_background_size_%1$s !== \'undefined\' && et_pb_background_size_%1$s === \'cover\' ? \' selected="selected"\' : \'\';
current_background_size_contain = typeof et_pb_background_size_%1$s !== \'undefined\' && et_pb_background_size_%1$s === \'contain\' ? \' selected="selected"\' : \'\';
current_background_size_initial = typeof et_pb_background_size_%1$s !== \'undefined\' && et_pb_background_size_%1$s === \'initial\' ? \' selected="selected"\' : \'\';
current_background_position_topleft = typeof et_pb_background_position_%1$s !== \'undefined\' && et_pb_background_position_%1$s === \'top_left\' ? \' selected="selected"\' : \'\';
current_background_position_topcenter = typeof et_pb_background_position_%1$s !== \'undefined\' && et_pb_background_position_%1$s === \'top_center\' ? \' selected="selected"\' : \'\';
current_background_position_topright = typeof et_pb_background_position_%1$s !== \'undefined\' && et_pb_background_position_%1$s === \'top_right\' ? \' selected="selected"\' : \'\';
current_background_position_centerleft = typeof et_pb_background_position_%1$s !== \'undefined\' && et_pb_background_position_%1$s === \'center_left\' ? \' selected="selected"\' : \'\';
current_background_position_center = typeof et_pb_background_position_%1$s === \'undefined\' || et_pb_background_position_%1$s === \'center\' ? \' selected="selected"\' : \'\';
current_background_position_centerright = typeof et_pb_background_position_%1$s !== \'undefined\' && et_pb_background_position_%1$s === \'center_right\' ? \' selected="selected"\' : \'\';
current_background_position_bottomleft = typeof et_pb_background_position_%1$s !== \'undefined\' && et_pb_background_position_%1$s === \'bottom_left\' ? \' selected="selected"\' : \'\';
current_background_position_bottomcenter = typeof et_pb_background_position_%1$s !== \'undefined\' && et_pb_background_position_%1$s === \'bottom_center\' ? \' selected="selected"\' : \'\';
current_background_position_bottomright = typeof et_pb_background_position_%1$s !== \'undefined\' && et_pb_background_position_%1$s === \'bottom_right\' ? \' selected="selected"\' : \'\';
current_background_repeat_repeat = typeof et_pb_background_repeat_%1$s === \'undefined\' || et_pb_background_repeat_%1$s === \'repeat\' ? \' selected="selected"\' : \'\';
current_background_repeat_repeatx = typeof et_pb_background_repeat_%1$s !== \'undefined\' && et_pb_background_repeat_%1$s === \'repeat-x\' ? \' selected="selected"\' : \'\';
current_background_repeat_repeaty = typeof et_pb_background_repeat_%1$s !== \'undefined\' && et_pb_background_repeat_%1$s === \'repeat-y\' ? \' selected="selected"\' : \'\';
current_background_repeat_space = typeof et_pb_background_repeat_%1$s !== \'undefined\' && et_pb_background_repeat_%1$s === \'space\' ? \' selected="selected"\' : \'\';
current_background_repeat_round = typeof et_pb_background_repeat_%1$s !== \'undefined\' && et_pb_background_repeat_%1$s === \'round\' ? \' selected="selected"\' : \'\';
current_background_repeat_norepeat = typeof et_pb_background_repeat_%1$s !== \'undefined\' && et_pb_background_repeat_%1$s === \'no-repeat\' ? \' selected="selected"\' : \'\';
current_background_blend_normal = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'normal\' ? \' selected="selected"\' : \'\';
current_background_blend_multiply = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'multiply\' ? \' selected="selected"\' : \'\';
current_background_blend_screen = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'screen\' ? \' selected="selected"\' : \'\';
current_background_blend_overlay = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'overlay\' ? \' selected="selected"\' : \'\';
current_background_blend_darken = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'darken\' ? \' selected="selected"\' : \'\';
current_background_blend_lighten = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'lighten\' ? \' selected="selected"\' : \'\';
current_background_blend_colordodge = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'color-dodge\' ? \' selected="selected"\' : \'\';
current_background_blend_colorburn = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'color-burn\' ? \' selected="selected"\' : \'\';
current_background_blend_hardlight = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'hard-light\' ? \' selected="selected"\' : \'\';
current_background_blend_softlight = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'soft-light\' ? \' selected="selected"\' : \'\';
current_background_blend_difference = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'difference\' ? \' selected="selected"\' : \'\';
current_background_blend_exclusion = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'hue\' ? \' selected="selected"\' : \'\';
current_background_blend_hue = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'saturation\' ? \' selected="selected"\' : \'\';
current_background_blend_saturation = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'color\' ? \' selected="selected"\' : \'\';
current_background_blend_color = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'normal\' ? \' selected="selected"\' : \'\';
current_background_blend_luminosity = typeof et_pb_background_blend_%1$s !== \'undefined\' && et_pb_background_blend_%1$s === \'luminosity\' ? \' selected="selected"\' : \'\';
current_use_background_color_gradient = typeof et_pb_use_background_color_gradient_%1$s !== \'undefined\' && \'on\' === et_pb_use_background_color_gradient_%1$s ? \' selected="selected"\' : \'\';
current_background_color_gradient_start = typeof et_pb_background_color_gradient_start_%1$s !== \'undefined\' ? et_pb_background_color_gradient_start_%1$s : \'%2$s\';
current_background_color_gradient_end = typeof et_pb_background_color_gradient_end_%1$s !== \'undefined\' ? et_pb_background_color_gradient_end_%1$s : \'%3$s\';
current_background_color_gradient_type = typeof et_pb_background_color_gradient_type_%1$s !== \'undefined\' && \'radial\' === et_pb_background_color_gradient_type_%1$s ? \' selected="selected"\' : \'\';
current_background_color_gradient_direction = typeof et_pb_background_color_gradient_direction_%1$s !== \'undefined\' ? et_pb_background_color_gradient_direction_%1$s : \'%4$s\';
current_background_color_gradient_direction_radial_center = typeof et_pb_background_color_gradient_direction_radial_%1$s !== \'undefined\' && \'center\' === et_pb_background_color_gradient_direction_radial_%1$s ? \' selected="selected"\' : \'\';
current_background_color_gradient_direction_radial_top_left = typeof et_pb_background_color_gradient_direction_radial_%1$s !== \'undefined\' && \'top left\' === et_pb_background_color_gradient_direction_radial_%1$s ? \' selected="selected"\' : \'\';
current_background_color_gradient_direction_radial_top = typeof et_pb_background_color_gradient_direction_radial_%1$s !== \'undefined\' && \'top\' === et_pb_background_color_gradient_direction_radial_%1$s ? \' selected="selected"\' : \'\';
current_background_color_gradient_direction_radial_top_right = typeof et_pb_background_color_gradient_direction_radial_%1$s !== \'undefined\' && \'top right\' === et_pb_background_color_gradient_direction_radial_%1$s ? \' selected="selected"\' : \'\';
current_background_color_gradient_direction_radial_right = typeof et_pb_background_color_gradient_direction_radial_%1$s !== \'undefined\' && \'right\' === et_pb_background_color_gradient_direction_radial_%1$s ? \' selected="selected"\' : \'\';
current_background_color_gradient_direction_radial_bottom_right = typeof et_pb_background_color_gradient_direction_radial_%1$s !== \'undefined\' && \'bottom right\' === et_pb_background_color_gradient_direction_radial_%1$s ? \' selected="selected"\' : \'\';
current_background_color_gradient_direction_radial_bottom = typeof et_pb_background_color_gradient_direction_radial_%1$s !== \'undefined\' && \'bottom\' === et_pb_background_color_gradient_direction_radial_%1$s ? \' selected="selected"\' : \'\';
current_background_color_gradient_direction_radial_bottom_left = typeof et_pb_background_color_gradient_direction_radial_%1$s !== \'undefined\' && \'bottom left\' === et_pb_background_color_gradient_direction_radial_%1$s ? \' selected="selected"\' : \'\';
current_background_color_gradient_direction_radial_left = typeof et_pb_background_color_gradient_direction_radial_%1$s !== \'undefined\' && \'left\' === et_pb_background_color_gradient_direction_radial_%1$s ? \' selected="selected"\' : \'\';
current_background_color_gradient_start_position = typeof et_pb_background_color_gradient_start_position_%1$s !== \'undefined\' ? et_pb_background_color_gradient_start_position_%1$s : \'%5$s\';
current_background_color_gradient_end_position = typeof et_pb_background_color_gradient_end_position_%1$s !== \'undefined\' ? et_pb_background_color_gradient_end_position_%1$s : \'%6$s\';
current_background_color_gradient_overlays_image = typeof et_pb_background_color_gradient_overlays_image_%1$s !== \'undefined\' && \'on\' === et_pb_background_color_gradient_overlays_image_%1$s ? \' selected="selected"\' : \'\';
current_background_video_mp4 = typeof et_pb_background_video_mp4_%1$s !== \'undefined\' ? et_pb_background_video_mp4_%1$s : \'\';
current_background_video_webm = typeof et_pb_background_video_webm_%1$s !== \'undefined\' ? et_pb_background_video_webm_%1$s : \'\';
current_background_video_width = typeof et_pb_background_video_width_%1$s !== \'undefined\' ? et_pb_background_video_width_%1$s : \'\';
current_background_video_height = typeof et_pb_background_video_height_%1$s !== \'undefined\' ? et_pb_background_video_height_%1$s : \'\';
current_allow_played_pause = typeof et_pb_allow_player_pause_%1$s !== \'undefined\' && \'on\' === et_pb_allow_player_pause_%1$s ? \' selected="selected"\' : \'\';
current_background_video_pause_outside_viewport = typeof et_pb_background_video_pause_outside_viewport_%1$s !== \'undefined\' && \'off\' === et_pb_background_video_pause_outside_viewport_%1$s ? \' selected="selected"\' : \'\';
current_value_parallax = typeof et_pb_parallax_%1$s !== \'undefined\' && \'on\' === et_pb_parallax_%1$s ? \' selected="selected"\' : \'\';
current_value_parallax_method = typeof et_pb_parallax_method_%1$s !== \'undefined\' && \'on\' !== et_pb_parallax_method_%1$s ? \' selected="selected"\' : \'\';
break; ',
esc_attr( $i ),
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_start' ) ),
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_end' ) ),
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_direction' ) ),
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_start_position' ) ), // #5
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_end_position' ) )
);
}
return $output;
}
function generate_column_vars_padding() {
$output = '';
for ( $i = 1; $i < 5; $i++ ) {
$output .= sprintf(
'case %1$s :
current_value_pt = typeof et_pb_padding_top_%1$s !== \'undefined\' ? et_pb_padding_top_%1$s : \'\',
current_value_pr = typeof et_pb_padding_right_%1$s !== \'undefined\' ? et_pb_padding_right_%1$s : \'\',
current_value_pb = typeof et_pb_padding_bottom_%1$s !== \'undefined\' ? et_pb_padding_bottom_%1$s : \'\',
current_value_pl = typeof et_pb_padding_left_%1$s !== \'undefined\' ? et_pb_padding_left_%1$s : \'\',
current_value_padding_tablet = typeof et_pb_padding_%1$s_tablet !== \'undefined\' ? et_pb_padding_%1$s_tablet : \'\',
current_value_padding_phone = typeof et_pb_padding_%1$s_phone !== \'undefined\' ? et_pb_padding_%1$s_phone : \'\',
last_edited_padding_field = typeof et_pb_padding_%1$s_last_edited !== \'undefined\' ? et_pb_padding_%1$s_last_edited : \'\',
has_tablet_padding = typeof et_pb_padding_%1$s_tablet !== \'undefined\' ? \'yes\' : \'no\',
has_phone_padding = typeof et_pb_padding_%1$s_phone !== \'undefined\' ? \'yes\' : \'no\';
break; ',
esc_attr( $i )
);
}
return $output;
}
function generate_columns_settings_background() {
$output = sprintf(
'<%% var columns = typeof columns_layout !== \'undefined\' ? columns_layout.split(",") : [],
counter = 1;
_.each( columns, function ( column_type ) {
var current_value_bg,
current_value_bg_img,
current_value_parallax,
current_value_parallax_method,
current_background_size_cover,
current_background_size_contain,
current_background_size_initial,
current_background_position_topleft,
current_background_position_topcenter,
current_background_position_topright,
current_background_position_centerleft,
current_background_position_center,
current_background_position_centerright,
current_background_position_bottomleft,
current_background_position_bottomcenter,
current_background_position_bottomright,
current_background_repeat_repeat,
current_background_repeat_repeatx,
current_background_repeat_repeaty,
current_background_repeat_space,
current_background_repeat_round,
current_background_repeat_norepeat,
current_background_blend_normal,
current_background_blend_multiply,
current_background_blend_screen,
current_background_blend_overlay,
current_background_blend_darken,
current_background_blend_lighten,
current_background_blend_colordodge,
current_background_blend_colorburn,
current_background_blend_hardlight,
current_background_blend_softlight,
current_background_blend_difference,
current_background_blend_exclusion,
current_background_blend_hue,
current_background_blend_saturation,
current_background_blend_color,
current_background_blend_luminosity,
current_use_background_color_gradient,
current_background_color_gradient_start,
current_background_color_gradient_end,
current_background_color_gradient_type,
current_background_color_gradient_direction,
current_background_color_gradient_direction_radial_center,
current_background_color_gradient_direction_radial_top_left,
current_background_color_gradient_direction_radial_top,
current_background_color_gradient_direction_radial_top_right,
current_background_color_gradient_direction_radial_right,
current_background_color_gradient_direction_radial_bottom_right,
current_background_color_gradient_direction_radial_bottom,
current_background_color_gradient_direction_radial_bottom_left,
current_background_color_gradient_direction_radial_left,
current_background_color_gradient_start_position,
current_background_color_gradient_end_position,
current_background_color_gradient_overlays_image,
current_background_video_mp4,
current_background_video_webm,
current_background_video_width,
current_background_video_height,
current_allow_played_pause,
current_background_video_pause_outside_viewport;
switch ( counter ) {
%1$s
}
%%>',
$this->generate_column_vars_bg()
);
$tab_navs = sprintf(
'',
esc_html__( 'Color', 'et_builder' ),
esc_html__( 'Gradient', 'et_builder' ),
esc_html__( 'Image', 'et_builder' ),
esc_html__( 'Video', 'et_builder' ),
$this->get_icon( 'background-color' ),
$this->get_icon( 'background-gradient' ),
$this->get_icon( 'background-image' ),
$this->get_icon( 'background-video' )
);
$tab_color = sprintf(
'',
esc_html__( 'Background Color', 'et_builder' ),
$this->get_icon( 'add' ),
$this->get_icon( 'setting' ),
$this->get_icon( 'delete' ),
esc_html__( 'Hex Value', 'et_builder' )
);
$tab_gradient = sprintf(
'
',
$this->get_icon( 'add' ),
$this->get_icon( 'swap' ),
$this->get_icon( 'delete' ),
esc_html__( 'Background Gradient', 'et_builder' ),
esc_html__( 'On', 'et_builder' ), // #5
esc_html__( 'Off', 'et_builder' ),
esc_html__( 'Gradient Start', 'et_builder' ),
esc_html__( 'Hex Value', 'et_builder' ),
esc_html__( 'Gradient End', 'et_builder' ),
esc_html__( 'Gradient Type', 'et_builder' ), // #10
esc_html__( 'Linear', 'et_builder' ),
esc_html__( 'Radial', 'et_builder' ),
esc_html__( 'Gradient Direction', 'et_builder' ),
esc_html__( 'Radial Direction', 'et_builder' ),
esc_html__( 'Center', 'et_builder' ), // #15
esc_html__( 'Top Left', 'et_builder' ),
esc_html__( 'Top', 'et_builder' ),
esc_html__( 'Top Right', 'et_builder' ),
esc_html__( 'Right', 'et_builder' ),
esc_html__( 'Bottom Right', 'et_builder' ), // #20
esc_html__( 'Bottom', 'et_builder' ),
esc_html__( 'Bottom Left', 'et_builder' ),
esc_html__( 'Left', 'et_builder' ),
esc_html__( 'Start Position', 'et_builder' ),
esc_html__( 'End Position', 'et_builder' ), // #25
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_start' ) ),
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_end' ) ),
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_type' ) ),
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_direction' ) ),
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_direction_radial' ) ), // #30
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_start_position' ) ),
esc_attr( intval( ET_Global_Settings::get_value( 'all_background_gradient_start_position' ) ) ),
esc_attr( ET_Global_Settings::get_value( 'all_background_gradient_end_position' ) ),
esc_attr( intval( ET_Global_Settings::get_value( 'all_background_gradient_end_position' ) ) ),
esc_html__( 'Place Gradient Above Background Image', 'et_builder' ) // #35
);
$select_background_size = sprintf(
'',
esc_html__( 'Cover', 'et_builder' ),
esc_html__( 'Fit', 'et_builder' ),
esc_html__( 'Actual Size', 'et_builder' )
);
$select_background_position = sprintf(
'',
esc_html__( 'Top Left', 'et_builder' ),
esc_html__( 'Top Center', 'et_builder' ),
esc_html__( 'Top Right', 'et_builder' ),
esc_html__( 'Center Left', 'et_builder' ),
esc_html__( 'Center', 'et_builder' ),
esc_html__( 'Center Right', 'et_builder' ),
esc_html__( 'Bottom Left', 'et_builder' ),
esc_html__( 'Bottom Center', 'et_builder' ),
esc_html__( 'Bottom Right', 'et_builder' )
);
$select_background_repeat = sprintf(
'',
esc_html__( 'No Repeat', 'et_builder' ),
esc_html__( 'Repeat', 'et_builder' ),
esc_html__( 'Repeat X (horizontal)', 'et_builder' ),
esc_html__( 'Repeat Y (vertical)', 'et_builder' ),
esc_html__( 'Space', 'et_builder' ),
esc_html__( 'Round', 'et_builder' )
);
$select_background_blend = sprintf(
'',
esc_html__( 'Normal', 'et_builder' ),
esc_html__( 'Multiply', 'et_builder' ),
esc_html__( 'Screen', 'et_builder' ),
esc_html__( 'Overlay', 'et_builder' ),
esc_html__( 'Darken', 'et_builder' ),
esc_html__( 'Lighten', 'et_builder' ),
esc_html__( 'Color Dodge', 'et_builder' ),
esc_html__( 'Color Burn', 'et_builder' ),
esc_html__( 'Hard Light', 'et_builder' ),
esc_html__( 'Soft Light', 'et_builder' ),
esc_html__( 'Difference', 'et_builder' ),
esc_html__( 'Exclusion', 'et_builder' ),
esc_html__( 'Hue', 'et_builder' ),
esc_html__( 'Saturation', 'et_builder' ),
esc_html__( 'Color', 'et_builder' ),
esc_html__( 'Luminosity', 'et_builder' )
);
$tab_image = sprintf(
'',
esc_html__( 'Background Image', 'et_builder' ),
$this->get_icon( 'add' ),
$this->get_icon( 'setting' ),
$this->get_icon( 'delete' ),
esc_html__( 'Upload an image', 'et_builder' ), // #5
esc_html__( 'Choose a Background Image', 'et_builder' ),
esc_html__( 'Set As Background', 'et_builder' ),
esc_html__( 'Use Parallax Effect', 'et_builder' ),
esc_html__( 'On', 'et_builder' ),
esc_html__( 'Off', 'et_builder' ), // #10
esc_html__( 'Parallax Method', 'et_builder' ),
esc_html__( 'True Parallax', 'et_builder' ),
esc_html__( 'CSS', 'et_builder' ),
esc_html__( 'Background Image Size', 'et_builder' ),
$select_background_size, // #15
esc_html__( 'Background Image Position', 'et_builder' ),
$select_background_position,
esc_html__( 'Background Image Repeat', 'et_builder' ),
$select_background_repeat,
esc_html__( 'Background Image Blend', 'et_builder' ), // #20
$select_background_blend
);
$tab_video = sprintf(
'',
esc_html__( 'Background Video MP4', 'et_builder' ),
$this->get_icon( 'add' ),
$this->get_icon( 'setting' ),
$this->get_icon( 'delete' ),
esc_html__( 'Upload a video', 'et_builder' ), // #5
esc_html__( 'Choose a Background Video MP4 File', 'et_builder' ),
esc_html__( 'Set As Background Video', 'et_builder' ),
esc_html__( 'Background Video Webm', 'et_builder' ),
esc_html__( 'Choose a Background Video WEBM File', 'et_builder' ),
esc_html__( 'Background Video Width', 'et_builder' ), // #10
esc_html__( 'Background Video Height', 'et_builder' ),
esc_html__( 'Pause Video When Another Video Plays', 'et_builder' ),
esc_html__( 'On', 'et_builder' ),
esc_html__( 'Off', 'et_builder' ),
esc_html__( 'Pause Video While Not In View', 'et_builder' ) // #15
);
$output .= sprintf(
'
%3$s
%4$s
%5$s
%6$s
%7$s
<%% counter++;
}); %%>',
esc_html__( 'Column', 'et_builder' ),
esc_html__( 'Background', 'et_builder' ),
$tab_navs,
$tab_color,
$tab_gradient, // #5
$tab_image,
$tab_video
);
return $output;
}
function generate_columns_settings_padding() {
$output = sprintf(
'<%% var columns = typeof columns_layout !== \'undefined\' ? columns_layout.split(",") : [],
counter = 1;
_.each( columns, function ( column_type ) {
var current_value_pt,
current_value_pr,
current_value_pb,
current_value_pl,
current_value_padding_tablet,
current_value_padding_phone,
has_tablet_padding,
has_phone_padding;
switch ( counter ) {
%1$s
}
%%>',
$this->generate_column_vars_padding()
);
$output .= sprintf(
'
<%% counter++;
}); %%>',
esc_html__( 'Column', 'et_builder' ),
esc_html__( 'Padding', 'et_builder' ),
esc_html__( 'Top', 'et_builder' ),
esc_html__( 'Right', 'et_builder' ),
esc_html__( 'Bottom', 'et_builder' ), // #5
esc_html__( 'Left', 'et_builder' ),
et_pb_generate_mobile_options_tabs() // #7
);
return $output;
}
function generate_columns_settings_css() {
$output = sprintf(
'<%%
var columns_css = typeof columns_layout !== \'undefined\' ? columns_layout.split(",") : [],
counter_css = 1;
_.each( columns_css, function ( column_type ) {
var current_module_id_value,
current_module_class_value,
current_custom_css_before_value,
current_custom_css_main_value,
current_custom_css_after_value;
switch ( counter_css ) {
%1$s
} %%>
<%% counter_css++;
}); %%>',
$this->generate_column_vars_css(),
esc_html__( 'Column', 'et_builder' ),
esc_html__( 'Before', 'et_builder' ),
esc_html__( 'Main Element', 'et_builder' ),
esc_html__( 'After', 'et_builder' )
);
return $output;
}
function generate_columns_settings_css_fields() {
$output = sprintf(
'<%%
var columns_css = typeof columns_layout !== \'undefined\' ? columns_layout.split(",") : [],
counter_css = 1;
_.each( columns_css, function ( column_type ) {
var current_module_id_value,
current_module_class_value;
switch ( counter_css ) {
%1$s
} %%>
<%% counter_css++;
}); %%>',
$this->generate_column_vars_css(),
esc_html__( 'Column', 'et_builder' ),
esc_html__( 'CSS ID', 'et_builder' ),
esc_html__( 'CSS Class', 'et_builder' )
);
return $output;
}
}