dimanche 8 février 2015

Ember route model blocks javascript

I have an IndexRoute and a PricingRoute, both are using the plan model in order to retrieve a list of plans from a JSON API. The models load just fine, there's no problem there.


I also have the Google+ SDK added on the index.html page. Also, the Materialize CSS library with a side-nav that is initialized through Javascript inside the application controller.


The problem is that whenever I refresh/initially load either of those 2 routes, the Google+ follow widget is not showing and the Materialize side-nav is not working (probably the JS init didn't work). However, if I just remove the model on the route (whichever of the 2), both the Google+ widget and the Materialize side-nav work as intended. So what exactly is wrong with the route model that it makes it interfere with the Google+ and Materialize libs ?


Worth noting is that I also have the Facebook lib initialized before the side-nav in the application controller, but that works just fine even with the models.


application.js controller:



export default Ember.Controller.extend({

init: function ()
{
// initialize facebook SDK
var facebook_id = this.facebook_app_id;
window.fbAsyncInit = function ()
{
FB.init({
appId: facebook_id,
xfbml: true,
version: 'v2.1'
});
};
(function (d, s, id)
{
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id))
{
return;
}
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

// load side nav drawer
Ember.$(document).ready(function ()
{
Ember.$('.button-collapse').sideNav();
});
}
});


index.js route:



export default Ember.Route.extend({

model: function ()
{
return this.store.find('plan');
}
});


pricing.js route:



export default Ember.Route.extend({

model: function ()
{
return this.store.find('plan');
}
});


index.html



<html>
<head>
...
<script src="http://ift.tt/1xN9CxI" async defer></script>
</head>
...
</html>




Aucun commentaire:

Enregistrer un commentaire