'بِسْمِ ٱللَّٰهِ ٱلرَّحْمَٰنِ ٱلرَّحِيمِ
In the Name of Allah the Merciful, the Compassionate.
This project has been open-sourced as a form of sadaqah jariyah - may Allah reward every single contribution, technical, non-technical and those who share with others.
This application allows mosques to run a prayer display screen for the worshipers and also an offline progressive web app that runs on any modern web browser.
This version of the application supersedes the original version which was created in association with East London Mosque.
The commentary on why we built this version, can be found in the following blog: https://medium.com/mosque/design-concept-direction-for-mosque-screens-51c4f9bb82.
The original contributors of this project can be found here.
A special thanks should be given to the UK Government Digital Service who provided voluntary days which allowed the original project to come to life.
To keep track of features implemented and in the pipeline, please have a look at our project board: https://github.com/orgs/MosqueOS/projects/1/views/1
If you want to request a new feature, please raise an issue on this repo with a description of what you want.
You can see a working demo here: https://mosque-prayer-display-screen.vercel.app/
All of the code sits here: https://github.com/MosqueOS/Mosque-Prayer-Display-Screen
- Google Account
Go to the following link and make a copy of the spreadsheet: https://docs.google.com/spreadsheets/d/1o9dngtGJbfkFGZK_M7xdlo2PtRuQknGEQU3FxpiPVbg/copy.
Click on the share button and add [email protected]
as a viewer. We don't need any write access, so please do not give us this.
This allows our API to access your spreadsheet and read your data.
To generate the API endpoint, you need to extract the spreadsheet ID from your spreadsheet link.
For example, if your spreadsheet URL is:
https://docs.google.com/spreadsheets/d/1o9dngtGJbfkFGZK_M7xdlo2PtRuQknGEQU3FxpiPVbg/edit
Your ID would be:
1o9dngtGJbfkFGZK_M7xdlo2PtRuQknGEQU3FxpiPVbg
You then add this ID to the following URL, like this:
https://api.mosque.tech/mosque-data/1o9dngtGJbfkFGZK_M7xdlo2PtRuQknGEQU3FxpiPVbg
You can use the following tool to automatically generate an API endpoint: https://codepen.io/DilwoarH/full/mdvOexr
Note: You don't need to use our API endpoint, you can generate your own endpoint but please make sure it has all the required properties.
We currently use Vercel (we found others not to work as well).
Click on the following button:
Once your app has deployed, visit the URL and test your screen. Make sure it works on the TV you want to use for the mosque. Our app is designed for 1080p Full HD TV screens.
You can set up custom domains like: prayertime.mymosque.com
If you want to update your domain, you can do so by following the Vercel documentation: https://vercel.com/docs/projects/domains/add-a-domain
KEY | VALUE | DEFAULT | DESCRIPTION |
---|---|---|---|
MOSQUE_API_ENDPOINT | https://api.mosque.tech/mosque-data/1o9dngtGJbfkFGZK_M7xdlo2PtRuQknGEQU3FxpiPVbg | REQUIRED - NO DEFAULT | Data from Mosque API |
BLACKOUT_PERIOD | 13 | 13 minutes | How long your mosque screen dims / blacks out during congregation prayer |
UPCOMING_PRAYER_DAY | 3 | 3 upcoming days shown in slider | How many upcoming days it shows in the sliding section |
SLIDE_TRANSITION_TIME | 7 | 7 seconds | How long each slide shows for in the sliding section |
cp .env.local.example .env.local
npm install
npm run dev
Raspberry Pi (RPI) is an easy way to get the screen running, the screen doesn't need too much power - a lightweight computer like an RPI is enough.
You can buy one from the official suppliers: https://www.raspberrypi.com/products/
We recommend you buy a case with a fan or some heat-cooling solution - the screen will run all day so it's good to have a good cooling solution.
- Install Raspberry Pi OS on the SD Card
- Install chromium-browser - Do this step only if you do not have Chromium
- Open Terminal
cd .config
sudo mkdir -p lxsession/LXDE-pi
sudo nano lxsession/LXDE-pi/autostart
- Add the following line at the end of the file:
@lxpanel --profile LXDE-pi
@pcmanfm --desktop --profile LXDE-pi
point-rpi
@chromium-browser --noerrdialogs --noerrors --disable-session-crashed-bubble --disable-features=InfiniteSessionRestore --disable-infobars --start-fullscreen --start-maximized --app=https://mosque-prayer-display-screen.vercel.app
(make sure to replace the --app=https://mosque-prayer-display-screen.vercel.app
with your URL)
sudo reboot
- Once it reboots, it should start with start-up to your screen automatically.
We don't provide any free support, you can join our discord channel to get help from the community using the following invite link: https://discord.gg/CG7frj2.
If you would like paid support, you can contact us here for pricing: [email protected].