From 49a100ef155226264bff1d924ca2e49ded513829 Mon Sep 17 00:00:00 2001 From: kammitama5 Date: Wed, 14 Jun 2017 15:41:52 +0000 Subject: [PATCH 1/6] added logout buttons and event listeners --- firebase-test/firebasetest.js | 23 +++++++++++++++++++++++ firebase-test/index.html | 9 ++++++++- 2 files changed, 31 insertions(+), 1 deletion(-) diff --git a/firebase-test/firebasetest.js b/firebase-test/firebasetest.js index 1c7f359..29ed71c 100644 --- a/firebase-test/firebasetest.js +++ b/firebase-test/firebasetest.js @@ -15,6 +15,13 @@ var messageBox = document.getElementById("message"); // Create a JavaScript object for the HTML element that has id="username" var usernameBox = document.getElementById("username"); +// Create Objects for Buttons UserInfo +var userInfoBox = document.getElementById("userinfo"); +// Create Objects for Button Login +var loginButton = document.getElementById("login"); +// Create Objects for Button Logout +var logoutButton = document.getElementById("logout"); + // Get a reference to the root of our database var dbRef = firebase.database().ref(); // Get a reference to the "greeting" section of our database @@ -22,6 +29,12 @@ var dbGreeting = dbRef.child("greeting"); // Get a reference to the "myname" section of our database var dbUsername = dbRef.child("myname"); +// button function and event listener +document.addEventListener("click", myButton); + +function myButton(github){ + alert("hi"); +} // Whenever "greeting" value in our database is updated, show the data inside messageBox! dbGreeting.on("value", function(dataSnapshot) { messageBox.textContent = dataSnapshot.val(); @@ -33,3 +46,13 @@ dbUsername.on("value", function(dataSnapshot) { usernameBox.textContent = dataSnapshot.val(); console.log( dataSnapshot.val() ); }); + +// Event Listener for Login +loginButton.addEventListener("click", function(){ + console.log("User clicked LOGIN"); +}); + +// Event Listener for Logout +logoutButton.addEventListener("click", function(){ + console.log("User clicked LOGOUT"); +}); \ No newline at end of file diff --git a/firebase-test/index.html b/firebase-test/index.html index a77c6f5..b865b06 100644 --- a/firebase-test/index.html +++ b/firebase-test/index.html @@ -6,9 +6,16 @@

Testing Firebase!

+ + + + +

Not currently logged in.

+

