JSFiddle - React, Tailwind, and code Playground

by dekkard

HTML

<div id="snippet_searchpanel">  
    
    <a href="http://www.skyscanner.net/flights-from/uk/cheap-flights-from-united-kingdom.html" target="_blank"></a>  
         
         
         </div>

<button>Load</button>

CSS

button{margin-top:30px;padding:10px;width:220px;}

JavaScript

var API_KEY = 'b7290ac3-1f9f-4575-88a7-89fed0c61f7f',
    MAIN_URL = 'http://api.skyscanner.net/api.ashx?key=' + API_KEY;

function main(){   
    console.log('loaded module');
    var snippet = new skyscanner.snippets.SearchPanelControl();
    snippet.setCurrency('GBP');
    snippet.setDeparture('uk');
    snippet.draw(document.getElementById('snippet_searchpanel'));
};

function newWrite(str) {
    $(str).appendTo('body');
}

var oldWrite = document.write;
document.write = newWrite;

function onMainSkyscannerScriptLoad(e) {
    console.log('loaded main script');
    skyscanner.loadAndWait('snippets', '1', {'nocss' : true}, main);
}

$('button').click(function() {
    console.log('getting main script');
    $.getScript(MAIN_URL, onMainSkyscannerScriptLoad);
});