You are here

public function BgImageFormatter::settingsForm in Background Images Formatter 8.2

Same name and namespace in other branches
  1. 8.3 src/Plugin/Field/FieldFormatter/BgImageFormatter.php \Drupal\bg_image_formatter\Plugin\Field\FieldFormatter\BgImageFormatter::settingsForm()
  2. 8 src/Plugin/Field/FieldFormatter/BgImageFormatter.php \Drupal\bg_image_formatter\Plugin\Field\FieldFormatter\BgImageFormatter::settingsForm()

Returns a form to configure settings for the formatter.

Invoked from \Drupal\field_ui\Form\EntityDisplayFormBase to allow administrators to configure the formatter. The field_ui module takes care of handling submitted form values.

Parameters

array $form: The form where the settings form is being included in.

\Drupal\Core\Form\FormStateInterface $form_state: The current state of the form.

Return value

array The form elements for the formatter settings.

Overrides ImageFormatter::settingsForm

1 call to BgImageFormatter::settingsForm()
ResponsiveBgImageFormatter::settingsForm in modules/responsive_bg_image_formatter/src/Plugin/Field/FieldFormatter/ResponsiveBgImageFormatter.php
Returns a form to configure settings for the formatter.
1 method overrides BgImageFormatter::settingsForm()
ResponsiveBgImageFormatter::settingsForm in modules/responsive_bg_image_formatter/src/Plugin/Field/FieldFormatter/ResponsiveBgImageFormatter.php
Returns a form to configure settings for the formatter.

