Commit b1003c9e authored by borisson_'s avatar borisson_ Committed by StryKaizer

Issue #2725499 by borisson_, dragos-dumi, StryKaizer: Make 'Show more'/'Show...

Issue #2725499 by borisson_, dragos-dumi, StryKaizer: Make 'Show more'/'Show less' labels configurable
parent 28e96fa4
......@@ -32,6 +32,16 @@ facet.widget.config.links:
soft_limit:
type: integer
label: 'Soft limit'
soft_limit_settings:
type: mapping
label: 'Soft limit settings'
mapping:
show_less_label:
type: label
label: 'Show less label'
show_more_label:
type: label
label: 'Show more label'
# Config schema for checkbox, you can find the implementation in
# Drupal\facets\Plugin\facets\widget\CheckboxWidget. Options for this widget are
......
......@@ -11,8 +11,8 @@
attach: function (context, settings) {
if (settings.facets.softLimit !== 'undefined') {
$.each(settings.facets.softLimit, function (facet, limit) {
Drupal.facets.applySoftLimit(facet, limit);
});
Drupal.facets.applySoftLimit(facet, limit, settings);
})
}
}
};
......@@ -26,9 +26,11 @@
* The facet id.
* @param {string} limit
* The maximum amount of items to show.
* @param {object} settings
* Settings.
*/
Drupal.facets.applySoftLimit = function (facet, limit) {
var zero_based_limit = limit - 1;
Drupal.facets.applySoftLimit = function (facet, limit, settings) {
var zero_based_limit = (limit - 1);
var facetsList = $('ul[data-drupal-facet-id="' + facet + '"]');
// Hide facets over the limit.
......@@ -39,16 +41,21 @@
return $(this).find('li').length > limit;
}).each(function () {
var facet = $(this);
$('<a href="#" class="facets-soft-limit-link"></a>').text(Drupal.t('Show more')).click(function () {
if (facet.find('li:hidden').length > 0) {
facet.find('li:gt(' + zero_based_limit + ')').slideDown();
$(this).addClass('open').text(Drupal.t('Show less'));
}
else {
facet.find('li:gt(' + zero_based_limit + ')').slideUp();
$(this).removeClass('open').text(Drupal.t('Show more'));
}
return false;
var id = facet.data('drupal-facet-id');
var showLessLabel = settings.facets.softLimitSettings[id].showLessLabel;
var showMoreLabel = settings.facets.softLimitSettings[id].showMoreLabel;
$('<a href="#" class="facets-soft-limit-link"></a>')
.text(showMoreLabel)
.on('click', function () {
if (facet.find('li:hidden').length > 0) {
facet.find('li:gt(' + zero_based_limit + ')').slideDown();
$(this).addClass('open').text(showLessLabel);
}
else {
facet.find('li:gt(' + zero_based_limit + ')').slideUp();
$(this).removeClass('open').text(showMoreLabel);
}
return false;
}).insertAfter($(this));
});
};
......
......@@ -21,7 +21,13 @@ class LinksWidget extends WidgetPluginBase {
* {@inheritdoc}
*/
public function defaultConfiguration() {
return ['soft_limit' => 0] + parent::defaultConfiguration();
return [
'soft_limit' => 0,
'soft_limit_settings' => [
'show_less_label' => 'Show less',
'show_more_label' => 'Show more',
],
] + parent::defaultConfiguration();
}
/**
......@@ -31,8 +37,12 @@ class LinksWidget extends WidgetPluginBase {
$build = parent::build($facet);
$soft_limit = (int) $this->getConfiguration()['soft_limit'];
if ($soft_limit !== 0) {
$show_less_label = $this->getConfiguration()['soft_limit_settings']['show_less_label'];
$show_more_label = $this->getConfiguration()['soft_limit_settings']['show_more_label'];
$build['#attached']['library'][] = 'facets/soft-limit';
$build['#attached']['drupalSettings']['facets']['softLimit'][$facet->id()] = $soft_limit;
$build['#attached']['drupalSettings']['facets']['softLimitSettings'][$facet->id()]['showLessLabel'] = $show_less_label;
$build['#attached']['drupalSettings']['facets']['softLimitSettings'][$facet->id()]['showMoreLabel'] = $show_more_label;
}
if ($facet->getUseHierarchy()) {
$build['#attached']['library'][] = 'facets/drupal.facets.hierarchical';
......@@ -54,6 +64,31 @@ class LinksWidget extends WidgetPluginBase {
'#options' => [0 => $this->t('No limit')] + array_combine($options, $options),
'#description' => $this->t('Limit the number of displayed facets via JavaScript.'),
];
$form['soft_limit_settings'] = [
'#type' => 'container',
'#title' => $this->t('Soft limit settings'),
'#states' => [
'invisible' => [':input[name="widget_config[soft_limit]"]' => ['value' => 0]],
],
];
$form['soft_limit_settings']['show_less_label'] = [
'#type' => 'textfield',
'#title' => $this->t('Show less label'),
'#description' => $this->t('This text will be used for "Show less" link.'),
'#default_value' => $this->getConfiguration()['soft_limit_settings']['show_less_label'],
'#states' => [
'optional' => [':input[name="widget_config[soft_limit]"]' => ['value' => 0]],
],
];
$form['soft_limit_settings']['show_more_label'] = [
'#type' => 'textfield',
'#title' => $this->t('Show more label'),
'#description' => $this->t('This text will be used for "Show more" link.'),
'#default_value' => $this->getConfiguration()['soft_limit_settings']['show_more_label'],
'#states' => [
'optional' => [':input[name="widget_config[soft_limit]"]' => ['value' => 0]],
],
];
return $form;
}
......
......@@ -3,6 +3,7 @@
namespace Drupal\Tests\facets\FunctionalJavascript;
use Drupal\block\Entity\Block;
use Drupal\facets\Entity\Facet;
use Drupal\FunctionalJavascriptTests\JavascriptTestBase;
use Drupal\search_api\Entity\Index;
......@@ -62,6 +63,72 @@ class WidgetJSTest extends JavascriptTestBase {
$this->assertEquals('Type', $field_value);
}
/**
* Tests show more / less links.
*/
public function testLinksShowMoreLess() {
$facet_storage = \Drupal::entityTypeManager()->getStorage('facets_facet');
$id = 'owl';
// Create and save a facet with a checkbox widget on the 'type' field.
$facet_storage->create([
'id' => $id,
'name' => strtoupper($id),
'url_alias' => $id,
'facet_source_id' => 'search_api:views_page__search_api_test_view__page_1',
'field_identifier' => 'type',
'empty_behavior' => ['behavior' => 'none'],
'weight' => 1,
'widget' => [
'type' => 'links',
'config' => [
'show_numbers' => TRUE,
'soft_limit' => 1,
'soft_limit_settings' => [
'show_less_label' => 'Show less',
'show_more_label' => 'Show more',
],
],
],
'processor_configs' => [
'url_processor_handler' => [
'processor_id' => 'url_processor_handler',
'weights' => ['pre_query' => -10, 'build' => -10],
'settings' => [],
],
],
])->save();
$this->createBlock($id);
// Go to the views page.
$this->drupalGet('search-api-test-fulltext');
// Make sure the block is shown on the page.
$page = $this->getSession()->getPage();
$block = $page->findById('block-owl-block');
$block->isVisible();
// Make sure the show more / show less links are shown.
$this->assertSession()->linkExists('Show more');
// Change the link label of show more into "Moar Llamas".
$facet = Facet::load('owl');
$facet->setWidget('links', [
'show_numbers' => TRUE,
'soft_limit' => 1,
'soft_limit_settings' => [
'show_less_label' => 'Show less',
'show_more_label' => 'Moar Llamas',
],
]);
$facet->save();
// Check that the new configuration is used now.
$this->drupalGet('search-api-test-fulltext');
$this->assertSession()->linkNotExists('Show more');
$this->assertSession()->linkExists('Moar Llamas');
}
/**
* Tests checkbox widget.
*/
......
......@@ -66,7 +66,14 @@ class FacetTest extends KernelTestBase {
$manager = $entity->getWidgetManager();
$this->assertInstanceOf(WidgetPluginManager::class, $manager);
$config = ['soft_limit' => 0, 'show_numbers' => FALSE];
$config = [
'soft_limit' => 0,
'show_numbers' => FALSE,
'soft_limit_settings' => [
'show_less_label' => 'Show less',
'show_more_label' => 'Show more',
],
];
$this->assertEquals(['type' => 'links', 'config' => $config], $entity->getWidget());
$this->assertInstanceOf('\Drupal\facets\Plugin\facets\widget\LinksWidget', $entity->getWidgetInstance());
$this->assertFalse($entity->getWidgetInstance()->getConfiguration()['show_numbers']);
......
......@@ -55,7 +55,15 @@ class CheckboxWidgetTest extends WidgetTestBase {
*/
public function testDefaultConfiguration() {
$default_config = $this->widget->defaultConfiguration();
$this->assertEquals(['show_numbers' => FALSE, 'soft_limit' => 0], $default_config);
$expected = [
'show_numbers' => FALSE,
'soft_limit' => 0,
'soft_limit_settings' => [
'show_less_label' => 'Show less',
'show_more_label' => 'Show more',
],
];
$this->assertEquals($expected, $default_config);
}
}
......@@ -182,4 +182,20 @@ class LinksWidgetTest extends WidgetTestBase {
}
/**
* Tests default configuration.
*/
public function testDefaultConfiguration() {
$default_config = $this->widget->defaultConfiguration();
$expected = [
'show_numbers' => FALSE,
'soft_limit' => 0,
'soft_limit_settings' => [
'show_less_label' => 'Show less',
'show_more_label' => 'Show more',
],
];
$this->assertEquals($expected, $default_config);
}
}
......@@ -36,6 +36,10 @@ class NumericGranularWidgetTest extends WidgetTestBase {
'show_numbers' => FALSE,
'soft_limit' => 0,
'granularity' => 0,
'soft_limit_settings' => [
'show_less_label' => 'Show less',
'show_more_label' => 'Show more',
],
];
$this->assertEquals($expected, $default_config);
}
......
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