[V0_FILE]javascript:file="server.js" isMerged="true" // Backend server using Node.js and Express const express = require("express") const cors = require("cors") const bcrypt = require("bcrypt") const jwt = require("jsonwebtoken") const bodyParser = require("body-parser") const mongoose = require("mongoose") require("dotenv").config() // Initialize Express app const app = express() const PORT = process.env.PORT || 3000 // Middleware app.use(cors()) app.use(bodyParser.json()) app.use(express.static("public")) // Serve static files from 'public' directory // Connect to MongoDB mongoose .connect(process.env.MONGODB_URI || "mongodb://localhost:27017/mindease", { useNewUrlParser: true, useUnifiedTopology: true, }) .then(() => console.log("Connected to MongoDB")) .catch((err) => console.error("MongoDB connection error:", err)) // Define schemas const userSchema = new mongoose.Schema({ name: { type: String, required: true }, email: { type: String, required: true, unique: true }, password: { type: String, required: true }, dateJoined: { type: Date, default: Date.now }, }) const moodEntrySchema = new mongoose.Schema({ userId: { type: mongoose.Schema.Types.ObjectId, ref: "User", required: true }, mood: { type: String, required: true }, note: { type: String }, timestamp: { type: Date, default: Date.now }, }) const resourceSchema = new mongoose.Schema({ title: { type: String, required: true }, category: { type: String, required: true }, type: { type: String, required: true }, contentUrl: { type: String }, text: { type: String }, imageUrl: { type: String }, }) // Create models const User = mongoose.model("User", userSchema) const MoodEntry = mongoose.model("MoodEntry", moodEntrySchema) const Resource = mongoose.model("Resource", resourceSchema) // JWT secret const JWT_SECRET = process.env.JWT_SECRET || "your-secret-key" // Authentication middleware const authenticateToken = (req, res, next) => { const authHeader = req.headers["authorization"] const token = authHeader && authHeader.split(" ")[1] if (!token) return res.status(401).json({ message: "Access denied" }) jwt.verify(token, JWT_SECRET, (err, user) => { if (err) return res.status(403).json({ message: "Invalid token" }) req.user = user next() }) } // Routes // Register app.post("/register", async (req, res) => { try { const { name, email, password } = req.body // Check if user already exists const existingUser = await User.findOne({ email }) if (existingUser) { return res.status(400).json({ message: "User already exists" }) } // Hash password const salt = await bcrypt.genSalt(10) const hashedPassword = await bcrypt.hash(password, salt) // Create new user const user = new User({ name, email, password: hashedPassword, }) await user.save() // Create token const token = jwt.sign({ id: user._id }, JWT_SECRET, { expiresIn: "1d" }) res.status(201).json({ token, user: { id: user._id, name: user.name, email: user.email } }) } catch (error) { console.error("Registration error:", error) res.status(500).json({ message: "Server error" }) } }) // Login app.post("/login", async (req, res) => { try { const { email, password } = req.body // Check if user exists const user = await User.findOne({ email }) if (!user) { return res.status(400).json({ message: "Invalid email or password" }) } // Check password const validPassword = await bcrypt.compare(password, user.password) if (!validPassword) { return res.status(400).json({ message: "Invalid email or password" }) } // Create token const token = jwt.sign({ id: user._id }, JWT_SECRET, { expiresIn: "1d" }) res.status(200).json({ token, user: { id: user._id, name: user.name, email: user.email } }) } catch (error) { console.error("Login error:", error) res.status(500).json({ message: "Server error" }) } }) // Create mood entry app.post("/mood-entry", authenticateToken, async (req, res) => { try { const { mood, note } = req.body const moodEntry = new MoodEntry({ userId: req.user.id, mood, note, }) await moodEntry.save() res.status(201).json(moodEntry) } catch (error) { console.error("Mood entry error:", error) res.status(500).json({ message: "Server error" }) } }) // Get mood history app.get("/mood-history", authenticateToken, async (req, res) => { try { const moodEntries = await MoodEntry.find({ userId: req.user.id }).sort({ timestamp: -1 }) res.status(200).json(moodEntries) } catch (error) { console.error("Mood history error:", error) res.status(500).json({ message: "Server error" }) } }) // Update mood entry app.put("/mood-entry/:id", authenticateToken, async (req, res) => { try { const { mood, note } = req.body // Find entry and check ownership const moodEntry = await MoodEntry.findById(req.params.id) if (!moodEntry) { return res.status(404).json({ message: "Entry not found" }) } if (moodEntry.userId.toString() !== req.user.id) { return res.status(403).json({ message: "Not authorized" }) } // Update entry moodEntry.mood = mood || moodEntry.mood moodEntry.note = note !== undefined ? note : moodEntry.note await moodEntry.save() res.status(200).json(moodEntry) } catch (error) { console.error("Update mood entry error:", error) res.status(500).json({ message: "Server error" }) } }) // Delete mood entry app.delete("/mood-entry/:id", authenticateToken, async (req, res) => { try { // Find entry and check ownership const moodEntry = await MoodEntry.findById(req.params.id) if (!moodEntry) { return res.status(404).json({ message: "Entry not found" }) } if (moodEntry.userId.toString() !== req.user.id) { return res.status(403).json({ message: "Not authorized" }) } // Delete entry await MoodEntry.findByIdAndDelete(req.params.id) res.status(200).json({ message: "Entry deleted" }) } catch (error) { console.error("Delete mood entry error:", error) res.status(500).json({ message: "Server error" }) } }) // Get resources app.get("/resources", async (req, res) => { try { const { category } = req.query const query = {} if (category && category !== "all") { query.category = category } const resources = await Resource.find(query) res.status(200).json(resources) } catch (error) { console.error("Resources error:", error) res.status(500).json({ message: "Server error" }) } }) // Get user profile app.get("/profile", authenticateToken, async (req, res) => { try { const user = await User.findById(req.user.id).select("-password") if (!user) { return res.status(404).json({ message: "User not found" }) } res.status(200).json(user) } catch (error) { console.error("Profile error:", error) res.status(500).json({ message: "Server error" }) } }) // Update user profile app.put("/profile", authenticateToken, async (req, res) => { try { const { name, email } = req.body // Find user const user = await User.findById(req.user.id) if (!user) { return res.status(404).json({ message: "User not found" }) } // Update user user.name = name || user.name user.email = email || user.email await user.save() res.status(200).json({ user: { id: user._id, name: user.name, email: user.email } }) } catch (error) { console.error("Update profile error:", error) res.status(500).json({ message: "Server error" }) } }) // Change password app.put("/change-password", authenticateToken, async (req, res) => { try { const { currentPassword, newPassword } = req.body // Find user const user = await User.findById(req.user.id) if (!user) { return res.status(404).json({ message: "User not found" }) } // Check current password const validPassword = await bcrypt.compare(currentPassword, user.password) if (!validPassword) { return res.status(400).json({ message: "Current password is incorrect" }) } // Hash new password const salt = await bcrypt.genSalt(10) const hashedPassword = await bcrypt.hash(newPassword, salt) // Update password user.password = hashedPassword await user.save() res.status(200).json({ message: "Password updated successfully" }) } catch (error) { console.error("Change password error:", error) res.status(500).json({ message: "Server error" }) } }) // Start server app.listen(PORT, () => { console.log(`Server running on port ${PORT}`) }) [V0_FILE]javascript:file="models/User.js" isMerged="true" const mongoose = require("mongoose") const Schema = mongoose.Schema const userSchema = new Schema({ name: { type: String, required: true, }, email: { type: String, required: true, unique: true, }, password: { type: String, required: true, }, date_joined: { type: Date, default: Date.now, }, }) module.exports = mongoose.model("User", userSchema) [V0_FILE]javascript:file="models/MoodEntry.js" isMerged="true" const mongoose = require("mongoose") const Schema = mongoose.Schema const moodEntrySchema = new Schema({ user_id: { type: Schema.Types.ObjectId, ref: "User", required: true, }, mood: { type: String, required: true, }, note: { type: String, }, timestamp: { type: Date, default: Date.now, }, }) module.exports = mongoose.model("MoodEntry", moodEntrySchema) [V0_FILE]javascript:file="models/Resource.js" isMerged="true" const mongoose = require("mongoose") const Schema = mongoose.Schema const resourceSchema = new Schema({ title: { type: String, required: true, }, category: { type: String, required: true, }, type: { type: String, required: true, }, content_url: { type: String, }, text: { type: String, }, }) module.exports = mongoose.model("Resource", resourceSchema) [V0_FILE]javascript:file="routes/auth.js" isMerged="true" const express = require("express") const router = express.Router() const bcrypt = require("bcrypt") const jwt = require("jsonwebtoken") const User = require("../models/User") // Register route router.post("/register", async (req, res) => { try { const { name, email, password } = req.body // Check if user already exists let user = await User.findOne({ email }) if (user) { return res.status(400).json({ msg: "User already exists" }) } // Create new user user = new User({ name, email, password, }) // Hash password const salt = await bcrypt.genSalt(10) user.password = await bcrypt.hash(password, salt) await user.save() // Create JWT token const payload = { user: { id: user.id, }, } jwt.sign(payload, process.env.JWT_SECRET || "jwtSecret", { expiresIn: 3600 }, (err, token) => { if (err) throw err res.json({ token }) }) } catch (err) { console.error(err.message) res.status(500).send("Server error") } }) // Login route router.post("/login", async (req, res) => { try { const { email, password } = req.body // Check if user exists const user = await User.findOne({ email }) if (!user) { return res.status(400).json({ msg: "Invalid credentials" }) } // Check password const isMatch = await bcrypt.compare(password, user.password) if (!isMatch) { return res.status(400).json({ msg: "Invalid credentials" }) } // Create JWT token const payload = { user: { id: user.id, }, } jwt.sign(payload, process.env.JWT_SECRET || "jwtSecret", { expiresIn: 3600 }, (err, token) => { if (err) throw err res.json({ token }) }) } catch (err) { console.error(err.message) res.status(500).send("Server error") } }) module.exports = router [V0_FILE]javascript:file="routes/mood.js" isFixed="true" isQuickEdit="true" isMerged="true" const express = require("express") const router = express.Router() const auth = require("../middleware/auth") const MoodEntry = require("../models/MoodEntry") // Get all mood entries for a user router.get("/", auth, async (req, res) => { try { const moodEntries = await MoodEntry.find({ user_id: req.user.id }).sort({ timestamp: -1 }) res.json(moodEntries) } catch (err) { console.error(err.message) res.status(500).send("Server error") } }) // Add a new mood entry router.post("/", auth, async (req, res) => { try { const { mood, intensity, notes } = req.body const newMoodEntry = new MoodEntry({ user_id: req.user.id, mood, intensity, notes, timestamp: new Date(), }) const moodEntry = await newMoodEntry.save() res.json(moodEntry) } catch (err) { console.error(err.message) res.status(500).send("Server error") } }) [V0_FILE]javascript:file="js/resources.js" isEdit="true" isMerged="true" // Resources page specific JavaScript document.addEventListener("DOMContentLoaded", () => { // Load resources loadResources() // Set up category tabs setupCategoryTabs() // Check for hash in URL to activate specific tab checkUrlHash() }) // Load resources from mock data (would be from API in real app) function loadResources() { const resourcesContainer = document.getElementById("resources-container") if (!resourcesContainer) return // Clear loading message resourcesContainer.innerHTML = "" // Mock resources data const resources = [ { id: 1, title: "Deep Breathing Techniques", description: "Learn simple breathing exercises to reduce stress and anxiety in just a few minutes.", category: "breathing", type: "article", imageUrl: "https://via.placeholder.com/300x180?text=Breathing+Techniques", link: "#", }, { id: 2, title: "Mindfulness Meditation Guide", description: "A beginner's guide to mindfulness meditation with step-by-step instructions.", category: "mindfulness", type: "article", imageUrl: "https://via.placeholder.com/300x180?text=Mindfulness+Meditation", link: "#", }, { id: 3, title: "Stress Management for Students", description: "Practical strategies to manage academic stress and prevent burnout.", category: "stress", type: "article", imageUrl: "https://via.placeholder.com/300x180?text=Stress+Management", link: "#", }, { id: 4, title: "Improving Sleep Quality", description: "Tips and techniques for better sleep, especially during exam periods.", category: "sleep", type: "article", imageUrl: "https://via.placeholder.com/300x180?text=Sleep+Quality", link: "#", }, { id: 5, title: "Anxiety Reduction Techniques", description: "Evidence-based methods to reduce anxiety symptoms and manage panic attacks.", category: "anxiety", type: "article", imageUrl: "https://via.placeholder.com/300x180?text=Anxiety+Reduction", link: "#", }, { id: 6, title: "5-Minute Breathing Exercise", description: "A quick breathing exercise you can do anywhere to calm your mind.", category: "breathing", type: "video", imageUrl: "https://via.placeholder.com/300x180?text=Breathing+Exercise", link: "#", }, { id: 7, title: "Body Scan Meditation", description: "A guided meditation to help you connect with your body and release tension.", category: "mindfulness", type: "audio", imageUrl: "https://via.placeholder.com/300x180?text=Body+Scan", link: "#", }, { id: 8, title: "Exam Stress Toolkit", description: "A collection of resources specifically designed to help with exam-related stress.", category: "stress", type: "article", imageUrl: "https://via.placeholder.com/300x180?text=Exam+Stress", link: "#", }, { id: 9, title: "Sleep Hygiene Checklist", description: "A practical checklist to improve your sleep environment and habits.", category: "sleep", type: "article", imageUrl: "https://via.placeholder.com/300x180?text=Sleep+Hygiene", link: "#", }, { id: 10, title: "Understanding Anxiety", description: "Learn about the science behind anxiety and how it affects your body and mind.", category: "anxiety", type: "article", imageUrl: "https://via.placeholder.com/300x180?text=Understanding+Anxiety", link: "#", }, { id: 11, title: "Box Breathing Technique", description: "A simple breathing pattern that can help reduce stress and improve focus.", category: "breathing", type: "article", imageUrl: "https://via.placeholder.com/300x180?text=Box+Breathing", link: "#", }, { id: 12, title: "Mindful Walking Practice", description: "Turn a simple walk into a mindfulness practice with these techniques.", category: "mindfulness", type: "article", imageUrl: "https://via.placeholder.com/300x180?text=Mindful+Walking", link: "#", }, ] // Render all resources initially renderResources(resources) // Store resources in a global variable for filtering window.allResources = resources } // Render resources to the page function renderResources(resources) { const resourcesContainer = document.getElementById("resources-container") if (!resourcesContainer) return // Clear container resourcesContainer.innerHTML = "" if (resources.length === 0) { resourcesContainer.innerHTML = '

