Untitled

<!DOCTYPE html>
<html>

<head>
    <meta charset=utf-8 />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>FireBase Test</title>

    // Include firebase credentials here

    <script type="text/javascript">
        /**
         * Handles the sign in button press.
         */
        function toggleSignIn() {
            if (firebase.auth().currentUser) {
                // [START signout]
                firebase.auth().signOut();
                // [END signout]
            } else {
                var email = document.getElementById('email').value;
                var password = document.getElementById('password').value;
                if (email.length < 4) {
                    alert('Please enter an email address.');
                    return;
                }
                if (password.length < 4) {
                    alert('Please enter a password.');
                    return;
                }
                // Sign in with email and pass.
                // [START authwithemail]
                firebase.auth().signInWithEmailAndPassword(email, password).catch(function(error) {
                    // Handle Errors here.
                    var errorCode = error.code;
                    var errorMessage = error.message;
                    // [START_EXCLUDE]
                    if (errorCode === 'auth/wrong-password') {
                        alert('Wrong password.');
                    } else {
                        alert(errorMessage);
                    }
                    console.log(error);
                    document.getElementById('sign-in').disabled = false;
                    // [END_EXCLUDE]
                });
                // [END authwithemail]
            }
            document.getElementById('sign-in').disabled = true;
        }

        /**
         * Handles the sign up button press.
         */
        function handleSignUp() {
            var email = document.getElementById('email').value;
            var password = document.getElementById('password').value;
            if (email.length < 4) {
                alert('Please enter an email address.');
                return;
            }
            if (password.length < 4) {
                alert('Please enter a password.');
                return;
            }
            // Sign in with email and pass.
            // [START createwithemail]
            firebase.auth().createUserWithEmailAndPassword(email, password).catch(function(error) {
                // Handle Errors here.
                var errorCode = error.code;
                var errorMessage = error.message;
                // [START_EXCLUDE]
                if (errorCode == 'auth/weak-password') {
                    alert('The password is too weak.');
                } else {
                    alert(errorMessage);
                }
                console.log(error);
                // [END_EXCLUDE]
            });
            // [END createwithemail]
        }

        /**
         * Sends an email verification to the user.
         */
        function sendEmailVerification() {
            // [START sendemailverification]
            firebase.auth().currentUser.sendEmailVerification().then(function() {
                // Email Verification sent!
                // [START_EXCLUDE]
                alert('Email Verification Sent!');
                // [END_EXCLUDE]
            });
            // [END sendemailverification]
        }

        function sendPasswordReset() {
            var email = document.getElementById('email').value;
            // [START sendpasswordemail]
            firebase.auth().sendPasswordResetEmail(email).then(function() {
                // Password Reset Email Sent!
                // [START_EXCLUDE]
                alert('Password Reset Email Sent!');
                // [END_EXCLUDE]
            }).catch(function(error) {
                // Handle Errors here.
                var errorCode = error.code;
                var errorMessage = error.message;
                // [START_EXCLUDE]
                if (errorCode == 'auth/invalid-email') {
                    alert(errorMessage);
                } else if (errorCode == 'auth/user-not-found') {
                    alert(errorMessage);
                }
                console.log(error);
                // [END_EXCLUDE]
            });
            // [END sendpasswordemail];
        }

        /**
         * initApp handles setting up UI event listeners and registering Firebase auth listeners:
         *  - firebase.auth().onAuthStateChanged: This listener is called when the user is signed in or
         *    out, and that is where we update the UI.
         */
        function initApp() {
            // Listening for auth state changes.
            // [START authstatelistener]
            firebase.auth().onAuthStateChanged(function(user) {
                // [START_EXCLUDE silent]
                document.getElementById('verify-email').disabled = true;
                // [END_EXCLUDE]
                if (user) {
                    // User is signed in.
                    var displayName = user.displayName;
                    var email = user.email;
                    var emailVerified = user.emailVerified;
                    var photoURL = user.photoURL;
                    var isAnonymous = user.isAnonymous;
                    var uid = user.uid;
                    var providerData = user.providerData;
                    // [START_EXCLUDE silent]
                    document.getElementById('sign-in-status').textContent = 'Signed in';
                    document.getElementById('sign-in').textContent = 'Sign out';
                    document.getElementById('account-details').textContent = JSON.stringify(user, null, '  ');
                    if (!emailVerified) {
                        document.getElementById('verify-email').disabled = false;
                    }
                    // [END_EXCLUDE]
                } else {
                    // User is signed out.
                    // [START_EXCLUDE silent]
                    document.getElementById('sign-in-status').textContent = 'Signed out';
                    document.getElementById('sign-in').textContent = 'Sign in';
                    document.getElementById('account-details').textContent = '';
                    // [END_EXCLUDE]
                }
                // [START_EXCLUDE silent]
                document.getElementById('sign-in').disabled = false;
                // [END_EXCLUDE]
            });
            // [END authstatelistener]

            document.getElementById('sign-in').addEventListener('click', toggleSignIn, false);
            document.getElementById('sign-up').addEventListener('click', handleSignUp, false);
            document.getElementById('verify-email').addEventListener('click', sendEmailVerification, false);
            document.getElementById('password-reset').addEventListener('click', sendPasswordReset, false);
            document.getElementById('changename').addEventListener('click', updateName, false);
        }

        function updateName(name) {
            var user = firebase.auth().currentUser;

            if (user) {
                user.updateProfile({
                    displayName: document.getElementById('newname').value,
                }).then(function() {
                    location.reload();
                }, function(error) {
                    // An error happened.
                });
            } else {
                alert("Please sign in.");
            }
        }

        window.onload = function() {
            initApp();
        };
    </script>
</head>

<body>
    <fieldset>
        <legend>Sing-In:</legend>

        <input type="text" id="email" name="email" placeholder="Email" />
        <input type="password" id="password" name="password" placeholder="Password" />
        <button disabled id="sign-in" name="signin">Sign in</button>
        <button id="sign-up" name="signup">Register</button>
        <button id="password-reset" name="verify-email">Forgot password?</button>
    </fieldset>

    <fieldset>
        <legend>User data:</legend>

        <input type="text" id="newname" name="newname" placeholder="Display Name" />
        <button id="changename" name="changename">Change name</button>

        <h2><span id="sign-in-status">Unknown</span></h2>
        <pre><code id="account-details"></code></pre>
        <button disabled id="verify-email" name="verify-email">Send Email Verification</button>
    </fieldset>
</body>

</html>