Adhaan/adhan-webapp
filoor a5e27baa86 feat(webapp): implementatie van async/await voor API-calls en UI optimalisaties
Deze commit introduceert de overstap van traditionele threading naar async/await voor efficiëntere API-oproepen binnen de adhan-webapp. Dit omvat de vervanging van parallele executors met asyncio, waardoor de webapplicatie asynchroon weer- en Sonos-zonegegevens kan ophalen. Daarnaast zijn er prestatieverbeteringen in de gebruikersinterface doorgevoerd, zoals het cachen van DOM-elementen, debouncing van volume-updates en geoptimaliseerde tab-navigatie. Deze wijzigingen verbeteren de algehele snelheid en responsiviteit van de applicatie aanzienlijk.
2025-05-29 21:30:40 +02:00
..
2025-05-27 11:50:28 +02:00
2025-05-27 11:50:28 +02:00
2025-05-27 11:50:28 +02:00
2025-05-27 11:50:28 +02:00
2025-05-27 11:50:28 +02:00

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

  1. Ga naar OpenWeatherMap
  2. Maak een gratis account aan
  3. 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

  1. Plaats MP3 bestanden in static/clips/
  2. Bestanden worden automatisch beschikbaar in instellingen
  3. Aanbevolen: max 5MB per bestand

🔧 API Endpoints

  • GET /api/weather - Actuele weerdata
  • GET /api/hadith - Willekeurige hadith
  • POST /api/mute - Toggle mute status
  • POST /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