69 lines
2.6 KiB
HTML
69 lines
2.6 KiB
HTML
{% extends 'base.html' %}
|
|
{% block content %}
|
|
<div class="max-w-md mx-auto bg-white shadow rounded-2xl p-6">
|
|
<h1 class="text-xl font-semibold mb-4">Sign in</h1>
|
|
<form id="login-form" class="space-y-3">
|
|
<div>
|
|
<label class="block text-sm mb-1">Email</label>
|
|
<input id="email" type="email" required class="w-full border rounded-lg p-2" />
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm mb-1">Password</label>
|
|
<input id="password" type="password" required class="w-full border rounded-lg p-2" />
|
|
</div>
|
|
<button type="submit" class="w-full py-2 rounded-lg bg-slate-900 text-white">Sign in</button>
|
|
<p id="error" class="text-sm text-red-600 mt-2 hidden"></p>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- Firebase App (the core Firebase SDK) -->
|
|
<script src="https://www.gstatic.com/firebasejs/12.4.0/firebase-app-compat.js"></script>
|
|
|
|
<!-- Firebase Auth -->
|
|
<script src="https://www.gstatic.com/firebasejs/12.4.0/firebase-auth-compat.js"></script>
|
|
|
|
<script>
|
|
window.FIREBASE_CONFIG = {{ firebase_config|tojson }};
|
|
// import { initializeApp } from 'https://www.gstatic.com/firebasejs/12.4.0/firebase-app.js'
|
|
|
|
// // If you enabled Analytics in your project, add the Firebase SDK for Google Analytics
|
|
// import { getAnalytics } from 'https://www.gstatic.com/firebasejs/12.4.0/firebase-analytics.js'
|
|
|
|
// // Add Firebase products that you want to use
|
|
// import { getAuth } from 'https://www.gstatic.com/firebasejs/12.4.0/firebase-auth.js'
|
|
// import { getFirestore } from 'https://www.gstatic.com/firebasejs/12.4.0/firebase-firestore.js'
|
|
|
|
const app = firebase.initializeApp(window.FIREBASE_CONFIG || {});
|
|
const auth = firebase.auth()
|
|
console.log(app)
|
|
console.log(auth)
|
|
console.log(auth.signInWithEmailAndPassword)
|
|
|
|
const form = document.getElementById('login-form');
|
|
const email = document.getElementById('email');
|
|
const password = document.getElementById('password');
|
|
const err = document.getElementById('error');
|
|
|
|
form.addEventListener('submit', async (e) => {
|
|
e.preventDefault();
|
|
err.classList.add('hidden');
|
|
try {
|
|
const cred = await auth.signInWithEmailAndPassword(email.value, password.value);
|
|
const idToken = await cred.user.getIdToken();
|
|
const res = await fetch('/session_login', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ idToken })
|
|
});
|
|
if(!res.ok){
|
|
throw new Error('Session exchange failed');
|
|
}
|
|
window.location.href = '/';
|
|
} catch (e) {
|
|
err.textContent = e.message || 'Login failed';
|
|
err.classList.remove('hidden');
|
|
}
|
|
});
|
|
</script>
|
|
|
|
{% endblock %} |