NBN Map
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>KML Layers</title>
    <!--<link href="https://developers.google.com/maps/documentation/javascript/examples/default.css" rel="stylesheet">-->
    <script src="https://maps.googleapis.com/maps/api/js?v=3.12&key=AIzaSyAYxKPrqC3_jnpXoXTrrnJ_fD8PjvicAOw&sensor=false&libraries=geometry,places"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://server.ktsang.tk/assets/js/maps.google.polygon.containsLatLng.js"></script>
    <script>
    var geocoder;
    var polygons = [];
    geocoder = new google.maps.Geocoder();
    $.get("/local--code/nbn-map-static/1", function(data){
      $.each(data.boundaries, function(index, value){
        var paths = [];
        $.each(value.encodedPolygons, function(i, polygon){
          $.each(polygon, function(i, path){
            paths.push(google.maps.geometry.encoding.decodePath(path));
          });
        });
        var polygon = new google.maps.Polygon({
          paths: paths
        });
        polygons.push([polygon,value]);
      });
    }, "json");
    function checkAddress() {
      var address = document.getElementById('address').value;
      var found = false;
      var foundData = {};
      geocoder.geocode( { 'address': address, "region": "AU"}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          $.each(polygons, function(index, polygon){
            if(!found){
              if(polygon[0].containsLatLng(results[0].geometry.location)){
                foundData = {
                  nbn: polygon[1],
                  gmaps: results[0]
                };
                found = true;
              }
            }
          });
 
          if(found){
            console.log(foundData);
            alert("Your address has been found!");
          }
 
        } else {
          alert('Geocode was not successful for the following reason: ' + status);
        }
      });
    }
    var service;
    var placesServices;
    $(document).ready(function(){
      var input = /** @type {HTMLInputElement} */(document.getElementById('address'));
      var autocomplete = new google.maps.places.Autocomplete(input, { types: ["geocode"], componentRestrictions: {country: "au"}});
      //placesServices = new google.maps.places.PlacesService($("#data")[0]);
    });
    /*
    function keyup_complete(self){
      if(self.value.length<10){return;}
      service.getPlacePredictions({ input: self.value, types: ["geocode"], componentRestrictions: {country: "au"}}, function(d){
        //console.log(d);
        $("#autocomplete").text("");
        $.each(d, function(i,v){
          $("#autocomplete").append(v.description+"<br />");
        });
        placesServices.getDetails({reference:d[0].reference}, function(a){console.log(a)});
      });
 
    }
*/
    </script>
  </head>
  <body>
    <!--<div id="map-canvas"></div>-->
 
    <form action="javascript:;" onsubmit="checkAddress()">
      <label>Address:</label> <input type="text" id="address" value="41 Honeyeater Terrace, South Morang VIC 3752, Australia" />
    </form>
    <div id="data">
    </div>
    <div id="autocomplete">
    </div>
  </body>
</html>