Footlight Minimal Search widget

sahalali commented 1 year ago

Here is the link to the planning issue: https://github.com/culturecreates/minimal-footlight-search-widget/issues/9

### Tasks
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/11
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/30
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/12
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/13
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/14
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/15
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/16
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/17
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/18
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/19
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/20
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/21
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/22
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/23
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/24
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/25
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/26
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/27
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/28
- [ ] https://github.com/culturecreates/minimal-footlight-search-widget/issues/29

sahalali commented 1 year ago

@sahalali Please find the attachment containing the icons for the calendar.

Calendrier-20230719T173048Z-001.zip

troughc commented 1 year ago

comments from DEMO Issue

Single dates: sometimes there is a space between on left
Single dates: when you select single date - the wrong events (wrong dates) are displayed - not seeing the right dates (first screenshot in next comment)
When you click effacer - the calendar on left should reset to the current date
When you click ‘load all results button at bottom you should display all the events (limit may not being passed in the payload - comment from Abhishek)
Looks like the label fallback configuration is missing (comment from Gregory)

Mobile

Date range selection - looks good
Single date shows too many dates - not passing the end date (Siam’s comment)
In mobile Search bar: can only show date or search term - search takes precedent.

Organizations

Date should not be shown
Date as a parameter should not be sent with organizations

Questions for MINIMAL Image

When image missing, do you want to use/provide a default image?
How to display the date and search term in mobile? Can we put it on 2 lines

sahalali commented 1 year ago

troughc commented 1 year ago

Caitlin's early feedback from trying the new search widget in Gregory's staging site.

When I click an event in the list, no event is loaded (this is the same issue as when you click 'voir tous les résultats' as discussed during the demo).
Are you supposed to be able to scroll the event list display on the left? I cannot. When I load a date range, I can see 4 events displayed and the voir tous les resultats with a number (see screenshot). I cannot scroll the list on the left to see more events.

