The easiest way to start learning about this API is to see a simple example. The following web page displays a panel with airlines for route "From any location to Paris".

        <html>  
        <head>  
        <script type="text/javascript" src="http://api.skyscanner.net/api/ajax/loader.js?key=PUT_HERE_YOUR_SKYSCANNER_API_KEY"></script>  
        <script type="text/javascript">  
            skyscanner.load('snippets','1',{cultureid:'fr'});  
            function main(){  
                var snippet=new skyscanner.snippets.WhoFliesControl();
                snippet.setShape('box300x250');
                snippet.setDeparture('pl');
                snippet.draw(document.getElementById('snippet'));  
                }  
            skyscanner.setOnLoadCallback(main);  
        </script>    
        </head>  
        <body>  
            <div id="snippet">  
                <!--  Please do not remove this line. It is necessary for proper functionality of Skyscanner Snippet and is also required by terms and conditions of service -->  
                <a href="http://www.skyscanner.net/fr/vols-de/pl/compagnies-qui-proposent-des-vols-de-pologne.html">Compagnies aériennes à destination de Pologne</a>  
            </div>  
        </body>  
        </html>

Example explained

First thing you need to do is to add appropriate script tag to initiate API loader. Please make sure you use API key assigned to your site. Sign-up for SkyTools API key if you don't have one.

        <script type="text/javascript" src="http://api.skyscanner.net/api/ajax/loader.js?key=ABCDEFGH">
        </script>

Load the SkyTools API by using the skyscanner.load method as shown below. The skyscanner.load method takes an argument for the specific API and version number to load.

            skyscanner.load('snippets','1');

Create a <div> tag inside <body> of the page. Give it some unique ID. Inside <div> tag you must add an anchor tag that links to the page on Skyscanner which shows similar results. Please make sure to use localized URL and anchor text appropriate for the snippet's culture. Example for French:

            <div id="snippet">  
                <!--  Please do not remove this line. It is necessary for proper functionality of Skyscanner Snippet and is also required by terms and conditions of service -->  
                <a href="http://www.skyscanner.net/fr/vols-de/pl/compagnies-qui-proposent-des-vols-de-pologne.html">Compagnies aériennes à destination de Pologne</a>  
            </div>

The anchor tag above sets default properties of the snippet. The example above sets

title Compagnies aériennes à destination de Pologne
departure -pl
culture -fr

These default values can be overwritten later with Javascript code. If you are not sure what URL to use please use the WhoFlies code wizard.

Create a main function that configures the WhoFliesControl object. Use the skyscanner.snippets.* namespace for all classes, methods and properties in the SkyTools WhoFlies API.

            function main(){  
                var snippet=new skyscanner.snippets.WhoFliesControl();
                snippet.setShape('box300x250');  
                snippet.setDeparture('pl');                  
                snippet.draw(document.getElementById('snippet'));  
                }

            skyscanner.setOnLoadCallback(main);

WhoFliesControl object

methods

setDeparture (placeID, isFixed) - sets the departure place.

PlaceID can be ID of airport, city or country. You can find placeID by performing the search on Skyscanner and looking at URL. For example: http://www.skyscanner.net/gbp/flights/lond/pari/cheapest-flights-per-month-to-paris-from-london.html contains codes for London (LOND) and Paris (PARI). You can also use code wizard to set departure. When origin is not specified then departure country is guessed from user's IP.
isFixed - when true means user can not specify departure. You can only set departure or destination to be fixed, not both. Setting departure to be fixed changes destination to non-fixed and vice versa.

To set departure to London use:

            snippet.setDeparture('LOND',true); // sets London (All airports) as fixed departure place; 
                                               // user can't change it. Destination is now not fixed.

getDeparture() - returns the departure place.

setDestination(placeID,isFixed) - sets the destination place. To set destination to Paris use:

            snippet.setDestination('PARI',false); // sets Paris (All airports) as non-fixed 
                                                  // destination place; user can change it.
                                                  // Departure can be either fixed or non fixed.

setShape(shape) - sets the shape of the snippets. Available shapes are:

            snippet.setShape("leaderboard"); // sets shape to leaderboard
            snippet.setShape("box300x250"); // sets shape to box 300px by 250px
            snippet.setShape("box400x400"); // sets shape to box 400px by 400px
            snippet.setShape("skyscraper"); // sets shape to skyscraper

getShape() - returns current shape

setIPRecognition(isIpRecognitionEnabled) - sets the departure country is recognized by IP (default), when false - recognition is inactive. Properly used only when there is no departure specified.

isIPRecognition() - returns true when IP recognition is active.

To receive Snippet in one of the languages supported by Skyscanner, please use:
setCulture(cultureID) - sets snippet's culture to specific cultureID

            snippet.setCulture('FR'); // sets snippet's language to French

getCulture() - returns the cultureID.

draw(divElement) - draws the snippet in specified <div> element. Example below will draw snippet in div element with id="snippet"

setSearchTargetWindow(newWindow) - when newWindow is true then clicking on "Search" button will open target page in new tab/window, otherwise it will open it in the same window.

setCultureFromIP(isEnabled) - if true and culture is not specified by setCulture(), nor skyscanner.load() then it is recognized by IP; if false then culture is taken from configuration anchor - by default.

Events

onDisplay() - fired after snippet has been displayed/repainted.

             snippet.onDisplay = function(){
                            alert('Now showing route:' + 
                            this.getDeparture() + ' to:'+this.getDestination());
                        }

onRouteChanged(oldRoute, newRoute) - fired when route has been changed.

            snippet.onRouteChanged = function(oldRoute, newRoute){
                        alert('Route changed from ' + oldRoute.departureID +'->' + oldRoute.destinationID +  
                        ' to ' + newRoute.departureID +'->' + newRoute.destinationID);  
                    }

Browser compatibility

The SkyTools WhoFlies API currently supports Firefox 1.5+,IE 6, IE 7, Safari, and Opera 9+.

API updates

The second parameter of skyscanner.load method contains the expected version level of this API. When we do a significant update to the API, we will increase the version number and send an email to all API key owners. After a new version is released, Skyscanner will support both old and new versions concurrently for few months. After this period expires, client requests using the old API will no longer be accepted, so change your code as soon as possible after receiving notification of the change. The Skyscanner team will also periodically update the API with recent bug fixes and performance enhancements without requiring a version update. For the most part, these fixes should remain transparent to you, but we may inadvertently break some API clients.

Who Flies Documentation

Table of Contents

A Simple example