Initial

templates/login.html

@@ -0,0 +1,69 @@
+{% 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 %}