My Personal App — All-in-One Personal Hub

A private, client-side progressive web app for tracking your daily life — food diary with AI calorie estimation, budgeting, moodboard inspirations, and progress selfies. Built as a single-file web application installed to the iOS home screen or web browsers.

---

App Architecture

Level 1: Home Dashboard (Hub)

• Home Hub (#hub): Central dashboard featuring module stat cards and quick access to:
  • 🍲 Food Diary: Daily food diary, Instagram-style multi-photo posts, carousel views, and Gemini AI food recognition.
  • 💰 Budget (記帳): Track daily expenses, income transactions, and monthly balances.
  • 🎨 Moodboard: Collect visual inspiration pins and aesthetic notes.
  • 📸 Selfies: Document daily progress portraits and visual timeline.
  • ⏳ Countings: Track anniversaries (Count-up), event countdowns (D-Day), repeat milestones, and create shareable posters.
• Global Bottom Navigation Bar: Seamless one-tap navigation across modules.

Level 2: Modules

🍲 Food Module

• Instagram-Style Multi-Photo Posts: Uploading multiple photos creates a single post card with a swipeable carousel and pagination indicators (• • •).
• Photo Reordering: Reorder photos within a post using ◄ Left and Right ► buttons.
• List vs. Carousel View Modes: Toggle day views between a vertical post list and a horizontal scrollable carousel.
• AI Calorie & Food Recognition: Tap ✨ AI Calorie on any food post to analyze dishes and estimate calories/macros using the Gemini Multimodal Vision API.

💰 Budget Module

• Quick expense/income logging with category tags (Food, Transport, Shopping, Entertainment, General) and auto-calculated totals.

🎨 Moodboard Module

• Visual photo inspiration collage grid.

📸 Selfies Module

• Daily progress portrait log with date timestamps.

⏳ Countings Module

• Dual Mode (Countdown & Count-up): Count days until future events (Countdown / D-Day) or count days elapsed since special milestones (Count-up / Days Together).
• Repeat Cycles: Support for One-off, Yearly (birthdays/anniversaries automatically roll to the next occurrence), Monthly, and Weekly cycles.
• Spotlight Hero Card: Pinned hero card with live seconds ticker and refined Liquid Glass theme styling.
• Milestone Predictor: Automatically calculate exact dates for 100, 300, 500, 1000 days and anniversary milestones.
• Date Toolbox: Built-in interval calculator and date offset calculator.
• Shareable Posters: Canvas-generated aesthetic posters (Liquid Glass, Polaroid, Minimalist, Ticket Pass) for instant download or sharing.

---

Running and Deploying

Locally:

python3 -m http.server 8085

Open http://localhost:8085 in a browser.

Deploying: Put index.html at the root of GitHub Pages or any static host. On iPhone, open the URL in Safari and select Share → Add to Home Screen.