This package has been deprecated

    Author message:

    this is no longer compatible with the latest versions of instantsearch

    instantsearch-ion.rangeslider

    0.1.0 • Public • Published

    instantsearch-ion.rangeSlider

    This JavaScript library embeds the awesome ion.rangeSlider as an instantsearch.js widget.

    build status NPM version

    Table of Contents

    Preview

    widget

    Usage

    To use the ion.rangeSlider as a widget, do as follow:

    • include the ion.rangeSlider theme, for instance the ion.rangeSlider.css and ion.rangeSlider.skinFlat.css stylesheets,
    • include the ion.rangeSlider.min.js JavaScript script,
    • include the instantsearch-ion.rangeSlider.min.js JavaScript script,
    • and instantiate the instantsearch.widgets.ionRangeSlider widget.
    <!DOCTYPE html>
    <html>
      <head>
        <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/ion.rangeslider/2.0.6/css/ion.rangeSlider.css">
        <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/ion.rangeslider/2.0.6/css/ion.rangeSlider.skinFlat.css">
      </head>
      <body>
        <div id="slider"></div>
        <!-- [...] -->
        <script src="https://cdn.jsdelivr.net/ion.rangeslider/2.0.6/js/ion.rangeSlider.min.js"></script> 
        <script src="instantsearch-ion.rangeSlider.min.js"></script> 
        <script>
          var search = instantsearch({
            appId: 'YourApplicationID',
            apiKey: 'YourSearchOnlyAPIKey',
            indexName: 'YourIndexName'
          });
          // [...]
          search.addWidget(
            instantsearch.widgets.ionRangeSlider({
              container: '#slider',
              facetName: 'YourAttribute'
            })
          );
          // [...]
          search.start();
        </script> 
      </body>
    </html>

    Development

    To start developing, you can use the following commands:

    $ npm install
    $ npm run dev
    $ open http://localhost:8888/test/playground.html

    Linting is done with eslint and Algolia's configuration and can be run with:

    $ npm run lint

    Testing

    Unit tests are written using Jasmine and ran with Karma. Integration tests are using Mocha and Saucelabs.

    To run the unit tests suite run:

    $ npm test

    To run the integration tests suite run:

    $ npm run build
    $ npm run server
    $ ngrok 8888
    $ TEST_HOST=http://YOUR_NGROK_ID.ngrok.com SAUCE_ACCESS_KEY=YOUR_KEY SAUCE_USERNAME=YOUR_USERNAME./node_modules/mocha/bin/mocha --harmony -R spec ./test/integration/test.js

    Credits

    • Ion.RangeSlider. An easy, flexible and responsive range slider with tons of options.

    Install

    npm i instantsearch-ion.rangeslider

    DownloadsWeekly Downloads

    10

    Version

    0.1.0

    License

    MIT

    Last publish

    Collaborators

    • haroenv
    • speedblue
    • redox