File

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

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 settingsForm(array $form, FormStateInterface $form_state) {
  $element = [];
  $settings = $this
    ->getSettings();
  $element['image_style'] = [
    '#title' => $this
      ->t('Image style'),
    '#type' => 'select',
    '#default_value' => $settings['image_style'],
    '#empty_option' => $this
      ->t('None (original image)'),
    '#options' => image_style_options(),
    '#description' => $this
      ->t('Select <a href="@href_image_style">the image style</a> to apply on' . 'images.', [
      '@href_image_style' => Url::fromRoute('image.style_add')
        ->toString(),
    ]),
  ];

  // Fieldset for css settings.
  $element['css_settings'] = [
    '#type' => 'fieldset',
    '#title' => $this
      ->t('Default CSS Settings'),
    '#description' => $this
      ->t('Default CSS settings for outputting the background property. These settings will be concatenated to form a complete css statement that uses the "background" property. For more information on the css background property see http://www.w3schools.com/css/css_background.asp"'),
  ];

  // The selector for the background property.
  $element['css_settings']['bg_image_selector'] = [
    '#type' => 'textarea',
    '#title' => $this
      ->t('Selector(s)'),
    '#description' => $this
      ->t('A valid CSS selector that will be used to apply the background image. One per line. If the field is a multivalue field, the first line will be applied to the first value, the second to the second value... and so on. Tokens are supported.'),
    '#default_value' => $settings['css_settings']['bg_image_selector'],
  ];

  // The token help relevant to this entity type.
  $element['css_settings']['token_help'] = [
    '#theme' => 'token_tree_link',
    '#token_types' => [
      'user',
      $form['#entity_type'],
    ],
  ];

  // The selector for the background property.
  $element['css_settings']['bg_image_z_index'] = [
    '#type' => 'textfield',
    '#title' => $this
      ->t('Z Index'),
    '#description' => $this
      ->t('The z-index property specifies the stack order of an element. An element with greater stack order is always in front of an element with a lower stack order. Note: z-index only works on positioned elements (position:absolute, position:relative, or position:fixed)'),
    '#default_value' => $settings['css_settings']['bg_image_z_index'],
  ];

  // The selector for the background property.
  $element['css_settings']['bg_image_color'] = [
    '#type' => 'textarea',
    '#title' => $this
      ->t('Color'),
    '#description' => $this
      ->t('The background color formatted as any valid css color format (e.g. hex, rgb, text, hsl) [<a href="@url">css property: background-color</a>]. One per line. If the field is a multivalue field, the first line will be applied to the first value, the second to the second value... and so on.', [
      '@url' => 'http://www.w3schools.com/css/pr_background-color.asp',
    ]),
    '#default_value' => $settings['css_settings']['bg_image_color'],
  ];

  // The selector for the background property.
  $element['css_settings']['bg_image_x'] = [
    '#type' => 'textfield',
    '#title' => $this
      ->t('Horizontal Alignment'),
    '#description' => $this
      ->t('The horizontal alignment of the background image formatted as any valid css alignment. [<a href="http://www.w3schools.com/css/pr_background-position.asp">css property: background-position</a>]'),
    '#default_value' => $settings['css_settings']['bg_image_x'],
  ];

  // The selector for the background property.
  $element['css_settings']['bg_image_y'] = [
    '#type' => 'textfield',
    '#title' => $this
      ->t('Vertical Alignment'),
    '#description' => $this
      ->t('The vertical alignment of the background image formatted as any valid css alignment. [<a href="http://www.w3schools.com/css/pr_background-position.asp">css property: background-position</a>]'),
    '#default_value' => $settings['css_settings']['bg_image_y'],
  ];

  // The selector for the background property.
  $element['css_settings']['bg_image_attachment'] = [
    '#type' => 'radios',
    '#title' => $this
      ->t('Background Attachment'),
    '#description' => $this
      ->t('The attachment setting for the background image. [<a href="http://www.w3schools.com/css/pr_background-attachment.asp">css property: background-attachment</a>]'),
    '#options' => [
      FALSE => $this
        ->t('Ignore'),
      'scroll' => 'Scroll',
      'fixed' => 'Fixed',
    ],
    '#default_value' => $settings['css_settings']['bg_image_attachment'],
  ];

  // The background-repeat property.
  $element['css_settings']['bg_image_repeat'] = [
    '#type' => 'radios',
    '#title' => $this
      ->t('Background Repeat'),
    '#description' => $this
      ->t('Define the repeat settings for the background image. [<a href="http://www.w3schools.com/css/pr_background-repeat.asp">css property: background-repeat</a>]'),
    '#options' => [
      FALSE => $this
        ->t('Ignore'),
      'no-repeat' => $this
        ->t('No Repeat'),
      'repeat' => $this
        ->t('Tiled (repeat)'),
      'repeat-x' => $this
        ->t('Repeat Horizontally (repeat-x)'),
      'repeat-y' => $this
        ->t('Repeat Vertically (repeat-y)'),
    ],
    '#default_value' => $settings['css_settings']['bg_image_repeat'],
  ];

  // The background-size property.
  $element['css_settings']['bg_image_background_size'] = [
    '#type' => 'textfield',
    '#title' => $this
      ->t('Background Size'),
    '#description' => $this
      ->t('The size of the background (NOTE: CSS3 only. Useful for responsive designs) [<a href="http://www.w3schools.com/cssref/css3_pr_background-size.asp">css property: background-size</a>]'),
    '#default_value' => $settings['css_settings']['bg_image_background_size'],
  ];

  // background-size:cover suppor for IE8.
  $element['css_settings']['bg_image_background_size_ie8'] = [
    '#type' => 'checkbox',
    '#title' => $this
      ->t('Add background-size:cover support for ie8'),
    '#description' => $this
      ->t('The background-size css property is only supported on browsers that support CSS3. However, there is a workaround for IE using Internet Explorer\'s built-in filters (http://msdn.microsoft.com/en-us/library/ms532969%28v=vs.85%29.aspx). Check this box to add the filters to the css. Sometimes it works well, sometimes it doesn\'t. Use at your own risk'),
    '#default_value' => $settings['css_settings']['bg_image_background_size_ie8'],
  ];

  // The media query specifics.
  $element['css_settings']['bg_image_media_query'] = [
    '#type' => 'textfield',
    '#title' => $this
      ->t('Media Query'),
    '#description' => $this
      ->t('Apply this background image css using a media query. CSS3 Only. Useful for responsive designs. example: only screen and (min-width:481px) and (max-width:768px) [<a href="http://www.w3.org/TR/css3-mediaqueries/">Read about media queries</a>]'),
    '#default_value' => $settings['css_settings']['bg_image_media_query'],
  ];
  $element['css_settings']['bg_image_important'] = [
    '#type' => 'checkbox',
    '#title' => $this
      ->t('Add "!important" to the background property.'),
    '#description' => $this
      ->t('This can be helpful to override any existing background image or color properties added by the theme.'),
    '#default_value' => $settings['css_settings']['bg_image_important'],
  ];
  return $element;
}