SolarScope

A modern, mobile-friendly dashboard for visualizing and analyzing your solar and utility (SaskPower) data.

---

🛠️ Tech Stack

• Backend: Flask (Python)
• Frontend Graphs: Chart.js v4 (responsive, mobile-friendly)
• Styling: Tailwind CSS
• Dynamic Data: AJAX (vanilla JS or HTMX)
• CSV Import: Supports SaskPower 15-minute interval data
• Optional: chartjs-plugin-zoom for advanced touch/pinch/zoom

---

🚀 Quickstart

1. Clone and install dependencies:

   git clone https://github.com/yourusername/solarscope.git
   cd solarscope
   python3 -m venv venv
   source venv/bin/activate
   pip install -r requirements.txt
   

2. Initialize the database:

   python3 scripts/init_db.py
   

3. Run the server:

   python3 app/app.py
   

4. Visit:
   • Dashboard: http://localhost:5005/dashboard
   • Admin: http://localhost:5005/admin (manage SolarEdge, weather, and upload/download)
   • API: /power-usage, /solar-generation, /summary/daily, etc.

---

📊 Features

• Interactive graphs for power usage and solar generation
• Mobile-first: Responsive layout, touch-friendly graphs
• Upload SaskPower CSV/ZIP: Drag-and-drop or select your data file
• Day/week toggle with daily and weekly summaries
• Download your data as CSV
• Admin page: Streamlined settings for SolarEdge API, weather location (with validation and feedback), and user-friendly upload/download tools
• Improved error handling and feedback throughout the admin panel
• Automatic SolarEdge sync every 15 minutes

---

🖼️ Architecture

• Flask serves HTML, API endpoints, and static files
• Chart.js renders graphs (line, bar, area)
• Tailwind CSS for layout, spacing, and mobile UX
• AJAX/HTMX fetches new data for charts when user changes date or toggles filters

---

🔧 Extending/Customizing

• Add new chart types: Edit the dashboard JS and add new Flask endpoints as needed
• Add new data sources: Implement new importers (see routes.py)
• Style tweaks: Edit Tailwind classes in the HTML

---

📱 Mobile UX Tips

• Use w-full and h-64 on chart containers
• Add horizontal scroll (overflow-x-auto) for long time series
• Use sticky summary cards for quick daily totals
• Use button groups for quick date filters ("Today", "This Week", etc.)

---

📅 Roadmap (see ROADMAP.md for details)

• Modular Flask backend
• File upload and CSV import
• Chart.js v4 integration
• SolarEdge API integration with automatic 15-minute sync
• Admin page redesign and error feedback improvements
• Enhanced mobile dashboard
• Live updating (HTMX or Flask-Sock)

---

License

MIT