You are here

public function SlickUi::edit_form in Slick Carousel 7.2

Overrides the actual editing form.

Overrides ctools_export_ui::edit_form

File

slick_ui/plugins/export_ui/SlickUi.class.php, line 16
Contains the CTools export UI integration code.

Class

SlickUi
CTools Export UI class handler for Slick UI.

Code

public function edit_form(&$form, &$form_state) {
  parent::edit_form($form, $form_state);
  ctools_form_include($form_state, 'slick.admin', 'slick');
  ctools_form_include($form_state, 'slick.theme', 'slick', 'templates');
  $module_path = drupal_get_path('module', 'slick');
  $optionset = $form_state['item'];
  $options = $optionset->options;
  if (variable_get('slick_admin_css', TRUE)) {
    $form['#attached']['library'][] = array(
      'slick_ui',
      'slick.ui',
    );
    $form['#attached']['css'][] = $module_path . '/css/admin/slick.admin--vertical-tabs.css';
  }
  $form['#attributes']['class'][] = 'form--slick';
  $form['#attributes']['class'][] = 'form--compact';
  $form['#attributes']['class'][] = 'form--optionset';
  $form['#attributes']['class'][] = 'has-tooltip clearfix';
  $form['info']['name']['#attributes']['class'][] = 'is-tooltip';
  $form['info']['label']['#attributes']['class'][] = 'is-tooltip';
  $form['info']['label']['#prefix'] = '<div class="form--slick__header has-tooltip clearfix">';

  // Skins. We don't provide skin_thumbnail as each optionset may be deployed
  // as main display, or thumbnail navigation.
  $skins_main = slick_get_skins_by_group('main', TRUE);
  $skins_thumbnail = slick_get_skins_by_group('thumbnail', TRUE);
  $skins = array_merge($skins_main, $skins_thumbnail);
  $form['skin'] = array(
    '#type' => 'select',
    '#title' => t('Skin'),
    '#options' => $skins,
    '#default_value' => $optionset->skin,
    '#empty_option' => t('- None -'),
    '#description' => t('Skins allow swappable layouts like next/prev links, split image and caption, etc. Be sure to provide a dedicated slide layout per field. However a combination of skins and options may lead to unpredictable layouts, get dirty yourself. See main <a href="@skin">README</a> for details on Skins. Keep it simple for thumbnail navigation skin.', array(
      '@skin' => url($module_path . '/README.txt'),
    )),
    '#attributes' => array(
      'class' => array(
        'is-tooltip',
      ),
    ),
  );
  $form['breakpoints'] = array(
    '#title' => t('Breakpoints'),
    '#type' => 'textfield',
    '#description' => t('The number of breakpoints added to Responsive display, max 9. This is not Breakpoint Width (480px, etc).'),
    '#default_value' => isset($form_state['values']['breakpoints']) ? $form_state['values']['breakpoints'] : $optionset->breakpoints,
    '#suffix' => '</div>',
    '#ajax' => array(
      'callback' => 'slick_ui_add_breakpoints',
      'wrapper' => 'breakpoints-ajax-wrapper',
      'event' => 'blur',
    ),
    '#attributes' => array(
      'class' => array(
        'is-tooltip',
      ),
    ),
    '#maxlength' => 1,
  );

  // Options.
  $form['options'] = array(
    '#type' => 'vertical_tabs',
    '#tree' => TRUE,
  );
  $is_optimized = $optionset->name == 'default' ? 0 : 1;
  $form['options']['optimized'] = array(
    '#type' => 'checkbox',
    '#title' => t('Optimized'),
    '#attributes' => array(
      'class' => array(
        'is-tooltip',
      ),
    ),
    '#default_value' => isset($options['optimized']) ? $options['optimized'] : $is_optimized,
    '#description' => t('Check to optimize the stored options. Anything similar to defaults will be excluded, except those required by sub-modules and theme_slick(). Like you hand-code/ cherry-pick the needed options, and frees up memory. The rest are taken care of by JS. Uncheck only if theme_slick() can not satisfy the needs, and more hand-coded preprocess is needed which is less likely in most cases.'),
    '#access' => $optionset->name != 'default',
  );

  // Image styles.
  $image_styles = function_exists('image_style_options') ? image_style_options(FALSE) : array();
  $form['options']['general'] = array(
    '#type' => 'fieldset',
    '#title' => t('General'),
    '#attributes' => array(
      'class' => array(
        'has-tooltip',
        'fieldset--no-checkboxes-label',
      ),
    ),
  );
  $form['options']['general']['normal'] = array(
    '#type' => 'select',
    '#title' => t('Image style'),
    '#description' => t('Image style for the main/background image, overriden by field formatter. Useful for custom work.'),
    '#empty_option' => t('None (original image)'),
    '#options' => $image_styles,
    '#default_value' => isset($options['general']['normal']) ? $options['general']['normal'] : '',
    '#attributes' => array(
      'class' => array(
        'is-tooltip',
      ),
    ),
  );

  // More useful for custom work, overriden by sub-modules.
  $form['options']['general']['thumbnail'] = array(
    '#type' => 'select',
    '#title' => t('Thumbnail style'),
    '#description' => t('Image style for the thumbnail image if using asNavFor, overriden by field formatter. Useful for custom work.'),
    '#empty_option' => t('None (original image)'),
    '#options' => $image_styles,
    '#default_value' => isset($options['general']['thumbnail']) ? $options['general']['thumbnail'] : '',
    '#attributes' => array(
      'class' => array(
        'is-tooltip',
      ),
    ),
  );
  $form['options']['general']['template_class'] = array(
    '#type' => 'textfield',
    '#title' => t('Wrapper class'),
    '#description' => t('Additional template wrapper classes separated by spaces. No need to prefix it with a dot (.).'),
    '#default_value' => isset($options['general']['template_class']) ? $options['general']['template_class'] : '',
    '#attributes' => array(
      'class' => array(
        'is-tooltip',
      ),
    ),
  );
  $form['options']['general']['goodies'] = array(
    '#type' => 'checkboxes',
    '#title' => t('Goodies'),
    '#default_value' => !empty($options['general']['goodies']) ? array_values((array) $options['general']['goodies']) : array(),
    '#options' => array(
      'arrow-down' => t('Use arrow down'),
      'pattern' => t('Use pattern overlay'),
      'random' => t('Randomize'),
    ),
    '#description' => t('Applies to main display, not thumbnail pager. <ol><li>Pattern overlay is background image with pattern placed over the main stage.</li><li>Arrow down to scroll down into a certain page section, make sure to provide target selector.</li><li>Randomize the slide display, useful to manipulate cached blocks.</li></ol>'),
    '#attributes' => array(
      'class' => array(
        'is-tooltip',
      ),
    ),
  );
  $form['options']['general']['arrow_down_target'] = array(
    '#type' => 'textfield',
    '#title' => t('Arrow down target'),
    '#description' => t('Valid CSS selector to scroll to, e.g.: #main, or #content.'),
    '#default_value' => isset($options['general']['arrow_down_target']) ? $options['general']['arrow_down_target'] : '',
    '#states' => array(
      'visible' => array(
        ':input[name*=arrow-down]' => array(
          'checked' => TRUE,
        ),
      ),
    ),
    '#attributes' => array(
      'class' => array(
        'is-tooltip',
      ),
    ),
  );
  $form['options']['general']['arrow_down_offset'] = array(
    '#type' => 'textfield',
    '#title' => t('Arrow down offset'),
    '#description' => t('Offset when scrolled down from the top.'),
    '#default_value' => isset($options['general']['arrow_down_offset']) ? $options['general']['arrow_down_offset'] : '',
    '#states' => array(
      'visible' => array(
        ':input[name*=arrow-down]' => array(
          'checked' => TRUE,
        ),
      ),
    ),
    '#attributes' => array(
      'class' => array(
        'is-tooltip',
      ),
    ),
  );

  // Add empty suffix to style checkboxes like iOS.
  if (variable_get('slick_admin_css', TRUE)) {
    foreach ($form['options']['general']['goodies']['#options'] as $key => $value) {
      $form['options']['general']['goodies'][$key]['#field_suffix'] = '';
      $form['options']['general']['goodies'][$key]['#title_display'] = 'before';
    }
  }

  // Main options.
  $slick_elements = $this
    ->getSlickElements();
  $form['options']['settings'] = array(
    '#title' => t('Settings'),
    '#type' => 'fieldset',
    '#collapsible' => FALSE,
    '#tree' => TRUE,
    '#attributes' => array(
      'class' => array(
        'fieldset--settings',
        'has-tooltip',
      ),
    ),
  );
  foreach ($slick_elements as $name => $element) {
    $element['default'] = isset($element['default']) ? $element['default'] : '';
    $default_value = isset($options['settings'][$name]) ? $options['settings'][$name] : $element['default'];
    $form['options']['settings'][$name] = array(
      '#title' => isset($element['title']) ? $element['title'] : '',
      '#description' => isset($element['description']) ? $element['description'] : '',
      '#default_value' => $default_value,
      '#attributes' => array(
        'class' => array(
          'is-tooltip',
        ),
      ),
    );
    if (isset($element['type'])) {
      $form['options']['settings'][$name]['#type'] = $element['type'];
      if ($element['type'] == 'textfield') {
        $form['options']['settings'][$name]['#size'] = 20;
        $form['options']['settings'][$name]['#maxlength'] = 255;
      }
      if ($element['type'] == 'hidden' && isset($element['states'])) {
        unset($element['states']);
      }
    }
    if (isset($element['field_suffix'])) {
      $form['options']['settings'][$name]['#field_suffix'] = $element['field_suffix'];
    }
    if (variable_get('slick_admin_css', TRUE)) {
      if (!isset($element['field_suffix']) && is_bool($element['default'])) {
        $form['options']['settings'][$name]['#field_suffix'] = '';
        $form['options']['settings'][$name]['#title_display'] = 'before';
      }
    }
    if (is_int($element['default'])) {
      $form['options']['settings'][$name]['#maxlength'] = 60;
      $form['options']['settings'][$name]['#attributes']['class'][] = 'form-text--int';
    }
    if (isset($element['states'])) {
      $form['options']['settings'][$name]['#states'] = $element['states'];
    }
    if (isset($element['options'])) {
      $form['options']['settings'][$name]['#options'] = $element['options'];
    }
    if (isset($element['empty_option'])) {
      $form['options']['settings'][$name]['#empty_option'] = $element['empty_option'];
    }

    // Expand textfield for easy edit.
    if (in_array($name, array(
      'prevArrow',
      'nextArrow',
    ))) {
      $form['options']['settings'][$name]['#default_value'] = trim(strip_tags($default_value));
    }
  }

  // Responsive options.
  $form['options']['responsives'] = array(
    '#title' => t('Responsive display'),
    '#type' => 'fieldset',
    '#description' => 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.'),
    '#collapsible' => FALSE,
    '#tree' => TRUE,
  );
  $form['options']['responsives']['responsive'] = array(
    '#title' => t('Responsive'),
    '#type' => 'fieldset',
    '#collapsible' => FALSE,
    '#attributes' => array(
      'class' => array(
        'has-tooltip',
        'fieldset--responsive--ajax',
      ),
    ),
    '#prefix' => '<div id="breakpoints-ajax-wrapper">',
    '#suffix' => '</div>',
  );
  $breakpoints_count = isset($form_state['values']['breakpoints']) ? $form_state['values']['breakpoints'] : $optionset->breakpoints;
  $form_state['breakpoints_count'] = $breakpoints_count;
  if ($form_state['breakpoints_count'] > 0) {
    $slick_responsive_elements = $this
      ->getSlickResponsiveElements($form_state['breakpoints_count']);
    foreach ($slick_responsive_elements as $i => $responsives) {

      // Individual breakpoint fieldset.
      $fieldset_class = drupal_clean_css_identifier(drupal_strtolower($responsives['title']));
      $form['options']['responsives']['responsive'][$i] = array(
        '#title' => $responsives['title'],
        '#type' => $responsives['type'],
        '#description' => isset($responsives['description']) ? $responsives['description'] : '',
        '#collapsible' => TRUE,
        '#collapsed' => TRUE,
        '#attributes' => array(
          'class' => array(
            'fieldset--responsive',
            'fieldset--' . $fieldset_class,
            'has-tooltip',
          ),
        ),
      );
      foreach ($responsives as $key => $responsive) {
        switch ($key) {
          case 'breakpoint':
          case 'unslick':
            $form['options']['responsives']['responsive'][$i][$key] = array(
              '#title' => $responsive['title'],
              '#description' => $responsive['description'],
              '#type' => $responsive['type'],
              '#default_value' => isset($options['responsives']['responsive'][$i][$key]) ? $options['responsives']['responsive'][$i][$key] : $responsive['default'],
              '#attributes' => array(
                'class' => array(
                  'is-tooltip',
                ),
              ),
            );
            if ($responsive['type'] == 'textfield') {
              $form['options']['responsives']['responsive'][$i][$key]['#size'] = 20;
              $form['options']['responsives']['responsive'][$i][$key]['#maxlength'] = 255;
            }
            if (is_int($responsive['default'])) {
              $form['options']['responsives']['responsive'][$i][$key]['#maxlength'] = 60;
            }
            if (isset($responsive['states'])) {
              $form['options']['responsives']['responsive'][$i][$key]['#states'] = $responsive['states'];
            }
            if (isset($responsive['options'])) {
              $form['options']['responsives']['responsive'][$i][$key]['#options'] = $responsive['options'];
            }
            if (isset($responsive['field_suffix'])) {
              $form['options']['responsives']['responsive'][$i][$key]['#field_suffix'] = $responsive['field_suffix'];
            }
            if (variable_get('slick_admin_css', TRUE)) {
              if (!isset($responsive['field_suffix']) && $responsive['type'] == 'checkbox') {
                $form['options']['responsives']['responsive'][$i][$key]['#field_suffix'] = '';
                $form['options']['responsives']['responsive'][$i][$key]['#title_display'] = 'before';
              }
            }
            break;
          case 'settings':
            $form['options']['responsives']['responsive'][$i][$key] = array(
              '#title' => t('Settings'),
              '#title_display' => 'invisible',
              '#type' => 'fieldset',
              '#collapsible' => FALSE,
              '#collapsed' => FALSE,
              '#attributes' => array(
                'class' => array(
                  'fieldset--settings',
                  'fieldset--' . $fieldset_class,
                  'has-tooltip',
                ),
              ),
              '#states' => array(
                'visible' => array(
                  ':input[name*="[responsive][' . $i . '][unslick]"]' => array(
                    'checked' => FALSE,
                  ),
                ),
              ),
            );
            unset($responsive['title'], $responsive['type']);
            if (!is_array($responsive)) {
              break;
            }
            foreach ($responsive as $k => $item) {
              if ($item && !is_array($item)) {
                continue;
              }
              $item['default'] = isset($item['default']) ? $item['default'] : '';
              $form['options']['responsives']['responsive'][$i][$key][$k] = array(
                '#title' => isset($item['title']) ? $item['title'] : '',
                '#description' => isset($item['description']) ? $item['description'] : '',
                '#attributes' => array(
                  'class' => array(
                    'is-tooltip',
                  ),
                ),
                '#default_value' => isset($options['responsives']['responsive'][$i][$key][$k]) ? $options['responsives']['responsive'][$i][$key][$k] : $item['default'],
              );
              if (isset($item['type'])) {
                $form['options']['responsives']['responsive'][$i][$key][$k]['#type'] = $item['type'];
              }

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

  // Allows form elements information to be altered without a class.
  // @see ctools_export_ui_edit_item_form
  drupal_alter('slick_ui_optionset_form', $form, $form_state);
}