v5.5.0
MASJID JAMI' AL JIHAD
Platform Digital Signage Masjid Terintegrasi & Smart Prayer Display System
Tentang Sistem Digital Masjid
Catatan perjuangan, dedikasi, serta ungkapan rasa syukur pengembang
Puji dan syukur marilah kita panjatkan ke hadirat Allah SWT, yang telah memberikan kita nikmat kesehatan, kemudahan, serta kesempatan sehingga pada hari yang penuh berkah ini, aplikasi web untuk Masjid Jami' Al-Jihad dapat diselesaikan, berevolusi hingga tahap mutakhir, dan siap untuk dipergunakan.
Jujur, dalam proses pembuatannya, saya sangat menyadari segala keterbatasan dan kekurangan kemampuan yang saya miliki. Namun, hanya atas izin, petunjuk, dan pertolongan dari Allah SWT belaka (لَا حَوْلَ وَلَا قُوَّةَ إِلَّا بِاللَّهِ), niat baik dan ikhtiar panjang ini akhirnya dapat terwujud secara nyata.
Hadirnya sistem aplikasi web ini tidak lain hanyalah sebuah sarana ikhtiar kecil yang dapat saya persembahkan untuk membantu merapikan administrasi, meningkatkan transparansi kas umat, serta memudahkan pelayanan ibadah dan pengelolaan kegiatan syiar dakwah di Masjid Al-Jihad yang kita cintai ini.
MASJID JAMI' AL JIHAD Digital Signage adalah platform informasi visual dan sistem otomasi masjid modern. Aplikasi ini dirancang khusus untuk memenuhi kebutuhan syiar, transparansi kas, serta ketertiban ibadah. Berjalan dengan arsitektur Dual Engine Crossfade Rotator (Layar TV Utama & Layar TV Luar/Serambi), serta terintegrasi penuh dengan Prayer Mode Otomatis, CCTV Mimbar Live Stream, dan Otomasi Pengajian Rutin Malam Ahad.
Sistem ini mengedepankan performa tinggi dengan teknologi murni Vanilla JS & GPU-Accelerated CSS sehingga mampu menampilkan visual yang sangat mewah, halus (60 FPS tanpa jeda kedip), dan ramah terhadap perangkat TV box berdaya rendah tanpa membebani memori. Demi efisiensi daya dan waktu pengoperasian, sistem TV ini juga dilengkapi dengan Smart Breaker dan Smart IR Remote Control sehingga beroperasi penuh secara mandiri (full auto self running).
Besar harapan saya, platform ini dapat memberikan manfaat yang nyata dan langgeng bagi pengurus maupun seluruh jama'ah. Sekali lagi saya mohon ma'af yang sedalam-dalamnya jika dalam menyelesaikan web aplikasi ini ada keterlambatan dan masih banyak kekurangan.
Terima kasih yang sebesar-besarnya saya sampaikan kepada seluruh pihak dan pengurus Masjid Al-Jihad yang telah memberikan kepercayaan, dukungan, serta doa selama proses pembuatan. Semoga setiap usaha dan ikhtiar kita ini dicatat oleh Allah SWT sebagai amal jariyah yang pahalanya terus mengalir tiada putus. Aamiin Ya Rabbal 'Alamin.
Analisa Spesial: Tabel Ringkasan Komparasi Head-to-Head
Studi Kasus Deploy RenderPerbandingan teknis: Web Statis Modern vs Web Laravel Dinamis Lama (Jika sama-sama di-deploy di platform Render)
| Parameter / Aspek Kinerja | Web Laravel Dinamis (Lama) | Web Statis Modern (Saat Ini) 🏆 |
|---|---|---|
| Tipe Layanan di Render | Web Service (Docker/PHP) | 🏆 Statis Menang Static Site (CDN Edge) — Gratis permanen tanpa batasan jam sewa. |
| Ukuran Web & Disk | ~450 MB – 1.2 GB (Vendor PHP, framework, cache) | 🏆 Hemat 96% ~25 MB – 45 MB (Murni aset statis HTML, CSS, JS, audio). |
| Waktu Build & Deploy | 4 – 8 Menit (Composer install, migrate, optimize) | 🏆 16x Lebih Cepat 10 – 30 Detik (Langsung publish tanpa kompilasi server). |
| Konsumsi RAM Server | 200 MB – 450 MB (Rentan OOM di limit 512MB RAM) | 🏆 Nol Risiko 0 MB (Serverless Edge, bebas crash Out-of-Memory). |
| Masalah Cold Start (Tidur) | 50 – 90 Detik (Layar TV macet/loading saat bangun) | 🏆 Instant 0 Detik (Nol Jeda) — Tidak pernah tidur 24 jam nonstop. |
| Kecepatan Respon (TTFB) | 600 ms – 2.500 ms (Query database + render Blade) | 🏆 Super Kilat 20 ms – 60 ms (Dihantarkan dari Cloudflare Edge Cache). |
| Ketahanan Internet Mati | Layar Error / Putih (Gagal request HTTP ke server) | 🏆 100% Mandiri Tetap Berjalan Normal via Cache LocalStorage & Client Engine. |
| Beban Hardware TV Box | Sering jank/patah-patah akibat reload iframe berkala | 🏆 60 FPS GPU Sangat ringan, hardware TV Box dingin & awet bertahun-tahun. |
Kesimpulan Studi Perbandingan:
Layar TV masjid adalah perangkat yang berjalan 24 jam nonstop di lingkungan jaringan yang terkadang fluktuatif. Memindahkan sistem display dari server PHP dinamis ke Web Statis Modern berbasis Client-Side Engine membuktikan bahwa kesederhanaan arsitektur (*simplicity*) justru menghasilkan keandalan tertinggi: biaya operasional Rp 0, waktu tanggap tanpa jeda, serta tampilan visual yang tak pernah mengecewakan jamaah.
Fitur Tampilan TV Mutakhir
Teknologi visual canggih yang tampil di layar TV Masjid Jami' Al-Jihad
Dual Engine Crossfade
Arsitektur dual-iframe cerdas. Pergantian slide 60 FPS berlangsung mulus tanpa kedip hitam (zero-flicker transitions).
Smart Next Prayer Bar
Kapsul hitung mundur waktu sholat berikutnya detik-demi-detik yang diposisikan presisi di atas kotak jadwal sholat utama.
Dynamic Ambient Theme
Pendaran aura cahaya latar layar (ambient orbs) yang otomatis berganti warna mengikuti 6 siklus waktu sholat.
Prayer & Khutbah Engine
Otomasi 5 fase ibadah: Audio Tarhim, Adzan, Hitung Iqamah, Layar Gelap Khusyuk, serta Mode Khutbah Jum'at 50 menit.
CCTV Mimbar Otomatis
TV Serambi Luar otomatis beralih menampilkan siaran langsung mimbar saat Khutbah Jum'at atau Sholat Ied dimulai.
Live Makkah & Madinah
Siaran langsung 24 jam Ka'bah Makkah dan Nabawi Madinah dilengkapi Smart Mosque Overlay (jam & jadwal sholat transparan).
Smart Running Text
Teks berjalan halus dengan dukungan multi-pesan (Enter) khusus per halaman yang selaras dengan tema yang tayang.
Kajian Malam Ahad TV
Auto-switch pintar tiap Sabtu ba'da Maghrib s/d Isya: Pemateri, Kitab, Tema, Smart Countdown Isya & QR Tanya Jawab Digital.
Kecerdasan Buatan Terintegrasi (Google Gemini AI)
Asisten cerdas DKM untuk konten dakwah & pengumuman TVAI One-Click Copywriter
Menyusun pengumuman resmi islami, jadwal, dan running text marquee 150 karakter dalam 2 detik.
Hadits Hikmah Harian AI
Matan Arab berharakat font Amiri, terjemahan, dan sari hikmah dengan cache 24 jam hemat kuota.
Otomasi Mandiri Hemat Daya
Full Auto Self-RunningTV display telah terhubung dengan Smart Breaker dan Smart IR Remote Control. Seluruh TV menyala (Power ON) dan mati (Power OFF) otomatis terjadwal tanpa perlu repot dinyalakan manual oleh marbot setiap hari.
Fitur Rotasi Halaman & Saluran Display
Daftar lengkap 19 saluran informasi visual yang berputar di layar TV masjid
Pembagian Hak Akses Pengguna (RBAC)
Keamanan data terstruktur sesuai bidang tugas kepengurusan DKM
Administrator
Akses Penuh (Full Control)- Kelola 3 akun pengguna & pembagian peran (RBAC)
- Pengaturan urutan putaran slide TV (Naik/Turun)
- Konfigurasi identitas masjid, logo, running text
- Konfigurasi API Key Google Gemini & model AI
- Integrasi link Live Makkah, Madinah, & CCTV Mimbar
- Manajemen backup data Cloud Supabase
Petugas / Operator
Operasional Harian- Penyesuaian jadwal sholat & waktu jeda iqamah
- Petugas Sholat Jum'at, Idul Fitri, & Idul Adha
- Manajemen Pengajian Rutin Malam Ahad (Pekan 1-5)
- Pembuatan pengumuman cerdas dibantu Gemini AI
- Upload poster & brosur kegiatan dakwah masjid
- Aktifkan/nonaktifkan slide TV (urutan terproteksi)
Bendahara
Manajemen Keuangan- Pencatatan Buku Kas Utama (infaq tromol & operasional)
- Pencatatan Kas Operasional Mobil Ambulance Masjid
- Program penggalangan donasi & target infaq terarah
- Pemantauan grafik ringkasan keuangan di TV
- Penerimaan Infaq Ramadhan & Hewan Qurban
Panduan Pengoperasian Sistem
Petunjuk teknis operasional lengkap: display TV, jadwal sholat, agenda rutin, Ramadhan, infaq, dan kas masjid
A. Layar TV Utama (Di Dalam Masjid):
- Buka aplikasi browser (Chrome / Edge / Browser TV) pada Smart TV atau Android Box.
- Ketik alamat website utama masjid:
https://digitalaljihad.my.id/. - Tekan tombol F11 pada keyboard (atau aktifkan mode Fullscreen / Kiosk) untuk menyembunyikan address bar browser.
- Layar otomatis berputar mulus 60 FPS menampilkan jadwal sholat, mutiara hadits, laporan kas, pengumuman, dan agenda dakwah.
B. Layar TV Luar / Serambi Masjid:
- Gunakan alamat khusus TV Luar:
https://digitalaljihad.my.id/slides/live-mimbar.html. - Di waktu biasa berputar menampilkan slide informasi umum seperti layar utama.
- Saat Khutbah Jum'at atau Sholat Ied tiba, layar otomatis beralih menampilkan siaran langsung kamera CCTV Mimbar agar jamaah di serambi luar dapat menyimak khutbah dengan nyaman.
C. Otomasi Mandiri Hemat Daya (Full Auto Self-Running):
Rangkaian TV display masjid telah terintegrasi dengan Smart Breaker dan Smart IR Remote Control. Seluruh TV menyala (Power ON) dan mati/standby (Power OFF) otomatis terjadwal tanpa perlu repot dinyalakan manual oleh marbot setiap hari.
A. Metode Perhitungan & Sinkronisasi Waktu:
- Tersedia 2 pilihan metode hisab resmi: Falakiyah Nahdlatul Ulama (LF-PBNU) dan Kementerian Agama RI (Bimas Islam).
- Sistem otomatis menghitung waktu sholat harian berdasarkan koordinat GPS masjid (Lintang & Bujur) serta zona waktu WIB (UTC+7).
- Fitur Koreksi Manual (+/- Menit): Memudahkan pengurus mencocokkan waktu sholat lokal (misal: Subuh +2 mnt, Ashar -1 mnt) agar tepat selaras dengan jam istiwa masjid.
B. 4 Fase Siklus Ibadah Reguler:
- Fase 1: Tarhim Otomatis — Audio tarhim/murottal mengalun merdu beberapa menit sebelum adzan sebagai peringatan awal jamaah bersiap wudhu.
- Fase 2: Panggilan Adzan — Rotasi TV berhenti sementara, menampilkan visual seruan adzan berkumandang.
- Fase 3: Hitung Mundur Iqamah — Display menampilkan countdown waktu jeda sholat sunnah qobliyah hingga iqamah ditegakkan.
- Fase 4: Sholat Khusyuk (Blank Screen) — Layar TV otomatis menjadi gelap syahdu bertuliskan pesan "Luruskan dan Rapatkan Shaf Anda" selama durasi sholat (default: 15 menit) agar konsentrasi sholat jamaah tidak terganggu oleh cahaya layar.
C. Khusus Sholat Jum'at (Durasi 50 Menit):
Saat masuk waktu Sholat Jum'at, sistem otomatis mengunci layar dalam mode Khutbah Jum'at (50 Menit): menampilkan 4 plakat petugas resmi (Khatib, Imam, Muadzin, Bilal) serta hadits larangan berbicara saat khatib berkhutbah. TV Serambi Luar otomatis beralih menyiarkan feed CCTV Mimbar.
A. 4 Pilar Kegiatan Dakwah Rutin:
- Rutinan Malam Jum'at: Pembacaan Surat Yaasiin, Tahlil, dan Doa Bersama untuk ahli kubur jamaah.
- Pengajian Rutin Sabtu Malam Ahad: Kajian Ba'da Maghrib s/d Isya dengan kurikulum kitab kuning & kajian tematik bergilir.
- Tahsin Al-Qur'an Pekanan: Kelas perbaikan makharijul huruf & tajwid dengan pilihan hari bebas menggunakan fitur 1-Click Day Picker (Senin s/d Ahad).
- Kajian Tematik Dwi-Mingguan: Pengajian Subuh Ahad Ke-2 & Ke-4 mengupas fiqih keluarga dan tasawuf.
B. Smart Pulsing Badge TV ("HARI INI / MALAM INI"):
Sistem TV membaca jam & hari kalender secara cerdas. Jika hari ini bertepatan dengan jadwal agenda (misal hari Kamis malam), kartu agenda Yaasiin akan otomatis menyalakan badge emas berkedip dinamis (*Golden Pulsing Glow*) bertuliskan "MALAM INI" untuk menarik perhatian jamaah yang sholat di masjid.
C. Sakelar Status Cepat (Toggle Switch):
Pengurus dapat meliburkan atau mengaktifkan kembali masing-masing pilar kajian dengan menekan sakelar switch ON/OFF tanpa menghapus data pemateri, kitab, atau jam kajian yang telah tersimpan.
A. Tombol "Terapkan Preset 5 Pekan DKM":
Berfungsi sebagai pengisi otomatis 1-klik untuk jadwal standar DKM Masjid Al-Jihad:
- Pekan 1: Kitab Riyadush Shalihin (Ustadz H. Ahmad Dahlan)
- Pekan 2: Kitab Fathul Qorib / Fiqih Ibadah (Ustadz H. Abdul Malik, Lc.)
- Pekan 3: Tafsir Al-Qur'an Tematik (K.H. Zainal Abidin)
- Pekan 4: Tazkiyatun Nufus & Sirah Nabawiyah (Ustadz M. Ridwan, M.Pd.I)
- Pekan 5: Muhasabah / Tematik Khusus (Ustadz Tamu / DKM)
B. Sinkronisasi Kalender Sabtu Otomatis:
Cukup pilih Bulan & Tahun di bagian atas form, sistem akan mendeteksi seluruh tanggal hari Sabtu dalam bulan tersebut secara matematis (termasuk pekan ke-5 jika bulan tersebut memiliki 5 hari Sabtu).
C. Posisi Tombol "Simpan Agenda 1 Bulan":
Untuk mempermudah pengisian tanpa perlu scroll panjang ke paling bawah layar, tombol "Simpan Agenda 1 Bulan" kini diposisikan tepat di bawah kotak Rekap Kajian Bulan Ini dan sejajar horizontal dengan formulir pengisian di sebelah kiri.
A. Manajemen Petugas Tarawih 30 Malam:
- Formulir terpadu untuk menyusun petugas: Imam Sholat Tarawih, Muadzin / Bilal Tarawih, serta Penceramah Kultum Ba'da Isya selama 30 hari penuh.
- Kolom Penceramah Kultum Bersifat Opsional: Jika pada malam tertentu masjid tidak mengadakan kultum tarawih, cukup kosongkan kolom kultum dan sistem akan tetap menampilkan nama Imam & Bilal di TV tanpa pesan error.
B. Pencatatan Kas Tromol Sholat Tarawih:
Setiap malam ba'da tarawih, bendahara atau marbot dapat langsung menginput nominal perolehan kotak tromol keliling. Data akan langsung terangkum dalam tabel rekap kas Ramadhan dan siap ditampilkan di TV menjelang waktu sholat malam berikutnya.
C. Sakelar Khusus Mode TV Ramadhan:
Ketika bulan suci Ramadhan tiba, aktifkan sakelar "Mode TV Ramadhan" di admin. Display TV akan otomatis menambahkan countdown waktu berbuka puasa, slide jadwal Imsakiyah harian, serta ornamen visual Ramadhan Mubarak yang megah.
A. Dukungan Multi-Program Infaq Aktif:
Masjid dapat menggalang beberapa pos dana secara simultan (misal: Renovasi Kubah & Tempat Wudhu, Pengadaan Karpet Turki, Santunan Anak Yatim & Dhuafa, serta Pembelian Mobil Ambulance). Masing-masing program memiliki saldo, target, dan rincian mutasi tersendiri.
B. Target Dana & Progress Bar Otomatis:
Setiap donasi yang masuk otomatis dihitung terhadap target nominal program. Layar TV akan menampilkan indikator persentase capaian dan grafik progress bar dinamis untuk memotivasi jamaah berinfaq.
C. Fitur Donatur Anonim ("Hamba Allah"):
Tersedia tombol pintas "Gunakan Hamba Allah" untuk menyamarkan identitas muhsinin yang menginginkan kerahasiaan sedekah demi menjaga kemurnian niat dan keikhlasan beramal.
D. Cetak Kuitansi & Ekspor Laporan:
Sistem menyediakan fitur cetak kuitansi tanda terima donasi resmi berkop DKM Masjid Al-Jihad serta tombol ekspor pembukuan donatur ke format file CSV/Excel.
A. Pemisahan Kas Utama & Kas Mobil Ambulance:
- Buku Kas Utama: Menampung seluruh penerimaan infaq jum'at, kotak keliling, operasional listrik, air, kebersihan, dan gaji marbot.
- Buku Kas Ambulance: Khusus mencatat donasi operasional ambulance, pembelian BBM, servis rutin, perpanjangan STNK, serta insentif relawan supir.
B. 3 Kartu Metrik Saldo Real-Time:
Di bagian atas halaman Kas, terdapat 3 kartu ringkasan keuangan yang otomatis ter-update setiap kali ada transaksi baru: Total Pemasukan, Total Pengeluaran, dan Saldo Kas Terkini.
C. Urutan Transaksi Kronologis Terkini (Descending):
Tabel mutasi keuangan disajikan secara kronologis menurun (transaksi paling baru berada di baris teratas) sehingga bendahara dapat langsung memantau transaksi mutasi terakhir tanpa perlu mencari ke halaman belakang.
D. Filter Cepat & Pencarian Transaksi:
Bendahara dapat menyaring pembukuan berdasarkan rentang tanggal tertentu, memfilter kategori penerimaan/pengeluaran, mencari kata kunci uraian, serta mengunduh rekap mutasi ke file CSV/Excel dengan satu klik.
A. AI Copywriter Pengumuman DKM:
- Buka menu Pengumuman → klik tombol "Tulis dengan AI".
- Ketik topik singkat (misal: "Kerja bakti bersih masjid Ahad pagi jam 7").
- Dalam 2 detik, Gemini AI akan menyusunkan Judul resmi, Naskah Maklumat lengkap, serta Teks Marquee Running Text ringkas (maksimal 150 karakter) secara otomatis.
B. Slide Mutiara Hadits Hikmah Harian AI:
Slide slides/hikmah.html menayangkan kutipan hadits shahih tematik yang diperbarui setiap 24 jam dengan kaligrafi Arab berharakat font Amiri, arti terjemahan bahasa Indonesia, dan sari pelajaran hikmah dengan sistem cache hemat kuota.
C. Efek Cahaya Golden Pulse & Ambient Aura:
Saat masuk waktu sholat, border kartu dan jam digital memancarkan animasi pendaran emas syahdu (*Golden Glowing Pulse*) yang memberi isyarat visual santun kepada jamaah bahwa waktu sholat telah tiba.
Riwayat Perjalanan & Pembaruan Sistem
Rekam jejak tahapan perjuangan dari inisiasi awal hingga rilis mutakhir
-
Versi 5.5.0 (Rilis Terkini) September 2026
Konsolidasi Pusat Agenda Rutin, Semarak Ramadhan, Program Infaq, & Panduan Sistem Lengkap
- Pusat Agenda Rutin Masjid (Bab 143): Konsolidasi 4 pilar dakwah terpadu (Yaasiin Malam Jum'at, Pengajian Rutin Sabtu Malam Ahad, Tahsin 1-Click Day Picker, Tafsir Subuh Dwi-Mingguan) dilengkapi Smart Pulsing Badge TV (*"HARI INI / MALAM INI"*).
- Pengajian Rutin Malam Ahad 1 Bulan Penuh (Bab 144 - 145): Fitur Preset 5 Pekan DKM 1-klik, auto-generate kalender hari Sabtu, dan reposisi tombol simpan sejajar di bawah kotak rekap kajian.
- Semarak Ramadhan Terintegrasi (Bab 135 - 140): Penyusunan jadwal tarawih 30 hari, kolom kultum opsional fleksibel, pencatatan kas tromol harian tarawih, serta sakelar mode TV Ramadhan.
- Program Infaq & Donasi Khusus Multi-Program (Bab 125 - 130): Dukungan multi-pos infaq aktif, visual target & progress bar persentase, mode donatur anonim "Hamba Allah", serta cetak kuitansi resmi.
- Buku Kas & Transaksi Realtime (Bab 110 - 120): Pemisahan Buku Kas Utama vs Kas Ambulance, 3 kartu ringkasan saldo realtime, dan pengurutan mutasi descending kronologis.
- Pembaruan Dokumentasi & Panduan Lengkap (Bab 146): Integrasi seluruh tutorial operasional 8 modul utama ke menu Tentang & Panduan.
-
Versi 5.1.0 25 September 2026
Fitur Pengajian Rutin Malam Ahad & Penajaman Tipografi Header TV
- Pengajian Rutin Malam Ahad (Bab 83): Slide khusus `slides/kajian.html`, auto-switch Sabtu malam ba'da Maghrib s/d Isya, smart countdown Isya, form preset 5 pekan di admin, dan QR tanya jawab digital.
- Peningkatan Kontras Font Header Masjid (Bab 82 & 85): Penyempurnaan warna font header menjadi Islamic Gold Metallic (
#FFD700) dengan text-stroke hitam pekat 1.5px dan bayangan 3D multi-arah sehingga nama masjid terbaca sangat tegas dan megah dari kejauhan 15 meter tanpa silau terhadap latar awan/langit Ka'bah. - Pembaruan Dokumentasi & Kenang-Kenangan (Bab 84): Adaptasi halaman Tentang Aplikasi ke format Web Statis Modern lengkap dengan Tabel Komparasi Head-to-Head Render.
-
Versi 5.0.0 September 2026
Evolusi Web Statis Mandiri & Supabase BaaS
Migrasi total arsitektur, dari PHP-Laravel-MySQL (yang sangat merepotkan dalam proses deploy dan mencari hosting) ke Web Statis Modern. Waktu build terpangkas dari 8 menit menjadi 15 detik, nol cold-start, dan ketahanan offline penuh jika Wi-Fi masjid terputus.
-
Versi 4.2.6 15 September 2026
Integrasi Google Gemini AI & Reposisi Countdown Sholat
Pemasangan AI Copywriter pengumuman dan Slide Mutiara Hadits Hikmah AI. Pengecualian Syuruk & Imsak dari layar gelap prayer mode, serta reposisi kapsul hitung mundur di atas kartu jadwal sholat.
-
Versi 4.0.0 14 September 2026
Grand Redesign Islamic Material Design 3
Penyempurnaan visual SB Admin 2 dengan nuansa hijau botol islami, live clock topbar, widget prayer pill, dan penataan ulang 14 slide siaran TV.
-
Versi 3.0.3 Agustus 2026
Catatan Sejarah TV Masjid & Momen Bersejarah
Catatan Kenangan: NDILALAH TV masjid terbeli dan diserahkan lagi. Bracket dipasang Sabtu malam minggu 5 Sept '26, langsung GAZZZ beli SamSoe 3 slop, trus lanjut lembur ke versi 3.0.4! -
Versi 1.0.0 – 3.0.2 (Juli – Agustus 2026)
Inisiasi konsep dasar, riset tampilan display jadwal sholat 5 waktu, modul keuangan kas, dan perintisan sistem display masjid digital.