Search Page: Add "Search Inside" async preview card

[mekarpeles]

Description, Patron Story

A patron performs a search on OpenLibrary.org and sees search results, with the addition of a new lazy loaded preview card showing fulltext / search-inside match(es) that allows the patron to click and switch to see all e.g. "1,234 full text matches"

Relevant Designs

e.g.

Search Inside: see all 18,232 books containing the phrase "kreb cycle":
[cover1] [cover2] [cover2]

Feedback Questions

Decisions

Stakeholders

[Ayush1404]

Hey @mekarpeles, I would like to work on this issue and implement the proposed enhancement. Before proceeding, I'd like to confirm if my understanding aligns with exactly what you want to be implemented.

From my understanding , we want to change the way how our inside search page looks and we want the design for it. Right now our inside search page looks as given below we want to change it such that patron only sees the cover,name and may be borrow and want to read button of the books having the searched text inside them . Then when user hovers over the book we want a lazy loaded card to appear which will have info about the texts matched i.e no. of results matched and maybe first few matched texts and a button to see all text matches .

Could you please confirm if this captures the what you wanted? If there are any additional details or specifications, please let me know. Once confirmed, I'll proceed with working on the implementation.

Looking forward to your feedback.

[mekarpeles]

Hi @Ayush1404, thank you so much for your interest!

This change is actually to the default Books search result page:

The idea would be that, e.g. after the 3rd search result, we would insert a special card (almost like an ad might appear) into the search results which gives the reader a preview of which relevant books contain the text they searched for.

e.g.

Here's another design concept

This card would be injected asynchronously using javascript after the page had loaded and show (in addition to the standard search results) a preview of Search Inside matches that they wouldn't otherwise have seen. The idea is that the patron would be able to use this card to preview search inside results and then either click one of the book covers to go to that book page, or help the patron switch to the Search Inside tab where they can see "search inside" results that may be more relevant to their query.

[Ayush1404]

Hey @mekarpeles really sorry for the late , it was my exams in the college . Now i understand the proposed feature completely so it is basically a "preview" of search results from search inside tab in books tab. I think it is great feature, the design you sent as image seems good tho , should we still try to make a design for this or should we design it like the image you provided ? Extreamly sorry about the gap in my responce but i had exams going on .

[merwhite11]

@mekarpeles I am working on this issue here: https://github.com/internetarchive/openlibrary/issues/1001

Please assign to me!

[mekarpeles]

Another design @cdrini proposed (see https://codepen.io/cdrini/full/RwmwOoV), w/ some tweaks I've added