import {AuthProviders, FirebaseAuthState, FirebaseAuth} from "angularfire2";
import {Injectable} from "@angular/core";

@Injectable()
export class AuthService {

  private authState: FirebaseAuthState = null;

  constructor(public auth$: FirebaseAuth) {
    auth$.subscribe((state: FirebaseAuthState) => {
      this.authState = state;
    });
  }

  get authenticated(): boolean {
    return this.authState !== null;
  }

  get id(): string {
    return this.authenticated ? this.authState.uid : '';
  }

  signIn(provider: number): firebase.Promise<FirebaseAuthState> {
    return this.auth$.login({provider})
      .catch(error => console.log('ERROR @ AuthService#signIn() :', error));
  }

  signInWithGithub(): firebase.Promise<FirebaseAuthState> {
    return this.signIn(AuthProviders.Github)
  }

  signInWithGoogle(): firebase.Promise<FirebaseAuthState> {
    return this.signIn(AuthProviders.Google);
  }

  signInWithTwitter(): firebase.Promise<FirebaseAuthState> {
    return this.signIn(AuthProviders.Twitter);
  }

  signOut(): void {
    this.auth$.logout();
  }
}

<section class="signup">
  <button md-button (click)="signInWithGoogle()">Google</button>
  <button md-button (click)="signInWithTwitter()">Twitter</button>
  <button md-button (click)="signInWithGithub()">Github</button>
</section>

import {Component, OnInit} from '@angular/core';
import {AuthService} from "../shared";
import {Router} from "@angular/router";

@Component({
  selector: 'app-signup',
  templateUrl: './signup.component.html',
  styleUrls: ['./signup.component.css']
})
export class SignupComponent implements OnInit {

  constructor(private auth: AuthService, private router: Router) {

  }

  ngOnInit() {
  }

  signInWithGithub(){
    this.auth.signInWithGithub()
      .then(this.postSignIn.bind(this))
  }

  signInWithTwitter(){
    this.auth.signInWithTwitter()
      .then(this.postSignIn.bind(this))
  }

  signInWithGoogle(){
    this.auth.signInWithGoogle()
      .then(this.postSignIn.bind(this))
  }

  postSignIn() {
    console.log("Auth id: ", this.auth.id);
    this.router.navigate(['/home']);
  }

}