Skip to content

Commit dbe032a

Browse files
2 parents 3c7806d + 933758c commit dbe032a

File tree

4 files changed

+56
-130
lines changed

4 files changed

+56
-130
lines changed

auth.js

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -96,4 +96,17 @@ document.addEventListener('DOMContentLoaded', () => {
9696
if (logoutButton) {
9797
logoutButton.addEventListener("click", handleLogout);
9898
}
99-
});
99+
});
100+
if (!user && window.location.pathname !== "/login") {
101+
window.location.href = "/login";
102+
}
103+
form.addEventListener("submit", (e) => {
104+
e.preventDefault(); // stops auto refresh
105+
// handle login/signup
106+
});
107+
useEffect(() => {
108+
if (user) {
109+
navigate("/dashboard");
110+
}
111+
}, [user]);
112+
localStorage.setItem("authToken", token);

chai-time.html

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -28,13 +28,13 @@
2828
<button id="voice-btn" class="fixed bottom-8 right-8 w-16 h-16 bg-gradient-to-r from-purple-500 to-pink-500 rounded-full flex items-center justify-center shadow-2xl text-white transform hover:scale-110 transition-transform z-30" title="Activate Voice Command"><svg id="mic-icon" xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z"></path><path d="M19 10v2a7 7 0 0 1-14 0v-2"></path><line x1="12" y1="19" x2="12" y2="22"></line></svg></button>
2929
<div class="min-h-screen p-4 sm:p-8">
3030
<main class="max-w-5xl mx-auto space-y-12">
31-
<header><div class="flex justify-between items-center mb-6"><div><h1 class="text-4xl sm:text-5xl font-extrabold text-transparent bg-clip-text bg-gradient-to-r from-purple-400 to-pink-500 mb-1">Genie ✨</h1><p class="text-gray-400">Your home's vibe manager. Scene sorted.</p></div><button id="settings-btn" class="p-3 bg-gray-800 rounded-full hover:bg-gray-700 transition" title="Settings"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 0 2.12l-.15.1a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.38a2 2 0 0 0-.73-2.73l-.15-.1a2 2 0 0 1 0-2.12l.15-.1a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button></div><nav class="flex space-x-4 sm:space-x-6 bg-gray-800/50 p-3 rounded-full justify-center"><a href="index.html" class="px-4 py-2 text-sm font-medium text-gray-300 hover:bg-gray-700 rounded-full transition">Mood-buddy</a><a href="recipe.html" class="px-4 py-2 text-sm font-medium text-gray-300 hover:bg-gray-700 rounded-full transition">Recipes</a><a href="chai-time.html" class="px-4 py-2 text-sm font-medium text-white bg-pink-600 rounded-full">Chai Time</a><a href="expenses.html" class="px-4 py-2 text-sm font-medium text-gray-300 hover:bg-gray-700 rounded-full transition">Expenses</a></nav></header>
32-
<section id="chai-module"><h2 class="text-2xl font-semibold mb-4">Chai Time Vibes ☕</h2><div class="bg-gray-800/50 backdrop-blur-lg border border-gray-700 rounded-2xl shadow-lg p-6"><p class="text-gray-300 mb-4">Set the perfect mood for your chai time with curated music and lighting.</p><div class="grid grid-cols-1 md:grid-cols-2 gap-6"><div class="bg-gray-700/50 p-4 rounded-xl"><h3 class="text-xl font-medium mb-3">Music Selection</h3><select id="music-select" class="w-full p-3 bg-gray-600 border border-gray-500 rounded-lg focus:ring-2 focus:ring-pink-500"><option value="lofi">Lo-Fi Beats</option><option value="classical">Classical Indian</option><option value="ambient">Ambient Sounds</option><option value="bollywood">Bollywood Acoustic</option></select><div class="mt-4 flex items-center justify-between"><span class="text-gray-300">Volume</span><input type="range" id="volume-slider" min="0" max="100" value="70" class="w-2/3"></div></div><div class="bg-gray-700/50 p-4 rounded-xl"><h3 class="text-xl font-medium mb-3">Lighting</h3><div class="flex items-center justify-between mb-4"><span class="text-gray-300">Warm Lights</span><label class="relative inline-flex items-center cursor-pointer"><input type="checkbox" id="warm-lights-toggle" class="sr-only peer"><div class="w-11 h-6 bg-gray-600 rounded-full toggle-bg"></div></label></div><div class="mt-4"><span class="text-gray-300 block mb-2">Brightness</span><input type="range" id="brightness-slider" min="0" max="100" value="100" class="w-full"></div></div></div><button id="apply-chai-settings" class="mt-6 w-full bg-gradient-to-r from-amber-500 to-orange-500 text-white font-bold py-3 px-6 rounded-lg shadow-md hover:scale-105 transition">Apply Chai Time Settings</button></div></section>
33-
<footer class="text-center text-gray-500 pt-8 pb-16"><p>© 2025 Genie ✨ | Your Home's Vibe Manager</p><p class="mt-2 text-sm">Made with 💜 for a better home experience</p></footer>
34-
</main>
35-
</div>
36-
<script src="https://www.youtube.com/iframe_api"></script>
37-
<script src="script.js"></script>
38-
<script type="module" src="app-auth.js"></script>
39-
</body>
40-
</html>
31+
<header><div class="flex justify-between items-center mb-6"><div><h1 class="text-4xl sm:text-5xl font-extrabold text-transparent bg-clip-text bg-gradient-to-r from-purple-400 to-pink-500 mb-1">Genie ✨</h1><p class="text-gray-400">Your home's vibe manager. Scene sorted.</p></div><button id="settings-btn" class="p-3 bg-gray-800 rounded-full hover:bg-gray-700 transition" title="Settings"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 0 2.12l-.15.1a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.38a2 2 0 0 0-.73-2.73l-.15-.1a2 2 0 0 1 0-2.12l.15-.1a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button></div>
32+
<nav class="flex flex-wrap items-center justify-center gap-2 rounded-full bg-gray-800/50 p-3 sm:gap-4 sm:space-x-6">
33+
<a href="index.html" class="rounded-full px-4 py-2 text-sm font-medium text-gray-300 transition hover:bg-gray-700">Mood-buddy</a>
34+
<a href="recipe.html" class="rounded-full px-4 py-2 text-sm font-medium text-gray-300 transition hover:bg-gray-700">Recipes</a>
35+
<a href="chai-time.html" class="rounded-full px-4 py-2 text-sm font-medium text-white bg-pink-600">Chai Time</a>
36+
<a href="expenses.html" class="rounded-full px-4 py-2 text-sm font-medium text-gray-300 transition hover:bg-gray-700">Expenses</a>
37+
<button id="logout-btn" class="rounded-full px-4 py-2 text-sm font-medium text-red-400 transition hover:bg-red-500 hover:text-white">Logout</button>
38+
</nav>
39+
</header>
40+
<section id="chai-module"><h2 class="text-2xl font-semibold mb-4">Chai Time Vibes ☕</h2><div class="bg-gray-800/50 backdrop-blur-lg border border-gray-700 rounded-2xl shadow-lg p-6"><p class="text-gray-300 mb-4">Set the perfect mood for your chai time with curated music and lighting.</p><div class="grid grid-cols-1 md:grid-cols-2 gap-6"><div class="bg-gray-700/50 p-4 rounded-xl"><h3 class="text-xl font-medium mb-3">Music Selection</h3><select id="music-select" class="w-full p-3 bg-gray-600 border border-gray-500 rounded-lg focus:ring-2 focus:ring-pink-500"><option value="lofi">Lo-Fi Beats</option><option value="classical">Classical Indian</option><option value="ambient">Ambient Sounds</option><option value="bollywood">Bollywood Acoustic</option></select><div class="mt-4 flex items-center justify-between"><span class="text-gray-300">Volume</span><input type="range" id="volume-slider" min="0" max="100" value="70" class="w-2/3"></div></div><div class="bg-gray-700/50 p-4 rounded-xl"><h3 class="text-xl font-medium mb-3">Lighting</h3><div class="flex items-center justify-between mb-4"><span class="text-gray-300">Warm Lights</span><label class="relative inline-flex items-center cursor-pointer"><input type="checkbox" id="warm-lights-toggle" class="sr-only peer"><div class="w-11 h-6 bg-gray-600 rounded-full toggle-bg"></div></label></div><div class="mt-4"><span class="text-gray-30

