The Search Gadget

MVC Enhancement

The Search Gadget is the starting point for your users to find Bookit products to book. A live example is shown below:

The base syntax for starting the gadget is :

// Domready wrapper
$w(function() {
// Search gadget initialisation
BE.gadget.search('dom element',options);
});

Where 'dom element' is a CSS selector string for the dom element you wish to insert the gadget into, and 'options' is an object containing the keys for the settings you wish to change.

 

If you look at the source code for this page, you'll see the gadget code that was used to start this gadget. Let's take a look at this working version:

<script src="//gadgets.impartmedia.com/gadgets.jsz" type="text/javascript"></script>
<script type="text/javascript">
$w(function() {
BE.gadget.search('#search-example',{
vcID:85,
period:5,
adults:4,
children:2,
infants:2,
hybridMode:true,
hybridOptions:{
'accom': { tabName:'Stay', adults:2 },
'events':{ tabName:'Play', adults:1 }
},
minDaysFromToday:10,
searchLocation:'./02-region-gadget.html'
});
});
</script>

You can edit the above code and either: hit esc; or click this paragraph to refresh the gadget.

The only truly required option is the vcID. Without this the gadget can't know which visitor centre it's dealing with. All other options are optional, but are likely to be needed in certain circumstances. Also, there is no required order for the options.

Search Gadget Defaults

If not supplied, these are the default values for the Search Gadget:

adults               2
children             0
campaignID           null
collapseRefineTools  false
defaultDate          null
defaultDaysFromToday 0
disabledTypes        null
hybridMode           false
hybridOptions        {}
infants              0
limitLocations       null
minDaysFromToday     0
noAdults             45 
noChildren           45
noInfants            45
noConcessions        45
noStudents           45
noObservers          45
noFamily             10
period               3
searchLocation       '/search/'
showRefineTools      false
vcID                 null
enableRegionSearch   false
forceRegionLoc       null
forceRegionRegion    null
forceRegionState     null

All possible parameters are described below. Click the title to see more information.

accomOnlyMode

Only show accommodation operators on the gadget search.

adults

The default number of adults in the chooser, when the user first loads the page.

agKey

e.g. `agKey: "12345678-9abc-0def-g98h-7i6kl5m43210"`

When you supply a Bookeasy Agent’s unique Agent Key, the gadgets will authenticate the end user and tag the booking as a booking received by the Bookeasy Agent pertaining to the Agent Key specified. Bookeasy recommends that when used, this parameter should be applied to the Search, Region and Item Details gadgets in order to ensure that agent authentication is always applied, regardless of the web page the end user lands on.

You can obtain a Bookeasy Agent's unique Agent Key via the Bookeasy Staff Console when viewing the Agent, or the homescreen of the agent’s Bookeasy Agent Console.

children

The default number of children in the chooser, when the user first loads the page.

campaignID

This will put the gadget into campaign mode, and will only show operators that are part of the supplied campaign ID. In campaign mode, the sort order tool is hidden, as the sort order is defined at the campaign level. Should the campaign have used the levels functionality, then the gadget will add classes you can use to style the various levels.

The syntax for converting your level names to classes is: set to lowercase, replace spaces with hyphens and remove any numbers at the start of the name. So for example, 'First Class' would become 'first-class'. Note: your style declarations will need to use !important if you don't set rules any more specific than the ones already in use by the gadget.

collapseRefineTools

Will collapse the refine tools and show an 'Advanced Search' link to show/hide the refine tools

crossDomainSearch

Will carry the search cookies from one domain to another if hosting the region gadget on a different domain to the search gadget.

defaultDate

Rather than set a preferred days from today (using the next option below), you can hard-set a particular date you would like the gadget to default to. This options accepts a string of the format 'dd/mm/yyyy', or a JS date object.

defaultDaysFromToday

Set as the number of days-from-today as the default for the search.

defaultRegionLoc

Set a specific location as the default for the search.

defaultRegionRegion

Set a specific region as the default for the search.

defaultRegionState

Set a specific state as the default for the search. eg. ACT,NSW,NT,QLD,SA,TAS,VIC,WA

disableDatePicker

Hides the date picker

disabledTypes

If you wish, or your VC doesn't use some of the bookable types, you can remove them from the drop down by setting this option to an array of any of these four strings: 'accom', 'tours','events','carhire','packages'.

enableRegionSearch

Set to true to get the gadget to break down the location refine tools select list into state/region/location. Must have the showRefineTools option set to true.

externalSearch

To enable ALL operators in the Bookeasy Distribution Network to come back as results.

forceDate

Hard-set a particular date you would like the gadget to default to with no option to select another. This options accepts a string of the format 'dd/mm/yyyy', or a JS date object.

forcePeriod

The default number of days/nights in the chooser, with no option to select another.

forceRegionLoc

When enableRegionSearch is set to true this will set the location select list to the value supplied.

forceRegionRegion

When enableRegionSearch is set to true this will set the region select list to the value supplied.

forceRegionState

When enableRegionSearch is set to true this will set the state select list to the value supplied.

hybridMode

Set to true to get the gadget to use tabs for the product types, rather than a drop-down box.

hybridOptions

Set to an object containing a key for each product type ['accom','tours','events','carhire','packages'] where the data for each key is an object that contains the settings you want for that mode:
'accom':{
    tabName:        'Stay',
    searchLocation: '/stay/search.html',
    adults:         2
}

infants

The default number of infants in the chooser, when the user first loads the page.

interactiveMapUser

When in interactive map mode, there is no way for a person to specify search criteria for availability. Setting this to true says that it will try use search details from the search cookie if it exists

limitLocations

If supplied an array of strings which match your VC locations, the gadget will be limited to only showing those locations.

minDaysFromToday

The minimum days from today choosable in the date picker.

noAdults

Maximum number of adults that can be selected from the adult drop down.

noChildren

Maximum number of children that can be selected from the children drop down.

noConcessions

Maximum number of concessions that can be selected from the concessions drop down.

noFamily

Maximum number of adults that can be selected from the drop family drop down.

noInfants

Maximum number of infants that can be selected from the infants drop down.

noObservers

Maximum number of observers that can be selected from the observers drop down.

noPeriod

Maximum number of nights that can be selected from the nights drop down.

noStudents

Maximum number of students that can be selected from the students drop down.

period

The default number of days/nights in the chooser, when the user first loads the page.

searchLocation [important]

This tells the search gadget the url to send the user on to the next gadget (region).

showCurrencySelector

Set to true if you want to show the currency dropdown in the embedSearch option.

showPeriod

Set to false if you don't want to show periods dropdown in the embedSearch option.

showRefineTools

If you want the user to be able to set up some preliminary filtering, set this to true. It is important to note that these fields be setup correctly inside the Bookeasy console otherwise this will fail to load

toursOnlyMode

Only show tour operators on the gadget search. Can be set to true/false.

type

As above with productID, this is not normally used. If you need to hard-set a product type, set this to a string, either: 'accom', 'tours', 'events', 'carhire', or 'packages'.

vcID [required]

Set the gadget to fetch data for a particular visitor centre.