gridstack.theme.inc in GridStack 8.2

Hooks and preprocess functions for the GridStack module.

File

templates/gridstack.theme.inc

<?php

/**
 * @file
 * Hooks and preprocess functions for the GridStack module.
 */
use Drupal\Core\Template\Attribute;
use Drupal\gridstack\GridStackDefault;

/**
 * Prepares variables for gridstack.html.twig templates.
 */
function template_preprocess_gridstack(&$variables) {
  $element = $variables['element'];
  foreach (GridStackDefault::themeProperties() as $key) {
    $variables[$key] = isset($element['#' . $key]) ? $element['#' . $key] : [];
  }
  $settings =& $variables['settings'];
  $settings += GridStackDefault::htmlSettings();
  $attributes =& $variables['attributes'];
  $custom_classes = empty($attributes['class']) ? [] : $attributes['class'];
  $attributes['class'] = array_merge([
    'gridstack',
  ], $custom_classes);
  $variables['wrapper'] = empty($settings['wrapper']) ? 'div' : $settings['wrapper'];
  $variables['wrapper_attributes'] = new Attribute($variables['wrapper_attributes']);
  $variables['content_attributes'] = empty($variables['content_attributes']) ? [] : new Attribute($variables['content_attributes']);
}

/**
 * Prepares variables for gridstack-box.html.twig templates.
 */
function template_preprocess_gridstack_box(&$variables) {

  // Content attributes are required by Layout Builder to make Sortable work.
  // Unlike jQuery.UI, Sortable doesn't work with outer wrapper.
  foreach ([
    'caption',
    'content',
    'delta',
    'item',
    'settings',
  ] as $key) {
    $default = $key == 'delta' ? 0 : [];
    $key = $key == 'caption' || $key == 'content' ? $key . '_attributes' : $key;
    $variables[$key] = isset($variables['element']["#{$key}"]) ? $variables['element']["#{$key}"] : $default;
  }
  $item =& $variables['item'];
  $settings =& $variables['settings'];

  // Boxes may have captions.
  foreach ([
    'alt',
    'category',
    'data',
    'link',
    'title',
  ] as $key) {
    $item['caption'][$key] = isset($item['caption']) && isset($item['caption'][$key]) ? $item['caption'][$key] : [];
  }
  $item['box'] = isset($item['box']) ? $item['box'] : [];
  $item['caption'] = array_filter($item['caption']);
  $item['preface'] = isset($item['preface']) ? $item['preface'] : [];
  $has_content = $item['box'] || $item['caption'] || $item['preface'];
  $settings['type'] = $type = isset($settings['type']) ? $settings['type'] : '';
  $is_rich_stamp = $item['box'] && $type && in_array($type, [
    'rich',
    'stamp',
  ]);

  // Provides debug attributes if so configured.
  if (!empty($settings['debug']) || !empty($settings['_ipe'])) {
    $delta = empty($settings['root_delta']) ? $variables['delta'] : $settings['root_delta'];
    $delta = (int) $delta + 1;
    if (isset($settings['nested_id'])) {
      $delta = str_replace('-', ':', $settings['nested_id']);
    }
    $variables['attributes']['data-gs-delta'] = $delta;
  }

  // Provides inner DIV if so required.
  if (!empty($settings['use_inner']) && !empty($settings['use_framework'])) {
    $settings['use_inner'] = $has_content;
  }

  // Provides optional classes if so configured.
  $classes = empty($variables['attributes']['class']) ? [] : $variables['attributes']['class'];
  $index = $variables['delta'] + 1;
  if (empty($settings['no_classes'])) {
    if ($item['box']) {
      if (!empty($settings['background'])) {
        $classes[] = 'box--background';
      }
      if ($type) {
        $classes[] = 'box--' . str_replace('_', '-', $type);
      }
    }
    if (!empty($settings['nested_id'])) {
      $classes[] = 'box--nested--' . $index;
    }
  }
  else {

    // Required by JS to work to fix aspect ratio.
    if ($is_rich_stamp) {
      $classes[] = 'box--' . str_replace('_', '-', $type);
    }

    // Removed classes if so configured.
    $removed = [
      'box--nester',
      'box--nested',
    ];
    $classes = array_diff($classes, $removed);
  }

  // Required by option dynamic custom BG color and Text color.
  $classes[] = empty($settings['nested_id']) ? 'box--' . $index : 'box--' . $settings['nested_id'];

  // Prevents collapsing container without media/ images.
  // Re-uses the same .is-gs-ratio class for ungridstack, not needed by native.
  if (!empty($settings['use_js'])) {
    $caption_only = empty($item['box']) && $item['caption'];
    if ($caption_only || !empty($settings['ungridstack'])) {

      // The .is-gs-ratio is to disable Blazy aspect ratio for inhouse solution.
      // Basically replacing padding-hack with exact height if applicable.
      $classes[] = 'is-gs-ratio';
    }
  }

  // The main box container attributes for consistency.
  $variables['attributes']['class'] = array_merge([
    'gridstack__box',
    'box',
  ], $classes);

  // Content attributes are required for Layout Builder draggable to work.
  $classes = empty($variables['content_attributes']['class']) ? [] : $variables['content_attributes']['class'];
  $variables['content_attributes']['class'] = array_merge([
    'box__content',
  ], $classes);
  $variables['caption_attributes'] = new Attribute($variables['caption_attributes']);

  // Provides extra variables.
  $settings['empty'] = $has_content ? FALSE : TRUE;
  $variables['wrapper'] = empty($settings['wrapper']) ? 'div' : $settings['wrapper'];
  if ($is_rich_stamp) {
    $item['box']['#theme_wrappers'][] = 'container';
    $item['box']['#attributes']['class'][] = 'box__' . $type;
    $item['box']['#attributes']['class'][] = 'is-gs-fh';
  }
}

Functions

Name	Description
template_preprocess_gridstack	Prepares variables for gridstack.html.twig templates.
template_preprocess_gridstack_box	Prepares variables for gridstack-box.html.twig templates.