A Progressive Web App for tracking swimming sessions and sauna usage, built with vanilla JavaScript and modern web technologies.
- 🏊♂️ Track swimming sessions with automatic session numbering
- 🔄 Count laps and calculate kilometers (0.025 km per lap)
- 🧖♂️ Monitor sauna usage with time tracking
- 📊 View statistics and progress over time
- 📱 Mobile-first design that works on all devices
- 🔄 Offline functionality - works without internet
- 📲 Installable as a native app on mobile devices
- Clone or download the project files
- Open
index.html
in a web browser - Start tracking your swimming sessions!
- Upload all files to your web server
- Ensure HTTPS is enabled (required for PWA features)
- Access the app via your domain
- Open the app in your mobile browser
- Look for the "Add to Home Screen" option:
- iOS Safari: Tap the share button → "Add to Home Screen"
- Android Chrome: Tap the menu → "Add to Home Screen"
- Launch the app from your home screen
- Local Storage: All data is stored locally in your browser
- No Server Required: Works completely offline
- Privacy: Your data never leaves your device
PoolTrackerWeb/
├── index.html # Main HTML file
├── styles.css # CSS styling
├── app.js # JavaScript logic
├── manifest.json # PWA manifest
├── sw.js # Service worker
├── icons/ # App icons (create these)
└── README.md # This file
You'll need to create app icons in various sizes. You can use any image editor or online tools:
- 72x72, 96x96, 128x128, 144x144, 152x152, 192x192, 384x384, 512x512 pixels
- Place them in an
icons/
folder - Use PNG format
- ✅ Chrome (Android & Desktop)
- ✅ Safari (iOS & macOS)
- ✅ Firefox
- ✅ Edge
⚠️ Internet Explorer (limited PWA support)
- Session counter: Total number of swimming sessions
- Lap counter: Total laps across all sessions
- Kilometer calculation: Automatic conversion (0.025 km per lap)
- Sauna tracking: Number of sauna visits and total time
- Recent sessions: Last 3 sessions displayed
- Date selection: Choose any date for the session
- Lap input: Enter number of laps completed
- Sauna tracking: Optional sauna time recording
- Validation: Ensures all required fields are filled
- Complete history: All sessions sorted by date
- Session details: Laps, kilometers, and sauna information
- Date display: Romanian date format
- Progressive Web App: Installable, offline-capable
- Local Storage: Data persistence without server
- Responsive Design: Works on all screen sizes
- Modern JavaScript: ES6+ features
- CSS Grid & Flexbox: Modern layout techniques
Edit styles.css
to change the color scheme:
- Primary blue:
#007AFF
- Success green:
#34c759
- Background:
#f2f2f7
Modify app.js
to change the kilometer calculation:
const totalKilometers = totalLaps * 0.025; // Change 0.025 to your pool length
This is a simple, self-contained web app. All functionality is client-side, so no server setup is required. The app will work offline once loaded and can be installed on mobile devices for a native app experience.