jshimko / meteor-geocomplete

Geocoding and Places Autocomplete Plugin
http://ubilabs.github.com/geocomplete/
44 stars 4 forks source link

ReferenceError: google is not defined #18

Closed atheriault closed 8 years ago

atheriault commented 9 years ago

I have your package up and running tank you very much. However I am running into an error when I reload the page or when the server does a restart after a code change. The full error is as follows:

Exception from Tracker afterFlush function: debug.js:41 ReferenceError: google is not defined debug.js:41 at GeoComplete.$.extend.initGeocoder (jquery.geocomplete.js:185) at GeoComplete.$.extend.init (jquery.geocomplete.js:101) at new GeoComplete (jquery.geocomplete.js:93) at HTMLInputElement. (jquery.geocomplete.js:580) at Function.jQuery.extend.each (jquery.js:384) at jQuery.fn.jQuery.each (jquery.js:136) at $.fn.geocomplete (jquery.geocomplete.js:576) at Template.driversTemplate.rendered (driversController.js?8ad445d79df3d3f774fd9c07e825fe63278bc56d:340) at runTemplateHooks (template-extension.js:375) at templateExtensionMasterHook (template-extension.js:324)

Now again this only appears when I manually refresh the browser or when the server restarts with a code update. If I switch between pages and come back to the page with the map it does not happen.

To fix this I have to stop the server, close the browser and start again. I am for the life of me unsure what is causing this to happen.

Below is the code that I have in the Meteor Startup - I have removed my key value....

      Meteor.startup(function() {
    GoogleMaps.load({
        key: 'my real key goes here',
        libraries: 'places'  // also accepts an array if you need more than one
    });
        });

in my template js file I have the following code :

Template.driversTemplate.onRendered(function () {
    this.autorun(function (){
        // Wait for API to be loaded
        if (GoogleMaps.loaded()) {
            console.log("Getting Here!");
            $('input:text[name=address]').geocomplete();
        }
    });
}); 

Template.driversTemplate.rendered = function (){     
    $('input:text[name=address]')
        .geocomplete()
        .bind("geocode:result", function(event, result){
            console.log(result.address_components.length);
            console.log(JSON.stringify(result, null, 2));
    });
}

This is the only code I have that is touching this package as I kept it isolated until I got it all working. Any help is greatly appreciated in solving what is causing this error.

jshimko commented 9 years ago

Well, you have a Template.driversTemplate.onRendered and a Template.driversTemplate.rendered, so I suspect it has something to do with that (you can only use the onRendered callback once per template). Additionally, you don't have the second one wrapped in...

if (GoogleMaps.loaded()) {
  // code here
}

So that could explain why it's running before the Google Maps API library is loaded.

jshimko commented 8 years ago

Based on what I mentioned above, it appears this issue is on your end. I'm going to close this issue for now. Feel free to reopen if you determine there's something wrong with this package.

Thanks!