JSFiddle - React, Tailwind, and code Playground
by chrisguzman
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<script src="https://cdn.firebase.com/js/client/1.0.17/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/0.7.1/angularfire.min.js"></script>
<section ng-app="fluttrApp" ng-controller="fluttrCtrl">
<button type="submit" ng-click="loginGoogle()">Login into Google</button>
<li ng-show="loggedIn">Welcome, {{uniqueid}}</li>
<button type="submit" ng-click="logout()">Logout into Google</button>
</section>
JavaScript
var app = angular.module("fluttrApp", ["firebase"]);
app.controller("fluttrCtrl", function($scope, $firebase) {
var url = "https://crowdfluttr.firebaseio.com/";
var ref = new Firebase(url);
$scope.loginGoogle = function() {
console.log("Got into google login");
ref.authWithOAuthPopup("google", function(error, authData) {
$scope.loggedIn = true;
$scope.uniqueid = authData.google.displayName;
}, {
remember: "sessionOnly",
scope: "email"
});
$scope.loggedIn = true;
function checkLogin() {
ref.onAuth(function(authData) {
if (authData) {
// user authenticated with Firebase
console.log("User ID: " + authData.uid + ", Provider: " + authData.provider);
}
});
}
checkLogin();
};
$scope.logout = function() {
ref.unauth();
$scope.loggedIn = false;
window.location.href="/";
};
});