No resources found in this category.

' return } // Create resource cards resources.forEach((resource) => { const resourceCard = document.createElement("div") resourceCard.className = "resource-card" resourceCard.innerHTML = `

${resource.category.charAt(0).toUpperCase() + resource.category.slice(1)}

${resource.title}

${resource.description}

` resourcesContainer.appendChild(resourceCard) }) } // Set up category tabs function setupCategoryTabs() { const tabButtons = document.querySelectorAll(".tab-btn") tabButtons.forEach((button) => { button.addEventListener("click", function () { // Remove active class from all buttons tabButtons.forEach((btn) => btn.classList.remove("active")) // Add active class to clicked button this.classList.add("active") // Get category const category = this.getAttribute("data-category") // Filter resources filterResources(category) // Update URL hash if (category !== "all") { window.location.hash = category } else { history.pushState("", document.title, window.location.pathname) } }) }) } // Filter resources by category function filterResources(category) { if (!window.allResources) return if (category === "all") { renderResources(window.allResources) } else { const filteredResources = window.allResources.filter((resource) => resource.category === category) renderResources(filteredResources) } } // Check URL hash to activate specific tab function checkUrlHash() { const hash = window.location.hash.substring(1) if (hash) { const tabButton = document.querySelector(`.tab-btn[data-category="${hash}"]`) if (tabButton) { tabButton.click() } } } [V0_FILE]javascript:file="js/chat.js" isEdit="true" isMerged="true" // Chat page specific JavaScript document.addEventListener("DOMContentLoaded", () => { // Set up chat form submission setupChatForm() // Set up suggestion buttons setupSuggestionButtons() // Scroll to bottom of chat scrollToBottom() }) // Set up chat form submission function setupChatForm() { const chatForm = document.getElementById("chat-form") const userMessageInput = document.getElementById("user-message") if (!chatForm || !userMessageInput) return chatForm.addEventListener("submit", (event) => { event.preventDefault() const message = userMessageInput.value.trim() if (message) { // Add user message to chat addUserMessage(message) // Clear input userMessageInput.value = "" // Simulate bot response (with typing indicator) simulateBotResponse(message) } }) } // Add user message to chat function addUserMessage(message) { const chatMessages = document.getElementById("chat-messages") if (!chatMessages) return const messageElement = document.createElement("div") messageElement.className = "message user" const now = new Date() const timeString = now.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) messageElement.innerHTML = `

${escapeHTML(message)}

${timeString}

` chatMessages.appendChild(messageElement) // Scroll to bottom scrollToBottom() } // Add bot message to chat function addBotMessage(message) { const chatMessages = document.getElementById("chat-messages") if (!chatMessages) return const messageElement = document.createElement("div") messageElement.className = "message bot" const now = new Date() const timeString = now.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) messageElement.innerHTML = `

${message}

${timeString}

` chatMessages.appendChild(messageElement) // Scroll to bottom scrollToBottom() } // Add typing indicator function addTypingIndicator() { const chatMessages = document.getElementById("chat-messages") if (!chatMessages) return const typingElement = document.createElement("div") typingElement.className = "message bot typing-indicator" typingElement.innerHTML = `

MindBot is typing...

