📖 Khutbah Live Translator v4.6

"And of His signs is the creation of the heavens and the earth and the diversity of your languages..." (Quran 30:22)

A free, open-source web app bringing live translation and spiritual resources to your Masjid.

🌐 Live Demo • 📱 Install as Web App

---

✨ What's New in v4.6?

The ultimate spiritual companion for the Masjid — now with 35+ languages and a complete Islamic toolkit:

Feature	Description
🌍 35+ Language UI	Full app interface available in Amharic, Arabic, Azerbaijani, Bengali, Bosnian, Dutch, English, French, German, Gujarati, Hausa, Hindi, Indonesian, Italian, Japanese, Korean, Kurdish, Malayalam, Pashto, Persian, Polish, Portuguese, Punjabi, Russian, Somali, Spanish, Swahili, Tamil, Thai, Turkish, Urdu, Uzbek, and more!
📖 Quran Reader	Built-in module with Arabic text, transliteration, and 30+ translation languages
🤲 Du'a Collection	Curated library of Adhkar, Salah supplications & daily prayers with Arabic, transliteration, and meanings
🕌 Prayer Times	Accurate prayer time calculations with countdown to next prayer
🧭 Qibla Compass	Built-in Qibla direction indicator using device compass
🎨 6 Beautiful Themes	Masjid Night, Desert Sand, Midnight Blue, Ottoman Rose, Pure Light, and Royal Purple
🔄 Dual Translation Engines	Lingva + MyMemory fallback for maximum reliability
📶 Offline-First	Smart caching for all content — works even without internet
🔒 Privacy First	Zero ads, zero tracking, no registration required

---

🚀 Key Features

⚡ Real-time Translation

Advanced speech-to-text and dual translation APIs deliver live sermon captions in real-time:

• 35+ languages for app interface localization
• Speech recognition for 30+ source languages (Arabic dialects, English, Urdu, Turkish, etc.)
• Translation to 35+ target languages
• Dual engine fallback (Lingva → MyMemory) ensures reliability

📖 Quran Reader

Read and listen to the Holy Quran with:

• Arabic text with beautiful Amiri font
• Transliteration for those learning Arabic
• 30+ translation languages including English, Urdu, Arabic, Turkish, Indonesian, Hindi, Bengali, and more
• Audio playback with multiple reciters (Alafasy, AbdulBasit, Hudhaify, Minshawi, As-Sudais, etc.)
• Playback speed control (0.5x - 2x)

🤲 Du'a Collection

Curated library of essential supplications:

• Arabic text with transliteration
• English/Hindi meanings for all duas
• Categorized by type (Morning, Evening, Sleep, Food, Travel, etc.)
• Searchable by category tags

🕌 Prayer Times

Stay connected to prayer times:

• Automatic location detection
• Multiple calculation methods (Umm Al-Qura, Egyptian, ISNA, etc.)
• Countdown timer to next prayer
• Hijri & Gregorian dates
• Qibla compass direction indicator

📱 PWA Ready

Add to your home screen for a native app experience:

• Works offline with cached content
• Full-screen immersive mode
• Optimized for mobile browsers
• No app store required

---

🌍 Supported Languages

The app interface is fully translated into 35+ languages:

Language	Code	Status
Amharic	am	✅
Arabic	ar	✅ Embedded
Azerbaijani	az	✅
Bengali	bn	✅
Bosnian	bs	✅
Dutch	nl	✅
English	en	✅ Embedded
French	fr	✅
German	de	✅
Gujarati	gu	✅
Hausa	ha	✅
Hindi	hi	✅
Indonesian	id	✅
Italian	it	✅
Japanese	ja	✅
Korean	ko	✅
Kurdish	ku	✅
Malayalam	ml	✅
Pashto	ps	✅
Persian/Farsi	fa	✅
Polish	pl	✅
Portuguese	pt	✅
Punjabi	pa	✅
Russian	ru	✅
Somali	so	✅
Spanish	es	✅
Swahili	sw	✅
Tamil	ta	✅
Thai	th	✅
Turkish	tr	✅
Urdu	ur	✅ Embedded
Uzbek	uz	✅

Note: Embedded languages (English, Arabic, Urdu) work offline without internet. Other languages load from the server but are cached for offline use.

---

🛠 Tech Stack

Built lightweight and accessible for everyone:

Frontend:      HTML5 • CSS3 (Custom Variables) • JavaScript (Vanilla)
Typography:    Amiri (Arabic) • Outfit (Modern UI)
Deployment:    GitHub Pages
Architecture:  Progressive Web App (PWA)
APIs:         Web Speech API • Lingva Translation • MyMemory Translation
Prayer:        Aladhan API • OpenCompass

📥 Installation & How to Use

🔗 Option 1: Web Browser (Easiest)

1. Open https://khalecl.github.io/Khutbah on your mobile browser
2. Select your preferred language from Settings
3. Choose sermon source and translation languages
4. Hold your phone near the speaker or use during waiting times

📱 Option 2: Install as App (Recommended)

iOS Users:

1. Open Safari
2. Navigate to the app
3. Tap the Share icon (↗️)
4. Select "Add to Home Screen"
5. Tap "Add"

Android Users:

1. Open Chrome
2. Navigate to the app
3. Tap the three-dot menu (⋮)
4. Select "Install app" or "Add to Home Screen"
5. Confirm installation

---

🎨 Themes

The app comes with 6 beautiful themes optimized for different environments:

Theme	Best For
🕌 Masjid Night (Default)	Dark mosque environments
🏜️ Desert Sand	Warm, sandy environments
🌊 Midnight Blue	Late-night reading
🌹 Ottoman Rose	Elegant, royal feel
☀️ Pure Light	Daytime use, bright environments
👑 Royal Purple	Purple lovers

---

🤝 Contribute (Sadaqah Jariyah)

This is a Sadaqah Jariyah (ongoing charity) built for the sake of Allah.

How You Can Help:

👨‍💻 Developers

• Fork the repo and submit PRs
• Improve translation logic
• Add new features

🌐 Translators

• Refine existing translations
• Add new language files to lang/ folder
• Improve Du'a translations

📣 Everyone

• Share with your local Masjid
• Spread the word on social media
• Report bugs and suggest features

Adding New Languages

To add a new language:

1. Create a new file in lang/ folder (e.g., lang/fr.json)
2. Copy the structure from lang/en.json
3. Translate all keys to your target language
4. Add the language to the LANGUAGE_NAMES object in index.html
5. Submit a pull request!

"Whoever guides someone to goodness will have a reward like whoever did it." — Prophet Muhammad (ﷺ)

---

📄 License

MIT License © 2024-2025 Dr. Khaled Diab

This project is open-source and free to use, modify, and distribute.

---

📩 Contact & Support

Created with 💚 by Dr. Khaled Diab

If this tool helped you or your community, please keep me and my family in your Du'as. 🤲

---

⭐ If you find this project useful, please consider giving it a star!