StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POember.js Uncaught TypeError: Object data-size has no method 'transitionTo'
text
Body
copied!<p>I am very new to ember and trying to implement authentication via facebook</p> <p>I am using <a href="http://luansantos.com/2012/03/06/using-facebook-js-sdk-with-emberjs/" rel="nofollow">ember-facebook.js</a> library to connect with facebook. Once the authentication is successful, I want to transition to some other route e.g. '/index'. This library creates a App.FBUser object in mixin which is populated from the facebook response. The blog say following:</p> <blockquote> <p>Whenever the user changes (login, logout, app authorization, etc) the method updateFBUser is called, updating the App.FBUser object on your application. You can do whatever you want with this binding, observe it, put it in the DOM, whatever.</p> </blockquote> <pre><code>Ember.Facebook = Ember.Mixin.create({ FBUser: void 0, appId: void 0, fetchPicture: true, init: function() { this._super(); return window.FBApp = this; }, appIdChanged: (function() { var _this = this; this.removeObserver('appId'); window.fbAsyncInit = function() { return _this.fbAsyncInit(); }; return $(function() { var js; js = document.createElement('script'); $(js).attr({ id: 'facebook-jssdk', async: true, src: "//connect.facebook.net/en_US/all.js" }); return $('head').append(js); }); }).observes('appId'), fbAsyncInit: function() { var _this = this; FB.init({ appId: this.get('appId'), status: true, cookie: true, xfbml: true }); this.set('FBloading', true); FB.Event.subscribe('auth.authResponseChange', function(response) { return _this.updateFBUser(response); }); return FB.getLoginStatus(function(response) { return _this.updateFBUser(response); }); }, updateFBUser: function(response) { console.log("Facebook.updateFBUser: Start"); var _this = this; if (response.status === 'connected') { //console.log(_this); return FB.api('/me', function(user) { var FBUser; FBUser = user; FBUser.accessToken = response.authResponse.accessToken; if (_this.get('fetchPicture')) { return FB.api('/me/picture', function(path) { FBUser.picture = path; _this.set('FBUser', FBUser); return _this.set('FBloading', false); }); } else { _this.set('FBUser', FBUser); return _this.set('FBloading', false); } }); } else { this.set('FBUser', false); return this.set('FBloading', false); } }//updateFBUser }); </code></pre> <p>Update : </p> <p>Adding following observer in my LoginController, I am able to capture the App.FBUser update event(it is update after getting response from FB; as indicated by the blog). From this observer method, when I try to 'transitionTo' my index route I get following error <strong>Uncaught TypeError: Object data-size has no method 'transitionTo'</strong>. Following is the code</p> <pre><code>App.LoginController = Ember.Controller.extend({ onSuccess: (function(){ var self = this; /* //tried all these method to redirect but error is the same var attemptedTransition = this.get('attemptedTransition'); attemptedTransition.retry(); */ /* //tried all these method to redirect but error is the same var router = this.get('target.router'); router.transitionTo('index'); */ //tried all these method to redirect but error is the same this.transitionToRoute('index'); }).observes('App.FBUser') }); </code></pre> <p><strong>Index Route</strong></p> <pre><code>App.AuthenticatedRoute = Ember.Route.extend({ beforeModel: function(transition){ var self = this; if(!App.FBUser){ self.redirectToLogin(transition); } }, redirectToLogin: function(transition){ var loginController = this.controllerFor('login'); loginController.set('attemptedTransition', transition); this.transitionTo('login'); } }); </code></pre> <p>I am not able to get my head around it. </p> <p>Any help is greatly appreciated. Thanks</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload