Documentation
Search Form Technology
Sep 28th
If you’re a hardcore affiliate of VroomVroomVroom or an employee, use this guide to setup and customise your form.
Contents of this Guide
Installation
Client Side Javascript
Server Generated Javascript
Styles
Changing Form Defaults
Form Options
I want to speed things up
Installation
You need to copy and paste the code found in “My Account” into your website or blog. The coud found there will include your affiliate tracking ID’s
Client Side Javascript
There are 3 javascript files that do cool stuff.
1. vroom.js
This is the engine room. This is where it all happens Validation, URL Generation, Server Side Calls, AutoComplete Feature, Form Initialisation
2. writeform.js
This generates and uses document.writes for the HTML that displays the form. If you don’t like javascript, you might like to write the HTML out manually, in RAW html form. See “Speeding things up” for information on this
3. jquery.js
This is a meger of several jQuery libraries. It is used for Calendar, Autocomplete and DOM manipulation
There are no “minified” versions of these files at this stage, although jquery.js is already a minified version. We will inform you further if we release minified versions of the above files.
Server Generated Javascript
If you are lucky, you won’t need to get involved with this. The vroom search form makes calls to the vroom server for dynamic javascript. This allows AJAX-like functionality using old-school technology. This means the form can be hosted anywhere and there is no need for messing around with server side php or aspx files to get cross-domain AJAX to work.
The calls made using a function “includejs” and calls the following example files:
http://www.vroomvroomvroom.com/locationJS.aspx?country=US //to retrieve locations for different countries
http://www.vroomvroomvroom.com/depotJS.aspx //to retrieve depots for different locations
Styles
Set the theme variable to change the design of your search form.
eg.
var THEME = “greenfresh”;
Other options are:
bluefresh
greenfresh
orangefresh
greyfresh
whitefresh
blankfresh
If you are a CSS guru make any cool changes, share them with us!
Changing Form Default Options
You can help the user by changing the default values of details you probably know about them. Like Country, City and maybe even dates.
This is done using javascript variables in the source code at installation time or using query string. The query string variable names are the same as the javascript variable names. The javascript variables override the url variables. ALL ARE OPTIONAL but they may make things easier for your customer. They are:
var HTTPSERVER = “http://www.vroomvroomvroom.com.au/”; //path of vroom server. Change to http://www.vroomvroomvroom.com or http://vroomvroomvroom.com.au, depending on which is faster for your website. The .com is hosted in Dallas Texas. The .com.au is hosted in Brisbane, Australia.
var COUNTRYID = “AU”; //AU, UK, US, NZ, CA
var PICKUPFROM = “”; //a city name like Brisbane, New York, San Francisco, London
var RETURNTO = “”; //a city name like Brisbane, New York, San Francisco, London
var AFFILIATEID = “”; //the affiliate id you were given when you signed up.
var PICKUP_PROMPT = “Type in pickup city or airport code here”; //message to ask users to type a city.
var RETURN_PROMPT = “Type in return city or airport code here”;
var SUGGESTION_MODE = “AUTOCOMPLETE”; //OFF or LIST or AUTOCOMPLETE.(when PICKUPFROM is set)
var ADVANCED_MODE = “OFF”; //OFF or MAPLINK or MAP
var DEPOT_SELECTION = “COLLAPSED”; //OFF or COLLAPSED or EXPANDED
var THEME = “bluefresh”; //bluefresh or greenfresh or other themes
An example querystring is:
http://www.vroomvroomvroom.com/searchfresh/searchform.html?countryid=us&pickupfrom=boston&returnto=boston&pickupdate=11/07/2010&returndate=11/03/2010&a=vroom&oldschool=false&theme=bluefresh
Note: to keep the consistency of URL variables, we keep every variable and its value in the URL in lower case.
Form Options
SUGGESTION_MODE
When a pickupFrom variable is set, then the search form will try to suggest some locations based on that variable. Set it to
AUTOCOMPLETE if you want it to act as if the use typed it in onclick. Use
LIST if you want it to suggest locations underneath the box on load. Use
OFF to…. you know. Disable this feature
var SUGGESTION_MODE = “AUTOCOMPLETE”; //OFF or LIST or AUTOCOMPLETE (when PICKUPFROM is set)
I want to speed things up
1. Add “-min” to javascipt files for the smaller versions. eg. searchfresh-min.js
2. Change the httpServer to a server close to your users. (http://vroomvroomvroom.com.au or http://vroomvroomvroom.com) See “Changing Form Defaults”
3. Change the path of the js includes and css include to either vroomvroomvroom.com.au or vroomvroomvroom.com. Or better yet, host these files on your own server.
