Client side js for login

login.js

'use strict';

function Login() {
  document.addEventListener('DOMContentLoaded', function() {
    // Shortcuts to DOM Elements.
    this.signInButton = document.getElementById('demo-sign-in-button');
    this.signOutButton = document.getElementById('demo-sign-out-button');
    this.nameContainer = document.getElementById('demo-name-container');
    this.uidContainer = document.getElementById('demo-uid-container');
    this.deleteButton = document.getElementById('demo-delete-button');
    this.profilePic = document.getElementById('demo-profile-pic');
    this.signedOutCard = document.getElementById('demo-signed-out-card');
    this.signedInCard = document.getElementById('demo-signed-in-card');

    // Bind events.
    this.signInButton.addEventListener('click', this.onSignInButtonClick.bind(this));
    this.signOutButton.addEventListener('click', this.onSignOutButtonClick.bind(this));
    this.deleteButton.addEventListener('click', this.onDeleteAccountButtonClick.bind(this));
    firebase.auth().onAuthStateChanged(this.onAuthStateChanged.bind(this));
  }.bind(this));
}

// Triggered on Firebase auth state change.
Login.prototype.onAuthStateChanged = function(user) {
  // Skip token refresh.
  if(user && user.uid === this.lastUid) return;  
  
  if (user) {
    this.lastUid = user.uid;
    this.nameContainer.innerText = user.displayName;
    this.uidContainer.innerText = user.uid;
    this.profilePic.src = user.photoURL;
    this.signedOutCard.style.display = 'none';
    this.signedInCard.style.display = 'block';
    this.instagramTokenRef = firebase.database().ref('/instagramAccessToken/' + user.uid);

    var me = this;
    this.instagramTokenRef.once('value').then(function(snapshot) {
      var accessToken = snapshot.val();
      var userData = {
        uid: user.uid,
        displayName: user.displayName,
        photoURL: user.photoURL,
        accessToken: accessToken,
      };
      
      // save user if haven't
      firebase.database().ref('/creators/'+user.uid).once('value').then(function(snapshot) {
        if(!snapshot.exists()) {
          $.ajax({
          	url: 'https://api.instagram.com/v1/users/' + user.uid.replace('instagram:',''),
          	dataType: 'jsonp',
          	type: 'GET',
          	data: {access_token: accessToken},
          	success: function(data) {
              console.log('first time user signup -> ', data.data.username);
              var updates = {};
              updates['/creators/' + user.uid] = {
                'username':data.data.username,
                'displayName': user.displayName,
                'photoURL': user.photoURL,
                'accessToken': accessToken,
              };
              firebase.database().ref().update(updates);
              userData['username'] = data.data.username;
              window.app = new App(userData, true);
            }
          });
        } else {
          userData['username'] = snapshot.val().username;
          window.app = new App(userData, true);
        }
      });
      
    }.bind(this));

  } else {
    this.lastUid = null;
    this.signedOutCard.style.display = 'block';
    this.signedInCard.style.display = 'none';
  }
};

// Initiates the sign-in flow using LinkedIn sign in in a popup.
Login.prototype.onSignInButtonClick = function() {
  // Open the Auth flow as a popup.
  window.open('/redirect', 'firebaseAuth', 'height=315,width=400');
};

// Signs-out of Firebase.
Login.prototype.onSignOutButtonClick = function() {
  firebase.auth().signOut();
};

// Deletes the user's account.
Login.prototype.onDeleteAccountButtonClick = function() {
  this.instagramTokenRef.remove().then(function() {
    firebase.auth().currentUser.delete().then(function () {
      window.alert('Account deleted');
    }).catch(function (error) {
      if (error.code === 'auth/requires-recent-login') {
        window.alert('You need to have recently signed-in to delete your account. Please sign-in and try again.');
        firebase.auth().signOut();
      }
    });
  });
};

// Load the demo.
window.login = new Login();
window.login.onSignInButtonClick();