GithubHelp home page GithubHelp logo

apisearch-io / search-ui Goto Github PK

View Code? Open in Web Editor NEW
24.0 3.0 1.0 10.97 MB

:mag: A set of UI components to build a fully customized search!

Home Page: http://apisearch.io

License: MIT License

JavaScript 53.70% TypeScript 45.32% Sass 0.98%
apisearch-ui search-engine vanilla-js es6 apisearch search filters faceted-search

search-ui's People

Contributors

alexhoma avatar mmoreram avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

Forkers

xgbuils

search-ui's Issues

Improve infinite scroll

  • Add a load more button
  • Force the automatic infinite scroll to work only with the wheel
  • Add a loading code

MultipleFilter widget preloads all aggregations every time

MultipleFilter widget preloads all aggregations every time and this makes every query super heavy and increases the response time. Even if the limit of items is set and "Show more" button is on, all data is loaded. So when we click to "Show more", the data is already loaded, we only hide or show the items. And this is bad. Because if we have 1000 aggregations to load, this will be queried each time.

Solution: when limiting the items (aggregations) shown on the widget, only query this items. Not all of them. And when clicking show more, the rest of items will be queried.

const multipleFilterWidget = ui.widgets.multipleFilter({
    target: "#authors-filter",
    name: "author",
    filterField: "author_id",
    limit: 5,  // <-- this limit
    showMoreActive: true
})

UI load only when it's visible, or even when the user focus on search input

In order to reduce some first-results loads, we can work with certain events before making the first load

  • When the UI result widget is visible in the browser (we could check if it's possible to define this value a number of pixels before to increase UI and reduce this effect as much as possible)
  • When the user clicks in the search engine

set dictionary

given an object, where the key is the translation key, and the value the translation, we should add the possibility to work with translatable texts in all the templates.

Transform data callable parameter on some widgets.

When using MultipleFilter widget to refine a search based on a "rating" values, with our logic-less template engine there is no way to transform the given rating number to a star icons. This is just an example, but there are a lot more.

It would be useful to have an attribute, something like dataHelper or dataTransformer to transform the received data before is being passed to the template compiler.

Promote/Exclude uuid's parameter on Result widget

Possibility to add a parameter, something like promotedItems on ResultComponent to promote some items on the result search.

Also to add a parameter like excludedItems on ResultComponent to exclude some items on the result search.

Page preload on certain events

We can anticipate the results when we think that the use will require it.

  • On paginate item focus (both pagination and infinite scroll load more button - #39)

Range filter and own condition

Hi!
Two fast questions:

  1. How to create range filter?
  2. How to add own condition to search, which can no visible in filters, e.g. I have static page with category ?category_id =300, and I want saw only items only from this category without button check filter.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.