- + + From 070d199f0e2c5b3eace420a45e4b6cff8e39a58c Mon Sep 17 00:00:00 2001 From: kammitama5 Date: Wed, 14 Jun 2017 15:55:17 +0000 Subject: [PATCH 2/6] changing buttons to firebase event listeners --- firebase-test/firebasetest.js | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/firebase-test/firebasetest.js b/firebase-test/firebasetest.js index 29ed71c..cd7d8f4 100644 --- a/firebase-test/firebasetest.js +++ b/firebase-test/firebasetest.js @@ -10,6 +10,8 @@ var config = { firebase.initializeApp(config); +var provider = new firebase.auth.GithubAuthProvider(); + // Create a JavaScript object for the HTML element that has id="message" var messageBox = document.getElementById("message"); // Create a JavaScript object for the HTML element that has id="username" @@ -48,11 +50,16 @@ dbUsername.on("value", function(dataSnapshot) { }); // Event Listener for Login -loginButton.addEventListener("click", function(){ - console.log("User clicked LOGIN"); +// Use Firebase with Github Auth to log in the user +firebase.auth().signInWithRedirect(provider).catch(function(error){ + // Log any errors to the console + console.log(error); }); + // Event Listener for Logout -logoutButton.addEventListener("click", function(){ - console.log("User clicked LOGOUT"); +// Change your logout button's event listener +firebase.auth().signOut().catch(function(error){ + // Log any errors to the console + console.log(error); }); \ No newline at end of file From 3c9d9bb595c0d2d48fffd840e3e482bd6acd4dbb Mon Sep 17 00:00:00 2001 From: kammitama5 Date: Wed, 14 Jun 2017 16:05:43 +0000 Subject: [PATCH 3/6] added onAuthStateChanged function --- firebase-test/firebasetest.js | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/firebase-test/firebasetest.js b/firebase-test/firebasetest.js index cd7d8f4..2b5b04b 100644 --- a/firebase-test/firebasetest.js +++ b/firebase-test/firebasetest.js @@ -62,4 +62,23 @@ firebase.auth().signInWithRedirect(provider).catch(function(error){ firebase.auth().signOut().catch(function(error){ // Log any errors to the console console.log(error); +}); + +// onAuthStateChanged +//When user logs in or logs out: +firebase.auth().onAuthStateChanged(function(user){ + // If user is now logged in: + if (user){ + console.log("User successfully logged in to Firebase!"); + + //Here: update the paragraph with ID of "userinfo to display Github's Username and Github profile photo " + //Otherwise, if no user currently logged in: + } + else + { + console.log("User successfully logged OUT from Firebase!"); + + // Here: Update the paragraph with ID of "userinfo" to display the message "Not currently logged in." + } + }); \ No newline at end of file From 6ef1658ab3d85ccc0f207630ea160571223f6c5f Mon Sep 17 00:00:00 2001 From: kammitama5 Date: Wed, 14 Jun 2017 16:11:45 +0000 Subject: [PATCH 4/6] add username and profilephoto variables --- firebase-test/firebasetest.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/firebase-test/firebasetest.js b/firebase-test/firebasetest.js index 2b5b04b..cd0e17d 100644 --- a/firebase-test/firebasetest.js +++ b/firebase-test/firebasetest.js @@ -73,6 +73,8 @@ firebase.auth().onAuthStateChanged(function(user){ //Here: update the paragraph with ID of "userinfo to display Github's Username and Github profile photo " //Otherwise, if no user currently logged in: + var username = getElementById("username"); + var profilephoto = getElementById("profilephoto"); } else { From d9a756f252a054a0b982e74db83c9da0a92c1308 Mon Sep 17 00:00:00 2001 From: kammitama5 Date: Wed, 14 Jun 2017 16:28:09 +0000 Subject: [PATCH 5/6] document typo :( --- firebase-test/firebasetest.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/firebase-test/firebasetest.js b/firebase-test/firebasetest.js index cd0e17d..8499b21 100644 --- a/firebase-test/firebasetest.js +++ b/firebase-test/firebasetest.js @@ -73,8 +73,8 @@ firebase.auth().onAuthStateChanged(function(user){ //Here: update the paragraph with ID of "userinfo to display Github's Username and Github profile photo " //Otherwise, if no user currently logged in: - var username = getElementById("username"); - var profilephoto = getElementById("profilephoto"); + var username = document.getElementById("username"); + var profilephoto = document.getElementById("profilephoto"); } else { From 87944f75f2505322f34ef29139e5b481b15bb66e Mon Sep 17 00:00:00 2001 From: kammitama5 Date: Wed, 14 Jun 2017 16:42:09 +0000 Subject: [PATCH 6/6] first test --- firebase-test/firebasetest.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/firebase-test/firebasetest.js b/firebase-test/firebasetest.js index 8499b21..c9eb2ab 100644 --- a/firebase-test/firebasetest.js +++ b/firebase-test/firebasetest.js @@ -75,12 +75,18 @@ firebase.auth().onAuthStateChanged(function(user){ //Otherwise, if no user currently logged in: var username = document.getElementById("username"); var profilephoto = document.getElementById("profilephoto"); + + // Display Username and Photo + var show = document.getElementById("userinfo").innerHTML; + var show1 = document.getElementById("profilephoto").innerHTML; } else { console.log("User successfully logged OUT from Firebase!"); // Here: Update the paragraph with ID of "userinfo" to display the message "Not currently logged in." + document.getElementById("userinfo").textContent = "Not currently logged in"; + } }); \ No newline at end of file