public function BgImageFormatter::getBackgroundImageCss in Background Images Formatter 8.2

Same name and namespace in other branches

8.3 src/Plugin/Field/FieldFormatter/BgImageFormatter.php \Drupal\bg_image_formatter\Plugin\Field\FieldFormatter\BgImageFormatter::getBackgroundImageCss()
8 src/Plugin/Field/FieldFormatter/BgImageFormatter.php \Drupal\bg_image_formatter\Plugin\Field\FieldFormatter\BgImageFormatter::getBackgroundImageCss()

Function taken from the module 'bg_image'.

Adds a background image to the page using the css 'background' property.

Parameters

string $image_path: The path of the image to use. This can be either

A relative path e.g. sites/default/files/image.png
A uri: e.g. public://image.png.

array $css_settings: An array of css settings to use. Possible values are:

bg_image_selector: The css selector to use
bg_image_color: The background color
bg_image_x: The x offset
bg_image_y: The y offset
bg_image_attachment: The attachment property (scroll or fixed)
bg_image_repeat: The repeat settings
bg_image_background_size: The background size property if necessary

Default settings will be used for any values not provided.

string $image_style: Optionally add an image style to the image before applying it to the background.

Return value

array The array containing the CSS.

2 calls to BgImageFormatter::getBackgroundImageCss()

BgImageFormatter::viewElements in src/Plugin/Field/FieldFormatter/BgImageFormatter.php: Builds a renderable array for a field value.
ResponsiveBgImageFormatter::viewElements in modules/responsive_bg_image_formatter/src/Plugin/Field/FieldFormatter/ResponsiveBgImageFormatter.php: Builds a renderable array for a field value.

File

src/Plugin/Field/FieldFormatter/BgImageFormatter.php, line 306

Class

BgImageFormatter: Plugin annotation @FieldFormatter( id = "bg_image_formatter", label = @Translation("Background Image"), field_types = {"image"} )

Namespace

Drupal\bg_image_formatter\Plugin\Field\FieldFormatter

Code

public function getBackgroundImageCss($image_path, $css_settings = [], $image_style = NULL) {
  $defaults = self::defaultSettings();
  $css_settings += $defaults['css_settings'];

  // Pull the default css setting if not provided.
  $selector = $css_settings['bg_image_selector'];
  $bg_color = $css_settings['bg_image_color'];
  $bg_x = $css_settings['bg_image_x'];
  $bg_y = $css_settings['bg_image_y'];
  $attachment = $css_settings['bg_image_attachment'];
  $repeat = $css_settings['bg_image_repeat'];
  $important = $css_settings['bg_image_important'];
  $background_size = $css_settings['bg_image_background_size'];
  $background_size_ie8 = $css_settings['bg_image_background_size_ie8'];
  $media_query = $css_settings['bg_image_media_query'];
  $z_index = $css_settings['bg_image_z_index'];

  // If important is true, we turn it into a string for css output.
  if ($important) {
    $important = '!important';
  }
  else {
    $important = '';
  }

  // Handle the background size property.
  $bg_size = '';
  $ie_bg_size = '';
  if ($background_size) {

    // CSS3.
    $bg_size = sprintf('background-size: %s %s;', $background_size, $important);

    // Let's cover ourselves for other browsers as well...
    $bg_size .= sprintf('-webkit-background-size: %s %s;', $background_size, $important);
    $bg_size .= sprintf('-moz-background-size: %s %s;', $background_size, $important);
    $bg_size .= sprintf('-o-background-size: %s %s;', $background_size, $important);

    // IE filters to apply the cover effect.
    if ($background_size == 'cover' && $background_size_ie8) {
      $ie_bg_size = sprintf("filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='%s', sizingMethod='scale');", $image_path);
      $ie_bg_size .= sprintf("-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='%s', sizingMethod='scale');", $image_path);
    }
  }

  // Add the css if we have everything we need.
  if ($selector && $image_path) {
    $style = sprintf('%s {', $selector);
    if ($bg_color) {
      $style .= sprintf('background-color: %s %s;', $bg_color, $important);
    }
    $style .= sprintf("background-image: url('%s') %s;", $image_path, $important);
    if ($repeat) {
      $style .= sprintf('background-repeat: %s %s;', $repeat, $important);
    }
    if ($attachment) {
      $style .= sprintf('background-attachment: %s %s;', $attachment, $important);
    }
    if ($bg_x && $bg_y) {
      $style .= sprintf('background-position: %s %s %s;', $bg_x, $bg_y, $important);
    }
    if ($z_index) {
      $style .= sprintf('z-index: %s;', $z_index);
    }
    $style .= $bg_size;
    $style .= $background_size_ie8 ? $ie_bg_size : '';
    $style .= "}";
    return [
      'type' => 'inline',
      'style' => $style,
      'media' => $media_query,
      'group' => CSS_THEME,
    ];
  }
  return [];
}

You are here