filoor
d378511401
Deze commit verbetert de laadtijden en responsiviteit van de Adhaan-webapp door verschillende optimalisaties. Er is een verbetering in de structuur van HTML en JavaScript. De expliciete onclick-attributen zijn vervangen door event listeners, caching van DOM-elementen is geïntroduceerd, en er zijn debouncing-technieken toegevoegd voor efficiëntere updates van weer- en hadithgegevens. Verder is er sprake van een herschikking van de countdown-timer en andere UI-elementen om logischer te werken, zoals het verbergen van de inhoud om FOUC te voorkomen totdat alles geladen is. Deze wijzigingen samen dragen bij aan een soepeler gebruikerservaring.
Adhaan Gebedstijden Display
Een moderne, islamitische gebedstijden display applicatie met automatische adhaan, weersinformatie en Sonos integratie.
✨ Nieuwe Functies
🌤️ Weersinformatie
- Actuele temperatuur en weersomstandigheden
- Automatische updates elke 10 minuten
- Nederlandse weerbeschrijvingen
- Windsnelheid en luchtvochtigheid
🎵 Uitgebreide Audio Opties
- Meerdere adhaan-stijlen beschikbaar
- Audio preview functie in instellingen
- Verbeterde instellingen interface
- Test functionaliteit voor Sonos
🚀 Installatie
1. OpenWeatherMap API Key verkrijgen
- Ga naar OpenWeatherMap
- Maak een gratis account aan
- Verkrijg je API key (1000 gratis calls per dag)
2. Configuratie
Bewerk config.py en vervang YOUR_API_KEY_HERE met je OpenWeatherMap API key:
OPENWEATHER_API_KEY = 'jouw_api_key_hier'
Optioneel kun je ook de locatie aanpassen:
WEATHER_LOCATION = 'Amsterdam,NL' # Vervang met jouw stad
3. Docker opstarten
docker-compose up -d
📱 Gebruik
Hoofdscherm
- Links: Huidige tijd, datum en countdown naar volgende gebed
- Rechts: Hadith, gebedstijden en weersinformatie
- Knoppen: Dark/light mode, instellingen, mute
Instellingen
- Volume: Sonos volume instelling (0-100)
- Zones: Selecteer welke Sonos speakers gebruikt worden
- Audio: Kies adhaan-stijl met preview functie
- Test: Test audio op Sonos of lokaal
🎵 Audio Bestanden Toevoegen
- Plaats MP3 bestanden in
static/clips/ - Bestanden worden automatisch beschikbaar in instellingen
- Aanbevolen: max 5MB per bestand
🔧 API Endpoints
GET /api/weather- Actuele weerdataGET /api/hadith- Willekeurige hadithPOST /api/mute- Toggle mute statusPOST /api/test-audio- Test audio bestand
🌍 Functies
- ✅ Automatische adhaan op gebedstijden
- ✅ Sonos integratie met meerdere zones
- ✅ Nederlandse hadiths die automatisch wisselen
- ✅ Dark/light theme toggle
- ✅ Mute functionaliteit
- ✅ Responsive design
- ✅ Weersinformatie met automatische updates
- ✅ Meerdere adhaan-stijlen met preview
- ✅ Moderne, islamitische UI
🛠️ Technische Details
- Backend: Flask (Python)
- Frontend: HTML5, CSS3, JavaScript
- Audio: MP3 ondersteuning
- API's: VUMG (gebedstijden), OpenWeatherMap (weer), Sonos
- Deployment: Docker + TrueNAS
📝 Changelog
v2.0 - Nieuwe Functies
- ➕ Weersinformatie toegevoegd
- ➕ Meerdere adhaan-stijlen
- ➕ Audio preview functie
- ➕ Verbeterde instellingen interface
- ➕ API endpoints voor dynamische updates
- ➕ Configuratie bestand voor eenvoudige setup
v1.0 - Basis Functionaliteit
- ✅ Gebedstijden display
- ✅ Automatische adhaan
- ✅ Sonos integratie
- ✅ Hadith rotatie
- ✅ Dark/light theme