Filter

Filter for products in eshop.

It is programmed in the app/eshop/controls/filter folder.
It is filtered mostly by supplements and by properties with options or by text.

Currently the best filtration option is on project Briol

Setting the slider in the filter

In the file filter.php in the field "slidersSetup" we add the field with the key size (we follow it in the future) and fill in the key for the min part and for the max part, then the type (we choose according to the constants above), finally the property_id if it is a property we enter here the id of the property otherwise 0.
```
'cena' => [
   'min' => 'cena_min',
   'max' => 'cena_max',
   'type' => self::PRICE,
   'property_id' => 0
],
```
If we have set something other than the already set ones, we have to set a new condition in the setMinValues, setMaxValues and prepareQuery functions.

In filter.latte we need to code a slider, it must contain: element with slider id, and 2 elements with id for left and right slider (id must have the same base + "-left" or "-right" is added to it based on the side), so we need to set default values to element for left and right slider.

<span class="f-filter__label f-filter-toggler">Podle ceny</span>

<div class="f-filter__expandable">
   <div class="f-filter--price f-filter" id="priceSlider"></div>
   <div class="f-filter__value-wrap">
      <div class="f-filter__value-left f-filter__value" id="priceSlider-left">
         {$minMaxValues['cena_min']} {$web["JS_CONFIG_CURRENCY"]|noescape}
      </div>
      <div class="f-filter__value-right f-filter__value" id="priceSlider-right">
         {$minMaxValues['cena_max']} {$web["JS_CONFIG_CURRENCY"]|noescape}
      </div>
   </div>
</div>

Finally, we need to set up a script for the slider plugin in the base template (this means a latte file that contains block content tags, e.g.: categories.latte). We do this by calling the createSlider function (we must have imported noUiSlider.js wNumb.js and sliderInit.js), which we fill with parameters: slider id, name input for basic minimum value (default is set as "slider_" + key of min part), name input for basic maximum value (default is set as "slider_" + key of max part), name input of min value set by slider, name input of max value set by slider, unit (e.g.: mm or pcs, etc.), slider type (for price here is given currency (most often CZK or EUR)
```
//price
if (document.getElementById("priceSlider") !== null) {
   createSlider('priceSlider', 'slider_cena_min', 'slider_cena_max', 'cena_min', 'cena_max', '{$web["JS_CONFIG_CURRENCY"]|noescape}', _currency);
}
```

Filter settings by supplement

In the filter.php file add a line with the supplement name key (at your discretion) to the "supplementCheckboxes" field and enter the supplement id as the value
```
private array $supplementCheckboxes = [
   'novinka' => 30
];
```

In the filter.latte file, add input type "checkbox" with name according to the supplement key. If we want to include the number of items displayed after the user checks this input, we use the code {$form['supplement key']->getOption('count', default value if nothing is filled in, for example 0)}

<span class="f-filter__label f-filter-toggler">Podle vlastností</span>

<div class="f-filter__expandable">
   <label class="c-check-styled c-comp-styled c-comp-styled">
      <input type="checkbox" class="onchange-submit" n:name="novinka">
      <span class="c-wrapper">
         <span class="c-wrapper__mark"></snap>
         <span class="c-wrapper__text">Novinka
            <span>{$form['novinka']->getOption('count', 0)}</span>
         </span>
      </span>
   </label>
</div>

Setting the slider in the filter

Filter settings by supplement

Kontaktní osoby