You are here

Home » API reference » Slick Carousel 8 » SlickForm.php » SlickForm

public function SlickForm::form in Slick Carousel 8

Same name and namespace in other branches
  1. 8.2 slick_ui/src/Form/SlickForm.php \Drupal\slick_ui\Form\SlickForm::form()

Gets the actual form array to be built.

Overrides SlickFormBase::form

See also

\Drupal\Core\Entity\EntityForm::processForm()

\Drupal\Core\Entity\EntityForm::afterBuild()

File

slick_ui/src/Form/SlickForm.php, line 23

Class

SlickForm
Extends base form for slick instance configuration form.

Namespace

Drupal\slick_ui\Form

Code

public function form(array $form, FormStateInterface $form_state) {
  $form = parent::form($form, $form_state);
  $slick = $this->entity;
  $options = $slick
    ->getOptions() ?: [];
  $admin_css = $this->manager
    ->configLoad('admin_css', 'blazy.settings');
  $tooltip = [
    'class' => [
      'is-tooltip',
    ],
  ];

  // Options.
  $form['options'] = [
    '#type' => 'vertical_tabs',
    '#tree' => TRUE,
    '#parents' => [
      'options',
    ],
  ];

  // Main JS options.
  $form['settings'] = [
    '#type' => 'details',
    '#tree' => TRUE,
    '#title' => $this
      ->t('Settings'),
    '#attributes' => [
      'class' => [
        'details--settings',
        'has-tooltip',
      ],
    ],
    '#group' => 'options',
    '#parents' => [
      'options',
      'settings',
    ],
  ];
  foreach ($this
    ->getFormElements() as $name => $element) {
    $element['default'] = isset($element['default']) ? $element['default'] : '';
    $default_value = NULL !== $slick
      ->getSetting($name) ? $slick
      ->getSetting($name) : $element['default'];
    $form['settings'][$name] = [
      '#title' => isset($element['title']) ? $element['title'] : '',
      '#default_value' => $default_value,
    ];
    if (isset($element['type'])) {
      $form['settings'][$name]['#type'] = $element['type'];
      if ($element['type'] != 'hidden') {
        $form['settings'][$name]['#attributes'] = $tooltip;
      }
      else {

        // Ensures hidden element doesn't screw up the states.
        unset($element['states']);
      }
      if ($element['type'] == 'textfield') {
        $form['settings'][$name]['#size'] = 20;
        $form['settings'][$name]['#maxlength'] = 255;
      }
    }
    if (isset($element['options'])) {
      $form['settings'][$name]['#options'] = $element['options'];
    }
    if (isset($element['empty_option'])) {
      $form['settings'][$name]['#empty_option'] = $element['empty_option'];
    }
    if (isset($element['description'])) {
      $form['settings'][$name]['#description'] = $element['description'];
    }
    if (isset($element['states'])) {
      $form['settings'][$name]['#states'] = $element['states'];
    }

    // Expand textfield for easy edit.
    if (in_array($name, [
      'prevArrow',
      'nextArrow',
    ])) {
      $form['settings'][$name]['#default_value'] = trim(strip_tags($default_value));
    }
    if (isset($element['field_suffix'])) {
      $form['settings'][$name]['#field_suffix'] = $element['field_suffix'];
    }
    if (is_int($element['default'])) {
      $form['settings'][$name]['#maxlength'] = 60;
      $form['settings'][$name]['#attributes']['class'][] = 'form-text--int';
    }
    if ($admin_css && !isset($element['field_suffix']) && is_bool($element['default'])) {
      $form['settings'][$name]['#field_suffix'] = ' ';
      $form['settings'][$name]['#title_display'] = 'before';
    }
  }

  // Responsive JS options.
  // https://github.com/kenwheeler/slick/issues/951
  $form['responsives'] = [
    '#type' => 'details',
    '#title' => $this
      ->t('Responsive display'),
    '#open' => TRUE,
    '#tree' => TRUE,
    '#group' => 'options',
    '#parents' => [
      'options',
      'responsives',
    ],
    '#description' => $this
      ->t('Containing breakpoints and settings objects. Settings set at a given breakpoint/screen width is self-contained and does not inherit the main settings, but defaults. Be sure to set Breakpoints option above.'),
  ];
  $form['responsives']['responsive'] = [
    '#type' => 'details',
    '#title' => $this
      ->t('Responsive'),
    '#open' => TRUE,
    '#group' => 'responsives',
    '#parents' => [
      'options',
      'responsives',
      'responsive',
    ],
    '#prefix' => '<div id="edit-breakpoints-ajax-wrapper">',
    '#suffix' => '</div>',
    '#attributes' => [
      'class' => [
        'has-tooltip',
        'details--responsive--ajax',
      ],
    ],
  ];

  // Add some information to the form state for easier form altering.
  $form_state
    ->set('breakpoints_count', 0);
  $breakpoints_count = $form_state
    ->hasValue('breakpoints') ? $form_state
    ->getValue('breakpoints') : $slick
    ->getBreakpoints();
  if (!$form_state
    ->hasValue('breakpoints_count')) {
    $form_state
      ->setValue('breakpoints_count', $breakpoints_count);
  }
  $user_input = $form_state
    ->getUserInput();
  $breakpoints_input = isset($user_input['breakpoints']) ? (int) $user_input['breakpoints'] : $breakpoints_count;
  if ($breakpoints_input && $breakpoints_input != $breakpoints_count) {
    $form_state
      ->setValue('breakpoints_count', $breakpoints_input);
  }
  if ($form_state
    ->getValue('breakpoints_count') > 0) {
    $slick_responsive_options = $this
      ->getResponsiveFormElements($form_state
      ->getValue('breakpoints_count'));
    foreach ($slick_responsive_options as $i => $responsives) {

      // Individual breakpoint details depends on the breakpoints amount.
      $form['responsives']['responsive'][$i] = [
        '#type' => $responsives['type'],
        '#title' => $responsives['title'],
        '#open' => FALSE,
        '#group' => 'responsive',
        '#attributes' => [
          'class' => [
            'details--responsive',
            'details--breakpoint-' . $i,
            'has-tooltip',
          ],
        ],
      ];
      unset($responsives['title'], $responsives['type']);
      foreach ($responsives as $key => $responsive) {
        switch ($key) {
          case 'breakpoint':
          case 'unslick':
            $form['responsives']['responsive'][$i][$key] = [
              '#type' => $responsive['type'],
              '#title' => $responsive['title'],
              '#default_value' => isset($options['responsives']['responsive'][$i][$key]) ? $options['responsives']['responsive'][$i][$key] : $responsive['default'],
              '#description' => $responsive['description'],
              '#attributes' => $tooltip,
            ];
            if ($responsive['type'] == 'textfield') {
              $form['responsives']['responsive'][$i][$key]['#size'] = 20;
              $form['responsives']['responsive'][$i][$key]['#maxlength'] = 255;
            }
            if (is_int($responsive['default'])) {
              $form['responsives']['responsive'][$i][$key]['#maxlength'] = 60;
            }
            if (isset($responsive['field_suffix'])) {
              $form['responsives']['responsive'][$i][$key]['#field_suffix'] = $responsive['field_suffix'];
            }
            if ($admin_css && !isset($responsive['field_suffix']) && $responsive['type'] == 'checkbox') {
              $form['responsives']['responsive'][$i][$key]['#field_suffix'] = '&nbsp;';
              $form['responsives']['responsive'][$i][$key]['#title_display'] = 'before';
            }
            break;
          case 'settings':
            $form['responsives']['responsive'][$i][$key] = [
              '#type' => $responsive['type'],
              '#title' => $responsive['title'],
              '#open' => TRUE,
              '#group' => $i,
              '#states' => [
                'visible' => [
                  ':input[name*="[responsive][' . $i . '][unslick]"]' => [
                    'checked' => FALSE,
                  ],
                ],
              ],
              '#attributes' => [
                'class' => [
                  'details--settings',
                  'details--breakpoint-' . $i,
                  'has-tooltip',
                ],
              ],
            ];
            unset($responsive['title'], $responsive['type']);

            // @fixme, boolean default is ignored at index 0 only.
            foreach ($responsive as $k => $item) {
              $item['default'] = isset($item['default']) ? $item['default'] : '';
              $form['responsives']['responsive'][$i][$key][$k] = [
                '#title' => isset($item['title']) ? $item['title'] : '',
                '#default_value' => isset($options['responsives']['responsive'][$i][$key][$k]) ? $options['responsives']['responsive'][$i][$key][$k] : $item['default'],
                '#description' => isset($item['description']) ? $item['description'] : '',
                '#attributes' => $tooltip,
              ];
              if (isset($item['type'])) {
                $form['responsives']['responsive'][$i][$key][$k]['#type'] = $item['type'];
              }

              // Specify proper states for the breakpoint form elements.
              if (isset($item['states'])) {
                $states = '';
                switch ($k) {
                  case 'pauseOnHover':
                  case 'pauseOnDotsHover':
                  case 'autoplaySpeed':
                    $states = [
                      'visible' => [
                        ':input[name*="[' . $i . '][settings][autoplay]"]' => [
                          'checked' => TRUE,
                        ],
                      ],
                    ];
                    break;
                  case 'centerPadding':
                    $states = [
                      'visible' => [
                        ':input[name*="[' . $i . '][settings][centerMode]"]' => [
                          'checked' => TRUE,
                        ],
                      ],
                    ];
                    break;
                  case 'touchThreshold':
                    $states = [
                      'visible' => [
                        ':input[name*="[' . $i . '][settings][touchMove]"]' => [
                          'checked' => TRUE,
                        ],
                      ],
                    ];
                    break;
                  case 'swipeToSlide':
                    $states = [
                      'visible' => [
                        ':input[name*="[' . $i . '][settings][swipe]"]' => [
                          'checked' => TRUE,
                        ],
                      ],
                    ];
                    break;
                  case 'verticalSwiping':
                    $states = [
                      'visible' => [
                        ':input[name*="[' . $i . '][settings][vertical]"]' => [
                          'checked' => TRUE,
                        ],
                      ],
                    ];
                    break;
                }
                if ($states) {
                  $form['responsives']['responsive'][$i][$key][$k]['#states'] = $states;
                }
              }
              if (isset($item['options'])) {
                $form['responsives']['responsive'][$i][$key][$k]['#options'] = $item['options'];
              }
              if (isset($item['empty_option'])) {
                $form['responsives']['responsive'][$i][$key][$k]['#empty_option'] = $item['empty_option'];
              }
              if (isset($item['field_suffix'])) {
                $form['responsives']['responsive'][$i][$key][$k]['#field_suffix'] = $item['field_suffix'];
              }
              if ($admin_css && !isset($item['field_suffix']) && is_bool($item['default'])) {
                $form['responsives']['responsive'][$i][$key][$k]['#field_suffix'] = '&nbsp;';
                $form['responsives']['responsive'][$i][$key][$k]['#title_display'] = 'before';
              }
            }
            break;
          default:
            break;
        }
      }
    }
  }

  // Attach Slick admin library.
  if ($admin_css) {
    $form['#attached']['library'][] = 'slick_ui/slick.admin.vtabs';
  }
  return $form;
}