Ctrl-click on results #517

s-pace · 2018-11-01T21:56:47Z

PR that:

Fix the highlighting of lvl1 and lvl2
Enable command + click
Enable link preview
~~Enable multi input~~
Add a playground to use served assets

…hting in lvl1 & lvl0

algobot · 2018-11-01T21:57:56Z

Deploy preview ready

Built with commit fe530ca

https://deploy-preview-517--docsearch.netlify.com

s-pace · 2018-11-01T21:58:24Z

Live demo of the new search https://docsearch-pr517.surge.sh/

.prettierrc

scripts/playground.html

scripts/serve

pixelastic · 2018-11-02T06:44:05Z

src/lib/DocSearch.js

@@ -64,7 +64,7 @@ class DocSearch {
    this.apiKey = apiKey;
    this.appId = appId;
    this.indexName = indexName;
-    this.input = DocSearch.getInputFromSelector(inputSelector);
+    this.input = DocSearch.getInputsFromSelector(inputSelector);


If we can now accept several selectors and not just one, I would rename this.input to this.inputs

Ok I will enhance it with the string selectors

src/lib/DocSearch.js

src/lib/templates.js

pixelastic · 2018-11-02T07:05:58Z

src/lib/templates.js

@@ -67,7 +71,9 @@ const templates = {
  `,
  footer: `
    <div class="${footerPrefix}">
-      Search by <a class="${footerPrefix}--logo" href="https://www.algolia.com/docsearch">Algolia</a>
+      <a class="${footerPrefix}--logo" aria-label="Search by algolia" href="https://www.algolia.com/docsearch">
+        <img src="${searchByAddress}" alt="Search by algolia" height="100%" width="100%">


I don't think we should be using an external url for the image. I would rather have it either as an inline SVG in the JavaScript, or as a background image from the CSS. In any case, if we use an URL, we should use one that targets an origin we control (ie. something in the DocSearch repo, or DocSearch website, not on the main Algolia website).

I'm gonna ping @JonasBa on this: How do you suggest we include the "Powered by Algolia" logo in DocSearch? As an inline SVG, a background image or a hotlink?

I will use https://instantsearch-css.netlify.com/widgets/powered-by/ instead

src/styles/main.scss

Co-Authored-By: s-pace <[email protected]>

…he first one

…ll failing

Co-Authored-By: s-pace <[email protected]>

pixelastic · 2018-11-05T09:26:06Z

I removed the multi-input feature as it was not working as intended (we only return one instance, so we cannot bind it to two different inputs). I also remove the two inputs from the playground (keeping only one), as we don't yet handle multiple inputs, it was confusing.

I changed the handleSelected logic so it works with links. Basically by default a a is enough to redirect people to the destination on click (we still need our own handleSelected for keyboard navigation though). But when a specific handleSelected is defined by the user, it should take precedence. When such a handleSelected is defined, we prevent all links from executing their default behavior by catching all click on those elmeents and calling event.preventDefault().

This works well from my manual tests, I still have one unit test to write and it should be ok.

s-pace

Need test and we go live 🎉

.prettierrc

s-pace · 2018-11-05T10:12:29Z

@pixelastic I wanted to resolve automatically the conflicts. I have used the hint provided by github. It actually merges everything.
Feel free to open a PR to add test, then we can release it

pixelastic · 2018-11-05T13:11:53Z

Wait, we should not release this as v3, but keep it a minor bump.

If we release it as v3, people won't be able to use it right away, as it would require them to update the link to the CDN:

We need to make sure it's still a v2.x, with backward compatibility. We want to keep the big bump to v3 for the rewrite, where we'll be able to break backward compat if needed.

s-pace · 2018-11-05T13:13:55Z

I think we do not have any issue with releasing it straight away. I do not see any breaking change. Use os really regular so let's release the v2 :)
(We will help people to solve issue if needed)

s-pace · 2018-11-05T13:14:15Z

Could you have a look regarding gzip or any way to reduce the size of it pls?

pixelastic · 2018-11-05T13:18:04Z

I think we do not have any issue with releasing it straight away.

We're still missing at least one test. I would not release something that hasn't been tested

Could you have a look regarding gzip or any way to reduce the size of it pls?

Yes, and I think the logo display is bigger in that branch than it used to be. I'd like to double check that before the release as well.

s-pace · 2018-11-05T13:20:01Z

Fine with it. Write a test and then we can release 🎉

s-pace added 7 commits November 1, 2018 14:48

after npm install

02ac68f

simple eslint reformat

71fd398

add a playground to use served assets

8e52c20

Using a tags to have cmd + click feature and URL preview, fix highlig…

a62d19c

…hting in lvl1 & lvl0

avoid issue with scss

9c6ef3d

removing handleSelected properly, make sure backward compatibility

16790f9

adding multi input feature closes #230

b8c5569

s-pace requested review from pixelastic and Haroenv November 1, 2018 21:58

pixelastic requested changes Nov 2, 2018

View reviewed changes

pixelastic and others added 18 commits November 2, 2018 08:14

better use of aria

afa72dd

Co-Authored-By: s-pace <[email protected]>

change args.inputSelector as a string

9e80e72

svg footer

99d69e6

better a tags handling for result

12a64cb

update getInputFromSelector

04a4470

use inputs instead of input

e517eb0

removing unused URL

b211630

better management of selector matching plenty element, we only take t…

67b64d6

…he first one

test compatibility with multi selectors

b5abdce

Use Error convention

b3a1406

better fallback on handle selected

3caa399

compatibility with multiple input

3979e4f

handleSelected test

e0c72a7

compatibility with multiple input

bb1e19d

should listen to the selected and shown event of autocomplete is sti…

b3c057e

…ll failing

Better explanation of playground

dd6f2f1

Co-Authored-By: s-pace <[email protected]>

overridde instead of replace

e0b8b7a

Serve playground

6442e03

pixelastic added 2 commits November 5, 2018 10:22

Disable links with handleSelected is defined

8931345

Add tests (still one test WIP)

5e85d7b

pixelastic changed the title ~~Feat/v3~~ Ctrl-click on results Nov 5, 2018

s-pace commented Nov 5, 2018

View reviewed changes

.prettierrc Outdated Show resolved Hide resolved

s-pace added 2 commits November 5, 2018 11:01

Merge branch 'feat/v3' of github.com:algolia/docsearch into feat/v3

bbeb2f4

add the proper version

fe530ca

s-pace merged commit fe530ca into master Nov 5, 2018

pixelastic deleted the feat/v3 branch November 5, 2018 13:07

s-pace mentioned this pull request Nov 13, 2018

feat(selected): Adding context about original event triggering an autocomplete:selected event algolia/autocomplete#267

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Ctrl-click on results #517

Ctrl-click on results #517

s-pace commented Nov 1, 2018 •

edited by pixelastic

Loading

algobot commented Nov 1, 2018 •

edited

Loading

s-pace commented Nov 1, 2018

pixelastic Nov 2, 2018

s-pace Nov 2, 2018

pixelastic Nov 2, 2018

s-pace Nov 2, 2018

pixelastic Nov 2, 2018

pixelastic commented Nov 5, 2018

s-pace left a comment

s-pace commented Nov 5, 2018 •

edited

Loading

pixelastic commented Nov 5, 2018

s-pace commented Nov 5, 2018

s-pace commented Nov 5, 2018

pixelastic commented Nov 5, 2018 •

edited

Loading

s-pace commented Nov 5, 2018

Ctrl-click on results #517

Ctrl-click on results #517

Conversation

s-pace commented Nov 1, 2018 • edited by pixelastic Loading

algobot commented Nov 1, 2018 • edited Loading

s-pace commented Nov 1, 2018

pixelastic Nov 2, 2018

Choose a reason for hiding this comment

s-pace Nov 2, 2018

Choose a reason for hiding this comment

pixelastic Nov 2, 2018

Choose a reason for hiding this comment

s-pace Nov 2, 2018

Choose a reason for hiding this comment

pixelastic Nov 2, 2018

Choose a reason for hiding this comment

pixelastic commented Nov 5, 2018

s-pace left a comment

Choose a reason for hiding this comment

s-pace commented Nov 5, 2018 • edited Loading

pixelastic commented Nov 5, 2018

s-pace commented Nov 5, 2018

s-pace commented Nov 5, 2018

pixelastic commented Nov 5, 2018 • edited Loading

s-pace commented Nov 5, 2018

s-pace commented Nov 1, 2018 •

edited by pixelastic

Loading

algobot commented Nov 1, 2018 •

edited

Loading

s-pace commented Nov 5, 2018 •

edited

Loading

pixelastic commented Nov 5, 2018 •

edited

Loading