Prayer timetable in Casablanca

/* Conteneur global limité en hauteur */ .widget-prieres-maroc { max-height: 1900px; /* div { height: 100%; width: 0%; background: #1f8ceb; transition: width .2s ease; } .table-wrap { max-height: 900px; /* limite l’affichage des 50 villes */ overflow: auto; border: 1px solid #eee; border-radius: 10px; } table { width: 100%; border-collapse: collapse; } th, td { white-space: nowrap; } tbody tr:nth-child(odd) { background: #fff; } tbody tr:nth-child(even) { background: #f6f6f6; } .badge { display: inline-block; padding: .25rem .5rem; border-radius: 999px; background: #eaf4ff; color: #1f8ceb; font-size: .8rem; } .sr-only { position: absolute; width: 1px; height: 1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; } .inline-note { font-size: .9rem; color: #666; } .sticky-top { position: sticky; top: 0; background: inherit; z-index: 2; } /* Free API used: Aladhan Endpoint: https://api.aladhan.com/v1/timingsByCity?city={CITY}&country=Morocco&date={DD-MM-YYYY} Doc: https://aladhan.com/prayer-times-api Example call: https://api.aladhan.com/v1/timingsByCity?city=Casablanca&country=Morocco&date=10-10-2025 Example JSON response (excerpt): { “code”: 200, “status”: “OK”, “data”: { “timings”: { “Fajr”: “05:38”, “Sunrise”: “07:04”, “Dhuhr”: “13:22”, “Asr”: “16:33”, “Maghrib”: “19:34”, “Isha”: “20:56” }, “date”: { “readable”: “10 Oct 2025”, “timestamp”: “1696896000” }, “meta”: { “timezone”: “Africa/Casablanca” } } } */ /* =============================== Data for the 50 largest cities (FR label / API name) =============================== */ const VILLES_MAROC = [ { label: “Casablanca”, city: “Casablanca” }, { label: “Rabat”, city: “Rabat” }, { label: “Fès”, city: “Fes” }, { label: “Salé”, city: “Sale” }, { label: “Tanger”, city: “Tangier” }, { label: “Marrakech”, city: “Marrakech” }, { label: “Meknès”, city: “Meknes” }, { label: “Oujda”, city: “Oujda” }, { label: “Kénitra”, city: “Kenitra” }, { label: “Agadir”, city: “Agadir” }, { label: “Tétouan”, city: “Tetouan” }, { label: “Témara”, city: “Temara” }, { label: “Safi”, city: “Safi” }, { label: “Mohammédia”, city: “Mohammedia” }, { label: “Khouribga”, city: “Khouribga” }, { label: “El Jadida”, city: “El Jadida” }, { label: “Béni Mellal”, city: “Beni Mellal” }, { label: “Nador”, city: “Nador” }, { label: “Taza”, city: “Taza” }, { label: “Settat”, city: “Settat” }, { label: “Berrechid”, city: “Berrechid” }, { label: “Ksar El Kébir”, city: “Ksar el Kebir” }, { label: “Larache”, city: “Larache” }, { label: “Khemisset”, city: “Khemisset” }, { label: “Guelmim”, city: “Guelmim” }, { label: “Ouarzazate”, city: “Ouarzazate” }, { label: “Al Hoceïma”, city: “Al Hoceima” }, { label: “Taroudant”, city: “Taroudant” }, { label: “Essaouira”, city: “Essaouira” }, { label: “Fnideq”, city: “Fnideq” }, { label: “Martil”, city: “Martil” }, { label: “Sidi Slimane”, city: “Sidi Slimane” }, { label: “Sidi Kacem”, city: “Sidi Kacem” }, { label: “Oulad Teima”, city: “Oulad Teima” }, { label: “Youssoufia”, city: “Youssoufia” }, { label: “Midelt”, city: “Midelt” }, { label: “Berkane”, city: “Berkane” }, { label: “Guercif”, city: “Guercif” }, { label: “Taourirt”, city: “Taourirt” }, { label: “Errachidia”, city: “Errachidia” }, { label: “Fquih Ben Salah”, city: “Fkih Ben Salah” }, { label: “Sefrou”, city: “Sefrou” }, { label: “Azrou”, city: “Azrou” }, { label: “Oued Zem”, city: “Oued Zem” }, { label: “Ouazzane”, city: “Ouazzane” }, { label: “Tiznit”, city: “Tiznit” }, { label: “Chichaoua”, city: “Chichaoua” }, { label: “Skhirat”, city: “Skhirat” }, { label: “Benslimane”, city: “Benslimane” }, { label: “Bouznika”, city: “Bouznika” } ]; /* =============================== Constants & helpers =============================== */ const API_BASE = “https://api.aladhan.com/v1/timingsByCity”; const cache = new Map(); // key: city|date -> timings const $ = (sel, ctx=document) => ctx.querySelector(sel); const $$ = (sel, ctx=document) => Array.from(ctx.querySelectorAll(sel)); function toDDMMYYYY(date) { const d = String(date.getDate()).padStart(2, ‘0’); const m = String(date.getMonth() + 1).padStart(2, ‘0’); const y = date.getFullYear(); return `${d}-${m}-${y}`; } function fromInputDate(val) { // val: YYYY-MM-DD const [y,m,d] = val.split(‘-‘).map(Number); return new Date(y, m-1, d); } function formatHumanDateFR(date) { return date.toLocaleDateString(‘fr-MA’, { weekday: ‘long’, year: ‘numeric’, month: ‘long’, day: ‘numeric’ }); } function stripTZ(t) { // Aladhan sometimes returns “05:38 (+01)” -> keep HH:MM only return String(t).split(‘ ‘)[0]; } /* =============================== Fetch timings (with cache) =============================== */ async function fetchTimings(city, dateStr) { const key = `${city}|${dateStr}`; if (cache.has(key)) return cache.get(key); const url = `${API_BASE}?city=${encodeURIComponent(city)}&country=Morocco&date=${encodeURIComponent(dateStr)}`; const resp = await fetch(url); if (!resp.ok) throw new Error(`Network error (${resp.status})`); const json = await resp.json(); if (json.code !== 200 || !json.data) throw new Error(‘Invalid response from API’); const t = json.data.timings; const timings = { Fajr: stripTZ(t.Fajr), Sunrise: stripTZ(t.Sunrise), Dhuhr: stripTZ(t.Dhuhr), Asr: stripTZ(t.Asr), Maghrib: stripTZ(t.Maghrib), Isha: stripTZ(t.Isha), timezone: json.data.meta?.timezone || ‘Africa/Casablanca’ }; cache.set(key, timings); return timings; } /* =============================== Render main card (selected city) =============================== */ function renderTimingsTiles(container, timings) { container.innerHTML = ”; const items = [ { k: ‘Fajr’, label: ‘Fajr’ }, { k: ‘Sunrise’, label: ‘Sunrise’ }, { k: ‘Dhuhr’, label: ‘Dhuhr’ }, { k: ‘Asr’, label: ‘Asr’ }, { k: ‘Maghrib’, label: ‘Maghrib’ }, { k: ‘Isha’, label: ‘Isha’ } ]; items.forEach(item => { const div = document.createElement(‘div’); div.className = ‘time-pill’; div.innerHTML = `${item.label}${timings[item.k] || ‘–:–‘}`; container.appendChild(div); }); } async function updateMainCard() { const select = $(‘#select-ville’); const dateInput = $(‘#input-date’); const cityObj = VILLES_MAROC[select.selectedIndex] || VILLES_MAROC[0]; const apiCity = cityObj.city; const label = cityObj.label; const date = dateInput.value ? fromInputDate(dateInput.value) : new Date(); const dateStr = toDDMMYYYY(date); $(‘#titre-ville’).textContent = `${label} — timings for ${formatHumanDateFR(date)}`; $(‘#badge-date’).textContent = formatHumanDateFR(date); const grid = $(‘#grille-horaires’); grid.innerHTML = ‘‘; try { const timings = await fetchTimings(apiCity, dateStr); renderTimingsTiles(grid, timings); } catch (e) { grid.innerHTML = ``; } } /* =============================== Table all cities =============================== */ function initAllCitiesRows() { const tbody = $(‘#tbody-villes’); tbody.innerHTML = ”; VILLES_MAROC.forEach(v => { const tr = document.createElement(‘tr’); tr.dataset.label = v.label.toLowerCase(); tr.innerHTML = ` ${v.label} –:– –:– –:– –:– –:– –:– `; tbody.appendChild(tr); }); } function filterCities(q) { const needle = q.trim().toLowerCase(); $$(‘#tbody-villes tr’).forEach(tr => { tr.style.display = (!needle || tr.dataset.label.includes(needle)) ? ” : ‘none’; }); } async function loadAllCities(dateStr, onProgress) { const results = {}; let done = 0; const total = VILLES_MAROC.length; const limit = 8; // concurrency limit for performance const queue = VILLES_MAROC.map(v => v); async function worker() { while (queue.length) { const v = queue.shift(); try { const t = await fetchTimings(v.city, dateStr); results[v.label] = t; } catch { results[v.label] = { Fajr: ‘—’, Sunrise: ‘—’, Dhuhr: ‘—’, Asr: ‘—’, Maghrib: ‘—’, Isha: ‘—’ }; } finally { done++; onProgress(Math.round((done / total) * 100)); } } } await Promise.all(Array.from({ length: limit }, worker)); return results; } function renderAllCitiesTable(results) { $$(‘#tbody-villes tr’).forEach(tr => { const label = tr.querySelector(‘td strong’).textContent; const times = results[label]; if (!times) return; [‘Fajr’,’Sunrise’,’Dhuhr’,’Asr’,’Maghrib’,’Isha’].forEach(k => { const td = tr.querySelector(`td[data-k=”${k}”]`); if (td) td.textContent = times[k] || ‘—’; }); }); } /* =============================== UI initialization =============================== */ function initUI() { // Fill city select const select = $(‘#select-ville’); VILLES_MAROC.forEach((v, i) => { const opt = document.createElement(‘option’); opt.value = v.city; opt.textContent = v.label; if (v.label === ‘Casablanca’) opt.selected = true; select.appendChild(opt); }); // Default date (YYYY-MM-DD) const today = new Date(); const yyyy = today.getFullYear(); const mm = String(today.getMonth() + 1).padStart(2, ‘0’); const dd = String(today.getDate()).padStart(2, ‘0’); $(‘#input-date’).value = `${yyyy}-${mm}-${dd}`; // Init table initAllCitiesRows(); // Listeners $(‘#btn-actualiser’).addEventListener(‘click’, updateMainCard); $(‘#select-ville’).addEventListener(‘change’, updateMainCard); $(‘#input-date’).addEventListener(‘change’, () => { updateMainCard(); // If user reloads all cities after date change, it will be accounted for }); $(‘#filtre-ville’).addEventListener(‘input’, (e) => filterCities(e.target.value)); const progressBar = $(‘#progress-bar’); const srProgress = $(‘#sr-progress’); function setProgress(pct) { progressBar.style.width = `${pct}%`; srProgress.textContent = `Progress ${pct}%`; } $(‘#btn-charger-toutes’).addEventListener(‘click’, async () => { const date = $(‘#input-date’).value ? fromInputDate($(‘#input-date’).value) : new Date(); const dateStr = toDDMMYYYY(date); setProgress(0); $(‘#btn-charger-toutes’).setAttribute(‘disabled’, ‘true’); try { const results = await loadAllCities(dateStr, setProgress); renderAllCitiesTable(results); } catch (e) { alert(‘Error loading timings for all cities.’); } finally { $(‘#btn-charger-toutes’).removeAttribute(‘disabled’); setProgress(100); setTimeout(() => setProgress(0), 800); } }); // First render (Casablanca) updateMainCard(); } document.addEventListener(‘DOMContentLoaded’, initUI);

Prayer times in Casablanca: detailed guide for each salat

Exact times of the five daily prayers in Casablanca (example: October 2025)

In Casablanca, the accuracy of prayer times determines the daily prayer. Example for October 15, 2025 (GMT+1): Fajr 05:59 (ends at Sunrise 07:25), Dhuhr 13:22, Asr 16:38, Maghrib 18:53, Isha 20:08. The adhan signals the start of the prayer, and each time slot has clear start and end times.

The sahur period ends at the adhan of Fajr, and the iftar corresponds to Maghrib. For the following night, the favorable window for the spiritual Fajr (pre-dawn supplications) is before the adhan of Fajr, often around the last third of the night.

• Practical example: on 15/10, recommended sahur until 05:55, Fajr 05:59–07:25, iftar at 18:53.

• For Rabat, also check this updated prayer calendar.

Start and end of each prayer: Fajr, Sunrise, Dhuhr, Asr, Maghrib, Isha

The time for Fajr starts at true dawn and ends at sunrise (Sunrise). Dhuhr starts just after the zenith and lasts until the start of Asr. Asr continues until sunset, the time of Maghrib. Isha extends from the disappearance of twilight until midnight (ideally) or until Fajr.

• Useful milestones: sunrise 07:25, iftar time 18:53, Fajr window 05:59–07:25.

• For cross-checking, explore these detailed timings for Rabat.

Calculation of prayer times in Casablanca: methods, sun angles, and time zones

Calculation method for prayer times: sun angles and Casablanca’s latitude

We adopt classical angles: 18° for Fajr and Isha, consistent with the latitude of Casablanca and the GMT+1 time zone. Practically, the algorithm determines the solar position according to local longitude and adjusts margins for a reliable adhan.

• Reference points: Fajr/Isha at 18°, automatic adaptation to civil day and twilight.

• Need a nearby reference? Check prayer times in Rabat.

Differences between schools and religious authorities regarding timings

Differences exist: some authorities adopt 15° for Fajr/Isha, and for Asr, the Hanafi school uses the double shadow length while others use the simple shadow. In Casablanca, these nuances shift the windows by a few minutes.

• To note: check the method used by your local mosque in Casablanca.

• Useful reference: this nearby guide illustrates these choices.

Specificities of prayers in Casablanca: number of raka’at, recommendations, and discouraged times

Number of rak’ats (fardh, sunnah, nawafil) for each prayer

In Casablanca, the practice follows orthodoxy: Fajr 2 fardh (after 2 sunnah), Dhuhr 4 fardh (before/after sunnah), Asr 4 fardh, Maghrib 3 fardh, Isha 4 fardh plus witr. The supererogatory prayer strengthens the daily spiritual presence.

• Advice: audible recitation for Fajr, Maghrib, Isha; low voice for Dhuhr and Asr.

• Want to compare? Browse this nearby calendar.

Recommended and makruh (discouraged) times for each daily prayer

It is discouraged to pray exactly at sunrise, zenith, and sunset. In Casablanca, performing Fajr early in its window, Dhuhr after zenith, and Asr before yellowing of the sun fosters quality prayer. These landmarks guide a serene and disciplined practice.

• Good practice: avoid delaying Fajr and rushing Asr at the end of its window.

• For Rabat, the same vigilance applies: see the slots.

Secondary prayer times in Casablanca: Duha, Tahajjoud, and key spiritual moments

Ideal times for the Duha prayer and their significance

The Duha prayer begins after Sunrise when the sun has risen a bit: for our date, around 07:45–11:30 in Casablanca. Duha nourishes gratitude, like a breath in the morning between activity and contemplation.

• Indicative window: 07:45–11:30, with 2 to 8 units of recommended prayer.

• Nearby example available: Duha in Rabat.

Favorable times for Tahajjoud and the importance of night prayer

Tahajjoud is performed in the last third of the night. Between Maghrib and Fajr, the ideal window in Casablanca for the given example is around 02:45–05:40, a time when the heart calms and supplications strengthen.

• Tip: set an alarm before the Fajr time to preserve the window.

• Useful tool: this night schedule helps you plan.

Qibla direction in Casablanca: orientation towards the Kaaba

In Casablanca, the qibla points approximately to 100° (east-southeast) from geographic north. This bearing ensures alignment towards the Kaaba, essential for prayer in congregation and at work throughout Morocco.

• Memo: check orientation once, then mark the prayer space.

• Need another urban reference? Also see the page dedicated to Rabat.

Seasonal variation of prayer times in Casablanca and access to the monthly online calendar

Changes in prayer times according to the seasons (summer, winter, solstices)

Days lengthen in summer and shorten in winter; in Casablanca, Fajr shifts earlier in June and later in December, while Asr and Isha move accordingly. Understanding these variations means planning your prayer at the right time.

• Seasonal markers: around the summer solstice, very early Fajr; in winter, Isha closer to Maghrib.

• Think of following a reliable calendar for your travels.

Easy access to the monthly prayer calendar and city search on our site

A detailed monthly calendar, with local corrections and method options, simplifies life in Casablanca. To refine your times, compare with the neighboring city via this handy link to official times in Rabat, useful for professional mobility.

• Key features: city search, alerts, and display by adhan time for each prayer.

• Smooth transition between Casablanca and Rabat via the same timings portal.