Login Demo Firebase

index.js

'use strict';

angular.module('randomInfo', ['restangular', 'ui.router', 'ui.bootstrap', 'firebase'])
  .config(function ($stateProvider, $urlRouterProvider) {
    $stateProvider
      .state('home', {
        url: '/',
        templateUrl: 'app/main/main.html',
        controller: 'MainCtrl',
        controllerAs: 'app'
      });

    $urlRouterProvider.otherwise('/');
  })
  
  .factory('Auth', function($firebaseObject){
    var auth = new Firebase('<YOUR.FIREBASEIO.com>');
    var currentUser = {};

  return {
    /**
    * Wrapper for `onAuth` that filters the `auth` object
    * through the `updateUser()` function
    */
    onAuth: function(creds){
      auth.onAuth(function(data){
        creds(updateUser(data));
      });
    },
    /**
    * Wrapper for `authWithOAuthPopup()` for each login option.
    */
    twitLogin: function(){
            
            return auth.authWithOAuthPopup("twitter", function(error, authData) {
                console.log(authData)
            if (error) {
                console.log("Login Failed!", error);
            } else {
                console.log("Authenticated successfully with payload:", authData);
            }
          }, {remember: "sessionOnly"})
        },
        
    fbLogin: function(){

        return auth.authWithOAuthPopup("facebook", function(error, authData) {
            console.log(authData)
        if (error) {
            console.log("Login Failed!", error);
        } else {
            console.log("Authenticated successfully with payload:", authData);
        }
      }, {remember: "sessionOnly"})
    },
        
        ghLogin: function(){
            
            return auth.authWithOAuthPopup("github", function(error, authData) {
                console.log(authData)
            if (error) {
                console.log("Login Failed!", error);
            } else {
                console.log("Authenticated successfully with payload:", authData);
            }
          }, {remember: "sessionOnly"})
        },
    /** Wrapper for the unauth() functionality to logout
    */
        logout: function(){
        auth.unauth();
        console.log("hello")
    },
    /** Wrapper to allow the main controller to check if a user is currently 
    * Logged in currently
    */
    loggedIn: function(){
      if(auth.getAuth()){
        return true;
      }
    },
    /**
    *Get the current user.
    */
    getUser: function(){
      return currentUser;
    }
  };

  /**
  * Tranform the `authdUser` object from `$firebaseAuth` into a full User
  * record in the `/users` collection.
  *
  * @param {Object} authdUser from $firebaseAuth.getAuth()
  * @return {Object} from $firebase.$asObject()
  */
  function updateUser(authdUser){
      console.log(authdUser)
    if ( authdUser === null ){
      return null;
    }
    console.log("This will break if you login with anything other than FB")
    /**
    * Create a reference to the users collection within Firebase
    * Then create a child of the users collection named after the
    * authdUser's Facebook ID
    */
//    var fbUser = auth.child('superUsers').child(authdUser.facebook.id);
//
//    // Update the authdUser's information in Firebase
//    fbUser.update({
//      uid: authdUser.facebook.id,
//      facebook: authdUser.facebook,
//      fullName: authdUser.facebook.displayName,
//      firstName: authdUser.facebook.cachedUserProfile.first_name,
//      lastName: authdUser.facebook.cachedUserProfile.last_name,
//      avatarUrl: authdUser.facebook.cachedUserProfile.picture.data.url,
//      gender: authdUser.facebook.cachedUserProfile.gender
//    });
//
//    // Set user to the object reference of authdUser
////    fbUser = $firebaseObject(auth
////      .child('superUsers')
////      .child(authdUser.facebook.id)
////    )
//
//    //stores the user information for use elsewhere
//    currentUser = fbUser;
//
//    return fbUser;
   }
  })
;

LoginFire.html

<div class="login">
    <button class="btn btn-info col-xs-12" ng-click="app.twitLogin()">Twitter</button>
    <button class="btn btn-primary col-xs-12" ng-click="app.fbLogin()">Facebook</button>
    <button class="btn btn-success col-xs-12" ng-click="app.ghLogin()">Github</button>
    <button class="btn btn-danger col-xs-12" ng-click="app.logout()">Logout</button>
</div>

main.controller.js

'use strict';

angular.module('randomInfo')
  .controller('MainCtrl', function ($firebaseArray, $firebaseObject, Auth) {
    var self = this;
    var userInfo = new Firebase('<YOUR.FIREBASEIO.COM Directory>');
    
    this.obj = $firebaseArray(userInfo);
    console.log(this.obj)
    
    this.userArray = {};
    
    this.twitLogin = Auth.twitLogin;
    this.fbLogin = Auth.fbLogin;
    this.ghLogin = Auth.ghLogin;
    this.logout = Auth.logout;
    
    Auth.onAuth(function(user){
    self.user = user;
    if (user === null ){
      console.log('null')
    }
    else {
      console.log(user)
    }
  });
    
    this.newUser = {
        name: '',
        email: '',
        age: '',
        color: '',
        framework: 'AngularJS YO!',
        jQuery: 'NO!'
    };
    
    this.addUser = function(user){
        this.obj.$add(user);
        return this.newUser = {
        name: '',
        email: '',
        age: '',
        color: '',
        framework: 'AngularJS YO!',
        jQuery: 'NO!'
    };
    }
    
  });