TravelTime-Frontend

## TravelTime_TimeMap_JSON_to_GeoJSON.js
function remapLinearRing(linearRing) {
  return linearRing.map(c => [c['lng'], c['lat']]);
}

function shapesToMultiPolygon(shapes) {
  var allRings = shapes.map(function (shape) {
    var shell = remapLinearRing(shape['shell']);
    var holes = shape['holes'].map(h => remapLinearRing(h));
    return [shell].concat(holes);
  });

## shapesToMultiPolygon.js

function shapesToMultiPolygon(shapes) {
  var allRings = shapes.map(function (shape) {
    // The shell of the polygon is in a separate property 'shell'.
    var shell = remapLinearRing(shape['shell']);
    // The 'holes' property is an array of linear rings for holes.
    var holes = shape['holes'].map(h => remapLinearRing(h));
    // Combine the shell and holes so that the shell is the first element in the resulting array.
    return [shell].concat(holes);
  });

## toGeoJSON.js
function toGeojson(timeMapResponse) {
  // Parses the response json. This is needed if the parameter is a raw string. You don't need this if the response has already been parsed.
  var responseData = JSON.parse(timeMapResponse);
  // Converts each result in the response into a MultiPolygon object.
  var multiPolygons = responseData['results'].map(r => shapesToMultiPolygon(r['shapes']));
  // Transforms each feature into feature object
  var features = multiPolygons.map(mp => {
    return {
      'geometry': mp,
      'type': "Feature",

## store_locator_10.html
<div id="location-list" style="height: 100%; width: 35%; float: left;font-family: arial">
    <h2>Store Locations</h2>
</div>

## Driving_radius_snippet_4.js
function sendTimeMapRequest(geocodingResponse) {

  // The request for Time Map. Reference: http://docs.traveltimeplatform.com/reference/time-map/
  var coords = geocodingResponse.features[0].geometry.coordinates;
  var latLng = { lat: coords[1], lng: coords[0] };

  var request = {
    departure_searches: [{
      id: "first_location",
      coords: latLng,

## Driving_radius_snippet_3.js
function sendGeocodingRequest(location) {
  // The request for the geocoder. Reference: http://docs.traveltimeplatform.com/reference/geocoding-search/
  var request = {
    query: location
  };
  document.getElementById("error").style.display = "none";
  var xhr = new XMLHttpRequest();
  xhr.responseType = "json";
  xhr.open("GET", "https://api.traveltimeapp.com/v4/geocoding/search?query=" + location)
  xhr.setRequestHeader("X-Application-Id", APPLICATION_ID);

## Driving_radius_snippet_2.js
var startingLocation = "London Waterloo Train Station";
var departureTime =  new Date().toJSON();
var travelTime = 60 * 15;
var APPLICATION_ID = "place your app id here";
var API_KEY = "place your api key here";

## Driving_radius_snippet_1.html
<body>
  <div id='map'></div>
  <div id="error" class="tippy-tooltip honeybee-theme">
    <p><b>No API and APPLICATION_ID key inserted </b></p>
    <p><a href="http://docs.traveltimeplatform.com/overview/getting-keys/">Sign up for an API key</a>
    <p>Place it in API and APPLICATION_ID variables</p>
  </div>
  <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_GOES_HERE&callback=initMap" async defer></script>
  <script>
    var map;

## Driving_radius_snippet_0.html
<body>
  <div id='map'></div>
  <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY_GOES_HERE&callback=initMap" async
    defer></script>
  <script>
    var map;
    function initMap() {
      var mapOpts = {
        center: { lat: 51.5031653, lng: -0.1123051 },
        zoom: 13,

## Google_maps_initial_snippet.html
<body>
  <div id='map'></div>
  <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY_GOES_HERE&callback=initMap" async
    defer></script>
  <script>
    var map;
    function initMap() {
      var mapOpts = {
        center: { lat: 51.5031653, lng: -0.1123051 },
        zoom: 13,
	function remapLinearRing(linearRing) {
	return linearRing.map(c => [c['lng'], c['lat']]);
	}

	function shapesToMultiPolygon(shapes) {
	var allRings = shapes.map(function (shape) {
	var shell = remapLinearRing(shape['shell']);
	var holes = shape['holes'].map(h => remapLinearRing(h));
	return [shell].concat(holes);
	});

	function shapesToMultiPolygon(shapes) {
	var allRings = shapes.map(function (shape) {
	// The shell of the polygon is in a separate property 'shell'.
	var shell = remapLinearRing(shape['shell']);
	// The 'holes' property is an array of linear rings for holes.
	var holes = shape['holes'].map(h => remapLinearRing(h));
	// Combine the shell and holes so that the shell is the first element in the resulting array.
	return [shell].concat(holes);
	});
	function toGeojson(timeMapResponse) {
	// Parses the response json. This is needed if the parameter is a raw string. You don't need this if the response has already been parsed.
	var responseData = JSON.parse(timeMapResponse);
	// Converts each result in the response into a MultiPolygon object.
	var multiPolygons = responseData['results'].map(r => shapesToMultiPolygon(r['shapes']));
	// Transforms each feature into feature object
	var features = multiPolygons.map(mp => {
	return {
	'geometry': mp,
	'type': "Feature",
	<div id="location-list" style="height: 100%; width: 35%; float: left;font-family: arial">
	<h2>Store Locations</h2>
	</div>
	function sendTimeMapRequest(geocodingResponse) {

	// The request for Time Map. Reference: http://docs.traveltimeplatform.com/reference/time-map/
	var coords = geocodingResponse.features[0].geometry.coordinates;
	var latLng = { lat: coords[1], lng: coords[0] };

	var request = {
	departure_searches: [{
	id: "first_location",
	coords: latLng,
	function sendGeocodingRequest(location) {
	// The request for the geocoder. Reference: http://docs.traveltimeplatform.com/reference/geocoding-search/
	var request = {
	query: location
	};
	document.getElementById("error").style.display = "none";
	var xhr = new XMLHttpRequest();
	xhr.responseType = "json";
	xhr.open("GET", "https://api.traveltimeapp.com/v4/geocoding/search?query=" + location)
	xhr.setRequestHeader("X-Application-Id", APPLICATION_ID);
	var startingLocation = "London Waterloo Train Station";
	var departureTime = new Date().toJSON();
	var travelTime = 60 * 15;
	var APPLICATION_ID = "place your app id here";
	var API_KEY = "place your api key here";
	<body>
	<div id='map'></div>
	<div id="error" class="tippy-tooltip honeybee-theme">
	<p><b>No API and APPLICATION_ID key inserted </b></p>
	<p><a href="http://docs.traveltimeplatform.com/overview/getting-keys/">Sign up for an API key</a>
	<p>Place it in API and APPLICATION_ID variables</p>
	</div>
	<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_GOES_HERE&callback=initMap" async defer></script>
	<script>
	var map;