refs #22511 [finc-accessibility] usability date range slider

* add cluster for extracting possible year ranges
* set up possible ranges and by user chosen filtered years at the beginning of template to provide fitting variables for inputs and date range slider
* adjust configuration for loading complete range of years

local/config/vufind/facets.ini

@@ -310,6 +310,12 @@ hide_facets = "genre_facet,era_facet,geographic_facet"
 [SortedByIndex]
 ;index[] = format
 
+[Results_Settings]
+; By default, how many values should we show for each facet? (-1 for no limit)
+;facet_limit = 30
+; Override facet_limit on a per-field basis using this array:
+facet_limit_by_field[publishDateSort] = -1
+
 ; Special terms (key), which can't / shouldn't be translated but marked as other language (value) for BARF reasons
 [LanguageTags]
 en[] = "American Museum of Natural History"

themes/finc-accessibility/templates/Recommend/SideFacets/facet.phtml

@@ -10,9 +10,10 @@
   $facet = $this->facet;
 ?>
 <?php if (isset($rangeFacets[$facet])): // special display for ranges ?>
+  <?php /* finc: usability date range slider #22511: add cluster for extracting possible year ranges */ ?>
   <?=$this->context($this)->renderInContext(
     'Recommend/SideFacets/range-slider.phtml',
-    ['title' => $facet, 'facet' => $rangeFacets[$facet]]
+    ['title' => $facet, 'facet' => $rangeFacets[$facet], 'cluster' => $cluster]
   ); ?>
 <?php else: ?>
   <?php

themes/finc/templates/Recommend/SideFacets/range-slider.phtml

@@ -4,6 +4,22 @@
      * slider-container element
      */
 ?>
+<?php
+    /** finc: usability date range slider #22511:
+     * set boundary values for daterange input and slider
+     * min & max values of handles and inputs are defined by search results
+     * if date range filter is applied additionaly: lowest and highest record years can be within filter values
+     */
+    foreach ($cluster['list'] as $facet) {
+      $years[] = $facet['value'];
+    }
+    $facetmin = min($years);
+    $facetmax = max($years);
+    $low = $facetmin;
+    $min = !empty($this->facet['values'][0]) ? $this->facet['values'][0] : $facetmin;
+    $high = $facetmax;
+    $max = !empty($this->facet['values'][1]) ? $this->facet['values'][1] : $facetmax;
+?>
 <?php /* finc changes div into li for compatibility with facet list structure */ ?>
 <li class="facet">
   <?php /* finc adds landmarks for active facets */ ?>
@@ -17,22 +33,24 @@
     <?=$results->getUrlQuery()->asHiddenFields(['page' => "/./", 'filter' => "/^{$this->title}:.*/"])?>
     <input type="hidden" name="<?=$this->escapeHtmlAttr($this->facet['type'])?>range[]" value="<?=$this->escapeHtmlAttr($this->title)?>"/>
     <div class="date-fields">
-      <?php /* finc adds 'max="'.(date('Y')+1).' to prevent dates beyond the year + 1 to be entered; maxlength was causing w3c issues  */ ?>
-      <?php $extraInputAttribs = ($this->facet['type'] == 'date') ? 'max="'.(date('Y')+1).'" ' : ''; ?>
+      <?php /* finc: usability date range slider #22511:
+              prefill min & max attributes by possible date range (given by search results or chosen date range filter)
+            */ ?>
+      <?php $extraInputAttribs = ($this->facet['type'] == 'date') ? " min=\"{$min}\" max=\"{$max}\" " : ''; ?>
       <div class="date-from">
         <?php /* finc adds label ids */ ?>
         <label id="from-label" for="<?=$this->escapeHtmlAttr($this->title)?>from">
           <?=$this->transEsc('date_from')?>:
         </label>
-        <?php /* finc changes this to number for consistency with adv search  */ ?>
-        <input type="number" class="form-control" name="<?=$this->escapeHtmlAttr($this->title)?>from" id="<?=$this->escapeHtmlAttr($this->title)?>from" value="<?=isset($this->facet['values'][0]) ? $this->escapeHtmlAttr($this->facet['values'][0]) : ''?>" <?=$extraInputAttribs?>/>
+        <?php /* finc: usability date range slider #22135, #22511: change input type and value */ ?>
+        <input type="number" class="form-control" name="<?=$this->escapeHtmlAttr($this->title)?>from" id="<?=$this->escapeHtmlAttr($this->title)?>from" value="<?=!empty($this->facet['values'][0]) ? $this->escapeHtmlAttr($low) : ''?>" <?=$extraInputAttribs?>/>
       </div>
       <div class="date-to">
         <label id="to-label" for="<?=$this->escapeHtmlAttr($this->title)?>to">
           <?=$this->transEsc('date_to')?>:
         </label>