already noted is that the single date option (to select a single date isn't working as expected. you need an end date I think?
the Clear option (EFFACER) seems to be working okay but I noticed one thing: When i click effacer, the number of events displayed next to 'voir tous les résultats' is 181 and NO DATE is highlighted in the calendar (on the right). How do I know what this number (181) is referring to? In contrast, if I enable the single date option and select a date in the future (say in August) the number of events next to 'voir tous les résultats' is different (depending on the date). So my question is: do we need to show (on the calendar) what date or date range is being used to generate the number of events when nothing is selected? (I hope this is clear)?
How do you clear out a search term? Do you have to select it and then delete it?
for Organizations section: you need to remove the word "prochainement" from the top of the list, as well as the strange spacing when there are fewer than 4 results (as discussed in the meeting). To see this behavior of fewer results, you can search on "ACAD"

troughc commented 1 year ago

@SyamBabu-M here is my guidance in writing:

please have the search for a specific date (single date) display results for that specific date (for example, the visitor clicks August 10 and gets results for August 10); the user searches for 'Danse' on August 10 and gets results that include the term 'Danse' that are happening on Aug. 10 NOTE: when no results are found, the date text that is displayed will be correct (because the single date is displayed under 'aucune evenement displonible')
Date range seems to be working well
By default, the way you highlight the current date (today's date) should be different from any dates you select (either a single date or date range). Right now you have the underline to diffentiate it, which is good. It would only be yellow if the user/visitor selected it. Hope this helps.

troughc commented 1 year ago

When no events are available the text has a typo with : Aucun Événements disponible It should be:

Aucun événement disponible

SyamBabu-M commented 1 year ago

@troughc Hi, thanks for the detailed summary in writing, all the points mentioned above are taken care of. 1: Fixed the spelling error in the message when no events are available. 2: Changed the default highlight color on today's date. 3: Changed the query params to include the end date so that the result will be for that specific date only

troughc commented 1 year ago

@SyamBabu-M I am looking at it in Gregory's test area here http://demo.staging-tout-culture.s3-website.ca-central-1.amazonaws.com/ ' Some things don't seem to have changed? But maybe it's because I am looking in the wrong place. Here is my test results:

Point 2 - looks good

point 1, I am still seeing the spelling error: To reproduce: Select a date far into the future (2025 Aug 10 for example) when there are no dates available.

On the left side the text displays Aucun Événements disponible
the text should be: Aucun événement disponible (Please note the change is to the second word - capitalization and no 's' at the end)

Point 3: it doesn't look like it is displaying only the events that are happening on the one selected date. Steps to reproduce:

Select a date in the calendar.
The list updates to include all future events (from the selected date going forward).

troughc commented 1 year ago

Thanks for merging the update @SyamBabu-M New TEST on Chrome Point 1: PASSED Point 3: Looking better but still has some issues: there are some wrong events that are event series that are being included in single date searches. These wrong events don't have any sub event on my selected date. to reproduce:

select August 23, 2023 in the calendar view
The results update (18 events). This is good because i can see that the results are closer to what I expect. However, there are events included that are not happening on august 23.
Open these events to see that they don't have a sub event on August 23: Jam Trad au Quai des Légendes (there is an event on August 24).
Select August 24, 2023 in the calendar
open this event: Le bureau de Charles Symmes - Chambre d'évasion This one has no event on August 24 (it has one on august 23 and august 25)

Hope this helps with troubleshooting.

sahalali commented 1 year ago

@troughc Point 3 is a known issue in the backend. Currently, the subEvent dates are not considered while filtering but the startDate and endDate of the parent Event.

@saumier I am not sure we have an open issue for this. If not, can we open an issue?

saumier commented 1 year ago

@sahalali Yes. This is issue https://github.com/culturecreates/footlight-calendar-api/issues/537

troughc commented 1 year ago

@SyamBabu-M UPDATED with clarifications from MINIMAL/client.

for largest screens (highest res) fix display of organizations so the names are left aligned as per the trello feedback.
Can you take a look at the font size for 4K resolution screens (make it bigger as per the trello feedback).
(NEW) Regarding SCROLL: The request is to include 10 items that can be scrolled in the result list (rather than 4). The assumption is that you keep the vertical sizing of display as is (showing 4 event results) and that you scroll to see the additional events/workshops/organizations. Make sense?

troughc commented 1 year ago

@SyamBabu-M request to change the wording of message we display when no events are available. This message:

Please change to:

French: Aucun événement présentement English: No events at the moment

troughc commented 1 year ago

message for workshops in French: Aucun ateliers présentement

troughc commented 1 year ago

Gentle reminder @SyamBabu-M

Please fix the messages that appear when no result is returned. Pay careful attention to capitalization of each word in the sentence. Only the first word is capitalized.

You need to make a changes to both French and English messages.

FRENCH fixes:

For workshops (ateliers) - note the capitalization change as well Replace 'Aucun Ateliers disponible' with the following:

Aucun ateliers présentement

For Events (événements) - please pay attention to accents on letters) Replace 'Aucun evénement disponible' with the following:

Aucun événement présentement

For organizations (organisations) - note the capitalization change Replace 'Aucun Organisations disponible' with the following

Aucun organisations disponible

ENGLISH fixes (only need to fix capitalization of second word):

For workshops: Replace 'No Workshops at the moment' with the following:

No workshops at the moment

For organizations: Replace 'No Organizations are available' with the following

No organizations are available

cc @sahalali

SyamBabu-M commented 1 year ago

@troughc Noted.

troughc commented 1 year ago

@SyamBabu-M a little research to prevent the zoom in on input elements (when you focus on a field). cc @saumier

Note: this tag may have to be also added by MINIMAL to the parent page.

troughc commented 1 year ago

Tested in Gregory's test site on CHROME everything I tested is working great: PASS

That said, I stumbled on one question I have for you @saumier regarding the following: eventId=648cd2ed5526a700645056d7

The event types include both "Festival" and "Workshop | Art and Craft".

The event only appears in Workshops (atelier) search results when I search on Festival (It is not included in events searches).

Is that the expected behavior? Logically, it could be, one could argue that festival is a secondary category to a type of workshop. However, Festival has it's own separate entry in the controlled vocabulary for event type (it is not a sub-category to 'course' or 'workshop'). @saumier I would like your opinion on this.

saumier commented 1 year ago

@troughc If an event is a workshop then it will be excluded from events in Tout Culture because the approach we have for the API is to exclude events in a specific category such as Workshop. Tout Culture displays 'events' that exclude all workshops and Courses. So events that are tagged both Festival and Workshop will be removed from 'events' and appear only under 'workshops'.

culturecreates / minimal-footlight-search-widget

Footlight Minimal Search widget #10