94 lines
2.7 KiB
Markdown
94 lines
2.7 KiB
Markdown
# CoolingStations.org Water Station Tracker
|
|
|
|
A mobile-first web application for tracking water refill stations with social login, real-time status updates, and interactive mapping.
|
|
|
|
## Features
|
|
|
|
- **Multi-platform Authentication**: Login via Google, Instagram, or traditional username/password
|
|
- **Interactive Map**: View all water stations with color-coded status indicators
|
|
- **Mobile-First Design**: Optimized for smartphones and tablets
|
|
- **Real-time Updates**: Track refill times and estimated empty times
|
|
- **Status Color Coding**:
|
|
- 🟢 Green: Recently refilled
|
|
- 🟡 Yellow: Needs refill soon
|
|
- 🔴 Red: Empty
|
|
- ⚫ Black: Not updated in 7+ days
|
|
|
|
## Installation
|
|
|
|
1. Clone the repository
|
|
2. Install dependencies:
|
|
```bash
|
|
npm install
|
|
```
|
|
|
|
3. Set up environment variables in `.env`:
|
|
```
|
|
SESSION_SECRET=your-secret-key
|
|
GOOGLE_CLIENT_ID=your-google-client-id
|
|
GOOGLE_CLIENT_SECRET=your-google-client-secret
|
|
INSTAGRAM_CLIENT_ID=your-instagram-client-id
|
|
INSTAGRAM_CLIENT_SECRET=your-instagram-client-secret
|
|
```
|
|
|
|
4. Run the application:
|
|
```bash
|
|
npm start
|
|
```
|
|
|
|
## OAuth Setup
|
|
|
|
### Google OAuth
|
|
1. Go to [Google Cloud Console](https://console.cloud.google.com/)
|
|
2. Create a new project or select existing
|
|
3. Enable Google+ API
|
|
4. Create OAuth 2.0 credentials
|
|
5. Add authorized redirect URI: `http://localhost:3000/auth/google/callback`
|
|
|
|
### Instagram OAuth
|
|
1. Go to [Instagram Developers](https://developers.facebook.com/apps/)
|
|
2. Create a new app
|
|
3. Add Instagram Basic Display product
|
|
4. Create Instagram App
|
|
5. Add redirect URI: `http://localhost:3000/auth/instagram/callback`
|
|
|
|
## Database Schema
|
|
|
|
The app uses SQLite with three main tables:
|
|
- `users`: User authentication and profile data
|
|
- `water_stations`: Station locations and basic info
|
|
- `station_updates`: Status updates with timestamps
|
|
|
|
## API Endpoints
|
|
|
|
- `GET /`: Public map view
|
|
- `GET /login`: Login page
|
|
- `GET /dashboard`: User dashboard (requires auth)
|
|
- `GET /api/stations`: Get all stations
|
|
- `POST /api/stations`: Add new station (requires auth)
|
|
- `POST /api/stations/:id/update`: Update station status (requires auth)
|
|
|
|
## Usage
|
|
|
|
1. **Public Users**: Can view the map and station statuses
|
|
2. **Registered Users**: Can add new stations and update existing ones
|
|
3. **Station Updates**: Include description, refill time, and estimated empty time
|
|
4. **Mobile Interface**: Responsive design works on all screen sizes
|
|
|
|
## Development
|
|
|
|
For development with auto-reload:
|
|
```bash
|
|
npm run dev
|
|
```
|
|
|
|
## Production Deployment
|
|
|
|
1. Set `NODE_ENV=production`
|
|
2. Configure HTTPS and update session cookie settings
|
|
3. Set up proper database backup
|
|
4. Configure reverse proxy (nginx recommended)
|
|
|
|
## License
|
|
|
|
MIT License |