` chatMessages.appendChild(typingElement) // Scroll to bottom scrollToBottom() return typingElement } // Remove typing indicator function removeTypingIndicator(element) { if (element && element.parentNode) { element.parentNode.removeChild(element) } } // Simulate bot response function simulateBotResponse(userMessage) { // Add typing indicator const typingIndicator = addTypingIndicator() // Simulate thinking time setTimeout(() => { // Remove typing indicator removeTypingIndicator(typingIndicator) // Generate response based on user message const botResponse = generateBotResponse(userMessage) // Add bot message addBotMessage(botResponse) }, 1500) } // Generate bot response based on user message function generateBotResponse(userMessage) { userMessage = userMessage.toLowerCase() // Simple keyword-based responses if (userMessage.includes("stress") || userMessage.includes("exam")) { return "Exam stress is common. Try breaking your study sessions into smaller chunks with breaks in between. Deep breathing can also help calm your nervous system when you feel overwhelmed." } else if (userMessage.includes("sleep") || userMessage.includes("tired")) { return "Sleep problems can significantly impact your mental health. Try establishing a regular sleep schedule, avoiding screens before bed, and creating a relaxing bedtime routine." } else if (userMessage.includes("anxious") || userMessage.includes("anxiety")) { return "Anxiety is a normal response to stress. When you're feeling anxious, try the 5-4-3-2-1 grounding technique: acknowledge 5 things you see, 4 things you can touch, 3 things you hear, 2 things you smell, and 1 thing you taste." } else if (userMessage.includes("sad") || userMessage.includes("depress")) { return "I'm sorry you're feeling down. Remember that it's okay to not be okay sometimes. Consider reaching out to a friend, family member, or counselor to talk about your feelings. Would you like me to provide some resources on managing low mood?" } else if (userMessage.includes("help") || userMessage.includes("resources")) { return "I can help you find resources for various mental health concerns. We have information on stress management, anxiety, depression, sleep improvement, and mindfulness techniques. What specific area are you interested in?" } else if (userMessage.includes("thank")) { return "You're welcome! I'm here to support you. Is there anything else I can help with?" } else if (userMessage.includes("hello") || userMessage.includes("hi")) { return "Hello! How are you feeling today? I'm here to chat and provide support." } else { return "Thank you for sharing. As an AI assistant, I'm here to support you with your mental health concerns. Would you like to explore some self-help resources, or would you prefer to talk more about what's on your mind?" } } // Set up suggestion buttons function setupSuggestionButtons() { const suggestionButtons = document.querySelectorAll(".suggestion-btn") suggestionButtons.forEach((button) => { button.addEventListener("click", function () { const message = this.getAttribute("data-message") // Add user message to chat addUserMessage(message) // Simulate bot response simulateBotResponse(message) }) }) } // Scroll to bottom of chat function scrollToBottom() { const chatMessages = document.getElementById("chat-messages") if (chatMessages) { chatMessages.scrollTop = chatMessages.scrollHeight } } // Escape HTML to prevent XSS function escapeHTML(text) { const div = document.createElement("div") div.textContent = text return div.innerHTML } [V0_FILE]javascript:file="js/auth.js" isEdit="true" isMerged="true" // Authentication page specific JavaScript document.addEventListener("DOMContentLoaded", () => { // Set up auth tabs setupAuthTabs() // Set up login form setupLoginForm() // Set up register form setupRegisterForm() // Check if user is already logged in checkLoggedInStatus() }) // Set up auth tabs function setupAuthTabs() { const authTabs = document.querySelectorAll(".auth-tab") const authForms = document.querySelectorAll(".auth-form") authTabs.forEach((tab) => { tab.addEventListener("click", function () { // Remove active class from all tabs and forms authTabs.forEach((t) => t.classList.remove("active")) authForms.forEach((f) => f.classList.remove("active")) // Add active class to clicked tab this.classList.add("active") // Show corresponding form const formId = this.getAttribute("data-form") document.getElementById(`${formId}-form`).classList.add("active") }) }) } // Set up login form function setupLoginForm() { const loginForm = document.getElementById("login-form-element") if (!loginForm) return loginForm.addEventListener("submit", (event) => { event.preventDefault() // Get form data const email = document.getElementById("login-email").value const password = document.getElementById("login-password").value // Validate form let isValid = true // Reset error messages document.getElementById("login-email-error").textContent = "" document.getElementById("login-password-error").textContent = "" // Validate email if (!validateEmail(email)) { document.getElementById("login-email-error").textContent = "Please enter a valid email address." isValid = false } // Validate password if (password.length < 6) { document.getElementById("login-password-error").textContent = "Password must be at least 6 characters." isValid = false } if (isValid) { // In a real app, this would send a request to the server // For this demo, we'll simulate a successful login simulateLogin(email) } }) } // Set up register form function setupRegisterForm() { const registerForm = document.getElementById("register-form-element") if (!registerForm) return registerForm.addEventListener("submit", (event) => { event.preventDefault() // Get form data const name = document.getElementById("register-name").value const email = document.getElementById("register-email").value const password = document.getElementById("register-password").value const confirmPassword = document.getElementById("register-confirm-password").value const terms = document.getElementById("terms").checked // Validate form let isValid = true // Reset error messages document.getElementById("register-name-error").textContent = "" document.getElementById("register-email-error").textContent = "" document.getElementById("register-password-error").textContent = "" document.getElementById("register-confirm-password-error").textContent = "" document.getElementById("terms-error").textContent = "" // Validate name if (name.trim() === "") { document.getElementById("register-name-error").textContent = "Please enter your name." isValid = false } // Validate email if (!validateEmail(email)) { document.getElementById("register-email-error").textContent = "Please enter a valid email address." isValid = false } // Validate password if (password.length < 6) { document.getElementById("register-password-error").textContent = "Password must be at least 6 characters." isValid = false } // Validate confirm password if (password !== confirmPassword) { document.getElementById("register-confirm-password-error").textContent = "Passwords do not match." isValid = false } // Validate terms if (!terms) { document.getElementById("terms-error").textContent = "You must agree to the terms." isValid = false } if (isValid) { // In a real app, this would send a request to the server // For this demo, we'll simulate a successful registration simulateRegistration(name, email) } }) } // Validate email format function validateEmail(email) { const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/ return re.test(email) } // Simulate login function simulateLogin(email) { // Show loading state const loginButton = document.querySelector('#login-form-element button[type="submit"]') loginButton.textContent = "Logging in..." loginButton.disabled = true // Simulate API call setTimeout(() => { // Store user info in local storage const userName = email.split("@")[0] localStorage.setItem("token", "fake-jwt-token") localStorage.setItem("userName", userName) // Redirect to dashboard window.location.href = "index.html" }, 1500) } // Simulate registration function simulateRegistration(name, email) { // Show loading state const registerButton = document.querySelector('#register-form-element button[type="submit"]') registerButton.textContent = "Creating account..." registerButton.disabled = true // Simulate API call setTimeout(() => { // Store user info in local storage localStorage.setItem("token", "fake-jwt-token") localStorage.setItem("userName", name) // Redirect to dashboard window.location.href = "index.html" }, 1500) } // Check if user is already logged in function checkLoggedInStatus() { const token = localStorage.getItem("token") if (token) { // Redirect to dashboard window.location.href = "index.html" } } [V0_FILE]javascript:file="js/profile.js" isEdit="true" isMerged="true" // Profile page specific JavaScript document.addEventListener("DOMContentLoaded", () => { // Check if user is logged in checkAuthForProfile() // Set up profile menu setupProfileMenu() // Set up profile forms setupProfileForms() // Set up logout button setupLogoutButton() }) // Check if user is logged in for profile page function checkAuthForProfile() { const token = localStorage.getItem("token") if (!token) { // Redirect to login page window.location.href = "login.html" return } // Load user data loadUserData() } // Load user data function loadUserData() { const userName = localStorage.getItem("userName") || "User" // Update profile name const profileNameInput = document.getElementById("profile-name") if (profileNameInput) { profileNameInput.value = userName } // In a real app, this would fetch user data from the server // For this demo, we'll use mock data const mockUserData = { name: userName, email: `${userName.toLowerCase()}@example.com`, university: "State University", major: "Computer Science", } // Update form fields const profileEmailInput = document.getElementById("profile-email") if (profileEmailInput) { profileEmailInput.value = mockUserData.email } const profileUniversityInput = document.getElementById("profile-university") if (profileUniversityInput) { profileUniversityInput.value = mockUserData.university } const profileMajorInput = document.getElementById("profile-major") if (profileMajorInput) { profileMajorInput.value = mockUserData.major } } // Set up profile menu function setupProfileMenu() { const menuItems = document.querySelectorAll(".profile-menu-item") const sections = document.querySelectorAll(".profile-section") menuItems.forEach((item) => { item.addEventListener("click", function () { // Remove active class from all menu items and sections menuItems.forEach((i) => i.classList.remove("active")) sections.forEach((s) => s.classList.remove("active")) // Add active class to clicked menu item this.classList.add("active") // Show corresponding section const sectionId = this.getAttribute("data-section") document.getElementById(`${sectionId}-section`).classList.add("active") }) }) } // Set up profile forms function setupProfileForms() { // Account form const accountForm = document.getElementById("account-form") if (accountForm) { accountForm.addEventListener("submit", (event) => { event.preventDefault() // Show success message showFormSuccessMessage(accountForm, "Account settings updated successfully!") // Update user name in local storage const nameInput = document.getElementById("profile-name") if (nameInput) { localStorage.setItem("userName", nameInput.value) } }) } // Password form const passwordForm = document.getElementById("password-form") if (passwordForm) { passwordForm.addEventListener("submit", (event) => { event.preventDefault() // Validate password const currentPassword = document.getElementById("current-password").value const newPassword = document.getElementById("new-password").value const confirmNewPassword = document.getElementById("confirm-new-password").value if (newPassword !== confirmNewPassword) { showFormErrorMessage(passwordForm, "New passwords do not match.") return } if (newPassword.length < 6) { showFormErrorMessage(passwordForm, "Password must be at least 6 characters.") return } // Show success message showFormSuccessMessage(passwordForm, "Password updated successfully!") // Reset form passwordForm.reset() }) } // Preferences form const preferencesForm = document.getElementById("preferences-form") if (preferencesForm) { preferencesForm.addEventListener("submit", (event) => { event.preventDefault() // Show success message showFormSuccessMessage(preferencesForm, "Preferences updated successfully!") }) } // Notifications form const notificationsForm = document.getElementById("notifications-form") if (notificationsForm) { notificationsForm.addEventListener("submit", (event) => { event.preventDefault() // Show success message showFormSuccessMessage(notificationsForm, "Notification settings updated successfully!") }) } // Privacy form const privacyForm = document.getElementById("privacy-form") if (privacyForm) { privacyForm.addEventListener("submit", (event) => { event.preventDefault() // Show success message showFormSuccessMessage(privacyForm, "Privacy settings updated successfully!") }) } // Data management buttons const downloadDataBtn = document.getElementById("download-data-btn") if (downloadDataBtn) { downloadDataBtn.addEventListener("click", () => { alert("Your data is being prepared for download. This would download a JSON file in a real application.") }) } const deleteDataBtn = document.getElementById("delete-data-btn") if (deleteDataBtn) { deleteDataBtn.addEventListener("click", () => { if (confirm("Are you sure you want to delete all your data? This action cannot be undone.")) { alert("Your data has been deleted. In a real application, this would remove all your data from our servers.") } }) } } // Show form success message function showFormSuccessMessage(form, message) { // Remove any existing messages const existingMessage = form.querySelector(".form-message") if (existingMessage) { existingMessage.remove() } // Create message element const messageElement = document.createElement("div") messageElement.className = "form-message success-message" messageElement.textContent = message messageElement.style.color = "var(--success-color)" messageElement.style.padding = "var(--spacing-md)" messageElement.style.marginTop = "var(--spacing-md)" // Add to form form.appendChild(messageElement) // Remove after 3 seconds setTimeout(() => { messageElement.remove() }, 3000) } // Show form error message function showFormErrorMessage(form, message) { // Remove any existing messages const existingMessage = form.querySelector(".form-message") if (existingMessage) { existingMessage.remove() } // Create message element const messageElement = document.createElement("div") messageElement.className = "form-message error-message" messageElement.textContent = message messageElement.style.color = "var(--error-color)" messageElement.style.padding = "var(--spacing-md)" messageElement.style.marginTop = "var(--spacing-md)" // Add to form form.appendChild(messageElement) // Remove after 3 seconds setTimeout(() => { messageElement.remove() }, 3000) } // Set up logout button function setupLogoutButton() { const logoutBtn = document.getElementById("logout-btn") if (logoutBtn) { logoutBtn.addEventListener("click", () => { // Clear local storage localStorage.removeItem("token") localStorage.removeItem("userName") // Redirect to login page window.location.href = "login.html" }) } } [V0_FILE]markdown:file="README.md" isMerged="true" # MindEase - Mental Health Support Application MindEase is a web application designed to support university students' mental health by providing mood tracking, resources, and chat support. ## Features - **Dashboard**: Overview of mood trends, quick resources, and daily motivation - **Mood Tracker**: Track and visualize your mood over time - **Resources**: Access to mental health resources categorized by topic - **Chat Support**: AI-powered chat assistant for mental health support - **User Authentication**: Register and login functionality - **Profile Management**: Manage account settings and preferences ## How to Preview the Application 1. **Clone or download** this repository to your local machine 2. **Open the `index.html` file** in a modern web browser (Chrome, Firefox, Edge, etc.) 3. **Navigate** through the application using the navigation menu 4. **Test features** like mood tracking, resource browsing, and chat support ## Important Notes - This is a frontend-only version that uses localStorage for data persistence - All data is stored in your browser and will be lost if you clear your browser data - For a full-featured application, a backend would be required ## File Structure - `index.html` - Dashboard page - `mood-tracker.html` - Mood tracking page - `resources.html` - Mental health resources page - `chat.html` - Chat support page - `login.html` - Authentication page - `profile.html` - User profile page - `css/styles.css` - Main stylesheet - `js/` - JavaScript files for each page - `server.js` - Backend server (not required for preview) ## Browser Compatibility This application works best in modern browsers that support: - ES6 JavaScript features - localStorage API - CSS Grid and Flexbox - Chart.js visualization ## Credits - Chart.js for data visualization - Font Awesome for icons \`\`\` Now let's update the HTML files to ensure they work properly with the Chart.js library: ```html file="index.html" <!DOCTYPE html> MindEase - Mental Health Support

