Commit Graph

11 Commits

Author SHA1 Message Date
Álvaro Mondéjar
25213c0cb0
Fix errors in website search and remove uneeded statements (#4309)
* Fix error in search and clean website statements

* Remove 'active' class from 'sort-color' sorter

* Add 'order-by-color' class to body

* Remove newlines
2020-12-11 21:56:09 +01:00
Eric Cornelissen
37222f7679
Focus the search input on load (#3572)
Focus the search input on load, if JavaScript is enabled.
2020-09-18 10:40:34 +02:00
Eric Cornelissen
185218ed5f
Fully escape parameter before use in Regexp (#3391)
* Fully escape parameter before use in Regexp
* Update ref URL for escaping
2020-07-31 17:52:07 +01:00
Eric Cornelissen
7fb4ff6395
Fix low severity issues in the JavaScript (#3342) 2020-07-28 11:33:40 +01:00
Peter Noble
f01afa9686
Normalise accented characters in website search (#3180)
* Normalise accented characters in website search

* Move icon name normalisation to Liquid
2020-06-23 18:21:10 +03:00
Eric Cornelissen
b6a2ff1f5a Increase search debounce timeout (#1169) 2019-02-03 22:32:44 +01:00
Eric Cornelissen
db442fb0c1 Improve search performance (#1170)
* Improve performance of search on website

By reducing the number of times a search query loops over all icons or
all icons that match the search query (from 3 to 1 and 2 to 0
respectively) the search on simpleicons.org should now be noticeably
faster (if it was slow before). Especially in conjunction with #1169.

This was achieved by utilizing CSS (which operates faster then plain
JavaScript) to do most of the heavy lifting. A class on <body> now
dictates the order of the icons rather then a JavaScript for-loop (found
in the removed function `orderIcons`).

It was also achieved by more cleverly utilizing the fuzzy search logic
and recognizing that the CSS `order` property also works if number are
not consecutive. Less relevant numbers will have a higher value assigned
by fuzzy search, which is what the `order`-value of the icon will
become, removing the need for sorting and an additional loop.

Some resources that helped me:
- https://css-tricks.com/css-attr-function-got-nothin-custom-properties/
- https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables
    Specifically the "Values in JavaScript" section

* * *

One unrelated change in stylesheet.css where 2 separate rulesets for
.grid-item__link have been merged.

* Simplify script with regard to button states

* Reduce complexity of `previousQuery` variables
2019-02-03 22:31:22 +01:00
Eric Cornelissen
92613a12ed Remember users ordering preference (#1053)
* Add basic support to remember sorting order for users

Without cookies!

* Prevent "sort by relevance" from being the stored preference

because it is not applicable if there is no search query

* Rename "sort" to "order" in scripts

* Create constant for the ordering preference ID in the local storage

* Verify `window.localStorage" exists before using it
2018-11-05 01:58:49 +01:00
Eric Cornelissen
781560abba Update no search results message (#1036)
* Restore "No matching icons found." message

* Update message when no icons are found

with a message that links to a new issue
2018-10-29 18:21:34 +01:00
Eric Cornelissen
0747029205 Website/sort and search (#949)
* Disable sort buttons when there is a search query

* Restore sorting order when search query is removed

* Update comment

* Add button to sort by relevance (non-functional)

As discussed in #949. Relatedly also removed the functionality that 
disabled the "sort by color" and "sort alphabetically" buttons (and 
related styling).

* Update sorting behaviour

Refactored to sorting algorithms into a single function and updated 
relevant code. The "sort by relenvance" button is now functional, and is 
automatically actived when the user starts searching, but not when 
updating their search query.

* Restore sorting ordre when search query is removed

* Only sort when needed

* Refactor activing a sorting button/selecting a soring order

* Renaming variables and functions

* Add colors to "order by relevance" button on hover
2018-09-01 11:20:04 +02:00
Eric Cornelissen
c639949524 Extract CSS and JavaScript from HTML
Put all of the CSS and most of the JavaScript into their own file. The
JavaScript that is left in HTML depends on some Liquid logic present in
the HTML.
2018-01-03 18:41:32 +01:00