Commit bf6fe1c4 authored by bucefal91's avatar bucefal91 Committed by NickWilde

Issue #2722283 by bucefal91, jadionisioar, NickWilde: Add Alternative Pager Styles

parent ee6387cd
.views-slideshow-controls-bottom .views-slideshow-pager-bullets {
text-align: center;
}
.views-slideshow-controls-bottom .views-slideshow-pager-bullets li {
text-indent: -9999px;
cursor: pointer;
display: inline-block;
border-radius: 6px;
padding: 0 6px;
background: #222;
margin: 0.4em;
line-height: 12px;
}
.views-slideshow-controls-bottom .views-slideshow-pager-bullets li.active {
background: #AAA;
cursor: default;
}
.views-slideshow-controls-bottom .views-slideshow-pager-bullets li:hover {
background: #555;
}
......@@ -380,6 +380,8 @@
}
};
// Copy the pager hooks from fields pager to the bullets one.
Drupal.viewsSlideshowPagerBullets = Drupal.viewsSlideshowPagerFields || {};
/**
* Views Slideshow Slide Counter
......
<?php
namespace Drupal\views_slideshow\Plugin\ViewsSlideshowWidget;
use Drupal\Core\Form\FormStateInterface;
use Drupal\views_slideshow\ViewsSlideshowWidgetBase;
/**
* Provides a pager using bullets.
*
* @ViewsSlideshowWidget(
* id = "views_slideshow_pager_bullets",
* type = "views_slideshow_pager",
* label = @Translation("Bullets"),
* )
*/
class PagerBullets extends ViewsSlideshowWidgetBase {
}
{#
/**
* @file
* Default theme implementation for a views slideshow bullets pager.
*
* Available variables:
* - bullet_items: Renderable array of pager items
*
* @ingroup vss_templates
*/
#}
{{ bullet_items }}
......@@ -19,6 +19,12 @@ controls_text:
theme:
css/controls_text.css: {}
pager_bullets:
version: VERSION
css:
component:
css/views-slideshow-pager-bullets.css: {}
jquery_hoverIntent:
remote: https://github.com/briancherne/jquery-hoverIntent
version: 1.9
......
......@@ -74,6 +74,16 @@ function views_slideshow_theme() {
'length' => NULL,
],
],
'views_slideshow_pager_bullets' => [
'variables' => [
'vss_id' => NULL,
'view' => NULL,
'settings' => [],
'location' => NULL,
'attributes' => [],
],
'file' => 'views_slideshow.theme.inc',
],
'views_slideshow_controls_widget_render' => [
'variables' => [
'vss_id' => NULL,
......
......@@ -284,6 +284,36 @@ function template_preprocess_views_slideshow_pager_field_item(&$vars) {
}
}
/**
* Views Slideshow: Bullets pager.
*/
function template_preprocess_views_slideshow_pager_bullets(&$vars) {
$vars['#attached']['library'][] = 'views_slideshow/widget_info';
$vars['#attached']['library'][] = 'views_slideshow/pager_bullets';
$vars['#attached']['drupalSettings']['viewsSlideshowPagerFields'][$vars['vss_id']] = [
$vars['location'] => [
'activatePauseOnHover' => $vars['settings']['views_slideshow_pager_bullets']['views_slideshow_pager_bullets_hover'],
],
];
$vars['bullet_items'] = [
'#theme' => 'item_list',
'#items' => [],
'#attributes' => $vars['attributes'],
];
$vars['bullet_items']['#attributes']['class'][] = 'views-slideshow-pager-bullets';
$vars['bullet_items']['#attributes']['class'][] = 'views_slideshow_pager_field';
for ($i = 0; $i < count($vars['view']->result); $i++) {
$vars['bullet_items']['#items'][] = [
'#markup' => $i,
'#wrapper_attributes' => [
'id' => 'views_slideshow_pager_field_item_' . $vars['location'] . '_' . $vars['vss_id'] . '_' . $i,
],
];
}
}
/**
* Views Slideshow: Controls.
*/
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment