ember-cli authentication & user signup

controller--application.js

//  controllers/application.js

import Ember from 'ember';

export default Ember.Controller.extend({

  currentUser: null,
  authToken: '',
  // used to show, or not show, the log out button
  loggedIn: false,
  
  isAnonymous: Ember.computed.not('loggedIn'), 
  
  
  // when a user enters the app unauthenticated, the transition
  // to where they are going is saved off so it can be retried
  // when they have logged in.
  afterLoginTransition: null,
  
  isauthToken: Ember.computed.notEmpty('authToken'),
  isCurrentUser: Ember.computed.notEmpty('currentUser'),
  isLoggedin: Ember.computed.equal('loggedIn', true),
  
  //returns true if 'isCurrentUser' and 'isloggedIn' are both true and returns false if any of them is flase
  currentlyLoggedIn: Ember.computed.and('isauthToken', 'isLoggedin'),
  
  login: function(){
    this.setProperties({
        afterLoginTransitions: null,
        loggedIn: true
    });
  },
    
  logOut: function(){
    this.setProperties({
      loggedIn: false,
      //currentUser: null,
      authToken: null
    });    
  }

});

controllers --signup.js

import Ember from 'ember';

export default Ember.ObjectController.extend({

  needs: 'application',
  email: ' ',
  password: '',
  passwordConfirmation: '',
  
  reset: function(){
    this.setProperties({
      email: '',
      password: '',
      passwordConfirmation: ''
    });
  },
  
  signupSuccessful: function(){
    var applicationController = this.get('controllers.application');  
    //set loggedIn, so the UI shows the button to logout
    applicationController.login();

  }


});

route -- application.js

import Ember from 'ember';

export default Ember.Route.extend({

//a = Charity.__container__.lookup('controller:application')
//a.get('csrfService')
//a.get('csrfService').token.authenticity_token
//or
//a.csrfService
//a.csrfService.token.authenticity_token
 beforeModel: function(){
   //return this.csrf.fetchToken();
   return this.csrfService.fetchToken();
  },
  
  actions: {
    logoutUser: function(){
      var self = this;
      console.log('id', self);
      var params = {
        url: "/api/signout.json",
        //url: "/api/sessions/" + self,
        type: "DELETE",
        dataType: "json",
        //url: "/users/sign_out.json"
      },
          
      signout = Ember.$.ajax(params);
      
       return signout.then(
         function(data, textStatus, jqXHR){
           self.controllerFor('application').logOut();
           self.controllerFor('login').reset();
           self.transitionTo('login'); 
           console.log('sign out', data);
           console.log('auth token', data.authenticity_token);
           console.log('textStatus', textStatus);
           console.log('jqHR', jqXHR);
           console.log('container has',  self.container.lookup('service:csrf'));
           self.set('csrfService.token.authenticity_token', data.authenticity_token);
            //self.container.lookup('service:csrf').set('token', data.authenticity_token);
            //self.refresh();

         },

         function(jqXHR, textStatus, errorThrown){
           console.log('sign out', jqXHR);
           console.log('textStatus', textStatus);
           console.log('errorThrown', errorThrown);
         }
       );
      
     }
    
    
   } //closes actions

});

route-signup.js

// routes/signup.js

import Ember from 'ember';

export default Ember.Route.extend({

   actions: {
    
    signupUser: function( ) {
      var self = this;
      
      var signupController = this.controllerFor('signup');
      var email = signupController.get('email');
      var password = signupController.get('password');
      var passwordConfirmation = signupController.get('passwordConfirmation');

      var signup = Ember.$.ajax({
        url: "/users.json",
        dataType: "json",
        type: "POST",
        //data: {email: email, password: password, passwordConfirmation: passwordConfirmation} 
        data: {user: { email: email, password: password, passwordConfirmation: passwordConfirmation }}
      });

      signup.then(function(data){ 
        console.log('data', data);
        var loaded;
        //loaded = self.get('store').push('user', data.user);
        
        //console.log('push', loaded);
        //console.log('la', loaded.get('username') );
        
        //use pushPayload for data that is not yet normalised
        loaded = self.get('store').pushPayload('user', data);
        //loaded = self.get('store');
        //loaded.pushPayload('user', data);
     
         //alert(JSON.stringify(loaded.id));
        console.log('pushPayload', loaded);
        
        console.log('user', self.get('store').find('user'));
        console.log('username directly in passed in data', data.user.username);
        console.log('using store.find:', self.get('store').find('user', data.user.id) );
        
        //finding user this way doesn't works and we can't fetch a username there after
        var n =  self.get('store').find('user', data.user.id);
        console.log('username b4 resolving promise:', n.get('username') );  //undefined in console
    
        var a = n.then(function(user){ console.log('log username:', user.get('username') ); });
        console.log('user  after then:', a );  //give an empty promise
        
        //finding user this way works and we can fetch a username there after
        //getById gets a record by type and ID without triggering a fetch
        var p = self.get('store').getById('user', data.user.id);
        console.log('using store.getById:', p);
         //only works when we push data into the store using push rtns null with pushPayload
        //https://github.com/emberjs/data/commit/995b366c36c828a0f04c6ba9b978aa258238ce04
        console.log('username after getById:', p.get('username') );
        
        console.log('authToken:', data.user.authentication_token);
        var b = self.controllerFor('application');
        b.set('authToken', data.user.authentication_token);
        
        //this function redirects the user after successful loggedin to the link they wanted to access or to home page
        self.controllerFor('login').signupSuccessful();


      });
      
    } //closes signupUser
    
  }//closes action

});

template -signup.hbs

<h1> Signup form </h1>
<form {{action 'signupUser' on='submit'}}>
  {{input type='text' value=email placeholder='email'}}
  {{input type='password' value=password placeholder='password'}}
  {{input type='password' value=passwordConfirmation placeholder='re-enter your password'}}
  <button type="submit">signup</button>
</form>

{{outlet}}