You are here

public function UIkitViewTable::buildOptionsForm in UIkit Components 8

Same name and namespace in other branches
  1. 8.3 uikit_views/src/Plugin/views/style/UIkitViewTable.php \Drupal\uikit_views\Plugin\views\style\UIkitViewTable::buildOptionsForm()
  2. 8.2 uikit_views/src/Plugin/views/style/UIkitViewTable.php \Drupal\uikit_views\Plugin\views\style\UIkitViewTable::buildOptionsForm()

Render the given style.

Overrides StylePluginBase::buildOptionsForm

File

uikit_views/src/Plugin/views/style/UIkitViewTable.php, line 212

Class

UIkitViewTable
Style plugin to render each item in a UIkit Table component.

Namespace

Drupal\uikit_views\Plugin\views\style

Code

public function buildOptionsForm(&$form, FormStateInterface $form_state) {
  parent::buildOptionsForm($form, $form_state);
  $args = [
    '@href' => 'https://getuikit.com/v2/docs/table.html',
    '@title' => 'Table component - UIkit documentation',
  ];
  $handlers = $this->displayHandler
    ->getHandlers('field');
  if (empty($handlers)) {
    $form['error_markup'] = [
      '#markup' => '<div class="messages messages--error">' . $this
        ->t('You need at least one field before you can configure your table settings') . '</div>',
    ];
    return;
  }
  $form['override'] = [
    '#type' => 'checkbox',
    '#title' => $this
      ->t('Override normal sorting if click sorting is used'),
    '#default_value' => !empty($this->options['override']),
  ];
  $form['sticky'] = [
    '#type' => 'checkbox',
    '#title' => $this
      ->t('Enable Drupal style "sticky" table headers (Javascript)'),
    '#default_value' => !empty($this->options['sticky']),
    '#description' => $this
      ->t('(Sticky header effects will not be active for preview below, only on live output.)'),
  ];
  $form['caption'] = [
    '#type' => 'textfield',
    '#title' => $this
      ->t('Caption for the table'),
    '#description' => $this
      ->t('A title semantically associated with your table for increased accessibility.'),
    '#default_value' => $this->options['caption'],
    '#maxlength' => 255,
  ];
  $form['accessibility_details'] = [
    '#type' => 'details',
    '#title' => $this
      ->t('Table details'),
  ];
  $form['summary'] = [
    '#title' => $this
      ->t('Summary title'),
    '#type' => 'textfield',
    '#default_value' => $this->options['summary'],
    '#fieldset' => 'accessibility_details',
  ];
  $form['description'] = [
    '#title' => $this
      ->t('Table description'),
    '#type' => 'textarea',
    '#description' => $this
      ->t('Provide additional details about the table to increase accessibility.'),
    '#default_value' => $this->options['description'],
    '#states' => [
      'visible' => [
        'input[name="style_options[summary]"]' => [
          'filled' => TRUE,
        ],
      ],
    ],
    '#fieldset' => 'accessibility_details',
  ];
  $form['uikit_table_options'] = [
    '#type' => 'details',
    '#title' => $this
      ->t('UIkit table options'),
    '#description' => $this
      ->t('Easily create nicely looking tables, which come in different styles. See <a href="@href" target="_blank" title="@title">Table component</a> for more details.', $args),
  ];
  $form['responsive_table'] = [
    '#type' => 'checkbox',
    '#title' => $this
      ->t('Responsive table'),
    '#description' => $this
      ->t('If your table happens to be wider than its container element or would eventually get too big on a specific viewport width, this creates a container that provides a horizontal scrollbar whenever the elements inside it are wider than the container itself.'),
    '#default_value' => $this->options['responsive_table'],
    '#fieldset' => 'uikit_table_options',
  ];
  $form['vertical_modifier'] = [
    '#type' => 'checkbox',
    '#title' => $this
      ->t('Vertical modifider'),
    '#description' => $this
      ->t('Vertically center table content.'),
    '#default_value' => $this->options['vertical_modifier'],
    '#fieldset' => 'uikit_table_options',
  ];
  $form['table_modifiers'] = [
    '#type' => 'checkboxes',
    '#title' => $this
      ->t('Table modifiers'),
    '#description' => $this
      ->t('Display the table in a different style. These modifiers can be used together.'),
    '#default_value' => $this->options['table_modifiers'],
    '#options' => [
      'hover' => $this
        ->t('Hover (displays a hover state on table rows)'),
      'striped' => $this
        ->t('Striped (adds zebra-striping on table rows)'),
      'condensed' => $this
        ->t('Condensed (compacts table rows to use less space)'),
    ],
    '#fieldset' => 'uikit_table_options',
  ];

  // Note: views UI registers this theme handler on our behalf. Your module
  // will have to register your theme handlers if you do stuff like this.
  $form['#theme'] = 'views_ui_style_plugin_table';
  $columns = $this
    ->sanitizeColumns($this->options['columns']);

  // Create an array of allowed columns from the data we know:
  $field_names = $this->displayHandler
    ->getFieldLabels();
  if (isset($this->options['default'])) {
    $default = $this->options['default'];
    if (!isset($columns[$default])) {
      $default = -1;
    }
  }
  else {
    $default = -1;
  }
  foreach ($columns as $field => $column) {
    $column_selector = ':input[name="style_options[columns][' . $field . ']"]';
    $form['columns'][$field] = [
      '#title' => $this
        ->t('Columns for @field', [
        '@field' => $field,
      ]),
      '#title_display' => 'invisible',
      '#type' => 'select',
      '#options' => $field_names,
      '#default_value' => $column,
    ];
    if ($handlers[$field]
      ->clickSortable()) {
      $form['info'][$field]['sortable'] = [
        '#title' => $this
          ->t('Sortable for @field', [
          '@field' => $field,
        ]),
        '#title_display' => 'invisible',
        '#type' => 'checkbox',
        '#default_value' => !empty($this->options['info'][$field]['sortable']),
        '#states' => [
          'visible' => [
            $column_selector => [
              'value' => $field,
            ],
          ],
        ],
      ];
      $form['info'][$field]['default_sort_order'] = [
        '#title' => $this
          ->t('Default sort order for @field', [
          '@field' => $field,
        ]),
        '#title_display' => 'invisible',
        '#type' => 'select',
        '#options' => [
          'asc' => $this
            ->t('Ascending'),
          'desc' => $this
            ->t('Descending'),
        ],
        '#default_value' => !empty($this->options['info'][$field]['default_sort_order']) ? $this->options['info'][$field]['default_sort_order'] : 'asc',
        '#states' => [
          'visible' => [
            $column_selector => [
              'value' => $field,
            ],
            ':input[name="style_options[info][' . $field . '][sortable]"]' => [
              'checked' => TRUE,
            ],
          ],
        ],
      ];

      // Provide an ID so we can have such things.
      $radio_id = Html::getUniqueId('edit-default-' . $field);
      $form['default'][$field] = [
        '#title' => $this
          ->t('Default sort for @field', [
          '@field' => $field,
        ]),
        '#title_display' => 'invisible',
        '#type' => 'radio',
        '#return_value' => $field,
        '#parents' => [
          'style_options',
          'default',
        ],
        '#id' => $radio_id,
        // because 'radio' doesn't fully support '#id' =(
        '#attributes' => [
          'id' => $radio_id,
        ],
        '#default_value' => $default,
        '#states' => [
          'visible' => [
            $column_selector => [
              'value' => $field,
            ],
          ],
        ],
      ];
    }
    $form['info'][$field]['align'] = [
      '#title' => $this
        ->t('Alignment for @field', [
        '@field' => $field,
      ]),
      '#title_display' => 'invisible',
      '#type' => 'select',
      '#default_value' => !empty($this->options['info'][$field]['align']) ? $this->options['info'][$field]['align'] : '',
      '#options' => [
        '' => $this
          ->t('None'),
        'views-align-left' => $this
          ->t('Left', [], [
          'context' => 'Text alignment',
        ]),
        'views-align-center' => $this
          ->t('Center', [], [
          'context' => 'Text alignment',
        ]),
        'views-align-right' => $this
          ->t('Right', [], [
          'context' => 'Text alignment',
        ]),
      ],
      '#states' => [
        'visible' => [
          $column_selector => [
            'value' => $field,
          ],
        ],
      ],
    ];
    $form['info'][$field]['separator'] = [
      '#title' => $this
        ->t('Separator for @field', [
        '@field' => $field,
      ]),
      '#title_display' => 'invisible',
      '#type' => 'textfield',
      '#size' => 10,
      '#default_value' => isset($this->options['info'][$field]['separator']) ? $this->options['info'][$field]['separator'] : '',
      '#states' => [
        'visible' => [
          $column_selector => [
            'value' => $field,
          ],
        ],
      ],
    ];
    $form['info'][$field]['empty_column'] = [
      '#title' => $this
        ->t('Hide empty column for @field', [
        '@field' => $field,
      ]),
      '#title_display' => 'invisible',
      '#type' => 'checkbox',
      '#default_value' => isset($this->options['info'][$field]['empty_column']) ? $this->options['info'][$field]['empty_column'] : FALSE,
      '#states' => [
        'visible' => [
          $column_selector => [
            'value' => $field,
          ],
        ],
      ],
    ];
    $form['info'][$field]['responsive'] = [
      '#title' => $this
        ->t('Responsive setting for @field', [
        '@field' => $field,
      ]),
      '#title_display' => 'invisible',
      '#type' => 'select',
      '#default_value' => isset($this->options['info'][$field]['responsive']) ? $this->options['info'][$field]['responsive'] : '',
      '#options' => [
        '' => $this
          ->t('High'),
        RESPONSIVE_PRIORITY_MEDIUM => $this
          ->t('Medium'),
        RESPONSIVE_PRIORITY_LOW => $this
          ->t('Low'),
      ],
      '#states' => [
        'visible' => [
          $column_selector => [
            'value' => $field,
          ],
        ],
      ],
    ];

    // markup for the field name
    $form['info'][$field]['name'] = [
      '#markup' => $field_names[$field],
    ];
  }

  // Provide a radio for no default sort
  $form['default'][-1] = [
    '#title' => $this
      ->t('No default sort'),
    '#title_display' => 'invisible',
    '#type' => 'radio',
    '#return_value' => -1,
    '#parents' => [
      'style_options',
      'default',
    ],
    '#id' => 'edit-default-0',
    '#default_value' => $default,
  ];
  $form['empty_table'] = [
    '#type' => 'checkbox',
    '#title' => $this
      ->t('Show the empty text in the table'),
    '#default_value' => $this->options['empty_table'],
    '#description' => $this
      ->t('Per default the table is hidden for an empty view. With this option it is possible to show an empty table with the text in it.'),
  ];
  $form['description_markup'] = [
    '#markup' => '<div class="js-form-item form-item description">' . $this
      ->t('Place fields into columns; you may combine multiple fields into the same column. If you do, the separator in the column specified will be used to separate the fields. Check the sortable box to make that column click sortable, and check the default sort radio to determine which column will be sorted by default, if any. You may control column order and field labels in the fields section.') . '</div>',
  ];
}