diff --git a/css/signin.css b/css/signin.css index 3f97c41..efe9b3b 100644 --- a/css/signin.css +++ b/css/signin.css @@ -88,3 +88,37 @@ h1 { color: #333; border: 1px solid #333; } + +/* New Code Changes */ + +#email-signin-form, +#email-signup-form { + margin-bottom: 20px; +} + +#email-signin-form input, +#email-signup-form input { + display: block; + width: 100%; + padding: 10px; + margin-bottom: 10px; + font-size: 16px; +} + +#email-signin-form button, +#email-signup-form button, +#forgot-password { + display: block; + width: 100%; + padding: 10px; + font-size: 16px; + background-color: #4285F4; + color: #fff; + border: none; + cursor: pointer; +} + +#forgot-password { + margin-bottom: 20px; + background-color: #333; +} \ No newline at end of file diff --git a/options/options.js b/options/options.js index 1ebe177..60196d4 100644 --- a/options/options.js +++ b/options/options.js @@ -11,6 +11,11 @@ const auth = getAuth(firebaseApp); onAuthStateChanged(auth, user => { if (user != null) { + if (!user.emailVerified) { + console.log('Email not verified!'); + auth.signOut(); + return; + } console.log('User is logged in!'); chrome.storage.sync.set({idToken: user.accessToken}) fetchUserLimit(); @@ -274,4 +279,4 @@ function fetchUserLimit() { }) .catch(error => console.error('Error:', error)); }); -} +} \ No newline at end of file diff --git a/options/signin.html b/options/signin.html index 2c5ccab..e416577 100644 --- a/options/signin.html +++ b/options/signin.html @@ -13,10 +13,19 @@

Manga Reader

-
- + + + + +
+ +
+ + + +
+
+ GOOGLE
diff --git a/options/signin.js b/options/signin.js index 6656499..895f8e2 100644 --- a/options/signin.js +++ b/options/signin.js @@ -5,7 +5,11 @@ import { signInWithCredential, GoogleAuthProvider, setPersistence, - browserLocalPersistence + browserLocalPersistence, + createUserWithEmailAndPassword, + signInWithEmailAndPassword, + sendPasswordResetEmail, + sendEmailVerification } from 'firebase/auth'; // Auth instance for the current firebaseApp @@ -30,6 +34,41 @@ document.querySelector('.btn__google').addEventListener('click', () => { initFirebaseApp() }); +document.querySelector('#email-signin-form').addEventListener('submit', (event) => { + event.preventDefault(); + const email = document.querySelector('#email-input').value; + const password = document.querySelector('#password-input').value; + signInWithEmailAndPassword(auth, email, password).catch((error) => { + console.error(error); + alert(error.message); + }); +}); + +document.querySelector('#forgot-password').addEventListener('click', () => { + const email = document.querySelector('#email-input').value; + sendPasswordResetEmail(auth, email).catch((error) => { + console.error(error); + alert(error.message); + }); +}); + +document.querySelector('#email-signup-form').addEventListener('submit', (event) => { + event.preventDefault(); + const email = document.querySelector('#signup-email-input').value; + const password = document.querySelector('#signup-password-input').value; + createUserWithEmailAndPassword(auth, email, password) + .then((userCredential) => { + sendEmailVerification(userCredential.user).catch((error) => { + console.error(error); + alert(error.message); + }); + }) + .catch((error) => { + console.error(error); + alert(error.message); + }); +}); + function initFirebaseApp() { // Detect auth state onAuthStateChanged(auth, user => { @@ -92,5 +131,4 @@ function startAuth(interactive) { console.error('The OAuth token was null'); } }); -} - +} \ No newline at end of file