Catalog-filtration (En/Ру)

IN DEV: Unstable

Table of Contents

1. Description
2. Installation
3. Import
4. Usage
5. How it work
6. Constructor options
7. Presets
8. Interface
   1. Filtering
   2. Reset filters

Description

It filters the objects of the associative array of data, by providing a filtering control interface.

Installation

npm i catalog-filtration

Import

import Catalog from 'catalog-filtration';
import Goods from './goods.json';

let options = {
    goods: Goods,
    filterFields:['FIELD_NAME_1', 'FIELD_NAME_2'],
    priceField: 'PRICE'
}

let catalog = new Catalog(options);

Usage

 catalog.filter('append', {'FILTER_FIELD': ['filterItem', 'filterItem']})
    .then(getStores)

 function getStores(stores){
    console.log(stores.productList); // List of filtered products
    console.log(stores.availableFilters); // List of available filters for filtered products
 }

See more in the Interface section.

How it works

See wiki

Constructor options

goods – Object/Array - An array of data for filtering.

Example 1:

{ 
    23523535: {
        category: 'female',
        type: 'shoes',
        color: 'black',
        price: 1924,00
    },
    45798436: {
        category: 'female',
        type: 'shoes',
        color: 'white',
        price: 424,50
    }
}

Example 2:

[{
    key: 23523535,
    category: 'female',
    type: 'shoes',
    color: 'black',
    price: 1924,00
},
{
    key: 45798436,
    category: 'female',
    type: 'shoes',
    color: 'white',
    price: 424,50
}]

filterFields – Array - List of fields involved in filtering.

priceField – String - Price field name.

presetRules - Object - See next section.

Presets

You can use preset filter sets. For this, insert presets into constructor option like this:

    presetsRules: {
        'female': {"GENDER": ["Female"], "ACCESSORY": ["N"]},
        'male': {"GENDER": ["Male"], "ACCESSORY": ["N"]} 
    }

Now you can call preset filters anytime:

filter('preset', 'female')

Interface

 import Catalog from 'catalog-filtration';

 let options = { }
 let catalog = new Catalog(options);

Filtering

To filter, use the:

filter(String: type, Object: selectedFiltes)

• type - String - Specify the type of filter action. It can be:
  • null or 'all' - you want apply list of filters;
  • 'append' - for add some filters to existing;
  • 'detach' - for remove some filters from existing;
  • 'preset' - for select products from preset;
  • 'reset' - reset. chosen preset will be saved;
• selectedFilters - Object - As an argument to the method, an array is used, from the selected filters.

catalog.filter(null, {'FILTER_FIELD': ['filterItem', 'filterItem']})

Or

let selected = {
    'FILTER_FIELD': 
        ['filterItem', 'filterItem']
    }
catalog.filter('append', selected)

In response to a query, filtering results can be obtained

catalog.filter('detach', {'FILTER_FIELD': ['filterItem', 'filterItem']})
    .then((stores) => ){
        console.log(stores.productList); // List of filtered products
        console.log(stores.availableFilters); // List of available filters for filtered products
    })

Or

 catalog.filter('detach', {'FILTER_FIELD': ['filterItem', 'filterItem']})
    .then(getStores)

 function getStores(stores){
    console.log(stores.productList); // List of filtered products
    console.log(stores.availableFilters); // List of available filters for filtered products
 }

Limitation

Filters, not specified when Import, Will be ignored.

Reset filters

To reset the filters, use filter method call. In this case chosen preset will be saved:

filter('reset')

or complete reset:

reset()