kuanb/gist:a76cce362aec8f0b9000

## gistfile1.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Find a route using Geolocation and Google Maps API</title>
    <script type="text/javascript" src="jquery-2.1.1.js"></script>
    <script src="http://maps.google.com/maps/api/js?sensor=true"></script>
    <script type="text/javascript" src="read-csv.js"></script>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script>

      var initOutput = null;
      var outData = null;
      var timesArray = null;

      function handleFiles(files) {
        // Check for the various File API support.
        if (window.FileReader) {
          // FileReader are supported.
          console.log("handleFiles pass");
          getAsText(files[0]);
        } else {
          alert('FileReader are not supported in this browser.');
        }
      }

      function getAsText(fileToRead) {
        var reader = new FileReader();
        // Read file into memory as UTF-8
        reader.readAsText(fileToRead);
        // Handle errors load
        reader.onload = loadHandler;
        reader.onerror = errorHandler;
      }

      function loadHandler(event) {
        var csv = event.target.result;
        processData(csv);
      }

      function processData(csv) {
        var allTextLines = csv.split(/\r\n|\n/);
        var lines = [];
        for (var i=0; i<allTextLines.length; i++) {
          var data = allTextLines[i].split(';');
              var tarr = [];
              for (var j=0; j<data.length; j++) {
                  tarr.push(data[j]);
              }
              lines.push(tarr);
        }
      console.log(lines);
      initOutput = lines;
      }

      function errorHandler(evt) {
        if(evt.target.error.name == "NotReadableError") {
          alert("Cannot read file !");
        }
      }

      function runParse(inData) {
        outDataTemp = [];
        for (var i=1; i<inData.length; i++) {
          allSplit = initOutput[i][0].split(',');
          surveyLat = Number(allSplit[0]);
          surveyLng = Number(allSplit[1]);
          southLat = Number(allSplit[2]);
          southLng = Number(allSplit[3]);
          list = [surveyLat, surveyLng, southLat, southLng];
          outDataTemp.push(list);
        }
        outData = outDataTemp;
      }

      function calculateDistances(compiledString) {
        var origin1 = [];
        for (var i1 = 1; i1 < compiledString.length; i1++) {
          var originSpecPoint = { "lat" : compiledString[i1][2] , "lng" : compiledString[i1][3] };
          origin1.push(originSpecPoint);
        }
        var destinationA = [];
        for (var i2 = 1; i2 < compiledString.length; i2++) {
          var destSpecPoint = { "lat" : compiledString[i2][0] , "lng" : compiledString[i2][1] };
          destinationA.push(destSpecPoint);
        }
        var service = new google.maps.DistanceMatrixService();
        service.getDistanceMatrix(
          {
            origins: origin1,
            destinations: destinationA,
            travelMode: google.maps.TravelMode.WALKING,
            unitSystem: google.maps.UnitSystem.METRIC,
            avoidHighways: false,
            avoidTolls: false
          },
          callback);
        }


      function callback(response, status) {
        timesArrayTemp = [];
        if (status != google.maps.DistanceMatrixStatus.OK) {
          alert('Error was: ' + status);
          }
        else {
          var origins = response.originAddresses;
          var destinations = response.destinationAddresses;
          for (var i = 0; i < origins.length; i++) {
            var results = response.rows[i].elements;
            for (var j = 0; j < results.length; j++) {
              timesArrayTemp.push(results[j].distance.text);
              }
            }
          }
        timesArray = timesArrayTemp;
        }

    </script>

  </head>
  <body>
    <h1>Route calculator</h1>
    <input type="file" id="csvFileInput" onchange="handleFiles(this.files)"
            accept=".csv">
    <button onclick="runParse(initOutput)">Parse Transit Matrix</button>
    <button onclick="calculateDistances(outData)">Calculate Distances</button>
  </body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8" />
	<title>Find a route using Geolocation and Google Maps API</title>
	<script type="text/javascript" src="jquery-2.1.1.js"></script>
	<script src="http://maps.google.com/maps/api/js?sensor=true"></script>
	<script type="text/javascript" src="read-csv.js"></script>
	<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
	<script>

	var initOutput = null;
	var outData = null;
	var timesArray = null;

	function handleFiles(files) {
	// Check for the various File API support.
	if (window.FileReader) {
	// FileReader are supported.
	console.log("handleFiles pass");
	getAsText(files[0]);
	} else {
	alert('FileReader are not supported in this browser.');
	}
	}

	function getAsText(fileToRead) {
	var reader = new FileReader();
	// Read file into memory as UTF-8
	reader.readAsText(fileToRead);
	// Handle errors load
	reader.onload = loadHandler;
	reader.onerror = errorHandler;
	}

	function loadHandler(event) {
	var csv = event.target.result;
	processData(csv);
	}

	function processData(csv) {
	var allTextLines = csv.split(/\r\n\|\n/);
	var lines = [];
	for (var i=0; i<allTextLines.length; i++) {
	var data = allTextLines[i].split(';');
	var tarr = [];
	for (var j=0; j<data.length; j++) {
	tarr.push(data[j]);
	}
	lines.push(tarr);
	}
	console.log(lines);
	initOutput = lines;
	}

	function errorHandler(evt) {
	if(evt.target.error.name == "NotReadableError") {
	alert("Cannot read file !");
	}
	}

	function runParse(inData) {
	outDataTemp = [];
	for (var i=1; i<inData.length; i++) {
	allSplit = initOutput[i][0].split(',');
	surveyLat = Number(allSplit[0]);
	surveyLng = Number(allSplit[1]);
	southLat = Number(allSplit[2]);
	southLng = Number(allSplit[3]);
	list = [surveyLat, surveyLng, southLat, southLng];
	outDataTemp.push(list);
	}
	outData = outDataTemp;
	}

	function calculateDistances(compiledString) {
	var origin1 = [];
	for (var i1 = 1; i1 < compiledString.length; i1++) {
	var originSpecPoint = { "lat" : compiledString[i1][2] , "lng" : compiledString[i1][3] };
	origin1.push(originSpecPoint);
	}
	var destinationA = [];
	for (var i2 = 1; i2 < compiledString.length; i2++) {
	var destSpecPoint = { "lat" : compiledString[i2][0] , "lng" : compiledString[i2][1] };
	destinationA.push(destSpecPoint);
	}
	var service = new google.maps.DistanceMatrixService();
	service.getDistanceMatrix(
	{
	origins: origin1,
	destinations: destinationA,
	travelMode: google.maps.TravelMode.WALKING,
	unitSystem: google.maps.UnitSystem.METRIC,
	avoidHighways: false,
	avoidTolls: false
	},
	callback);
	}


	function callback(response, status) {
	timesArrayTemp = [];
	if (status != google.maps.DistanceMatrixStatus.OK) {
	alert('Error was: ' + status);
	}
	else {
	var origins = response.originAddresses;
	var destinations = response.destinationAddresses;
	for (var i = 0; i < origins.length; i++) {
	var results = response.rows[i].elements;
	for (var j = 0; j < results.length; j++) {
	timesArrayTemp.push(results[j].distance.text);
	}
	}
	}
	timesArray = timesArrayTemp;
	}

	</script>

	</head>
	<body>
	<h1>Route calculator</h1>
	<input type="file" id="csvFileInput" onchange="handleFiles(this.files)"
	accept=".csv">
	<button onclick="runParse(initOutput)">Parse Transit Matrix</button>
	<button onclick="calculateDistances(outData)">Calculate Distances</button>
	</body>
	</html>