MindEase

Welcome, Guest

How are you feeling today?

Mood Overview

View Details

Quick Resources

Browse All Resources

Daily Motivation

"The greatest glory in living lies not in never falling, but in rising every time we fall."

- Nelson Mandela

Chat Support

Need someone to talk to? Our AI assistant is here to help.

Start Chatting

[V0_FILE]javascript:file="components/ui/chart.js" isQuickEdit="true" isMerged="true" export class Chart { constructor(ctx, config) { this.ctx = ctx this.config = config } } [V0_FILE]css:file="css/styles.css" isEdit="true" /* MindEase - Mental Health Support Application Modern CSS with Design System */ :root { /* Color System */ --primary: #5b8af0; --primary-dark: #4a75d8; --primary-light: #7ca1f5; --secondary: #64d2b1; --secondary-dark: #4eb89a; --secondary-light: #7fe0c1; --accent: #f0965b; --success: #4caf50; --warning: #ff9800; --danger: #f44336; --info: #2196f3; /* Neutrals */ --neutral-50: #fafafa; --neutral-100: #f5f5f5; --neutral-200: #eeeeee; --neutral-300: #e0e0e0; --neutral-400: #bdbdbd; --neutral-500: #9e9e9e; --neutral-600: #757575; --neutral-700: #616161; --neutral-800: #424242; --neutral-900: #212121; /* Text Colors */ --text-primary: var(--neutral-900); --text-secondary: var(--neutral-700); --text-tertiary: var(--neutral-600); --text-on-primary: white; --text-on-secondary: white; /* Background Colors */ --bg-body: var(--neutral-100); --bg-card: white; --bg-muted: var(--neutral-200); /* Spacing System */ --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem; --space-5: 1.5rem; --space-6: 2rem; --space-8: 3rem; --space-10: 4rem; --space-12: 5rem; /* Typography */ --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; --font-serif: Georgia, "Times New Roman", serif; --font-mono: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --font-size-xs: 0.75rem; --font-size-sm: 0.875rem; --font-size-md: 1rem; --font-size-lg: 1.125rem; --font-size-xl: 1.25rem; --font-size-2xl: 1.5rem; --font-size-3xl: 1.875rem; --font-size-4xl: 2.25rem; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; /* Border Radius */ --radius-sm: 0.25rem; --radius-md: 0.5rem; --radius-lg: 0.75rem; --radius-xl: 1rem; --radius-full: 9999px; /* Shadows */ --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05); --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); /* Transitions */ --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1); --transition-normal: 300ms cubic-bezier(0.4, 0, 0.2, 1); --transition-slow: 500ms cubic-bezier(0.4, 0, 0.2, 1); /* Z-index */ --z-0: 0; --z-10: 10; --z-20: 20; --z-30: 30; --z-40: 40; --z-50: 50; --z-auto: auto; } /* Base Styles */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { font-size: 16px; scroll-behavior: smooth; } body { font-family: var(--font-sans); background-color: var(--bg-body); color: var(--text-primary); line-height: 1.5; min-height: 100vh; display: flex; flex-direction: column; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } img { max-width: 100%; height: auto; } a { color: var(--primary); text-decoration: none; transition: color var(--transition-fast); } a:hover { color: var(--primary-dark); } ul, ol { list-style-position: inside; } /* Typography */ h1, h2, h3, h4, h5, h6 { font-weight: var(--font-weight-semibold); line-height: 1.2; margin-bottom: var(--space-4); color: var(--text-primary); } h1 { font-size: var(--font-size-4xl); } h2 { font-size: var(--font-size-3xl); } h3 { font-size: var(--font-size-2xl); } h4 { font-size: var(--font-size-xl); } h5 { font-size: var(--font-size-lg); } h6 { font-size: var(--font-size-md); } p { margin-bottom: var(--space-4); } small { font-size: var(--font-size-sm); } .text-center { text-align: center; } .text-primary { color: var(--primary); } .text-secondary { color: var(--secondary); } .text-success { color: var(--success); } .text-danger { color: var(--danger); } .text-warning { color: var(--warning); } .text-info { color: var(--info); } .text-muted { color: var(--text-tertiary); } /* Layout */ .container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 var(--space-4); } .row { display: flex; flex-wrap: wrap; margin: 0 -var(--space-4); } .col { flex: 1 0 0%; padding: 0 var(--space-4); } .col-auto { flex: 0 0 auto; width: auto; } .col-12 { flex: 0 0 auto; width: 100%; } .col-6 { flex: 0 0 auto; width: 50%; } .col-4 { flex: 0 0 auto; width: 33.333333%; } .col-3 { flex: 0 0 auto; width: 25%; } @media (max-width: 768px) { .col-md-12 { flex: 0 0 auto; width: 100%; } .col-md-6 { flex: 0 0 auto; width: 50%; } } @media (max-width: 576px) { .col-sm-12 { flex: 0 0 auto; width: 100%; } } .grid { display: grid; gap: var(--space-5); } .grid-cols-1 { grid-template-columns: repeat(1, 1fr); } .grid-cols-2 { grid-template-columns: repeat(2, 1fr); } .grid-cols-3 { grid-template-columns: repeat(3, 1fr); } .grid-cols-4 { grid-template-columns: repeat(4, 1fr); } @media (max-width: 992px) { .grid-cols-lg-2 { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 768px) { .grid-cols-md-2 { grid-template-columns: repeat(2, 1fr); } .grid-cols-md-1 { grid-template-columns: repeat(1, 1fr); } } @media (max-width: 576px) { .grid-cols-sm-1 { grid-template-columns: repeat(1, 1fr); } } .flex { display: flex; } .flex-col { flex-direction: column; } .items-center { align-items: center; } .justify-center { justify-content: center; } .justify-between { justify-content: space-between; } .gap-1 { gap: var(--space-1); } .gap-2 { gap: var(--space-2); } .gap-3 { gap: var(--space-3); } .gap-4 { gap: var(--space-4); } .gap-5 { gap: var(--space-5); } /* Spacing */ .m-0 { margin: 0; } .m-1 { margin: var(--space-1); } .m-2 { margin: var(--space-2); } .m-3 { margin: var(--space-3); } .m-4 { margin: var(--space-4); } .m-5 { margin: var(--space-5); } .mx-auto { margin-left: auto; margin-right: auto; } .mt-1 { margin-top: var(--space-1); } .mt-2 { margin-top: var(--space-2); } .mt-3 { margin-top: var(--space-3); } .mt-4 { margin-top: var(--space-4); } .mt-5 { margin-top: var(--space-5); } .mb-1 { margin-bottom: var(--space-1); } .mb-2 { margin-bottom: var(--space-2); } .mb-3 { margin-bottom: var(--space-3); } .mb-4 { margin-bottom: var(--space-4); } .mb-5 { margin-bottom: var(--space-5); } .mb-6 { margin-bottom: var(--space-6); } .mb-8 { margin-bottom: var(--space-8); } .p-0 { padding: 0; } .p-1 { padding: var(--space-1); } .p-2 { padding: var(--space-2); } .p-3 { padding: var(--space-3); } .p-4 { padding: var(--space-4); } .p-5 { padding: var(--space-5); } .py-1 { padding-top: var(--space-1); padding-bottom: var(--space-1); } .py-2 { padding-top: var(--space-2); padding-bottom: var(--space-2); } .py-3 { padding-top: var(--space-3); padding-bottom: var(--space-3); } .py-4 { padding-top: var(--space-4); padding-bottom: var(--space-4); } .py-5 { padding-top: var(--space-5); padding-bottom: var(--space-5); } .px-1 { padding-left: var(--space-1); padding-right: var(--space-1); } .px-2 { padding-left: var(--space-2); padding-right: var(--space-2); } .px-3 { padding-left: var(--space-3); padding-right: var(--space-3); } .px-4 { padding-left: var(--space-4); padding-right: var(--space-4); } .px-5 { padding-left: var(--space-5); padding-right: var(--space-5); } /* Components */ .card { background-color: var(--bg-card); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: var(--space-5); height: 100%; transition: transform var(--transition-normal), box-shadow var(--transition-normal); } .card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); } .card-header { margin-bottom: var(--space-4); padding-bottom: var(--space-3); border-bottom: 1px solid var(--neutral-200); } .card-title { font-size: var(--font-size-xl); font-weight: var(--font-weight-semibold); color: var(--primary); margin-bottom: var(--space-2); } .card-subtitle { font-size: var(--font-size-sm); color: var(--text-tertiary); } .card-body { flex: 1; } .card-footer { margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--neutral-200); } .btn { display: inline-flex; align-items: center; justify-content: center; padding: var(--space-2) var(--space-4); font-size: var(--font-size-md); font-weight: var(--font-weight-medium); line-height: 1.5; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; user-select: none; border: 1px solid transparent; border-radius: var(--radius-md); transition: all var(--transition-fast); } .btn:disabled { opacity: 0.65; pointer-events: none; } .btn-primary { background-color: var(--primary); color: var(--text-on-primary); } .btn-primary:hover { background-color: var(--primary-dark); color: var(--text-on-primary); } .btn-secondary { background-color: var(--secondary); color: var(--text-on-secondary); } .btn-secondary:hover { background-color: var(--secondary-dark); color: var(--text-on-secondary); } .btn-outline { background-color: transparent; border-color: var(--primary); color: var(--primary); } .btn-outline:hover { background-color: var(--primary); color: var(--text-on-primary); } .btn-danger { background-color: var(--danger); color: white; } .btn-danger:hover { background-color: #d32f2f; color: white; } .btn-sm { padding: var(--space-1) var(--space-3); font-size: var(--font-size-sm); } .btn-lg { padding: var(--space-3) var(--space-5); font-size: var(--font-size-lg); } .btn-block { display: block; width: 100%; } .badge { display: inline-block; padding: var(--space-1) var(--space-2); font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); line-height: 1; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: var(--radius-full); } .badge-primary { background-color: var(--primary-light); color: var(--primary-dark); } .badge-secondary { background-color: var(--secondary-light); color: var(--secondary-dark); } .badge-success { background-color: rgba(76, 175, 80, 0.2); color: var(--success); } .badge-danger { background-color: rgba(244, 67, 54, 0.2); color: var(--danger); } .badge-warning { background-color: rgba(255, 152, 0, 0.2); color: #e65100; } .badge-info { background-color: rgba(33, 150, 243, 0.2); color: var(--info); } .form-group { margin-bottom: var(--space-4); } .form-label { display: block; margin-bottom: var(--space-2); font-weight: var(--font-weight-medium); } .form-control { display: block; width: 100%; padding: var(--space-3); font-size: var(--font-size-md); line-height: 1.5; color: var(--text-primary); background-color: var(--bg-card); background-clip: padding-box; border: 1px solid var(--neutral-300); border-radius: var(--radius-md); transition: border-color var(--transition-fast), box-shadow var(--transition-fast); } .form-control:focus { border-color: var(--primary); outline: 0; box-shadow: 0 0 0 3px rgba(91, 138, 240, 0.25); } .form-control::placeholder { color: var(--neutral-500); opacity: 1; } .form-control:disabled { background-color: var(--neutral-200); opacity: 1; } textarea.form-control { min-height: 100px; resize: vertical; } .form-check { display: flex; align-items: center; margin-bottom: var(--space-2); } .form-check-input { margin-right: var(--space-2); } .form-check-label { margin-bottom: 0; } .alert { position: relative; padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); border: 1px solid transparent; border-radius: var(--radius-md); } .alert-success { color: #155724; background-color: #d4edda; border-color: #c3e6cb; } .alert-danger { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; } .alert-warning { color: #856404; background-color: #fff3cd; border-color: #ffeeba; } .alert-info { color: #0c5460; background-color: #d1ecf1; border-color: #bee5eb; } /* Navigation */ .navbar { display: flex; align-items: center; justify-content: space-between; padding: var(--space-4) 0; background-color: var(--bg-card); box-shadow: var(--shadow-sm); position: sticky; top: 0; z-index: var(--z-30); } .navbar-brand { font-size: var(--font-size-xl); font-weight: var(--font-weight-bold); color: var(--primary); display: flex; align-items: center; gap: var(--space-2); } .navbar-brand:hover { color: var(--primary); } .navbar-nav { display: flex; align-items: center; gap: var(--space-4); list-style: none; } .nav-link { color: var(--text-secondary); font-weight: var(--font-weight-medium); padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); transition: all var(--transition-fast); } .nav-link:hover { color: var(--primary); background-color: rgba(91, 138, 240, 0.1); } .nav-link.active { color: var(--primary); background-color: rgba(91, 138, 240, 0.1); } .navbar-toggler { display: none; background: none; border: none; font-size: var(--font-size-xl); color: var(--text-secondary); cursor: pointer; } @media (max-width: 768px) { .navbar-toggler { display: block; } .navbar-collapse { position: fixed; top: 0; left: 0; bottom: 0; width: 80%; max-width: 300px; padding: var(--space-5); background-color: var(--bg-card); box-shadow: var(--shadow-lg); transform: translateX(-100%); transition: transform var(--transition-normal); z-index: var(--z-40); overflow-y: auto; } .navbar-collapse.show { transform: translateX(0); } .navbar-nav { flex-direction: column; align-items: flex-start; gap: var(--space-3); } .nav-link { display: block; width: 100%; } .navbar-backdrop { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.5); z-index: var(--z-30); display: none; } .navbar-backdrop.show { display: block; } } /* Footer */ .footer { background-color: var(--neutral-800); color: white; padding: var(--space-8) 0 var(--space-4); margin-top: auto; } .footer-title { color: white; font-size: var(--font-size-lg); margin-bottom: var(--space-3); } .footer-link { color: var(--neutral-400); transition: color var(--transition-fast); } .footer-link:hover { color: white; } .footer-bottom { text-align: center; padding-top: var(--space-5); margin-top: var(--space-5); border-top: 1px solid var(--neutral-700); color: var(--neutral-400); } /* Mood Tracker Specific */ .mood-selector { display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--space-3); margin-bottom: var(--space-5); } .mood-option { text-align: center; } .mood-option input[type="radio"] { display: none; } .mood-option label { display: flex; flex-direction: column; align-items: center; cursor: pointer; padding: var(--space-3); border-radius: var(--radius-lg); transition: all var(--transition-fast); } .mood-option label span { margin-top: var(--space-2); font-size: var(--font-size-sm); } .mood-option input[type="radio"] + label { font-size: 2rem; } .mood-option input[type="radio"]:checked + label { background-color: rgba(91, 138, 240, 0.1); transform: scale(1.05); } .mood-entry { display: flex; align-items: flex-start; padding: var(--space-3); border-bottom: 1px solid var(--neutral-200); } .mood-entry:last-child { border-bottom: none; } .mood-entry-emoji { font-size: 1.5rem; margin-right: var(--space-3); flex-shrink: 0; } .mood-entry-content { flex: 1; } .mood-entry-date { color: var(--text-tertiary); font-size: var(--font-size-sm); margin-bottom: var(--space-1); } .mood-entry-note { margin-top: var(--space-2); } .mood-entry-actions { display: flex; gap: var(--space-2); } .mood-entry-actions button { background: none; border: none; color: var(--text-tertiary); cursor: pointer; transition: color var(--transition-fast); } .mood-entry-actions button:hover { color: var(--primary); } .chart-container { height: 300px; margin-bottom: var(--space-5); } /* Resources Specific */ .resource-card { height: 100%; display: flex; flex-direction: column; } .resource-image { height: 180px; overflow: hidden; border-radius: var(--radius-md) var(--radius-md) 0 0; position: relative; } .resource-image img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-normal); } .resource-card:hover .resource-image img { transform: scale(1.05); } .resource-content { padding: var(--space-4); flex: 1; display: flex; flex-direction: column; } .resource-category { margin-bottom: var(--space-2); } .resource-title { font-size: var(--font-size-lg); margin-bottom: var(--space-2); } .resource-description { color: var(--text-secondary); margin-bottom: var(--space-4); flex: 1; } .resource-link { margin-top: auto; align-self: flex-end; } /* Chat Specific */ .chat-container { display: flex; flex-direction: column; height: 500px; background-color: var(--bg-card); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); overflow: hidden; } .chat-messages { flex: 1; overflow-y: auto; padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); } .message { display: flex; flex-direction: column; max-width: 80%; } .message.user { align-self: flex-end; } .message.bot { align-self: flex-start; } .message-content { padding: var(--space-3); border-radius: var(--radius-lg); } .message.user .message-content { background-color: var(--primary); color: white; border-top-right-radius: 0; } .message.bot .message-content { background-color: var(--neutral-200); border-top-left-radius: 0; } .message-time { font-size: var(--font-size-xs); color: var(--text-tertiary); margin-top: var(--space-1); align-self: flex-end; } .message.user .message-time { align-self: flex-end; } .message.bot .message-time { align-self: flex-start; } .chat-input { padding: var(--space-3); border-top: 1px solid var(--neutral-200); background-color: var(--bg-card); } .chat-form { display: flex; gap: var(--space-2); } .chat-input-field { flex: 1; } .suggestion-buttons { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-4); } .suggestion-btn { padding: var(--space-2) var(--space-3); background-color: var(--bg-card); border: 1px solid var(--neutral-300); border-radius: var(--radius-full); cursor: pointer; transition: all var(--transition-fast); font-size: var(--font-size-sm); } .suggestion-btn:hover { background-color: rgba(91, 138, 240, 0.1); border-color: var(--primary); } /* Auth Specific */ .auth-container { max-width: 500px; margin: var(--space-8) auto; } .auth-card { background-color: var(--bg-card); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); padding: var(--space-6); } .auth-tabs { display: flex; margin-bottom: var(--space-5); border-bottom: 1px solid var(--neutral-200); } .auth-tab { flex: 1; padding: var(--space-3); text-align: center; background: none; border: none; cursor: pointer; font-weight: var(--font-weight-medium); color: var(--text-tertiary); transition: all var(--transition-fast); } .auth-tab.active { color: var(--primary); border-bottom: 2px solid var(--primary); } .auth-form { display: none; } .auth-form.active { display: block; } .auth-form h2 { text-align: center; margin-bottom: var(--space-5); color: var(--primary); } .form-footer { margin-top: var(--space-4); text-align: center; } /* Profile Specific */ .profile-container { display: flex; gap: var(--space-5); } .profile-sidebar { width: 250px; background-color: var(--bg-card); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-4); } .profile-avatar { text-align: center; } .profile-avatar img { width: 100px; height: 100px; border-radius: 50%; object-fit: cover; margin-bottom: var(--space-2); } .change-avatar-btn { background: none; border: none; color: var(--primary); cursor: pointer; font-size: var(--font-size-sm); } .profile-menu { display: flex; flex-direction: column; gap: var(--space-2); } .profile-menu-item { padding: var(--space-3); text-align: left; background: none; border: none; border-radius: var(--radius-md); cursor: pointer; transition: all var(--transition-fast); } .profile-menu-item:hover, .profile-menu-item.active { background-color: rgba(91, 138, 240, 0.1); color: var(--primary); } .profile-content { flex: 1; background-color: var(--bg-card); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: var(--space-5); } .profile-section { display: none; } .profile-section.active { display: block; } .profile-section h3 { margin-bottom: var(--space-5); padding-bottom: var(--space-3); border-bottom: 1px solid var(--neutral-200); color: var(--primary); } .password-change { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--neutral-200); } .theme-options { display: flex; gap: var(--space-4); } .theme-option { display: flex; align-items: center; gap: var(--space-2); } .theme-option input { width: auto; } .data-management { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--neutral-200); } .data-buttons { display: flex; gap: var(--space-3); margin-top: var(--space-3); } /* Utilities */ .d-none { display: none !important; } .d-block { display: block !important; } .d-flex { display: flex !important; } .w-100 { width: 100% !important; } .h-100 { height: 100% !important; } .rounded { border-radius: var(--radius-md) !important; } .rounded-circle { border-radius: 50% !important; } .shadow { box-shadow: var(--shadow-md) !important; } .text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .bg-primary { background-color: var(--primary) !important; } .bg-secondary { background-color: var(--secondary) !important; } .bg-success { background-color: var(--success) !important; } .bg-danger { background-color: var(--danger) !important; } .bg-warning { background-color: var(--warning) !important; } .bg-info { background-color: var(--info) !important; } .bg-light { background-color: var(--neutral-100) !important; } .bg-dark { background-color: var(--neutral-800) !important; } /* Animations */ @keyframes fadeIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } } .fade-in { animation: fadeIn 0.3s ease-in-out; } .typing-indicator .dot { display: inline-block; width: 4px; height: 4px; border-radius: 50%; margin: 0 1px; background-color: currentColor; animation: typingAnimation 1.5s infinite; } .typing-indicator .dot:nth-child(2) { animation-delay: 0.5s; } .typing-indicator .dot:nth-child(3) { animation-delay: 1s; } @keyframes typingAnimation { 0% { transform: translateY(0); opacity: 0.3; } 50% { transform: translateY(-5px); opacity: 1; } 100% { transform: translateY(0); opacity: 0.3; } } /* Responsive Adjustments */ @media (max-width: 992px) { .profile-container { flex-direction: column; } .profile-sidebar { width: 100%; } } @media (max-width: 768px) { .mood-selector { justify-content: center; } .auth-tabs { flex-direction: column; } .data-buttons { flex-direction: column; } } @media (max-width: 576px) { .card { padding: var(--space-4); } .mood-option label { padding: var(--space-2); } } [V0_FILE]html:file="index.html" isFixed="true" isEdit="true" MindEase - Mental Health Support

Welcome, Guest

How are you feeling today?

Mood Overview

Your mood trends over the past week

View Detailed History

Daily Motivation

A positive thought to brighten your day

"The greatest glory in living lies not in never falling, but in rising every time we fall."

- Nelson Mandela

Quick Access

Mood Tracker

Track your mood patterns and identify triggers

Track Mood

Resources

Explore self-help resources and techniques

Browse Resources

Chat Support

Talk to our AI assistant for guidance

Start Chat

Recommended Resources

Breathing

Deep Breathing Techniques

Simple breathing exercises to reduce stress and anxiety in just a few minutes.

Mindfulness

Mindfulness Meditation

A beginner's guide to mindfulness meditation with step-by-step instructions.

Stress

Stress Management

Practical strategies to manage academic stress and prevent burnout.

Sleep

Sleep Improvement

Tips and techniques for better sleep, especially during exam periods.

[V0_FILE]html:file="mood-tracker.html" isFixed="true" isEdit="true" Mood Tracker - MindEase

Mood Tracker

Track your mood and see patterns over time

How are you feeling today?

Select your current mood and add optional notes

Your Mood History

Visualize your mood patterns over time

Mood Insights

Understanding your emotional patterns

Most Common Mood

😊

Happy

60% of entries

Mood Trend

Improving

Based on the last 7 days

Tracking Streak

3 Days

Keep it up!

Mood Tips

Regular exercise can help improve your mood by releasing endorphins.

Try to identify patterns in your mood changes and potential triggers.

Mindfulness meditation can help manage stress and anxiety.

[V0_FILE]html:file="resources.html" isEdit="true" Resources - MindEase

Self-Help Resources

Explore our collection of mental health resources

Breathing

Deep Breathing Techniques

Learn simple breathing exercises to reduce stress and anxiety in just a few minutes.

Mindfulness

Mindfulness Meditation Guide

A beginner's guide to mindfulness meditation with step-by-step instructions.

Stress

Stress Management for Students

Practical strategies to manage academic stress and prevent burnout.

Sleep

Improving Sleep Quality

Tips and techniques for better sleep, especially during exam periods.

Anxiety

Anxiety Reduction Techniques

Evidence-based methods to reduce anxiety symptoms and manage panic attacks.

Breathing

5-Minute Breathing Exercise

A quick breathing exercise you can do anywhere to calm your mind.

[V0_FILE]html:file="chat.html" isEdit="true" Chat Support - MindEase

Chat Support

Talk to our AI assistant for support and guidance

Hello! I'm MindBot, your mental health assistant. How can I help you today?

Just now

About MindBot

Your AI mental health assistant

MindBot is designed to provide support and guidance for common mental health concerns. While it can offer helpful information and techniques, it is not a replacement for professional mental health care.

Note: If you're experiencing a mental health emergency, please call 988 or your local emergency services immediately.

MindBot can help with:

Stress management techniques
Anxiety coping strategies
Sleep improvement tips
Mood enhancement suggestions
Study and focus techniques
General mental wellbeing advice

[V0_FILE]html:file="login.html" isEdit="true" Login - MindEase

Welcome Back

Create Account

[V0_FILE]html:file="profile.html" isEdit="true" Profile - MindEase

[V0_FILE]javascript:file="js/main.js" isFixed="true" isEdit="true" // Main JavaScript file for shared functionality across all pages document.addEventListener("DOMContentLoaded", () => { // Mobile navigation toggle setupMobileNav() // Check authentication status checkAuthStatus() }) // Set up mobile navigation function setupMobileNav() { const navbarToggler = document.getElementById("navbar-toggler") const navbarCollapse = document.getElementById("navbar-collapse") const navbarBackdrop = document.getElementById("navbar-backdrop") if (navbarToggler && navbarCollapse && navbarBackdrop) { navbarToggler.addEventListener("click", () => { navbarCollapse.classList.toggle("show") navbarBackdrop.classList.toggle("show") document.body.style.overflow = navbarCollapse.classList.contains("show") ? "hidden" : "" }) navbarBackdrop.addEventListener("click", () => { navbarCollapse.classList.remove("show") navbarBackdrop.classList.remove("show") document.body.style.overflow = "" }) // Close dropdown when clicking a nav link on mobile const navLinks = document.querySelectorAll(".nav-link") navLinks.forEach((link) => { link.addEventListener("click", () => { navbarCollapse.classList.remove("show") navbarBackdrop.classList.remove("show") document.body.style.overflow = "" }) }) } } // Check if user is authenticated function checkAuthStatus() { const token = localStorage.getItem("token") const userName = localStorage.getItem("userName") // Update UI based on authentication status if (token) { // User is logged in const userNameElements = document.querySelectorAll("#user-name") userNameElements.forEach((element) => { if (element) { element.textContent = userName || "User" } }) // Update navigation links const loginLinks = document.querySelectorAll("#login-link") loginLinks.forEach((link) => { link.textContent = "Profile" link.href = "profile.html" }) } else { // User is not logged in const userNameElements = document.querySelectorAll("#user-name") userNameElements.forEach((element) => { if (element) { element.textContent = "Guest" } }) // Update navigation links const loginLinks = document.querySelectorAll("#login-link") loginLinks.forEach((link) => { link.textContent = "Login" link.href = "login.html" }) // Redirect from profile page if not logged in if (window.location.pathname.includes("profile.html")) { window.location.href = "login.html" } } } // Show success message function showSuccessMessage(container, message, duration = 3000) { // Create message element const messageElement = document.createElement("div") messageElement.className = "alert alert-success fade-in" messageElement.textContent = message // Add to DOM container.appendChild(messageElement) // Remove after specified duration setTimeout(() => { messageElement.style.opacity = "0" setTimeout(() => { messageElement.remove() }, 300) }, duration) } // Show error message function showErrorMessage(container, message, duration = 3000) { // Create message element const messageElement = document.createElement("div") messageElement.className = "alert alert-danger fade-in" messageElement.textContent = message // Add to DOM container.appendChild(messageElement) // Remove after specified duration setTimeout(() => { messageElement.style.opacity = "0" setTimeout(() => { messageElement.remove() }, 300) }, duration) } // Format date function formatDate(dateString) { const date = new Date(dateString) return date.toLocaleDateString("en-US", { weekday: "long", year: "numeric", month: "long", day: "numeric", hour: "2-digit", minute: "2-digit", }) } // Get emoji for mood function getMoodEmoji(mood) { switch (mood) { case "happy": return "😊" case "neutral": return "😐" case "sad": return "😔" case "anxious": return "😰" case "angry": return "😠" default: return "😐" } } // Get mood value (1-5) for charts function getMoodValue(mood) { switch (mood) { case "happy": return 5 case "neutral": return 3 case "sad": return 2 case "anxious": return 2 case "angry": return 1 default: return 3 } } // Get mood label from value function getMoodLabel(value) { switch (value) { case 5: return "Happy" case 4: return "Good" case 3: return "Neutral" case 2: return "Sad/Anxious" case 1: return "Angry" default: return "Neutral" } } [V0_FILE]javascript:file="js/dashboard.js" isFixed="true" isEdit="true" import { Chart } from "@/components/ui/chart" // Dashboard page specific JavaScript document.addEventListener("DOMContentLoaded", () => { // Initialize mood chart initMoodChart() // Set up quick mood buttons setupQuickMoodButtons() // Load daily quote loadDailyQuote() }) // Initialize the mood chart function initMoodChart() { const ctx = document.getElementById("moodChart") if (!ctx) return // Get mood data from local storage const moodData = getMoodData() // Create chart new Chart(ctx, { type: "line", data: { labels: moodData.dates, datasets: [ { label: "Mood", data: moodData.values, backgroundColor: "rgba(91, 138, 240, 0.2)", borderColor: "rgba(91, 138, 240, 1)", borderWidth: 2, tension: 0.4, fill: true, pointBackgroundColor: "rgba(91, 138, 240, 1)", pointRadius: 4, pointHoverRadius: 6, }, ], }, options: { responsive: true, maintainAspectRatio: false, scales: { y: { beginAtZero: true, max: 5, ticks: { stepSize: 1, callback: (value) => { return getMoodLabel(value) }, }, grid: { display: true, color: "rgba(0, 0, 0, 0.05)", }, }, x: { grid: { display: false, }, }, }, plugins: { legend: { display: false, }, tooltip: { backgroundColor: "rgba(0, 0, 0, 0.7)", padding: 10, titleFont: { size: 14, }, bodyFont: { size: 14, }, callbacks: { label: (context) => { return `Mood: ${getMoodLabel(context.raw)}` }, }, }, }, interaction: { mode: "index", intersect: false, }, }, }) } // Get mood data from local storage or mock data if none exists function getMoodData() { const storedMoodEntries = localStorage.getItem("moodEntries") if (storedMoodEntries) { const moodEntries = JSON.parse(storedMoodEntries) // Process entries for chart const dates = [] const values = [] // Get the last 7 entries or all if less than 7 const recentEntries = moodEntries.slice(-7) recentEntries.forEach((entry) => { const date = new Date(entry.timestamp) dates.push(date.toLocaleDateString("en-US", { month: "short", day: "numeric" })) values.push(getMoodValue(entry.mood)) }) return { dates, values } } else { // Return mock data if no entries exist return { dates: ["May 1", "May 2", "May 3", "May 4", "May 5", "May 6", "May 7"], values: [4, 3, 2, 3, 4, 5, 4], } } } // Set up quick mood buttons function setupQuickMoodButtons() { const moodButtons = document.querySelectorAll(".mood-btn") moodButtons.forEach((button) => { button.addEventListener("click", function () { const mood = this.getAttribute("data-mood") // Save mood entry saveMoodEntry(mood) // Show feedback showFeedback(mood) }) }) } // Save mood entry to local storage function saveMoodEntry(mood) { const moodEntry = { mood: mood, note: "", timestamp: new Date().toISOString(), } // Get existing entries or initialize empty array const storedMoodEntries = localStorage.getItem("moodEntries") const moodEntries = storedMoodEntries ? JSON.parse(storedMoodEntries) : [] // Add new entry moodEntries.push(moodEntry) // Save back to local storage localStorage.setItem("moodEntries", JSON.stringify(moodEntries)) // Refresh chart initMoodChart() } // Show feedback after mood selection function showFeedback(mood) { const welcomeCard = document.querySelector(".quick-mood").parentElement // Remove any existing feedback const existingFeedback = welcomeCard.querySelector(".alert") if (existingFeedback) { existingFeedback.remove() } // Create feedback element const feedback = document.createElement("div") feedback.className = "alert alert-success mt-4 fade-in" // Set feedback message based on mood let message switch (mood) { case "happy": message = "That's great! Keep up the positive energy!" break case "neutral": message = "Thanks for sharing. Remember it's okay to have neutral days." break case "sad": message = "I'm sorry you're feeling down. Remember to be kind to yourself today." break case "anxious": message = "It's okay to feel anxious. Try some deep breathing exercises to help calm your mind." break case "angry": message = "It's okay to feel angry sometimes. Consider journaling about what's bothering you." break default: message = "Thank you for sharing how you feel today." } feedback.textContent = message // Add to DOM welcomeCard.appendChild(feedback) // Remove after 5 seconds setTimeout(() => { feedback.style.opacity = "0" setTimeout(() => { feedback.remove() }, 300) }, 5000) } // Load daily quote function loadDailyQuote() { const quoteElement = document.getElementById("daily-quote") const authorElement = document.getElementById("quote-author") const newQuoteBtn = document.getElementById("new-quote-btn") if (!quoteElement || !authorElement || !newQuoteBtn) return // Array of motivational quotes const quotes = [ { text: "The greatest glory in living lies not in never falling, but in rising every time we fall.", author: "Nelson Mandela", }, { text: "Your mental health is a priority. Your happiness is essential. Your self-care is a necessity.", author: "Unknown", }, { text: "You don't have to control your thoughts. You just have to stop letting them control you.", author: "Dan Millman", }, { text: "There is hope, even when your brain tells you there isn't.", author: "John Green", }, { text: "Self-care is how you take your power back.", author: "Lalah Delia", }, { text: "You are not alone in this. You are seen, you are loved, and you matter.", author: "MindEase", }, { text: "The way you speak to yourself matters. Be kind with your words.", author: "Unknown", }, { text: "Mental health problems don't define who you are. They are something you experience.", author: "Roy Chisholm", }, { text: "Recovery is not one and done. It is a lifelong journey that takes place one day, one step at a time.", author: "Unknown", }, { text: "You are not your illness. You have an individual story to tell. You have a name, a history, a personality.", author: "Julian Seifter", }, ] // Function to display a random quote function displayRandomQuote() { const randomIndex = Math.floor(Math.random() * quotes.length) const quote = quotes[randomIndex] quoteElement.textContent = `"${quote.text}"` authorElement.textContent = `- ${quote.author}` // Add fade-in animation quoteElement.classList.remove("fade-in") authorElement.classList.remove("fade-in") // Trigger reflow void quoteElement.offsetWidth void authorElement.offsetWidth quoteElement.classList.add("fade-in") authorElement.classList.add("fade-in") } // Display initial quote displayRandomQuote() // Set up new quote button newQuoteBtn.addEventListener("click", displayRandomQuote) } function getMoodValue(mood) { let moodValue switch (mood) { case "angry": moodValue = 1 break case "sad": case "anxious": moodValue = 2 break case "neutral": moodValue = 3 break case "happy": moodValue = 5 break default: moodValue = 3 } return moodValue } function getMoodLabel(value) { const labels = ["", "Very Bad", "Bad", "Neutral", "Good", "Very Good"] return labels[value] } [V0_FILE]javascript:file="js/mood-tracker.js" isFixed="true" isEdit="true" isQuickEdit="true" import { Chart } from "@/components/ui/chart" // Mood Tracker page specific JavaScript document.addEventListener("DOMContentLoaded", () => { // Initialize mood history chart initMoodHistoryChart() // Load mood entries loadMoodEntries() // Set up mood form submission setupMoodForm() // Update mood insights updateMoodInsights() }) // Initialize the mood history chart function initMoodHistoryChart() { const ctx = document.getElementById("moodHistoryChart") if (!ctx) return // Get mood data from local storage const moodData = getMoodHistoryData() // Create chart new Chart(ctx, { type: "line", data: { labels: moodData.dates, datasets: [ { label: "Mood", data: moodData.values, backgroundColor: "rgba(91, 138, 240, 0.2)", borderColor: "rgba(91, 138, 240, 1)", borderWidth: 2, tension: 0.4, fill: true, pointBackgroundColor: "rgba(91, 138, 240, 1)", pointRadius: 4, pointHoverRadius: 6, }, ], }, options: { responsive: true, maintainAspectRatio: false, scales: { y: { beginAtZero: true, max: 5, ticks: { stepSize: 1, callback: (value) => { return getMoodLabel(value) }, }, grid: { display: true, color: "rgba(0, 0, 0, 0.05)", }, }, x: { grid: { display: false, }, }, }, plugins: { legend: { display: false, }, tooltip: { backgroundColor: "rgba(0, 0, 0, 0.7)", padding: 10, titleFont: { size: 14, }, bodyFont: { size: 14, }, callbacks: { label: (context) => { return `Mood: ${getMoodLabel(context.raw)}` }, }, }, }, interaction: { mode: "index", intersect: false, }, }, }) } // Get mood history data from local storage function getMoodHistoryData() { const storedMoodEntries = localStorage.getItem("moodEntries") if (storedMoodEntries) { const moodEntries = JSON.parse(storedMoodEntries) // Process entries for chart const dates = [] const values = [] // Get the last 14 entries or all if less than 14 const recentEntries = moodEntries.slice(-14) recentEntries.forEach((entry) => { const date = new Date(entry.timestamp) dates.push(date.toLocaleDateString("en-US", { month: "short", day: "numeric" })) values.push(getMoodValue(entry.mood)) }) return { dates, values } } else { // Return mock data if no entries exist return { dates: ["May 1", "May 2", "May 3", "May 4", "May 5", "May 6", "May 7"], values: [4, 3, 2, 3, 4, 5, 4], } } } // Load mood entries from local storage function loadMoodEntries() { const entriesContainer = document.getElementById("mood-entries-list") const noEntriesMessage = document.getElementById("no-entries-message") if (!entriesContainer) return const storedMoodEntries = localStorage.getItem("moodEntries") if (storedMoodEntries) { const moodEntries = JSON.parse(storedMoodEntries) // Clear container except for no-entries-message entriesContainer.innerHTML = "" if (moodEntries.length === 0) { noEntriesMessage.style.display = "block" } else { noEntriesMessage.style.display = "none" // Display entries in reverse chronological order for (let i = moodEntries.length - 1; i >= 0; i--) { const entry = moodEntries[i] const entryDiv = document.createElement("div") entryDiv.classList.add("mood-entry") const date = new Date(entry.timestamp) const formattedDate = date.toLocaleDateString("en-US", { year: "numeric", month: "long", day: "numeric", hour: "numeric", minute: "numeric", }) entryDiv.innerHTML = `

Mood: ${entry.mood}

Date: ${formattedDate}

Notes: ${entry.notes || "No notes"}

` entriesContainer.appendChild(entryDiv) } } } else { entriesContainer.innerHTML = "" noEntriesMessage.style.display = "block" } } // Set up mood form submission function setupMoodForm() { const moodForm = document.getElementById("mood-form") if (!moodForm) return moodForm.addEventListener("submit", (event) => { event.preventDefault() const mood = document.getElementById("mood").value const notes = document.getElementById("notes").value const timestamp = new Date().getTime() // Get existing entries const moodEntries = JSON.parse(localStorage.getItem("moodEntries") || "[]") // Add the new entry moodEntries.push({ mood, notes, timestamp }) // Save back to local storage localStorage.setItem("moodEntries", JSON.stringify(moodEntries)) // Reload mood entries loadMoodEntries() // Update mood history chart initMoodHistoryChart() // Update mood insights updateMoodInsights() // Reset the form moodForm.reset() }) } // Update mood insights function updateMoodInsights() { const storedMoodEntries = localStorage.getItem("moodEntries") const moodInsightsContainer = document.getElementById("mood-insights") if (!moodInsightsContainer) return if (storedMoodEntries) { const moodEntries = JSON.parse(storedMoodEntries) if (moodEntries.length > 0) { // Calculate average mood let totalMoodValue = 0 moodEntries.forEach((entry) => { totalMoodValue += getMoodValue(entry.mood) }) const averageMoodValue = totalMoodValue / moodEntries.length const averageMood = getMoodLabel(Math.round(averageMoodValue)) // Display insights moodInsightsContainer.innerHTML = `

Average Mood: ${averageMood}

` } else { moodInsightsContainer.textContent = "No mood entries to analyze." } } else { moodInsightsContainer.textContent = "No mood entries to analyze." } } // Helper function to get mood value function getMoodValue(mood) { switch (mood) { case "Very Happy": return 5 case "Happy": return 4 case "Neutral": return 3 case "Sad": return 2 case "Very Sad": return 1 default: return 3 } } // Helper function to get mood label function getMoodLabel(value) { switch (value) { case 5: return "Very Happy" case 4: return "Happy" case 3: return "Neutral" case 2: return "Sad" case 1: return "Very Sad" default: return "Neutral" } }

${resource.title}

Welcome, Guest

Mood Overview

Quick Resources

Daily Motivation

Chat Support

Welcome, Guest

Mood Overview

Daily Motivation

Quick Access

Mood Tracker

Resources

Chat Support

Recommended Resources

Deep Breathing Techniques

Mindfulness Meditation

Stress Management

Sleep Improvement

Mood Tracker

How are you feeling today?

Your Mood History

Recent Entries

Mood Insights

Most Common Mood

Mood Trend

Tracking Streak

Mood Tips

Self-Help Resources

Deep Breathing Techniques

Mindfulness Meditation Guide

Stress Management for Students

Improving Sleep Quality

Anxiety Reduction Techniques

5-Minute Breathing Exercise

Chat Support

Suggested Topics

About MindBot

MindBot can help with:

Welcome Back

Create Account

Your Profile

Account Settings

Change Password

Preferences

Notification Settings

Privacy Settings

Data Management