home.html

Lines changed: 12 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@
6060
.genie-lamp {
6161
width: 80px;
6262
height: 80px;
63-
background: url('https://upload.wikimedia.org/wikipedia/commons/thumb/e/e0/Genie_lamp_icon.svg/1200px-Genie_lamp_icon.svg.png') no-repeat center center / contain; /* Placeholder image */
63+
background: url('https://upload.wikimedia.org/wikipedia/commons/thumb/e/e0/Genie_lamp_icon.svg/1200px-Genie_lamp_icon.svg.png') no-repeat center center / contain;
6464
filter: drop-shadow(0 0 8px rgba(147, 51, 234, 0.7)); /* Purple shadow */
6565
animation-duration: 8s; /* Slower float for the lamp */
6666
}
@@ -93,40 +93,27 @@
9393
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
9494
<div class="flex items-center justify-between h-16">
9595
<div class="flex-shrink-0">
96-
<a href="#" class="text-2xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-purple-400 to-pink-500">Genie ✨</a>
96+
<a href="home.html" class="text-2xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-purple-400 to-pink-500">Genie ✨</a>
9797
</div>
98-
9998
<div class="hidden md:block">
10099
<div class="ml-10 flex items-baseline space-x-4">
101-
<a href="index.html" class="text-gray-300 bg-gray-800 px-3 py-2 rounded-md text-sm font-medium">Mood-buddy</a>
102-
<a href="chai-time.html" class="text-gray-400 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Chai_time</a>
103-
<a href="#recipe.html" class="text-gray-400 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Receipe</a>
104-
<a href="#expenses.html" class="text-gray-400 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Expenses</a>
105-
<button id="logout-btn" class="ml-4 px-4 py-2 text-sm font-medium text-red-400 hover:bg-red-500 hover:text-white rounded-full transition">Logout</button>
106-
100+
<a href="login.html" class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Login</a>
101+
<a href="signup.html" class="text-white bg-pink-600 hover:bg-pink-700 px-3 py-2 rounded-md text-sm font-medium">Sign Up</a>
107102
</div>
108103
</div>
109-
110104
<div class="-mr-2 flex md:hidden">
111-
<button id="hamburger-btn" type="button" class="bg-gray-800 inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white">
105+
<button id="hamburger-btn" type="button" class="bg-gray-800 inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none">
112106
<span class="sr-only">Open main menu</span>
113-
<svg id="hamburger-open-icon" class="block h-6 w-6" xmlns="http://www.w.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
114-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
115-
</svg>
116-
<svg id="hamburger-close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
117-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
118-
</svg>
107+
<svg id="hamburger-open-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" /></svg>
108+
<svg id="hamburger-close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" /></svg>
119109
</button>
120110
</div>
121111
</div>
122112
</div>
123-
124113
<div id="mobile-menu" class="hidden md:hidden">
125114
<div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
126-
<a href="#" class="text-gray-300 bg-gray-800 block px-3 py-2 rounded-md text-base font-medium">Home</a>
127-
<a href="index.html" class="text-gray-400 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Dashboard</a>
128-
<a href="#" class="text-gray-400 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">About</a>
129-
<a href="#" class="text-gray-400 hover:bg-gamma-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Features</a>
115+
<a href="login.html" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Login</a>
116+
<a href="signup.html" class="text-white bg-pink-600 hover:bg-pink-700 block px-3 py-2 rounded-md text-base font-medium">Sign Up</a>
130117
</div>
131118
</div>
132119
</nav>
@@ -136,24 +123,19 @@
136123
<h1 class="text-5xl md:text-7xl font-black text-white leading-tight animate-fade-in opacity-0">
137124
Welcome to <span class="text-transparent bg-clip-text bg-gradient-to-r from-purple-400 to-pink-500">Genie</span>
138125
</h1>
139-
140126
<p class="mt-4 text-xl md:text-2xl text-gray-400 animate-fade-in opacity-0 animation-delay-200">
141127
Your home's vibe manager. <span class="font-semibold text-gray-300">IYKYK.</span>
142128
</p>
143-
144129
<p class="mt-6 max-w-2xl mx-auto text-lg text-gray-500 animate-fade-in opacity-0 animation-delay-400">
145130
Genie is here to sort the whole scene—from figuring out what to cook with your leftovers to reminding you about bills. Your home just got a major glow-up.
146131
</p>
147-
148132
<div class="mt-10 animate-fade-in opacity-0 animation-delay-600">
149133
<a href="index.html" class="inline-block bg-gradient-to-r from-purple-500 to-pink-500 text-white font-bold text-lg px-8 py-4 rounded-full shadow-lg transform transition-transform hover:scale-105 glow-button">
150134
Enter the Vibe
151135
</a>
152136
</div>
153137
</div>
154-
155-
<div id="floating-objects-container" class="absolute inset-0">
156-
</div>
138+
<div id="floating-objects-container" class="absolute inset-0"></div>
157139
</main>
158140

