public function FastlyImageFormatter::settingsForm in Fastly 8.3

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 FormatterBase::settingsForm

File

src/Plugin/Field/FieldFormatter/FastlyImageFormatter.php, line 120

Class

FastlyImageFormatter

Plugin implementation of the fastly 'image' formatter.

Namespace

Drupal\fastly\Plugin\Field\FieldFormatter

Code

public function settingsForm(array $form, FormStateInterface $form_state) {
  $element['width'] = [
    '#title' => t('Width'),
    '#type' => 'number',
    '#description' => $this
      ->t('Entering integer is setting image in pixels (1-8192) and entering float 0.0-0.99 is setting percentage'),
    '#min' => 0,
    '#max' => 8192,
    '#step' => 0.01,
    '#default_value' => $this
      ->getSetting('width'),
  ];
  $element['height'] = [
    '#title' => t('Height'),
    '#type' => 'number',
    '#description' => $this
      ->t('Entering integer is setting image in pixels (1-8192) and entering float 0.0-0.99 is setting percentage'),
    '#min' => 0,
    '#max' => 8192,
    '#step' => 0.01,
    '#default_value' => $this
      ->getSetting('height'),
  ];
  $element['quality'] = [
    '#title' => t('Quality'),
    '#type' => 'number',
    '#description' => $this
      ->t('Parameter enables control over the compression level for lossy file-formatted images. More details <a href=":url" target="_blank">here</a>.', [
      ':url' => 'https://docs.fastly.com/en/image-optimization-api/quality',
    ]),
    '#default_value' => $this
      ->getSetting('quality'),
  ];
  $element['optimize'] = [
    '#title' => t('Optimize'),
    '#type' => 'select',
    '#description' => $this
      ->t('Automatically applies optimal quality compression to produce an output image with as much visual fidelity as possible, while minimizing the file size. More details <a href=":url" target="_blank">here</a>.', [
      ':url' => 'https://docs.fastly.com/en/image-optimization-api/enable',
    ]),
    '#default_value' => $this
      ->getSetting('optimize'),
    '#empty_option' => t('None'),
    '#options' => [
      'low' => 'low',
      'medium' => 'medium',
      'high' => 'high',
    ],
  ];
  $element['dpr'] = [
    '#title' => t('Device pixel ratio'),
    '#type' => 'select',
    '#description' => $this
      ->t('Parameter adds the ability to serve correctly sized images for devices that expose a device pixel ratio. More details <a href=":url" target="_blank">here</a>.', [
      ':url' => 'https://docs.fastly.com/en/image-optimization-api/dpr',
    ]),
    '#options' => [
      '1' => '1x',
      '1.5' => '1.5x',
      '2' => '2',
      '3' => '3',
      '4' => '4',
    ],
    '#empty_option' => t('None'),
    '#default_value' => $this
      ->getSetting('dpr'),
  ];
  $element['fit'] = [
    '#title' => t('Fit'),
    '#type' => 'select',
    '#description' => $this
      ->t('Set how the image will fit within the size bounds provided. Parameter controls how the image will be constrained within the provided size (width | height) values.'),
    '#default_value' => $this
      ->getSetting('fit'),
    '#empty_option' => t('None'),
    '#options' => [
      'bounds' => 'bounds',
      'cover' => 'cover',
      'crop' => 'crop',
    ],
  ];

  // @todo trim and crop
  $element['bg-color'] = [
    '#title' => t('Background color of an image'),
    '#type' => 'textfield',
    '#description' => $this
      ->t('Background color of an image in HEX value. More details <a href=":url" target="_blank">here</a>.', [
      ':url' => 'https://docs.fastly.com/en/image-optimization-api/bg-color',
    ]),
    '#default_value' => $this
      ->getSetting('bg-color'),
  ];
  $element['brightness'] = [
    '#title' => t('Brightness'),
    '#type' => 'number',
    '#description' => $this
      ->t('Brightness of the output image. More details <a href=":url" target="_blank">here</a>.', [
      ':url' => 'https://docs.fastly.com/en/image-optimization-api/brightness',
    ]),
    '#default_value' => $this
      ->getSetting('saturation'),
    '#min' => -100,
    '#max' => 100,
    '#step' => 0.01,
  ];
  $element['contrast'] = [
    '#title' => t('Contrast'),
    '#type' => 'number',
    '#description' => $this
      ->t('The contrast parameter increases or decreases the difference between the darkest and lightest tones in an image. More details <a href=":url" target="_blank">here</a>.', [
      ':url' => 'https://docs.fastly.com/en/image-optimization-api/contrast',
    ]),
    '#default_value' => $this
      ->getSetting('saturation'),
    '#min' => -100,
    '#max' => 100,
    '#step' => 0.01,
  ];
  $element['saturation'] = [
    '#title' => t('Saturation'),
    '#type' => 'number',
    '#description' => $this
      ->t('The saturation parameter increases or decreases the intensity of the colors in an image. More details <a href=":url" target="_blank">here</a>.', [
      ':url' => 'https://docs.fastly.com/en/image-optimization-api/saturation',
    ]),
    '#default_value' => $this
      ->getSetting('saturation'),
    '#min' => -100,
    '#max' => 100,
    '#step' => 0.01,
  ];

  // @todo Sharpen needs to be on the widget ?
  $element['blur'] = [
    '#title' => t('Blur'),
    '#type' => 'number',
    '#description' => $this
      ->t('Blurriness of the output image. Decimal number between 1 and 1000. More details <a href=":url" target="_blank">here</a>.', [
      ':url' => 'https://docs.fastly.com/en/image-optimization-api/blur',
    ]),
    '#default_value' => $this
      ->getSetting('blur'),
  ];
  $element['format'] = [
    '#title' => t('Format'),
    '#type' => 'select',
    '#description' => $this
      ->t('The format parameter enables the source image to be converted (a.k.a., "transcoded") from one encoded format to another. This is useful when the source image has been saved in a sub-optimal file format that hinders performance.. More details <a href=":url" target="_blank">here</a>.', [
      ':url' => 'https://docs.fastly.com/en/image-optimization-api/enable',
    ]),
    '#default_value' => $this
      ->getSetting('format'),
    '#empty_option' => t('None'),
    '#options' => [
      'gif' => $this
        ->t('Graphics Interchange Format'),
      'png' => $this
        ->t('Portable Network Graphics'),
      'png8' => $this
        ->t('Portable Network Graphics palette image with 256 colors and 8-bit transparency'),
      'png24' => $this
        ->t('Portable Network Graphics RGB image with 16.8 million colors'),
      'png32' => $this
        ->t('Portable Network Graphics RGBA image with 16.8 million colors and 8-bit transparency'),
      'jpg' => $this
        ->t('JPEG'),
      'pjpg' => $this
        ->t('Progressive JPEG'),
      'bjpg' => $this
        ->t('Baseline JPEG'),
      'webp' => $this
        ->t('WebP'),
      'webpll' => $this
        ->t('WebP (Lossless)'),
      'webply' => $this
        ->t('WebP (Lossy)'),
    ],
  ];

  //@todo frame
  $element['auto'] = [
    '#title' => t('Automatic optimization'),
    '#type' => 'select',
    '#description' => $this
      ->t('The auto parameter enables functionality that automates certain optimization features, like WebP image format support. More details <a href=":url" target="_blank">here</a>.', [
      ':url' => 'https://docs.fastly.com/en/image-optimization-api/auto',
    ]),
    '#default_value' => $this
      ->getSetting('auto'),
    '#empty_option' => t('None'),
    '#options' => [
      'webp' => 'webp',
    ],
  ];
  $element['resize-filter'] = [
    '#title' => t('Resize filter'),
    '#type' => 'select',
    '#description' => $this
      ->t('Enables control over the resizing filter used to generate a new image with a higher or lower number of pixels. More details <a href=":url" target="_blank">here</a>.', [
      ':url' => 'https://docs.fastly.com/en/image-optimization-api/resize-filter',
    ]),
    '#default_value' => $this
      ->getSetting('resize-filter'),
    '#empty_option' => t('None'),
    '#options' => [
      'nearest' => 'nearest',
      'bilinear' => 'bilinear',
      'bicubic' => 'bicubic',
      'lanczos2' => 'lanczos2',
      'lanczos3' => 'lanczos3',
    ],
  ];
  $link_types = [
    'content' => t('Content'),
    'file' => t('File'),
  ];
  $element['image_link'] = [
    '#title' => t('Link image to'),
    '#type' => 'select',
    '#default_value' => $this
      ->getSetting('image_link'),
    '#empty_option' => t('Nothing'),
    '#options' => $link_types,
  ];
  return $element;
}