View source
<?php
namespace Drupal\slick_ui\Form;
use Drupal\Core\Url;
use Drupal\Core\Entity\EntityForm;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Entity\EntityTypeInterface;
use Drupal\slick\Entity\Slick;
use Drupal\slick\Form\SlickAdminInterface;
use Drupal\slick\SlickManagerInterface;
use Symfony\Component\DependencyInjection\ContainerInterface;
abstract class SlickFormBase extends EntityForm {
protected $admin;
protected $manager;
protected $jsEasingOptions;
public function __construct(SlickAdminInterface $admin, SlickManagerInterface $manager) {
$this->admin = $admin;
$this->manager = $manager;
}
public static function create(ContainerInterface $container) {
return new static($container
->get('slick.admin'), $container
->get('slick.manager'));
}
public function admin() {
return $this->admin;
}
public function manager() {
return $this->manager;
}
public function form(array $form, FormStateInterface $form_state) {
if ($this->operation == 'duplicate') {
$form['#title'] = $this
->t('<em>Duplicate slick optionset</em>: @label', [
'@label' => $this->entity
->label(),
]);
$this->entity = $this->entity
->createDuplicate();
}
if ($this->operation == 'edit') {
$form['#title'] = $this
->t('<em>Edit slick optionset</em>: @label', [
'@label' => $this->entity
->label(),
]);
}
$slick = $this->entity;
$path = drupal_get_path('module', 'slick');
$tooltip = [
'class' => [
'is-tooltip',
],
];
$readme = Url::fromUri('base:' . $path . '/README.md')
->toString();
$admin_css = $this->manager
->configLoad('admin_css', 'blazy.settings');
$form['#attributes']['class'][] = 'form--slick';
$form['#attributes']['class'][] = 'form--blazy';
$form['#attributes']['class'][] = 'form--optionset';
$form['label'] = [
'#type' => 'textfield',
'#title' => $this
->t('Label'),
'#default_value' => $slick
->label(),
'#maxlength' => 255,
'#required' => TRUE,
'#description' => $this
->t("Label for the Slick optionset."),
'#attributes' => $tooltip,
'#prefix' => '<div class="form__header form__half form__half--first has-tooltip clearfix">',
];
$form['name'] = [
'#type' => 'machine_name',
'#default_value' => $slick
->id(),
'#maxlength' => EntityTypeInterface::BUNDLE_MAX_LENGTH,
'#machine_name' => [
'source' => [
'label',
],
'exists' => '\\Drupal\\slick\\Entity\\Slick::load',
],
'#attributes' => $tooltip,
'#disabled' => !$slick
->isNew(),
'#suffix' => '</div>',
];
$form['skin'] = [
'#type' => 'select',
'#title' => $this
->t('Skin'),
'#options' => $this->admin
->getSkinsByGroupOptions(),
'#empty_option' => $this
->t('- None -'),
'#default_value' => $slick
->getSkin(),
'#description' => $this
->t('Skins allow swappable layouts like next/prev links, split image and caption, etc. However a combination of skins and options may lead to unpredictable layouts, get yourself dirty. See main <a href="@url">README</a> for details on Skins. Only useful for custom work, and ignored/overridden by slick formatters or sub-modules.', [
'@url' => $readme,
]),
'#attributes' => $tooltip,
'#prefix' => '<div class="form__header form__half form__half--last has-tooltip clearfix">',
];
$form['group'] = [
'#type' => 'select',
'#title' => $this
->t('Group'),
'#options' => [
'main' => $this
->t('Main'),
'overlay' => $this
->t('Overlay'),
'thumbnail' => $this
->t('Thumbnail'),
],
'#empty_option' => $this
->t('- None -'),
'#default_value' => $slick
->getGroup(),
'#description' => $this
->t('Group this optionset to avoid confusion for optionset selections. Leave empty to make it available for all.'),
'#attributes' => $tooltip,
];
$form['breakpoints'] = [
'#title' => $this
->t('Breakpoints'),
'#type' => 'textfield',
'#default_value' => $form_state
->hasValue('breakpoints') ? $form_state
->getValue('breakpoints') : $slick
->getBreakpoints(),
'#description' => $this
->t('The number of breakpoints added to Responsive display, max 9. This is not Breakpoint Width (480px, etc).'),
'#ajax' => [
'callback' => '::addBreakpoints',
'wrapper' => 'edit-breakpoints-ajax-wrapper',
'event' => 'change',
'progress' => [
'type' => 'fullscreen',
],
'effect' => 'fade',
'speed' => 'fast',
],
'#attributes' => $tooltip,
'#maxlength' => 1,
];
$form['optimized'] = [
'#type' => 'checkbox',
'#title' => $this
->t('Optimized'),
'#default_value' => $slick
->optimized(),
'#description' => $this
->t('Check to optimize the stored options. Anything similar to defaults will not be stored, except those required by sub-modules and theme_slick(). Like you hand-code/ cherry-pick the needed options, and are smart enough to not repeat defaults, and free 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' => $slick
->id() != 'default',
'#attributes' => $tooltip,
'#wrapper_attributes' => [
'class' => [
'form-item--tooltip-wide',
],
],
];
if ($slick
->id() == 'default') {
$form['breakpoints']['#suffix'] = '</div>';
}
else {
$form['optimized']['#suffix'] = '</div>';
}
if ($admin_css) {
$form['optimized']['#field_suffix'] = ' ';
$form['optimized']['#title_display'] = 'before';
}
return parent::form($form, $form_state);
}
public function submitForm(array &$form, FormStateInterface $form_state) {
parent::submitForm($form, $form_state);
$slick = $this->entity;
$default = $slick
->id() == 'default';
if (!$default && !$form_state
->isValueEmpty('optimized')) {
$defaults = $slick::defaultSettings();
$required = $this
->getOptionsRequiredByTemplate();
$main = array_diff_assoc($defaults, $required);
$settings = $form_state
->getValue([
'options',
'settings',
]);
$this
->typecastOptionset($settings);
$slick
->removeWastedDependentOptions($settings);
$main_settings = array_diff_assoc($settings, $main);
$slick
->setSettings($main_settings);
$responsive_options = [
'options',
'responsives',
'responsive',
];
if ($responsives = $form_state
->getValue($responsive_options)) {
foreach ($responsives as $delta => &$responsive) {
if (!empty($responsive['unslick'])) {
$slick
->setResponsiveSettings([], $delta);
}
else {
$this
->typecastOptionset($responsive['settings']);
$slick
->removeWastedDependentOptions($responsive['settings']);
$responsive_settings = array_diff_assoc($responsive['settings'], $defaults);
$slick
->setResponsiveSettings($responsive_settings, $delta);
}
}
}
}
}
public function save(array $form, FormStateInterface $form_state) {
$slick = $this->entity;
$slick
->set('label', trim($slick
->label()));
$slick
->set('id', $slick
->id());
$status = $slick
->save();
$label = $slick
->label();
$edit_link = $slick
->toLink($this
->t('Edit'), 'edit-form')
->toString();
$config_prefix = $slick
->getEntityType()
->getConfigPrefix();
$message = [
'@config_prefix' => $config_prefix,
'%label' => $label,
];
$notice = [
'@config_prefix' => $config_prefix,
'%label' => $label,
'link' => $edit_link,
];
if ($status == SAVED_UPDATED) {
drupal_set_message($this
->t('@config_prefix %label has been updated.', $message));
$this
->logger('slick')
->notice('@config_prefix %label has been updated.', $notice);
}
else {
drupal_set_message($this
->t('@config_prefix %label has been added.', $message));
$this
->logger('slick')
->notice('@config_prefix %label has been added.', $notice);
}
}
public function addBreakpoints($form, FormStateInterface $form_state) {
if (!$form_state
->isValueEmpty('breakpoints')) {
$form_state
->setValue('breakpoints_count', $form_state
->getValue('breakpoints'));
if ($form_state
->getValue('breakpoints') >= 6) {
$message = $this
->t('You are trying to load too many Breakpoints. Try reducing it to reasonable numbers say, between 1 to 5.');
drupal_set_message($message, 'warning');
}
}
return $form['responsives']['responsive'];
}
public function typecastOptionset(array &$settings = []) {
if (empty($settings)) {
return;
}
$defaults = Slick::defaultSettings();
foreach ($defaults as $name => $value) {
if (isset($settings[$name])) {
$type = gettype($defaults[$name]);
$type = $type == 'double' ? 'float' : $type;
if ($name == 'edgeFriction') {
$type = $settings[$name] == '1' ? 'integer' : 'float';
}
settype($settings[$name], $type);
}
}
}
public function getJsEasingOptions() {
if (!isset($this->jsEasingOptions)) {
$this->jsEasingOptions = [
'linear' => 'Linear',
'swing' => 'Swing',
'easeInQuad' => 'easeInQuad',
'easeOutQuad' => 'easeOutQuad',
'easeInOutQuad' => 'easeInOutQuad',
'easeInCubic' => 'easeInCubic',
'easeOutCubic' => 'easeOutCubic',
'easeInOutCubic' => 'easeInOutCubic',
'easeInQuart' => 'easeInQuart',
'easeOutQuart' => 'easeOutQuart',
'easeInOutQuart' => 'easeInOutQuart',
'easeInQuint' => 'easeInQuint',
'easeOutQuint' => 'easeOutQuint',
'easeInOutQuint' => 'easeInOutQuint',
'easeInSine' => 'easeInSine',
'easeOutSine' => 'easeOutSine',
'easeInOutSine' => 'easeInOutSine',
'easeInExpo' => 'easeInExpo',
'easeOutExpo' => 'easeOutExpo',
'easeInOutExpo' => 'easeInOutExpo',
'easeInCirc' => 'easeInCirc',
'easeOutCirc' => 'easeOutCirc',
'easeInOutCirc' => 'easeInOutCirc',
'easeInElastic' => 'easeInElastic',
'easeOutElastic' => 'easeOutElastic',
'easeInOutElastic' => 'easeInOutElastic',
'easeInBack' => 'easeInBack',
'easeOutBack' => 'easeOutBack',
'easeInOutBack' => 'easeInOutBack',
'easeInBounce' => 'easeInBounce',
'easeOutBounce' => 'easeOutBounce',
'easeInOutBounce' => 'easeInOutBounce',
];
}
return $this->jsEasingOptions;
}
public function getCssEasingOptions($map = FALSE) {
$css_easings = [];
$available_easings = [
'ease' => 'ease|ease',
'linear' => 'linear|linear',
'ease-in' => 'ease-in|ease-in',
'ease-out' => 'ease-out|ease-out',
'swing' => 'swing|ease-in-out',
'easeInQuad' => 'easeInQuad|cubic-bezier(0.550, 0.085, 0.680, 0.530)',
'easeInCubic' => 'easeInCubic|cubic-bezier(0.550, 0.055, 0.675, 0.190)',
'easeInQuart' => 'easeInQuart|cubic-bezier(0.895, 0.030, 0.685, 0.220)',
'easeInQuint' => 'easeInQuint|cubic-bezier(0.755, 0.050, 0.855, 0.060)',
'easeInSine' => 'easeInSine|cubic-bezier(0.470, 0.000, 0.745, 0.715)',
'easeInExpo' => 'easeInExpo|cubic-bezier(0.950, 0.050, 0.795, 0.035)',
'easeInCirc' => 'easeInCirc|cubic-bezier(0.600, 0.040, 0.980, 0.335)',
'easeInBack' => 'easeInBack|cubic-bezier(0.600, -0.280, 0.735, 0.045)',
'easeOutQuad' => 'easeOutQuad|cubic-bezier(0.250, 0.460, 0.450, 0.940)',
'easeOutCubic' => 'easeOutCubic|cubic-bezier(0.215, 0.610, 0.355, 1.000)',
'easeOutQuart' => 'easeOutQuart|cubic-bezier(0.165, 0.840, 0.440, 1.000)',
'easeOutQuint' => 'easeOutQuint|cubic-bezier(0.230, 1.000, 0.320, 1.000)',
'easeOutSine' => 'easeOutSine|cubic-bezier(0.390, 0.575, 0.565, 1.000)',
'easeOutExpo' => 'easeOutExpo|cubic-bezier(0.190, 1.000, 0.220, 1.000)',
'easeOutCirc' => 'easeOutCirc|cubic-bezier(0.075, 0.820, 0.165, 1.000)',
'easeOutBack' => 'easeOutBack|cubic-bezier(0.175, 0.885, 0.320, 1.275)',
'easeInOutQuad' => 'easeInOutQuad|cubic-bezier(0.455, 0.030, 0.515, 0.955)',
'easeInOutCubic' => 'easeInOutCubic|cubic-bezier(0.645, 0.045, 0.355, 1.000)',
'easeInOutQuart' => 'easeInOutQuart|cubic-bezier(0.770, 0.000, 0.175, 1.000)',
'easeInOutQuint' => 'easeInOutQuint|cubic-bezier(0.860, 0.000, 0.070, 1.000)',
'easeInOutSine' => 'easeInOutSine|cubic-bezier(0.445, 0.050, 0.550, 0.950)',
'easeInOutExpo' => 'easeInOutExpo|cubic-bezier(1.000, 0.000, 0.000, 1.000)',
'easeInOutCirc' => 'easeInOutCirc|cubic-bezier(0.785, 0.135, 0.150, 0.860)',
'easeInOutBack' => 'easeInOutBack|cubic-bezier(0.680, -0.550, 0.265, 1.550)',
];
foreach ($available_easings as $key => $easing) {
list($readable_easing, $css_easing) = array_pad(array_map('trim', explode("|", $easing, 2)), 2, NULL);
$css_easings[$key] = $map ? $easing : $readable_easing;
unset($css_easing);
}
return $css_easings;
}
public function getOptionsRequiredByTemplate() {
$options = [
'lazyLoad' => 'ondemand',
'slidesToShow' => 1,
];
$this->manager
->getModuleHandler()
->alter('slick_options_required_by_template', $options);
return $options;
}
public function getBezier($easing = NULL) {
$css_easing = '';
if ($easing) {
$easings = $this
->getCssEasingOptions(TRUE);
list($readable_easing, $bezier) = array_pad(array_map('trim', explode("|", $easings[$easing], 2)), 2, NULL);
$css_easing = $bezier;
unset($readable_easing);
}
return $css_easing;
}
}