<?php

[0] Fix | Delete

[1] Fix | Delete

if ( ! defined( 'ABSPATH' ) ) {

[2] Fix | Delete

die( 'Direct access forbidden.' );

[3] Fix | Delete

}

[4] Fix | Delete

[5] Fix | Delete

[6] Fix | Delete

/**

[7] Fix | Delete

* Background helper methods.

[8] Fix | Delete

* This is abstraction of `ET_Builder_Element->process_advanced_background_options()` method which is

[9] Fix | Delete

* intended for module that needs to extend module background mechanism with few modification

[10] Fix | Delete

* (eg. post slider which needs to apply module background on individual slide that has featured

[11] Fix | Delete

* image).

[12] Fix | Delete

*

[13] Fix | Delete

* @since 4.3.3

[14] Fix | Delete

*

[15] Fix | Delete

* @todo Use `ET_Builder_Module_Helper_Background->get_background_style()` for `ET_Builder_Element->process_advanced_background_options()`

[16] Fix | Delete

*

[17] Fix | Delete

* Class ET_Builder_Module_Helper_Background

[18] Fix | Delete

*/

[19] Fix | Delete

class ET_Builder_Module_Helper_Background {

[20] Fix | Delete

public static function instance() {

[21] Fix | Delete

static $instance;

[22] Fix | Delete

[23] Fix | Delete

return $instance ? $instance : $instance = new self();

[24] Fix | Delete

}

[25] Fix | Delete

[26] Fix | Delete

/**

[27] Fix | Delete

* Get gradient properties based on given props

[28] Fix | Delete

*

[29] Fix | Delete

* @since 4.3.3

[30] Fix | Delete

*

[31] Fix | Delete

* @param array $props Module's props

[32] Fix | Delete

* @param string $base_prop_name Background base prop name

[33] Fix | Delete

* @param string $suffix Background base prop name's suffix

[34] Fix | Delete

*

[35] Fix | Delete

* @return array

[36] Fix | Delete

*/

[37] Fix | Delete

function get_gradient_properties( $props, $base_prop_name, $suffix ) {

[38] Fix | Delete

return array(

[39] Fix | Delete

'type' => et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_color_gradient_type{$suffix}", '', true ),

[40] Fix | Delete

'direction' => et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_color_gradient_direction{$suffix}", '', true ),

[41] Fix | Delete

'radial_direction' => et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_color_gradient_direction_radial{$suffix}", '', true ),

[42] Fix | Delete

'color_start' => et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_color_gradient_start{$suffix}", '', true ),

[43] Fix | Delete

'color_end' => et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_color_gradient_end{$suffix}", '', true ),

[44] Fix | Delete

'start_position' => et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_color_gradient_start_position{$suffix}", '', true ),

[45] Fix | Delete

'end_position' => et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_color_gradient_end_position{$suffix}", '', true ),

[46] Fix | Delete

);

[47] Fix | Delete

}

[48] Fix | Delete

[49] Fix | Delete

/**

[50] Fix | Delete

* Get gradient properties for hover mode

[51] Fix | Delete

*

[52] Fix | Delete

* @since 4.3.3

[53] Fix | Delete

*

[54] Fix | Delete

* @param array $props Module's props

[55] Fix | Delete

* @param string $base_prop_name Background base prop name

[56] Fix | Delete

* @param array $gradient_properties_desktop {

[57] Fix | Delete

* @type string $type

[58] Fix | Delete

* @type string $direction

[59] Fix | Delete

* @type string $radial_direction

[60] Fix | Delete

* @type string $color_start

[61] Fix | Delete

* @type string $color_end

[62] Fix | Delete

* @type string $start_position

[63] Fix | Delete

* @type string $end_position

[64] Fix | Delete

* }

[65] Fix | Delete

*

[66] Fix | Delete

* @return array

[67] Fix | Delete

*/

[68] Fix | Delete

function get_gradient_hover_properties( $props, $base_prop_name, $gradient_properties_desktop = array() ) {

[69] Fix | Delete

// Desktop value as default.

[70] Fix | Delete

$gradient_type_desktop = et_()->array_get( $gradient_properties_desktop, 'type', '' );

[71] Fix | Delete

$gradient_direction_desktop = et_()->array_get( $gradient_properties_desktop, 'direction', '' );

[72] Fix | Delete

$gradient_radial_direction_desktop = et_()->array_get( $gradient_properties_desktop, 'radial_direction', '' );

[73] Fix | Delete

$gradient_color_start_desktop = et_()->array_get( $gradient_properties_desktop, 'color_start', '' );

[74] Fix | Delete

$gradient_color_end_desktop = et_()->array_get( $gradient_properties_desktop, 'color_end', '' );

[75] Fix | Delete

$gradient_start_position_desktop = et_()->array_get( $gradient_properties_desktop, 'start_position', '' );

[76] Fix | Delete

$gradient_end_position_desktop = et_()->array_get( $gradient_properties_desktop, 'end_position', '' );

[77] Fix | Delete

$gradient_overlays_image_desktop = et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_color_gradient_overlays_image", '', true );

[78] Fix | Delete

[79] Fix | Delete

// Hover value.

[80] Fix | Delete

$gradient_type_hover = et_pb_hover_options()->get_raw_value( "{$base_prop_name}_color_gradient_type", $props, $gradient_type_desktop );

[81] Fix | Delete

$gradient_direction_hover = et_pb_hover_options()->get_raw_value( "{$base_prop_name}_color_gradient_direction", $props, $gradient_direction_desktop );

[82] Fix | Delete

$gradient_direction_radial_hover = et_pb_hover_options()->get_raw_value( "{$base_prop_name}_color_gradient_direction_radial", $props, $gradient_radial_direction_desktop );

[83] Fix | Delete

$gradient_start_hover = et_pb_hover_options()->get_raw_value( "{$base_prop_name}_color_gradient_start", $props, $gradient_color_start_desktop );

[84] Fix | Delete

$gradient_end_hover = et_pb_hover_options()->get_raw_value( "{$base_prop_name}_color_gradient_end", $props, $gradient_color_end_desktop );

[85] Fix | Delete

$gradient_start_position_hover = et_pb_hover_options()->get_raw_value( "{$base_prop_name}_color_gradient_start_position", $props, $gradient_start_position_desktop );

[86] Fix | Delete

$gradient_end_position_hover = et_pb_hover_options()->get_raw_value( "{$base_prop_name}_color_gradient_end_position", $props, $gradient_end_position_desktop );

[87] Fix | Delete

$gradient_overlays_image_hover = et_pb_hover_options()->get_raw_value( "{$base_prop_name}_color_gradient_overlays_image", $props, $gradient_overlays_image_desktop );

[88] Fix | Delete

[89] Fix | Delete

return array(

[90] Fix | Delete

'type' => '' !== $gradient_type_hover ? $gradient_type_hover : $gradient_type_desktop,

[91] Fix | Delete

'direction' => '' !== $gradient_direction_hover ? $gradient_direction_hover : $gradient_direction_desktop,

[92] Fix | Delete

'radial_direction' => '' !== $gradient_direction_radial_hover ? $gradient_direction_radial_hover : $gradient_radial_direction_desktop,

[93] Fix | Delete

'color_start' => '' !== $gradient_start_hover ? $gradient_start_hover : $gradient_color_start_desktop,

[94] Fix | Delete

'color_end' => '' !== $gradient_end_hover ? $gradient_end_hover : $gradient_color_end_desktop,

[95] Fix | Delete

'start_position' => '' !== $gradient_start_position_hover ? $gradient_start_position_hover : $gradient_start_position_desktop,

[96] Fix | Delete

'end_position' => '' !== $gradient_end_position_hover ? $gradient_end_position_hover : $gradient_end_position_desktop,

[97] Fix | Delete

);

[98] Fix | Delete

}

[99] Fix | Delete

[100] Fix | Delete

/**

[101] Fix | Delete

* Get background gradient style based on properties given

[102] Fix | Delete

*

[103] Fix | Delete

* @since 4.3.3

[104] Fix | Delete

*

[105] Fix | Delete

* @param array $args {

[106] Fix | Delete

* @type string $type

[107] Fix | Delete

* @type string $direction

[108] Fix | Delete

* @type string $radial_direction

[109] Fix | Delete

* @type string $color_start

[110] Fix | Delete

* @type string $color_end

[111] Fix | Delete

* @type string $start_position

[112] Fix | Delete

* @type string $end_position

[113] Fix | Delete

* }

[114] Fix | Delete

*

[115] Fix | Delete

* @return string

[116] Fix | Delete

*/

[117] Fix | Delete

function get_gradient_style( $args ) {

[118] Fix | Delete

$defaults = apply_filters( 'et_pb_default_gradient', array(

[119] Fix | Delete

'type' => ET_Global_Settings::get_value( 'all_background_gradient_type' ),

[120] Fix | Delete

'direction' => ET_Global_Settings::get_value( 'all_background_gradient_direction' ),

[121] Fix | Delete

'radial_direction' => ET_Global_Settings::get_value( 'all_background_gradient_direction_radial' ),

[122] Fix | Delete

'color_start' => ET_Global_Settings::get_value( 'all_background_gradient_start' ),

[123] Fix | Delete

'color_end' => ET_Global_Settings::get_value( 'all_background_gradient_end' ),

[124] Fix | Delete

'start_position' => ET_Global_Settings::get_value( 'all_background_gradient_start_position' ),

[125] Fix | Delete

'end_position' => ET_Global_Settings::get_value( 'all_background_gradient_end_position' ),

[126] Fix | Delete

) );

[127] Fix | Delete

[128] Fix | Delete

$args = wp_parse_args( array_filter( $args ), $defaults );

[129] Fix | Delete

$direction = 'linear' === $args['type'] ? $args['direction'] : "circle at {$args['radial_direction']}";

[130] Fix | Delete

$start_position = et_sanitize_input_unit( $args['start_position'], false, '%' );

[131] Fix | Delete

$end_Position = et_sanitize_input_unit( $args['end_position'], false, '%');

[132] Fix | Delete

[133] Fix | Delete

return esc_html( "{$args['type']}-gradient(

[134] Fix | Delete

{$direction},

[135] Fix | Delete

{$args['color_start']} ${start_position},

[136] Fix | Delete

{$args['color_end']} ${end_Position}

[137] Fix | Delete

)" );

[138] Fix | Delete

}

[139] Fix | Delete

[140] Fix | Delete

/**

[141] Fix | Delete

* Get individual background image style

[142] Fix | Delete

*

[143] Fix | Delete

* @since 4.3.3

[144] Fix | Delete

*

[145] Fix | Delete

* @param string $attr Background attribute name

[146] Fix | Delete

* @param string $base_prop_name Base background prop name

[147] Fix | Delete

* @param string $suffix Attribute name suffix

[148] Fix | Delete

* @param array $props Module props

[149] Fix | Delete

* @param array $fields_definition Module's fields definition

[150] Fix | Delete

* @param bool $is_prev_image_active Whether previous background image is active or not

[151] Fix | Delete

*

[152] Fix | Delete

* @return string

[153] Fix | Delete

*/

[154] Fix | Delete

function get_image_style( $attr, $base_prop_name, $suffix = '', $props = array(), $fields_definition = array(), $is_prev_image_active = true ) {

[155] Fix | Delete

// Get default style

[156] Fix | Delete

$default = et_()->array_get( $fields_definition, "{$base_prop_name}_{$attr}.default", '' );

[157] Fix | Delete

[158] Fix | Delete

// Get style

[159] Fix | Delete

$style = et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_{$attr}{$suffix}", $default, ! $is_prev_image_active );

[160] Fix | Delete

[161] Fix | Delete

return $style;

[162] Fix | Delete

}

[163] Fix | Delete

[164] Fix | Delete

/**

[165] Fix | Delete

* Get background UI option's style based on given props and prop name

[166] Fix | Delete

*

[167] Fix | Delete

* @since 4.3.3

[168] Fix | Delete

*

[169] Fix | Delete

* @todo Further simplify this method; Break it down into more encapsulated methods

[170] Fix | Delete

*

[171] Fix | Delete

* @param array $args {

[172] Fix | Delete

* @type string $base_prop_name

[173] Fix | Delete

* @type array $props

[174] Fix | Delete

* @type string $important

[175] Fix | Delete

* @type array $fields_Definition

[176] Fix | Delete

* @type string $selector

[177] Fix | Delete

* @type string $selector_hover

[178] Fix | Delete

* @type number $priority

[179] Fix | Delete

* @type string $function_name

[180] Fix | Delete

* @type bool $has_background_color_toggle

[181] Fix | Delete

* @type bool $use_background_color

[182] Fix | Delete

* @type bool $use_background_color_gradient

[183] Fix | Delete

* @type bool $use_background_image

[184] Fix | Delete

* @type bool $use_background_video

[185] Fix | Delete

* @type bool $use_background_color_reset

[186] Fix | Delete

* }

[187] Fix | Delete

*/

[188] Fix | Delete

function get_background_style( $args = array() ) {

[189] Fix | Delete

// Default settings

[190] Fix | Delete

$defaults = array(

[191] Fix | Delete

'base_prop_name' => 'background',

[192] Fix | Delete

'props' => array(),

[193] Fix | Delete

'important' => '',

[194] Fix | Delete

'fields_definition' => array(),

[195] Fix | Delete

'selector' => '',

[196] Fix | Delete

'selector_hover' => '',

[197] Fix | Delete

'priority' => '',

[198] Fix | Delete

'function_name' => '',

[199] Fix | Delete

'has_background_color_toggle' => false,

[200] Fix | Delete

'use_background_color' => true,

[201] Fix | Delete

'use_background_color_gradient' => true,

[202] Fix | Delete

'use_background_image' => true,

[203] Fix | Delete

'use_background_video' => true,

[204] Fix | Delete

'use_background_color_reset' => true,

[205] Fix | Delete

);

[206] Fix | Delete

[207] Fix | Delete

// Parse arguments

[208] Fix | Delete

$args = wp_parse_args( $args, $defaults );

[209] Fix | Delete

[210] Fix | Delete

// Break argument into variables

[211] Fix | Delete

$base_prop_name = $args['base_prop_name'];

[212] Fix | Delete

$props = $args['props'];

[213] Fix | Delete

$important = $args['important'];

[214] Fix | Delete

$fields_definition = $args['fields_definition'];

[215] Fix | Delete

$selector = $args['selector'];

[216] Fix | Delete

$selector_hover = $args['selector_hover'];

[217] Fix | Delete

$priority = $args['priority'];

[218] Fix | Delete

$function_name = $args['function_name'];

[219] Fix | Delete

[220] Fix | Delete

// Possible values for use_background_* variables are true, false, or 'fields_only'

[221] Fix | Delete

$has_color_toggle_options = $args['has_background_color_toggle'];

[222] Fix | Delete

$use_gradient_options = $args['use_background_color_gradient'];

[223] Fix | Delete

$use_image_options = $args['use_background_image'];

[224] Fix | Delete

$use_color_options = $args['use_background_color'];

[225] Fix | Delete

$use_color_reset_options = $args['use_background_color_reset'];

[226] Fix | Delete

[227] Fix | Delete

// Save processed background. These will be compared with the smaller device background

[228] Fix | Delete

// processed value to avoid rendering the same styles.

[229] Fix | Delete

$processed_color = '';

[230] Fix | Delete

$processed_image = '';

[231] Fix | Delete

$gradient_properties_desktop = array();

[232] Fix | Delete

$processed_image_blend = '';

[233] Fix | Delete

$gradient_overlays_image_desktop = 'off';

[234] Fix | Delete

[235] Fix | Delete

// Store background images status because the process is extensive.

[236] Fix | Delete

$image_status = array(

[237] Fix | Delete

'desktop' => false,

[238] Fix | Delete

'tablet' => false,

[239] Fix | Delete

'phone' => false,

[240] Fix | Delete

);

[241] Fix | Delete

[242] Fix | Delete

// Background Desktop, Tablet, and Phone.

[243] Fix | Delete

foreach ( et_pb_responsive_options()->get_modes() as $device ) {

[244] Fix | Delete

$is_desktop = 'desktop' === $device;

[245] Fix | Delete

$suffix = ! $is_desktop ? "_{$device}" : '';

[246] Fix | Delete

$style = '';

[247] Fix | Delete

[248] Fix | Delete

// Conditionals

[249] Fix | Delete

$has_gradient = false;

[250] Fix | Delete

$has_image = false;

[251] Fix | Delete

$has_gradient_and_image = false;

[252] Fix | Delete

$is_gradient_disabled = false;

[253] Fix | Delete

$is_image_disabled = false;

[254] Fix | Delete

[255] Fix | Delete

// Ensure responsive settings is enabled on mobile.

[256] Fix | Delete

if ( ! $is_desktop && ! et_pb_responsive_options()->is_responsive_enabled( $props, $base_prop_name ) ) {

[257] Fix | Delete

continue;

[258] Fix | Delete

}

[259] Fix | Delete

[260] Fix | Delete

// Styles output

[261] Fix | Delete

$image_style = '';

[262] Fix | Delete

$color_style = '';

[263] Fix | Delete

$images = array();

[264] Fix | Delete

$gradient_overlays_image = 'off';

[265] Fix | Delete

[266] Fix | Delete

// A. Background Gradient.

[267] Fix | Delete

if ( $use_gradient_options && 'fields_only' !== $use_gradient_options ) {

[268] Fix | Delete

$use_gradient = et_pb_responsive_options()->get_inheritance_background_value( $props, "use_{$base_prop_name}_color_gradient", $device, $base_prop_name, $fields_definition );

[269] Fix | Delete

[270] Fix | Delete

// 1. Ensure gradient color is active.

[271] Fix | Delete

if ( 'on' === $use_gradient ) {

[272] Fix | Delete

$gradient_overlays_image = et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_color_gradient_overlays_image{$suffix}", '', true );

[273] Fix | Delete

$gradient_properties = $this->get_gradient_properties( $props, $base_prop_name, $suffix );

[274] Fix | Delete

[275] Fix | Delete

// Will be used as default of Gradient hover.

[276] Fix | Delete

if ( $is_desktop ) {

[277] Fix | Delete

$gradient_properties_desktop = $gradient_properties;

[278] Fix | Delete

$gradient_overlays_image_desktop = $gradient_overlays_image;

[279] Fix | Delete

}

[280] Fix | Delete

[281] Fix | Delete

// Save background gradient into background images list.

[282] Fix | Delete

$background_gradient = $this->get_gradient_style( $gradient_properties );

[283] Fix | Delete

$images[] = $background_gradient;

[284] Fix | Delete

[285] Fix | Delete

// Flag to inform Background Color if current module has Gradient.

[286] Fix | Delete

$has_gradient = true;

[287] Fix | Delete

} else if ( 'off' === $use_gradient ) {

[288] Fix | Delete

$is_gradient_disabled = true;

[289] Fix | Delete

}

[290] Fix | Delete

}

[291] Fix | Delete

[292] Fix | Delete

// B. Background Image.

[293] Fix | Delete

if ( $use_image_options && 'fields_only' !== $use_image_options ) {

[294] Fix | Delete

$image = et_pb_responsive_options()->get_inheritance_background_value( $props, "{$base_prop_name}_image", $device, $base_prop_name, $fields_definition );

[295] Fix | Delete

$parallax = et_pb_responsive_options()->get_any_value( $props, "parallax{$suffix}", 'off' );

[296] Fix | Delete

[297] Fix | Delete

// Background image and parallax status.

[298] Fix | Delete

$is_image_active = '' !== $image && 'on' !== $parallax;

[299] Fix | Delete

$image_status[ $device ] = $is_image_active;

[300] Fix | Delete

[301] Fix | Delete

// 1. Ensure image exists and parallax is off.

[302] Fix | Delete

if ( $is_image_active ) {

[303] Fix | Delete

// Flag to inform Background Color if current module has Image.

[304] Fix | Delete

$has_image = true;

[305] Fix | Delete

[306] Fix | Delete

// Check previous Background image status. Needed to get the correct value.

[307] Fix | Delete

$is_prev_image_active = true;

[308] Fix | Delete

[309] Fix | Delete

if ( ! $is_desktop ) {

[310] Fix | Delete

$is_prev_image_active = 'tablet' === $device ?

[311] Fix | Delete

$image_status['desktop'] :

[312] Fix | Delete

$image_status['tablet'];

[313] Fix | Delete

}

[314] Fix | Delete

[315] Fix | Delete

// Size.

[316] Fix | Delete

$image_size = $this->get_image_style( 'size', $base_prop_name, $suffix, $props, $fields_definition, $is_prev_image_active );

[317] Fix | Delete

[318] Fix | Delete

if ( '' !== $image_size ) {

[319] Fix | Delete

$style .= sprintf( 'background-size: %1$s; ', esc_html( $image_size ) );

[320] Fix | Delete

}

[321] Fix | Delete

[322] Fix | Delete

// Position.

[323] Fix | Delete

$image_position = $this->get_image_style( 'position', $base_prop_name, $suffix, $props, $fields_definition, $is_prev_image_active );

[324] Fix | Delete

[325] Fix | Delete

if ( '' !== $image_position ) {

[326] Fix | Delete

$style .= sprintf(

[327] Fix | Delete

'background-position: %1$s; ',

[328] Fix | Delete

esc_html( str_replace( '_', ' ', $image_position ) )

[329] Fix | Delete

);

[330] Fix | Delete

}

[331] Fix | Delete

[332] Fix | Delete

// Repeat.

[333] Fix | Delete

$image_repeat = $this->get_image_style( 'repeat', $base_prop_name, $suffix, $props, $fields_definition, $is_prev_image_active );

[334] Fix | Delete

[335] Fix | Delete

if ( '' !== $image_repeat ) {

[336] Fix | Delete

$style .= sprintf( 'background-repeat: %1$s; ', esc_html( $image_repeat ) );

[337] Fix | Delete

}

[338] Fix | Delete

[339] Fix | Delete

// Blend.

[340] Fix | Delete

$image_blend = $this->get_image_style( 'blend', $base_prop_name, $suffix, $props, $fields_definition, $is_prev_image_active );

[341] Fix | Delete

$image_blend_inherit = et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_blend{$suffix}", '', true );

[342] Fix | Delete

$image_blend_default = et_()->array_get( $fields_definition, "{$base_prop_name}_blend.default", '' );

[343] Fix | Delete

[344] Fix | Delete

if ( '' !== $image_blend_inherit ) {

[345] Fix | Delete

// Don't print the same image blend style.

[346] Fix | Delete

if ( '' !== $image_blend ) {

[347] Fix | Delete

$style .= sprintf( 'background-blend-mode: %1$s; ', esc_html( $image_blend ) );

[348] Fix | Delete

}

[349] Fix | Delete

[350] Fix | Delete

// Reset - If background has image and gradient, force background-color: initial.

[351] Fix | Delete

if ( $has_gradient && $has_image && $use_color_reset_options !== 'fields_only' && $image_blend_inherit !== $image_blend_default ) {

[352] Fix | Delete

$has_gradient_and_image = true;

[353] Fix | Delete

$color_style = 'initial';

[354] Fix | Delete

[355] Fix | Delete

$style .= sprintf( 'background-color: initial%1$s; ', esc_html( $important ) );

[356] Fix | Delete

}

[357] Fix | Delete

[358] Fix | Delete

$processed_image_blend = $image_blend;

[359] Fix | Delete

}

[360] Fix | Delete

[361] Fix | Delete

// Only append background image when the image is exist.

[362] Fix | Delete

$images[] = sprintf( 'url(%1$s)', esc_html( $image ) );

[363] Fix | Delete

} else if ( '' === $image ) {

[364] Fix | Delete

// Reset - If background image is disabled, ensure we reset prev background blend mode.

[365] Fix | Delete

if ( '' !== $processed_image_blend ) {

[366] Fix | Delete

$style .= 'background-blend-mode: normal; ';

[367] Fix | Delete

$processed_image_blend = '';

[368] Fix | Delete

}

[369] Fix | Delete

[370] Fix | Delete

$is_image_disabled = true;

[371] Fix | Delete

}

[372] Fix | Delete

}

[373] Fix | Delete

[374] Fix | Delete

if ( ! empty( $images ) ) {

[375] Fix | Delete

// The browsers stack the images in the opposite order to what you'd expect.

[376] Fix | Delete

if ( 'on' !== $gradient_overlays_image ) {

[377] Fix | Delete

$images = array_reverse( $images );

[378] Fix | Delete

}

[379] Fix | Delete

[380] Fix | Delete

// Set background image styles only it's different compared to the larger device.

[381] Fix | Delete

$image_style = join( ', ', $images );

[382] Fix | Delete

if ( $processed_image !== $image_style ) {

[383] Fix | Delete

$style .= sprintf(

[384] Fix | Delete

'background-image: %1$s%2$s;',

[385] Fix | Delete

esc_html( $image_style ),

[386] Fix | Delete

$important

[387] Fix | Delete

);

[388] Fix | Delete

}

[389] Fix | Delete

} else if ( ! $is_desktop && $is_gradient_disabled && $is_image_disabled ) {

[390] Fix | Delete

// Reset - If background image and gradient are disabled, reset current background image.

[391] Fix | Delete

$image_style = 'initial';

[392] Fix | Delete

[393] Fix | Delete

$style .= sprintf(

[394] Fix | Delete

'background-image: %1$s%2$s;',

[395] Fix | Delete

esc_html( $image_style ),

[396] Fix | Delete

$important

[397] Fix | Delete

);

[398] Fix | Delete

}

[399] Fix | Delete

[400] Fix | Delete

// Save processed background images.

[401] Fix | Delete

$processed_image = $image_style;

[402] Fix | Delete

[403] Fix | Delete

// C. Background Color.

[404] Fix | Delete

if ( $use_color_options && 'fields_only' !== $use_color_options ) {

[405] Fix | Delete

[406] Fix | Delete

$use_color_value = et_pb_responsive_options()->get_any_value( $props, "use_{$base_prop_name}_color{$suffix}", 'on', true );

[407] Fix | Delete

[408] Fix | Delete

if ( ! $has_gradient_and_image && 'off' !== $use_color_value ) {

[409] Fix | Delete

$color = et_pb_responsive_options()->get_inheritance_background_value( $props, "{$base_prop_name}_color", $device, $base_prop_name, $fields_definition );

[410] Fix | Delete

$color = ! $is_desktop && '' === $color ? 'initial' : $color;

[411] Fix | Delete

$color_style = $color;

[412] Fix | Delete

[413] Fix | Delete

if ( '' !== $color && $processed_color !== $color ) {

[414] Fix | Delete

$style .= sprintf(

[415] Fix | Delete

'background-color: %1$s%2$s; ',

[416] Fix | Delete

esc_html( $color ),

[417] Fix | Delete

esc_html( $important )

[418] Fix | Delete

);

[419] Fix | Delete

}

[420] Fix | Delete

} else if ( $has_color_toggle_options && 'off' === $use_color_value && ! $is_desktop ) {

[421] Fix | Delete

// Reset - If current module has background color toggle, it's off, and current mode

[422] Fix | Delete

// it's not desktop, we should reset the background color.

[423] Fix | Delete

$style .= sprintf(

[424] Fix | Delete

'background-color: initial %1$s; ',

[425] Fix | Delete

esc_html( $important )

[426] Fix | Delete

);

[427] Fix | Delete

}

[428] Fix | Delete

}

[429] Fix | Delete

[430] Fix | Delete

// Save processed background color.

[431] Fix | Delete

$processed_color = $color_style;

[432] Fix | Delete

[433] Fix | Delete

// Render background styles.

[434] Fix | Delete

if ( '' !== $style ) {

[435] Fix | Delete

// Add media query parameter.

[436] Fix | Delete

$background_args = array();

[437] Fix | Delete

if ( ! $is_desktop ) {

[438] Fix | Delete

$current_media_query = 'tablet' === $device ? 'max_width_980' : 'max_width_767';

[439] Fix | Delete

$background_args['media_query'] = ET_Builder_Element::get_media_query( $current_media_query );

[440] Fix | Delete

}

[441] Fix | Delete

[442] Fix | Delete

ET_Builder_Element::set_style(

[443] Fix | Delete

$function_name,

[444] Fix | Delete

wp_parse_args( $background_args, array(

[445] Fix | Delete

'selector' => $selector,

[446] Fix | Delete

'declaration' => rtrim( $style ),

[447] Fix | Delete

'priority' => $priority,

[448] Fix | Delete

) )

[449] Fix | Delete

);

[450] Fix | Delete

}

[451] Fix | Delete

}

[452] Fix | Delete

[453] Fix | Delete

// Background Hover.

[454] Fix | Delete

if ( et_builder_is_hover_enabled( $base_prop_name, $props ) ) {

[455] Fix | Delete

$images_hover = array();

[456] Fix | Delete

$style_hover = '';

[457] Fix | Delete

[458] Fix | Delete

$has_gradient_hover = false;

[459] Fix | Delete

$has_image_hover = false;

[460] Fix | Delete

$has_gradient_and_image_hover = false;

[461] Fix | Delete

$is_gradient_hover_disabled = false;

[462] Fix | Delete

$is_image_hover_disabled = false;

[463] Fix | Delete

[464] Fix | Delete

$gradient_overlays_image_hover = 'off';

[465] Fix | Delete

[466] Fix | Delete

// Background Gradient Hover.

[467] Fix | Delete

// This part is little bit different compared to other hover implementation. In this case,

[468] Fix | Delete

// hover is enabled on the background field, not on the each of those fields. So, built

[469] Fix | Delete

// in function get_value() doesn't work in this case. Temporarily, we need to fetch the

[470] Fix | Delete

// the value from get_raw_value().

[471] Fix | Delete

if ( $use_gradient_options && 'fields_only' !== $use_gradient_options ) {

[472] Fix | Delete

$use_gradient_hover = et_pb_responsive_options()->get_inheritance_background_value( $props, "use_{$base_prop_name}_color_gradient", 'hover', $base_prop_name, $fields_definition );

[473] Fix | Delete

[474] Fix | Delete

// 1. Ensure gradient color is active and values are not null.

[475] Fix | Delete

if ( 'on' === $use_gradient_hover ) {

[476] Fix | Delete

// Flag to inform BG Color if current module has Gradient.

[477] Fix | Delete

$has_gradient_hover = true;

[478] Fix | Delete

$gradient_values_hover = $this->get_gradient_hover_properties( $props, $base_prop_name, $gradient_properties_desktop );

[479] Fix | Delete

$gradient_hover = $this->get_gradient_style( $gradient_values_hover );

[480] Fix | Delete

$images_hover[] = $gradient_hover;

[481] Fix | Delete

[482] Fix | Delete

$gradient_overlays_image_desktop = et_pb_responsive_options()->get_any_value( $props, "{$base_prop_name}_color_gradient_overlays_image", '', true );

[483] Fix | Delete

$gradient_overlays_image_hover = et_pb_hover_options()->get_raw_value( "{$base_prop_name}_color_gradient_overlays_image", $props, $gradient_overlays_image_desktop );

[484] Fix | Delete

} else if ( 'off' === $use_gradient_hover ) {

[485] Fix | Delete

$is_gradient_hover_disabled = true;

[486] Fix | Delete

}

[487] Fix | Delete

}

[488] Fix | Delete

[489] Fix | Delete

// Background Image Hover.

[490] Fix | Delete

// This part is little bit different compared to other hover implementation. In this case,

[491] Fix | Delete

// hover is enabled on the background field, not on the each of those fields. So, built

[492] Fix | Delete

// in function get_value() doesn't work in this case. Temporarily, we need to fetch the

[493] Fix | Delete

// the value from get_raw_value().

[494] Fix | Delete

if ( $use_image_options && 'fields_only' !== $use_image_options ) {

[495] Fix | Delete

$image_hover = et_pb_responsive_options()->get_inheritance_background_value( $props, "{$base_prop_name}_image", 'hover', $base_prop_name, $fields_definition );

[496] Fix | Delete

$parallax_hover = et_pb_hover_options()->get_raw_value( 'parallax', $props );

[497] Fix | Delete

[498] Fix | Delete

if ( '' !== $image_hover && null !== $image_hover && 'on' !== $parallax_hover ) {

[499] Fix | Delete