159141
<script>
@@ -162,53 +144,32 @@ <h1 class="text-5xl md:text-7xl font-black text-white leading-tight animate-fade
162144
const mobileMenu = document.getElementById('mobile-menu');
163145
const openIcon = document.getElementById('hamburger-open-icon');
164146
const closeIcon = document.getElementById('hamburger-close-icon');
165-
166147
hamburgerBtn.addEventListener('click', () => {
167-
// Toggle the 'hidden' class on the mobile menu
168148
mobileMenu.classList.toggle('hidden');
169-
170-
// Toggle the icons
171149
openIcon.classList.toggle('hidden');
172150
closeIcon.classList.toggle('hidden');
173151
});
174-
175-
// --- Floating Objects Logic ---
176152
const floatingObjectsContainer = document.getElementById('floating-objects-container');
177-
178153
function createFloatingObject(type, count) {
179154
for (let i = 0; i < count; i++) {
180155
const obj = document.createElement('div');
181156
obj.classList.add('floating-object', type);
182-
183-
// Random positioning - FIXED
184157
obj.style.left = (Math.random() * 100) + '%';
185158
obj.style.top = (Math.random() * 100) + '%';
186-
187-
// Random size variation (for orbs and dust)
188159
if (type === 'magic-orb' || type === 'magic-dust') {
189-
const size = Math.random() * (type === 'magic-orb' ? 20 : 3) + (type === 'magic-orb' ? 20 : 2); // Orbs between 20-40px, dust between 2-5px
190-
// FIXED
160+
const size = Math.random() * (type === 'magic-orb' ? 20 : 3) + (type === 'magic-orb' ? 20 : 2);
191161
obj.style.width = size + 'px';
192162
obj.style.height = size + 'px';
193163
}
194-
195-
// Random animation delay for variety - FIXED
196164
obj.style.setProperty('--delay', (Math.random() * 5) + 's');
197-
obj.style.animationDelay = (Math.random() * 2) + 's'; // Initial fade-in delay
198-
165+
obj.style.animationDelay = (Math.random() * 2) + 's';
199166
floatingObjectsContainer.appendChild(obj);
200167
}
201168
}
202-
203-
// Create one genie lamp
204169
createFloatingObject('genie-lamp', 1);
205-
// Create several magic orbs
206170
createFloatingObject('magic-orb', 8);
207-
// Create many magic dust particles
208171
createFloatingObject('magic-dust', 20);
209172
});
210-
211173
</script>
212-
<script type="module" src="app-auth.js"></script>
213174
</body>
214175
</html>

0 commit comments

Comments
 (0)