JSFiddle - React, Tailwind, and code Playground

by gryzzly

HTML

<!-- jslint's "add resources" feature didn't work for me -->
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>

JavaScript

var geocoder = new google.maps.Geocoder();
// query is "environment", it is being passed in query param
// in some cases (not always)
// if it's not set, we should request user's 
// current location 
var query; // = "london";
// suppose we get this from user location
var latlng = new google.maps.LatLng(51.500, -0.126);

});

App = {
    init : function() {
        App.setLocation();
    },
    
    location : '',
    
    setLocation : function() {
        if ( query ) {
            App.location = query;
        } else {
            // async call
            geocoder.geocode(
                { 'latLng': latlng }, 
                function (results, status) {
                    if ( status != google.maps.GeocoderStatus.OK ) {
                        return console.log("Geocoding failed: " + status);
                    }
                    $.each(
                        results[0].address_components, 
                        function( i, comp ) {
                            if ( $.inArray( "locality", comp.types ) ) {
                                App.location = comp.short_name;
                                console.log( App.location );
                                // break
                                return false;
                            }
                        }
                    );
                }
            );           
        }
    }
};

App.init();