-        <?php /* finc changes this to number for consistency with adv search  */ ?>
-        <input type="number" class="form-control" name="<?=$this->escapeHtmlAttr($this->title)?>to" id="<?=$this->escapeHtmlAttr($this->title)?>to" value="<?=isset($this->facet['values'][1]) ? $this->escapeHtmlAttr($this->facet['values'][1]) : ''?>" <?=$extraInputAttribs?>/>
+        <?php /* finc: usability date range slider #22135, #22511: change input type and value input */ ?>
+        <input type="number" class="form-control" name="<?=$this->escapeHtmlAttr($this->title)?>to" id="<?=$this->escapeHtmlAttr($this->title)?>to" value="<?=!empty($this->facet['values'][1]) ? $this->escapeHtmlAttr($high) : ''?>" <?=$extraInputAttribs?>/>
       </div>
     </div>
     <?php if ($this->facet['type'] == 'date'): ?>
@@ -49,11 +67,7 @@
   <?php $this->headScript()->appendFile('vendor/bootstrap-slider.min.js'); ?>
   <?php $this->headLink()->appendStylesheet('vendor/bootstrap-slider.min.css'); ?>
   <?php
-    $min = !empty($this->facet['values'][0]) ? min($this->facet['values'][0], 1400) : 1400;
-    $future = date('Y', time() + 31536000); // next year
-    $max = !empty($this->facet['values'][1]) ? max($future, $this->facet['values'][1]) : $future;
-    $low = !empty($this->facet['values'][0]) ? $this->facet['values'][0] : $min;
-    $high = !empty($this->facet['values'][1]) ? $this->facet['values'][1] : $max;
+    /* finc: usability date range slider #22511: variables moved to top */
     $script = <<<JS
 $(document).ready(function() {
   var fillTexts = function() {

themes/finc/templates/search/advanced/ranges.phtml

@@ -2,8 +2,15 @@
 <?php if (isset($this->ranges) && !empty($this->ranges)): ?>
   <?php $params = $this->searchParams($this->searchClassId); ?>
   <?php foreach ($this->ranges as $current): $escField = $this->escapeHtmlAttr($current['field']); ?>
-    <?php /* finc adds 'max="'.(date('Y')+1).' to prevent dates beyond the year + 1 to be entered; maxlength was causing w3c issues  */ ?>
-    <?php $extraInputAttribs = ($current['type'] == 'date') ? 'max="'.(date('Y')+1).'" ' : ''; ?>
+    <?php /* finc: usability date range slider #22511:: calculate variables at the beginning */
+      $min = !empty($current['values'][0]) ? min($current['values'][0], 1400) : 1400;
+      $future = date('Y', time() + 31536000);
+      $max = !empty($current['values'][1]) ? max($future, $current['values'][1]) : $future;
+      $low = !empty($current['values'][0]) ? $current['values'][0] : $min;
+      $high = !empty($current['values'][1]) ? $current['values'][1] : $max;
+      ?>
+    <?php /* finc: usability date range slider #22511: use previously calculated min-/max-values to limit inputs */ ?>
+    <?php $extraInputAttribs = ($current['type'] == 'date') ? " min=\"{$min}\" max=\"{$max}\" " : ''; ?>
     <fieldset class="range">
       <legend><?=$this->transEsc($params->getFacetLabel($current['field']))?></legend>
       <input type="hidden" name="<?=$this->escapeHtmlAttr($current['type'])?>range[]" value="<?=$escField?>"/>
@@ -27,11 +34,7 @@
         <?php
           $this->headScript()->appendFile('vendor/bootstrap-slider.min.js');
           $this->headLink()->appendStylesheet('vendor/bootstrap-slider.min.css');
-          $min = !empty($current['values'][0]) ? min($current['values'][0], 1400) : 1400;
-          $future = date('Y', time() + 31536000);
-          $max = !empty($current['values'][1]) ? max($future, $current['values'][1]) : $future;
-          $low = !empty($current['values'][0]) ? $current['values'][0] : $min;
-          $high = !empty($current['values'][1]) ? $current['values'][1] : $max;
+          /* finc: usability date range slider #22511: moving variables to the beginning */
           $min = intval($min);
           $max = intval($max);
           $low = intval($low);