drowl_paragraphs_bs-1.x-dev/modules/drowl_paragraphs_bs_type_layout_slideshow/drowl_paragraphs_bs_type_layout_slideshow.module

<?php

/**
 * @file
 * Drowl_paragraphs_bs_type_layout_slideshow module.
 */

use Drupal\Component\Serialization\Json;
use Drupal\Core\Template\Attribute;

/**
 * Implements hook_preprocess_HOOK().
 */
function drowl_paragraphs_bs_type_layout_slideshow_preprocess_paragraph(&$variables) {
  $bundle = $variables['paragraph']->bundle();
  if ($bundle === 'layout_slideshow' && $variables['view_mode'] == 'preview') {
    // We need a way to tell the layout that it is in layout paragraphs builder
    // edit mode, but we can't introduce new #variables on the render array.
    // As #in_preview isn't used in our case, we use this existing variable:
    // @todo If we can one day add a new #variable for this, better do that.
    $variables['content']['regions']['#in_preview'] = TRUE;
  }
}

/**
 * Implements hook_preprocess_HOOK().
 */
function drowl_paragraphs_bs_type_layout_slideshow_preprocess_layout(&$variables) {
  // Add flag to determine if the layout is currently in a "preview"/form-mode
  // (especially while in edit using layout_paragraphs module).
  // Layout Paragraphs module support:
  if (\Drupal::service('module_handler')->moduleExists('layout_paragraphs')) {
    // Ensure each layout_paragraphs builder region is rendered, even if empty:
    // @see https://www.drupal.org/project/drowl_layouts_bs/issues/3294075
    if (!empty($variables['layout'])) {
      $defaultRegion = $variables['layout']->getDefaultRegion();
      $hasDefaultRegion = !empty($defaultRegion);
      // @improve: If this works reliably enough, we might remove these comments in the future:
      // These are the other ideas we had to check if we're in layout builder mode:
      // - This was the original way, but doesn't work with translation forms:
      // @see https://www.drupal.org/project/drowl_paragraphs_bs/issues/3549241
      // $hasLayoutParagraphsBuilderAttached = !empty($variables['content'][$defaultRegion]['#attached']['drupalSettings']['lpBuilder']);
      // - Another alternative that would even be better than the current hack, but we're not yet sure if it will work in all cases:
      // $isLayoutParagraphsBuilder = $hasDefaultRegion && $variables['content'][$defaultRegion]['#paragraph_view_mode'] === 'preview';
      // So for now we use the following and hope it's reliable:
      $isLayoutParagraphsBuilder = $hasDefaultRegion && !empty($variables['content'][$defaultRegion]['#attributes']['data-lpb-ui-id']);
      if ($isLayoutParagraphsBuilder) {
        // This is a layout paragraphs builder (edit mode).
        // Set a layout twig variable to implicate we need to force rendering
        // empty regions:
        $variables['drowl_paragraphs_is_layout_paragraphs_builder'] = TRUE;
      }
    }
  }

  $slideshowLayouts = [
    'drowl_paragraphs_bs_slideshow__custom',
    'drowl_paragraphs_bs_slideshow__1col',
    'drowl_paragraphs_bs_slideshow__2col',
    'drowl_paragraphs_bs_slideshow__3col',
    'drowl_paragraphs_bs_slideshow__4col',
    'drowl_paragraphs_bs_slideshow__5col',
    'drowl_paragraphs_bs_slideshow__6col',
  ];
  if (in_array($variables['theme_hook_original'], $slideshowLayouts)) {
    // Pass slick settings as data-slick json array to the layouts 'slide'
    // regions region attributes.
    $variables['slideshow_wrapper_attributes'] = new Attribute();
    $slideshow_settings = $variables['settings'];
    $drowl_paragraphs_bs_settings_global_defaults = \Drupal::config('drowl_paragraphs_bs.settings')->get('defaults');
    $drowl_paragraphs_bs_settings_global_defaults_layout_slideshow = $drowl_paragraphs_bs_settings_global_defaults['layout_slideshow'];

    // Define slides to show values for the predefined layouts.
    switch ($variables['theme_hook_original']) {
      case "drowl_paragraphs_bs_slideshow__1col":
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_sm'] = 1;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_md'] = 1;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_lg'] = 1;
        break;

      case "drowl_paragraphs_bs_slideshow__2col":
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_sm'] = 1;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_md'] = 1;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_lg'] = 2;
        break;

      case "drowl_paragraphs_bs_slideshow__3col":
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_sm'] = 1;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_md'] = 2;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_lg'] = 3;
        break;

      case "drowl_paragraphs_bs_slideshow__4col":
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_sm'] = 1;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_md'] = 2;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_lg'] = 4;
        break;

      case "drowl_paragraphs_bs_slideshow__5col":
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_sm'] = 2;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_md'] = 3;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_lg'] = 5;
        break;

      case "drowl_paragraphs_bs_slideshow__6col":
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_sm'] = 2;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_md'] = 4;
        $slideshow_settings['drowl_paragraphs_bs_slideshow_slides_lg'] = 6;
        break;
    }

    // Add some default classes and attributes on the (.slick) wrapper.
    $variables['slideshow_wrapper_attributes']->addClass([
      'slick--drowl-paragraphs-slideshow-layout',
    ]);

    if (empty($variables['in_preview'])) {
      // Add these only, if not in preview:
      $variables['slideshow_wrapper_attributes']->addClass(['slick', 'blazy']);
    }

    // Show a warning if breakpoint arent configured.
    // The small breakpoint is not relevant, because its always 0 in this case.
    if (empty($drowl_paragraphs_bs_settings_global_defaults['breakpoint_sizes']['md']) || empty($drowl_paragraphs_bs_settings_global_defaults['breakpoint_sizes']['lg'])) {
      \Drupal::messenger()->addError(t('You will need to configure the breakpoints on the DROWL Paragraph Settings page for all the slideshow components to work correctly!'));
      \Drupal::logger('drowl_paragraphs_bs_type_layout')->error('You will need to configure the breakpoints on the DROWL Paragraph Settings page for all the slideshow components to work correctly!');
    }

    // For reasons, we need to pass all settings to all breakpoint groups, so
    // put them into vars first.
    // The Slick (UI) module does basically the same, you have to set up
    // nearly all settings in each breakpoint again.
    // So this seems to be a Slick Carousel library flaw.
    $slick_settings_autoplay = !empty($slideshow_settings['drowl_paragraphs_bs_slideshow_autoplay']) ? filter_var($slideshow_settings['drowl_paragraphs_bs_slideshow_autoplay'], FILTER_VALIDATE_BOOLEAN) : !empty($drowl_paragraphs_bs_settings_global_defaults_layout_slideshow['autoplay']);
    $slick_settings_adaptive_height = !empty($slideshow_settings['drowl_paragraphs_bs_slideshow_adaptive_height']) ? filter_var($slideshow_settings['drowl_paragraphs_bs_slideshow_adaptive_height'], FILTER_VALIDATE_BOOLEAN) : !empty($drowl_paragraphs_bs_settings_global_defaults_layout_slideshow['auto_height']);
    $slick_settings_arrows = !empty($slideshow_settings['drowl_paragraphs_bs_slideshow_arrows']) ? filter_var($slideshow_settings['drowl_paragraphs_bs_slideshow_arrows'], FILTER_VALIDATE_BOOLEAN) : !empty($drowl_paragraphs_bs_settings_global_defaults_layout_slideshow['navigation_arrows']);
    $slick_settings_dots = !empty($slideshow_settings['drowl_paragraphs_bs_slideshow_dots']) ? filter_var($slideshow_settings['drowl_paragraphs_bs_slideshow_dots'], FILTER_VALIDATE_BOOLEAN) : !empty($drowl_paragraphs_bs_settings_global_defaults_layout_slideshow['navigation_dots']);
    $slick_settings_infinite = !empty($slideshow_settings['drowl_paragraphs_bs_slideshow_infinite']) ? filter_var($slideshow_settings['drowl_paragraphs_bs_slideshow_infinite'], FILTER_VALIDATE_BOOLEAN) : !empty($drowl_paragraphs_bs_settings_global_defaults_layout_slideshow['infinite']);
    $slick_settings_center_mode = !empty($slideshow_settings['drowl_paragraphs_bs_slideshow_center_mode']) ? filter_var($slideshow_settings['drowl_paragraphs_bs_slideshow_center_mode'], FILTER_VALIDATE_BOOLEAN) : !empty($drowl_paragraphs_bs_settings_global_defaults_layout_slideshow['center_mode']);
    $slick_settings_slides_to_show_sm = (int) ($slideshow_settings['drowl_paragraphs_bs_slideshow_slides_sm'] ?: $drowl_paragraphs_bs_settings_global_defaults_layout_slideshow['visible_elements_sm']);
    $slick_settings_slides_to_show_md = (int) ($slideshow_settings['drowl_paragraphs_bs_slideshow_slides_md'] ?: $drowl_paragraphs_bs_settings_global_defaults_layout_slideshow['visible_elements_md']);
    $slick_settings_slides_to_show_lg = (int) ($slideshow_settings['drowl_paragraphs_bs_slideshow_slides_lg'] ?: $drowl_paragraphs_bs_settings_global_defaults_layout_slideshow['visible_elements_lg']);

    // Static values.
    // Important: Slick requires real bool and integer values, otherwise bad things will happen.
    $slick_settings_rows = 0;
    $slick_settings_mobile_first = TRUE;
    $slick_settings = [
      'autoplay' => $slick_settings_autoplay,
      'adaptiveHeight' => $slick_settings_adaptive_height,
      'arrows' => $slick_settings_arrows,
      'dots' => $slick_settings_dots,
      'infinite' => $slick_settings_infinite,
      'centerMode' => $slick_settings_center_mode,
      'slidesToShow' => $slick_settings_slides_to_show_sm,
      'slidesToScroll' => $slick_settings_slides_to_show_sm,
      'rows' => $slick_settings_rows,
      'mobileFirst' => $slick_settings_mobile_first,
      'responsive' => [
        [
          'breakpoint' => (int) $drowl_paragraphs_bs_settings_global_defaults['breakpoint_sizes']['md'],
          'settings' => [
            'autoplay' => $slick_settings_autoplay,
            'adaptiveHeight' => $slick_settings_adaptive_height,
            'arrows' => $slick_settings_arrows,
            'dots' => $slick_settings_dots,
            'infinite' => $slick_settings_infinite,
            'centerMode' => $slick_settings_center_mode,
            'slidesToShow' => $slick_settings_slides_to_show_md,
            'slidesToScroll' => $slick_settings_slides_to_show_md,
            'rows' => $slick_settings_rows,
            'mobileFirst' => $slick_settings_mobile_first,
          ],
        ],
        [
          'breakpoint' => (int) $drowl_paragraphs_bs_settings_global_defaults['breakpoint_sizes']['lg'],
          'settings' => [
            'autoplay' => $slick_settings_autoplay,
            'adaptiveHeight' => $slick_settings_adaptive_height,
            'arrows' => $slick_settings_arrows,
            'dots' => $slick_settings_dots,
            'infinite' => $slick_settings_infinite,
            'centerMode' => $slick_settings_center_mode,
            'slidesToShow' => $slick_settings_slides_to_show_lg,
            'slidesToScroll' => $slick_settings_slides_to_show_lg,
            'rows' => $slick_settings_rows,
            'mobileFirst' => $slick_settings_mobile_first,
          ],
        ],
      ],
    ];
    if (!empty($slick_settings) && !empty($variables['region_attributes']['slides'])) {
      $variables['region_attributes']['slides']->setAttribute('data-slick', Json::encode($slick_settings));
      // Pass the settings also available to the twig template, so we
      // are able to modify the markup.
      $variables['slideshow_settings'] = $slick_settings;
    }

    // Add flag to determine if the layout is currently in a "preview"/form-mode
    // (especially while in edit using layout_paragraphs module).
    if (\Drupal::service('module_handler')->moduleExists('layout_paragraphs')) {
      // Ensure each layout_paragraphs builder region is rendered, even if
      // empty:
      // @see https://www.drupal.org/project/drowl_layouts_bs/issues/3294075
      if (!empty($variables['layout'])) {
        $defaultRegion = $variables['layout']->getDefaultRegion();
        $hasDefaultRegion = !empty($defaultRegion);
        // Check if this is a layout paragraph:
        // @todo Find a better way to determine this, as this check is quite
        // risky (same in drowl_layouts_bs!):
        $isLayoutParagraphsBuilder = $hasDefaultRegion && !empty($variables['content'][$defaultRegion]['#attached']['drupalSettings']['lpBuilder']);
        if ($isLayoutParagraphsBuilder) {
          // This is a layout paragraphs builder (edit mode).
          // Set a layout twig variable to implicate we need to force rendering
          // empty regions:
          $variables['drowl_paragraphs_layout_in_preview'] = TRUE;
        }
      }
    }
  }
}

/**
 * Implements hook_theme().
 */
function drowl_paragraphs_bs_type_layout_slideshow_theme($existing, $type, $theme, $path) {
  $templates = $path . '/templates';
  return [
    'paragraph__drowl_paragraphs_bs__layout_slideshow' => [
      'base hook' => 'paragraph',
      'path' => $templates,
    ],
  ];
}

/**
 * Implements hook_theme_suggestions_HOOK_alter().
 */
function drowl_paragraphs_bs_type_layout_slideshow_theme_suggestions_paragraph_alter(&$suggestions, $variables) {
  // Our override should be more general than the theme suggestion:
  if (!empty($variables['elements']['#paragraph']) && $variables['elements']['#paragraph']->bundle() == 'layout_slideshow') {
    array_unshift($suggestions, 'paragraph__drowl_paragraphs_bs__layout_slideshow');
  }
}