diff --git a/config/schema/facets.widgets.schema.yml b/config/schema/facets.widgets.schema.yml
index 478a760aa0ff1c1dfab86de82addd35571b34f07..952e984711cc7249b3ccdfe50590fa0015048a59 100644
--- a/config/schema/facets.widgets.schema.yml
+++ b/config/schema/facets.widgets.schema.yml
@@ -57,3 +57,13 @@ facet.widget.config.links:
# "soft limit" and "show counts".
facet.widget.config.checkbox:
type: facet.widget.config.links
+ mapping:
+ disable_autosubmit:
+ type: label
+ label: 'Disable autosubmit'
+ submit_button_label:
+ type: label
+ label: 'Submit label'
+ limit_by_pages:
+ type: string
+ label: 'Limit by pages'
diff --git a/js/checkbox-widget.js b/js/checkbox-widget.js
index 4430b93d62d80098d3626823f795e386cb1b88e2..5375fba6bc7859769503c0647127b48555568ab9 100644
--- a/js/checkbox-widget.js
+++ b/js/checkbox-widget.js
@@ -3,7 +3,7 @@
* Transforms links into checkboxes.
*/
-(function ($, Drupal, once) {
+(function ($, Drupal, drupalSettings, once) {
'use strict';
@@ -31,21 +31,76 @@
* Turns all facet links into checkboxes.
*/
Drupal.facets.makeCheckboxes = function (context) {
+ var facetSettings;
+ var $widgetLinks;
// Find all checkbox facet links and give them a checkbox.
var $checkboxWidgets = $(once('facets-checkbox-transform', '.js-facets-checkbox-links, .js-facets-links', context));
if ($checkboxWidgets.length > 0) {
$checkboxWidgets.each(function (index, widget) {
var $widget = $(widget);
- var $widgetLinks = $widget.find('.facet-item > a');
+ $widgetLinks = $widget.find('.facet-item > a');
// Add correct CSS selector for the widget. The Facets JS API will
// register handlers on that element.
$widget.addClass('js-facets-widget');
+ facetSettings = (drupalSettings.facets && drupalSettings.facets[$widget.data('drupal-facet-id')]) ?? {};
// Transform links to checkboxes.
$widgetLinks.each(Drupal.facets.makeCheckbox);
+ // If disable autosubmit configuration is set, add the apply button.
+ if (facetSettings.disable_autosubmit) {
+ var $applyButton = $('<button class="facets-apply-button">' + facetSettings.submit_button_label + '</button>');
+ $applyButton.on('click', function (e) {
+ var $widget = $(this).parent('div').siblings('.js-facets-widget');
+ $widgetLinks = $widget.find('.facet-item > a');
+
+ Drupal.facets.disableFacet($widget);
+
+ // Build the url based on the selected checkboxes.
+ var queryString = $.parseParams(window.location.href);
+ var currentFacetValues = [];
+ if (typeof queryString['f'] == 'object') {
+ currentFacetValues = queryString['f'];
+ }
+
+ $widgetLinks.each(function () {
+ var $link = $(this);
+ var value = $widget.data('drupal-facet-alias') + ':' + $link.data('drupal-facet-item-value');
+ var setted_index = $.inArray(value, currentFacetValues);
+ // Add the facet, if it is not already set.
+ if ($link.siblings('.facets-checkbox').is(':checked') && setted_index === -1) {
+ currentFacetValues.push(value);
+ // Remove the facet if set.
+ } else if ($link.siblings('.facets-checkbox').is(':checked') === false && $link.siblings('.facets-checkbox').is(':indeterminate') === false && setted_index !== -1) {
+ currentFacetValues.splice(setted_index, 1);
+ }
+ });
+
+ if (currentFacetValues.length > 0) {
+ queryString['f'] = $.extend({}, currentFacetValues);
+ }
+ else {
+ queryString['f'] = null;
+ }
+ var path = facetSettings.facet_source_path || window.location.href.split('?')[0];
+ var queryStringObj = $.extend({}, queryString);
+
+ // Remove pager parameter as the current page could not exist with
+ // the new facets.
+ if (typeof queryStringObj.page !== 'undefined') {
+ queryStringObj.page = null;
+ }
+
+ var href = path + '?' + $.param(queryStringObj);
+
+ // Trigger the facet based on the built url.
+ $widget.trigger('facets_filter', [ href ]);
+ });
+ $widgetLinks.parents('.facets-widget-checkbox').append($('<div class="facets-apply-button-wrapper"></div>').append($applyButton));
+ }
+
// We have to trigger attaching of behaviours, so that Facets JS API can
// register handlers on checkbox widgets.
Drupal.attachBehaviors(this.parentNode, Drupal.settings);
@@ -67,6 +122,8 @@
var href = $link.attr('href');
var id = $link.data('drupal-facet-item-id');
var type = $link.data('drupal-facet-widget-element-class');
+ var $widget = $(this).closest('.js-facets-widget');
+ var facetSettings = (drupalSettings.facets && drupalSettings.facets[$widget.data('drupal-facet-id')]) ?? {};
var checkbox = $('<input type="checkbox">')
.attr('id', id)
@@ -87,14 +144,17 @@
var label = $('<label for="' + id + '">' + description + '</label>');
- checkbox.on('change.facets', function (e) {
- e.preventDefault();
-
- var $widget = $(this).closest('.js-facets-widget');
+ // Do not trigger facets on change when auto-submit is disabled, so we can trigger them manually clicking on the
+ // apply button.
+ var disableAutosubmit = facetSettings.disable_autosubmit ?? false;
+ if (!disableAutosubmit) {
+ checkbox.on('change.facets', function (e) {
+ e.preventDefault();
- Drupal.facets.disableFacet($widget);
- $widget.trigger('facets_filter', [href]);
- });
+ Drupal.facets.disableFacet($widget);
+ $widget.trigger('facets_filter', [href]);
+ });
+ }
if (active) {
checkbox.prop('checked', true);
@@ -140,4 +200,106 @@
e.preventDefault();
};
-})(jQuery, Drupal, once);
+})(jQuery, Drupal, drupalSettings, once);
+
+// Add an URL parser to JQuery that returns an object
+// This function is meant to be used with an URL like the window.location
+// Use: $.parseParams('http://mysite.com/?var=string') or $.parseParams() to parse the window.location
+// Simple variable: ?var=abc returns {var: "abc"}
+// Simple object: ?var.length=2&var.scope=123 returns {var: {length: "2", scope: "123"}}
+// Simple array: ?var[]=0&var[]=9 returns {var: ["0", "9"]}
+// Array with index: ?var[0]=0&var[1]=9 returns {var: ["0", "9"]}
+// Nested objects: ?my.var.is.here=5 returns {my: {var: {is: {here: "5"}}}}
+// All together: ?var=a&my.var[]=b&my.cookie=no returns {var: "a", my: {var: ["b"], cookie: "no"}}
+// You just cant have an object in an array, e.g. ?var[1].test=abc DOES NOT WORK
+(function ($) {
+ var re = /([^&=]+)=?([^&]*)/g;
+ var decode = function (str) {
+ return decodeURIComponent(str.replace(/\+/g, ' '));
+ };
+ $.parseParams = function (query) {
+
+ // Recursive function to construct the result object.
+ function createElement(params, key, value) {
+ var list;
+ key = key + '';
+
+ // If the key is a property.
+ if (key.indexOf('.') !== -1) {
+ // Extract the first part with the name of the object.
+ list = key.split('.');
+
+ // The rest of the key.
+ var new_key = key.split(/\.(.+)?/)[1];
+
+ // Create the object if it doesn't exist.
+ if (!params[list[0]]) params[list[0]] = {};
+
+ // If the key is not empty, create it in the object.
+ if (new_key !== '') {
+ createElement(params[list[0]], new_key, value);
+ }
+ else {
+ console.warn('parseParams :: empty property in key "' + key + '"');
+ }
+ }
+ // If the key is an array.
+ else if (key.indexOf('[') !== -1) {
+ // extract the array name
+ list = key.split('[');
+ key = list[0];
+
+ // extract the index of the array
+ list = list[1].split(']');
+ var index = list[0]
+
+ // if index is empty, just push the value at the end of the array
+ if (index === '') {
+ if (!params) params = {};
+ if (!params[key] || !$.isArray(params[key])) params[key] = [];
+ params[key].push(value);
+ }
+ // Add the value at the index (must be an integer).
+ else {
+ if (!params) params = {};
+ if (!params[key] || !$.isArray(params[key])) params[key] = [];
+ params[key][parseInt(index)] = value;
+ }
+ }
+ // Just normal key.
+ else {
+ if (!params) params = {};
+ params[key] = value;
+ }
+ }
+
+ // Be sure the query is a string.
+ query = query + '';
+
+ if (query === '') query = window.location + '';
+
+ var params = {}, e;
+ if (query) {
+ // Remove # from end of query.
+ if (query.indexOf('#') !== -1) {
+ query = query.substr(0, query.indexOf('#'));
+ }
+
+ // Remove ? at the beginning of the query.
+ if (query.indexOf('?') !== -1) {
+ query = query.substr(query.indexOf('?') + 1, query.length);
+ } else return {};
+
+ // Empty parameters.
+ if (query === '') return {};
+
+ // Execute a createElement on every key and value.
+ while (e = re.exec(query)) {
+ var key = decode(e[1]);
+ var value = decode(e[2]);
+ createElement(params, key, value);
+ }
+ }
+ return params;
+ };
+})(jQuery);
diff --git a/src/Plugin/Condition/LimitByPagesCondition.php b/src/Plugin/Condition/LimitByPagesCondition.php
new file mode 100644
index 0000000000000000000000000000000000000000..d83698ed0ee1f338e5bbbf899aef5a297db75568
--- /dev/null
+++ b/src/Plugin/Condition/LimitByPagesCondition.php
@@ -0,0 +1,38 @@
+<?php
+
+namespace Drupal\facets\Plugin\Condition;
+
+use Drupal\system\Plugin\Condition\RequestPath;
+
+/**
+ * Provides a 'Limit by Pages' condition.
+ *
+ * @Condition(
+ * id = "limit_by_pages",
+ * label = @Translation("Limit by Pages"),
+ * )
+ */
+class LimitByPagesCondition extends RequestPath {
+
+ /**
+ * {@inheritdoc}
+ */
+ public function evaluate(): bool {
+ $result = parent::evaluate();
+ if (!$result) {
+ // Additionally compare raw paths
+ // to make sure language prefixes are counted as well.
+ $pages = mb_strtolower($this->configuration['pages']);
+ $pages = explode(PHP_EOL, $pages);
+ if (!empty($pages)) {
+ $current_path = $this->requestStack
+ ->getCurrentRequest()
+ ->getRequestUri();
+ return in_array($current_path, $pages, TRUE);
+ }
+ }
+
+ return $result;
+ }
+
+}
\ No newline at end of file
diff --git a/src/Plugin/facets/widget/CheckboxWidget.php b/src/Plugin/facets/widget/CheckboxWidget.php
index 9ed08660c6df2acf93bc95368b9b6342e21c00d1..1f486446134041b29519dee4e244c401de5e9fe9 100644
--- a/src/Plugin/facets/widget/CheckboxWidget.php
+++ b/src/Plugin/facets/widget/CheckboxWidget.php
@@ -2,8 +2,12 @@
namespace Drupal\facets\Plugin\facets\widget;
+use Drupal\Core\Condition\ConditionManager;
+use Drupal\Core\Form\FormStateInterface;
+use Drupal\Core\Plugin\ContainerFactoryPluginInterface;
use Drupal\facets\FacetInterface;
use Drupal\facets\Result\ResultInterface;
+use Symfony\Component\DependencyInjection\ContainerInterface;
/**
* The checkbox / radios widget.
@@ -14,7 +18,32 @@ use Drupal\facets\Result\ResultInterface;
* description = @Translation("A configurable widget that shows a list of checkboxes"),
* )
*/
-class CheckboxWidget extends LinksWidget {
+class CheckboxWidget extends LinksWidget implements ContainerFactoryPluginInterface {
+
+ /**
+ * Condition manager.
+ *
+ * @var \Drupal\Core\Condition\ConditionManager
+ */
+ protected $conditionManager;
+
+ /**
+ * {@inheritdoc}
+ */
+ public function __construct(array $configuration, $plugin_id, $plugin_definition, ConditionManager $conditionManager) {
+ parent::__construct($configuration, $plugin_id, $plugin_definition);
+ $this->conditionManager = $conditionManager;
+ }
+
+ /**
+ * {@inheritdoc}
+ */
+ public static function create(ContainerInterface $container, array $configuration, $plugin_id, $plugin_definition) {
+ return new static(
+ $configuration, $plugin_id, $plugin_definition,
+ $container->get('plugin.manager.condition')
+ );
+ }
/**
* {@inheritdoc}
@@ -33,6 +62,89 @@ class CheckboxWidget extends LinksWidget {
protected function appendWidgetLibrary(array &$build) {
$build['#attributes']['class'][] = 'js-facets-checkbox-links';
$build['#attached']['library'][] = 'facets/drupal.facets.checkbox-widget';
+ if ($this->isDisablingAllowed()) {
+ $facetConfiguration = [
+ 'disable_autosubmit' => $this->getConfiguration()['disable_autosubmit'],
+ 'submit_button_label' => $this->getConfiguration()['submit_button_label'],
+ ];
+ if ($facet_source = $this->facet->getFacetSource()) {
+ $facetConfiguration['facet_source_path'] = $facet_source->getPath();
+ }
+
+ $build['#attached']['drupalSettings']['facets'][$this->facet->id()] = $facetConfiguration;
+ }
+ }
+
+ /**
+ * {@inheritdoc}
+ */
+ public function defaultConfiguration() {
+ return [
+ 'disable_autosubmit' => FALSE,
+ 'submit_button_label' => 'Apply',
+ 'limit_by_pages' => '',
+ ] + parent::defaultConfiguration();
+ }
+
+ /**
+ * {@inheritdoc}
+ */
+ public function buildConfigurationForm(array $form, FormStateInterface $form_state, FacetInterface $facet) {
+ $form = parent::buildConfigurationForm($form, $form_state, $facet);
+ $form['disable_autosubmit'] = [
+ '#type' => 'checkbox',
+ '#title' => $this->t('Disable autosubmit'),
+ '#description' => $this->t('Disabling autosubmit will provide a button to apply the selected facet items. Otherwise the facet will be applied immediately once a checkbox is checked.'),
+ '#default_value' => $this->getConfiguration()['disable_autosubmit'],
+ ];
+ $form['submit_button_label'] = [
+ '#type' => 'textfield',
+ '#title' => $this->t('Submit label'),
+ '#description' => $this->t('The label for the submit button to apply the facet.'),
+ '#default_value' => $this->getConfiguration()['submit_button_label'],
+ '#states' => [
+ 'visible' => [
+ ':input[name="widget_config[disable_autosubmit]"]' => ['checked' => TRUE],
+ ],
+ ],
+ ];
+ $form['limit_by_pages'] = [
+ '#type' => 'textarea',
+ '#title' => $this->t('List of pages'),
+ '#description' => $this->t('List of pages where "Disable autosubmit" should work. Leave empty to use on all pages'),
+ '#default_value' => $this->getConfiguration()['limit_by_pages'],
+ '#states' => [
+ 'visible' => [
+ ':input[name="widget_config[disable_autosubmit]"]' => ['checked' => TRUE],
+ ],
+ ],
+ ];
+ return $form;
+ }
+
+ /**
+ * Check if autosubmit disabling can be applied on this page.
+ *
+ * @return bool
+ * TRUE - if allowed, FALSE otherwise.
+ *
+ * @throws \Drupal\Component\Plugin\Exception\PluginException
+ */
+ protected function isDisablingAllowed(): bool {
+ // Early return for facets without "Disable autosubmit" option.
+ if (empty($this->getConfiguration()['disable_autosubmit'] ?? FALSE)) {
+ return FALSE;
+ }
+ $pages = $this->getConfiguration()['limit_by_pages'] ?? NULL;
+ if (empty($pages)) {
+ return TRUE;
+ }
+ /* @var \Drupal\facets\Plugin\Condition\LimitByPagesCondition $condition */
+ $condition = $this->conditionManager
+ ->createInstance('limit_by_pages')
+ ->setConfiguration(['pages' => $pages]);
+
+ return $condition->evaluate();
}
}
diff --git a/tests/src/Unit/Plugin/widget/CheckboxWidgetTest.php b/tests/src/Unit/Plugin/widget/CheckboxWidgetTest.php
index 157fd19b3915a0cd30aa89c06e6ed71527d41bb4..46a5ca043538af8bb910ee8cc5e35af372bacb30 100644
--- a/tests/src/Unit/Plugin/widget/CheckboxWidgetTest.php
+++ b/tests/src/Unit/Plugin/widget/CheckboxWidgetTest.php
@@ -17,7 +17,11 @@ class CheckboxWidgetTest extends WidgetTestBase {
protected function setUp(): void {
parent::setUp();
- $this->widget = new CheckboxWidget(['show_numbers' => TRUE], 'checkbox_widget', []);
+ $condition_manager = $this->createMock(ConditionManager::class);
+ $container = \Drupal::getContainer();
+ $container->set('plugin.manager.condition', $condition_manager);
+
+ $this->widget = CheckboxWidget::create($container, ['show_numbers' => TRUE], 'checkbox_widget', []);
}
/**