Event Search Funnelback Showcase Example Code

Developers Search Interface
1

Possible to share code for the Event Search Facet? We have the Event Search working ok, but now trying to configure the frontend, display options like this.

Screen Shot 2017-07-28 at 13.34.43.png301×403 9.29 KB

Seen here: http://showcase.funnelback.com/s/search.html?collection=showcase-events&profile=_default&query=!showallresults&event_start=2017-07-28&event_end=2017-08-04

2

Would be great to see the FTL used in the example.

3

There’s a few bits and pieces coming together there - FTL is only one small part of it:

  1. Hook scripts pre/post process to deal with the ‘event_start’ and ‘event_end’ URL values - http://showcase.funnelback.com/s/search.html?collection=showcase-events#nav-configuration

  2. JS for rendering the Calendar popups (see source)

  3. FTL is probably the least interesting bit:

      <form class="" action="${question.collection.configuration.value("ui.modern.search_link")}" method="GET" role="search">
             		<input type="hidden" name="collection" value="${question.inputParameterMap["collection"]!}">
         			<@s.IfDefCGI name="enc"><input type="hidden" name="enc" value="${question.inputParameterMap["enc"]!}"></@s.IfDefCGI>
     			<@s.IfDefCGI name="form"><input type="hidden" name="form" value="${question.inputParameterMap["form"]!}"></@s.IfDefCGI>
     			<@s.IfDefCGI name="scope"><input type="hidden" name="scope" value="${question.inputParameterMap["scope"]!}"></@s.IfDefCGI>
     			<@s.IfDefCGI name="lang"><input type="hidden" name="lang" value="${question.inputParameterMap["lang"]!}"></@s.IfDefCGI>
     			<@s.IfDefCGI name="profile"><input type="hidden" name="profile" value="${question.inputParameterMap["profile"]!}"></@s.IfDefCGI>
     		    <label for="event_start">After</label>
                 <div class="input-group">
                     <input type="text" name="event_start" value="${question.inputParameterMap["event_start"]!}" class="form-control datepicker" id="event_start" data-date="${.now?date?iso_utc}" data-date-format="yyyy-mm-dd">
                 	<span class="input-group-addon"><span class="fa fa-calendar"></span></span>
                 </div>
                 
                 <label for="event_end">Before</label>
                 <div class="input-group">
                     <input type="text" name="event_end" value="${question.inputParameterMap["event_end"]!}" class="form-control datepicker" id="event_end" data-date="${.now?date?iso_utc}" data-date-format="yyyy-mm-dd">
                     <span class="input-group-addon"><span class="fa fa-calendar"></span></span>
                 </div>
                 <br>
     			<button type="submit" class="btn btn-primary btn-sm"><span class="glyphicon glyphicon-search"></span> Search</button>
     		</form>
4

Thanks. How are these links generated?

<ul class="list-unstyled">
                    <li><a href="        search.html?collection=showcase-events&amp;profile=_default&amp;query=!showallresults&amp;event_start=2017-07-28&amp;event_end=2017-07-28
" title="All events matching '!showallresults' on today">Today</a></li>
                    <li><a href="        search.html?collection=showcase-events&amp;profile=_default&amp;query=!showallresults&amp;event_start=2017-07-28&amp;event_end=2017-08-04
" title="All events matching '!showallresults' in the coming week">Coming week</a></li>
                    <li><a href="        search.html?collection=showcase-events&amp;profile=_default&amp;query=!showallresults&amp;event_start=2017-07-28&amp;event_end=2017-08-28
" title="All events matching '!showallresults' in the next month">Coming month</a></li>
                    <li><a href="        search.html?collection=showcase-events&amp;profile=_default&amp;query=!showallresults&amp;event_start=2017-07-28&amp;event_end=2017-10-29
" title="All events matching '!showallresults' in the coming three months">Coming three months</a></li>
                </ul>

Also would be interested to know how these groupings by occurrence date are configured.

Screen Shot 2017-07-28 at 20.35.34.png1670×1220 147 KB

5

Can see now that the groupings by occurrence date are done using tierbars. Managed to turn this on using some ftl changes.

6

This is done by enabling events mode in Funnelback.

Before you do this you need to be aware that there are a number of limitations when using events mode. Events mode is documented here: Event Search - Funnelback Documentation - Version 15.10.0

There is some further advice about the incompatibilities here: Redirect Notice

Basically, events mode should only be used in very limited circumstances (if you have event results that need to appear more than once in the search results) as it relies on an old mode of operation (Term at a time mode) that is incompatible with a lot of newer features.

One good way of using events mode is to have a dedicated profile for your events search where events mode is enabled just on that profile.

Another gotcha with events mode is the formatting of the event queries - a % character is used within the query - anything that appears to the left of this is treated as normal query parameters and everything to the right is an event parameter