Edit readme
This commit is contained in:
@@ -1,72 +1,121 @@
|
|||||||
# 📺 GridTV
|
# 📺 GridTV
|
||||||
|
|
||||||
> A real-time IPTV TV guide, built for [Tunarr](https://github.com/chrisbenincasa/tunarr) and any XMLTV/M3U source.
|
A lightweight **real-time IPTV TV guide** designed for **Tunarr** and
|
||||||
|
any **XMLTV / M3U source**.
|
||||||
|
|
||||||

|
GridTV displays your EPG in a clean horizontal timeline similar to
|
||||||

|
traditional TV guides, accessible from any browser.
|
||||||

|
|
||||||
|
|
||||||
---
|
```{=html}
|
||||||
|
<p align="center">
|
||||||
|
```
|
||||||
|
`<img src="assets/preview.png" width="75%">`{=html}
|
||||||
|
`<img src="assets/previewmobile.png" width="18%">`{=html}
|
||||||
|
```{=html}
|
||||||
|
</p>
|
||||||
|
```
|
||||||
|
```{=html}
|
||||||
|
<p align="center">
|
||||||
|
```
|
||||||
|
`<img src="https://img.shields.io/badge/PHP-8.0+-777BB4?style=flat-square&logo=php&logoColor=white">`{=html}
|
||||||
|
`<img src="https://img.shields.io/badge/Nginx-ready-009639?style=flat-square&logo=nginx&logoColor=white">`{=html}
|
||||||
|
`<img src="https://img.shields.io/badge/license-AGPLv3-blue?style=flat-square">`{=html}
|
||||||
|
```{=html}
|
||||||
|
</p>
|
||||||
|
```
|
||||||
|
|
||||||
 
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
---
|
# 🌐 Demo
|
||||||
|
|
||||||
## 🌐 Demo
|
A public demo instance is available:
|
||||||
|
|
||||||
A public demo instance is available here:
|
|
||||||
|
|
||||||
👉 https://guide.demo.johnnybegood.fr/
|
👉 https://guide.demo.johnnybegood.fr/
|
||||||
|
|
||||||
This demo runs with a sample XMLTV feed and fake channels to showcase the interface.
|
The demo runs with **fake channels and sample XMLTV data** to showcase
|
||||||
|
the interface.
|
||||||
|
|
||||||
---
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
## ✨ Features
|
# ✨ Features
|
||||||
|
|
||||||
- 🎛️ **Timeline grid** — horizontal EPG-style view with a live "now" indicator
|
GridTV focuses on simplicity and usability.
|
||||||
- 📱 **Responsive** — optimized list view on mobile
|
|
||||||
- ⏱️ **Live progress bar** on the currently airing program
|
|
||||||
- 🕶️ **Past programs** automatically dimmed
|
|
||||||
- 📋 **Hover tooltip** — title, synopsis, season/episode, schedule, duration
|
|
||||||
- 🔗 **One-click copy** buttons for EPG & M3U URLs in the topbar
|
|
||||||
- ⚙️ **Guided setup** on first launch — no config files to edit manually
|
|
||||||
- 🔄 **Auto-reload** EPG every 30 minutes
|
|
||||||
- 0️⃣ **Zero dependencies** — vanilla PHP + nginx, that's it
|
|
||||||
|
|
||||||
---
|
## Interface
|
||||||
|
|
||||||
## 🚀 Installation
|
- Timeline grid similar to classic EPG interfaces\
|
||||||
|
- Horizontal scrolling with a live **"Now" indicator**
|
||||||
|
- **Past programs automatically dimmed**
|
||||||
|
- **Live progress bar** on currently airing program
|
||||||
|
- **Hover tooltip** with full program details
|
||||||
|
|
||||||
### Requirements
|
## Mobile
|
||||||
|
|
||||||
- A web server running **PHP 8.0+** with **php-fpm**
|
- Responsive layout
|
||||||
- **Nginx** (or Apache)
|
- Automatic switch to **list view on mobile**
|
||||||
- An **EPG source in XMLTV format** (e.g. Tunarr, Jellyfin, xTeVe...)
|
|
||||||
- *(Optional)* An **M3U playlist**
|
|
||||||
|
|
||||||
---
|
## Convenience
|
||||||
|
|
||||||
### 1. Clone the repo
|
- One-click **copy buttons** for EPG and M3U URLs
|
||||||
|
- **Automatic EPG refresh** every 30 minutes
|
||||||
|
- **Guided setup on first launch**
|
||||||
|
|
||||||
|
## Architecture
|
||||||
|
|
||||||
|
- Zero dependencies
|
||||||
|
- Pure **PHP + HTML + JS**
|
||||||
|
- Works behind **nginx or apache**
|
||||||
|
|
||||||
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
|
# 🧩 Compatibility
|
||||||
|
|
||||||
|
GridTV parses the standard **XMLTV format** and works with any
|
||||||
|
compatible source.
|
||||||
|
|
||||||
|
Tested with:
|
||||||
|
|
||||||
|
- Tunarr
|
||||||
|
- xTeVe
|
||||||
|
- Jellyfin Live TV
|
||||||
|
- Any XMLTV-compliant generator
|
||||||
|
|
||||||
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
|
# 🚀 Installation
|
||||||
|
|
||||||
|
## Requirements
|
||||||
|
|
||||||
|
- PHP **8.0+** with **php-fpm**
|
||||||
|
- nginx or apache
|
||||||
|
- An **XMLTV EPG source**
|
||||||
|
- Optional **M3U playlist**
|
||||||
|
|
||||||
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
|
## 1. Clone the repository
|
||||||
|
|
||||||
``` bash
|
``` bash
|
||||||
git clone https://github.com/Johnnybegood90/GridTV.git /var/www/gridtv
|
git clone https://github.com/Johnnybegood90/GridTV.git /var/www/gridtv
|
||||||
cd /var/www/gridtv
|
cd /var/www/gridtv
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
### 2. Set permissions
|
## 2. Set permissions
|
||||||
|
|
||||||
|
The web server must be able to create the configuration file.
|
||||||
|
|
||||||
``` bash
|
``` bash
|
||||||
# The web server needs write access to create config.json during setup
|
|
||||||
chmod 775 /var/www/gridtv
|
chmod 775 /var/www/gridtv
|
||||||
chown -R www-data:www-data /var/www/gridtv
|
chown -R www-data:www-data /var/www/gridtv
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
### 3. Configure Nginx
|
## 3. Configure nginx
|
||||||
|
|
||||||
|
Example configuration:
|
||||||
|
|
||||||
``` nginx
|
``` nginx
|
||||||
server {
|
server {
|
||||||
@@ -87,37 +136,45 @@ server {
|
|||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
> 💡 Adjust the PHP version (`php8.2-fpm`) to match the one installed on your server.
|
Reload nginx:
|
||||||
|
|
||||||
``` bash
|
``` bash
|
||||||
nginx -t && systemctl reload nginx
|
nginx -t && systemctl reload nginx
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
### 4. First launch — Setup
|
# ⚙️ First launch
|
||||||
|
|
||||||
Open your browser at `http://guide.your-domain.com`.
|
Open your browser:
|
||||||
|
|
||||||
GridTV detects the missing config and automatically redirects you to the setup page:
|
http://guide.your-domain.com
|
||||||
|
|
||||||
| Field | Description |
|
GridTV automatically detects the missing configuration and opens the
|
||||||
|---|---|
|
**setup page**.
|
||||||
| **Group name** | Displayed top-left in the topbar (e.g. *MyTV*, *FamilyTV*...) |
|
|
||||||
| **EPG URL (XMLTV)** | Your electronic program guide URL |
|
|
||||||
| **M3U URL** *(optional)* | Your IPTV playlist, for quick copy from the topbar |
|
|
||||||
|
|
||||||
Once submitted, `config.json` is created on the server. **The setup page becomes inaccessible.**
|
You will need to provide:
|
||||||
|
|
||||||
---
|
Field Description
|
||||||
|
------------ -----------------------------------
|
||||||
|
Group name Displayed in the interface header
|
||||||
|
EPG URL XMLTV program guide
|
||||||
|
M3U URL Optional IPTV playlist
|
||||||
|
|
||||||
### 5. Editing the config later
|
Once submitted, **config.json is created automatically**.
|
||||||
|
|
||||||
|
The setup page then becomes inaccessible.
|
||||||
|
|
||||||
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
|
# 🛠 Editing the configuration later
|
||||||
|
|
||||||
``` bash
|
``` bash
|
||||||
# Via SSH
|
|
||||||
nano /var/www/gridtv/config.json
|
nano /var/www/gridtv/config.json
|
||||||
```
|
```
|
||||||
|
|
||||||
|
Example configuration:
|
||||||
|
|
||||||
``` json
|
``` json
|
||||||
{
|
{
|
||||||
"group_name": "MyGroup TV",
|
"group_name": "MyGroup TV",
|
||||||
@@ -126,53 +183,54 @@ nano /var/www/gridtv/config.json
|
|||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
## 📁 Project structure
|
# ⚙️ Advanced configuration
|
||||||
|
|
||||||
```
|
These constants can be adjusted in **index.php**:
|
||||||
gridtv/
|
|
||||||
├── index.php # The TV guide (redirects to setup if no config found)
|
|
||||||
├── setup.php # First-launch configuration page
|
|
||||||
├── config.example.json # Config template (copy to config.json and fill in)
|
|
||||||
├── .gitignore # config.json excluded from the repo
|
|
||||||
└── README.md
|
|
||||||
```
|
|
||||||
|
|
||||||
> `config.json` is listed in `.gitignore` — your private URLs will never be pushed to GitHub.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## ⚙️ Advanced configuration
|
|
||||||
|
|
||||||
The following constants can be tweaked directly in `index.php`:
|
|
||||||
|
|
||||||
``` js
|
``` js
|
||||||
const PX_PER_MIN = 5; // Horizontal zoom (pixels per minute)
|
const PX_PER_MIN = 5;
|
||||||
const HOURS_BEFORE = 1; // Past hours visible in the grid
|
const HOURS_BEFORE = 1;
|
||||||
const HOURS_AFTER = 3; // Future hours visible in the grid
|
const HOURS_AFTER = 3;
|
||||||
const ROW_H = 80; // Channel row height (px)
|
const ROW_H = 80;
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
Meaning:
|
||||||
|
|
||||||
## 🧩 EPG Compatibility
|
- PX_PER_MIN → zoom level of the timeline\
|
||||||
|
- HOURS_BEFORE → past hours visible\
|
||||||
|
- HOURS_AFTER → future hours visible\
|
||||||
|
- ROW_H → height of channel rows
|
||||||
|
|
||||||
GridTV parses the standard **XMLTV format**. Tested with:
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
- ✅ [Tunarr](https://github.com/chrisbenincasa/tunarr)
|
# 📁 Project structure
|
||||||
- ✅ [xTeVe](https://github.com/xteve-project/xTeVe)
|
|
||||||
- ✅ [Jellyfin](https://jellyfin.org/) (via LiveTV plugin)
|
|
||||||
- ✅ Any XMLTV-compliant file
|
|
||||||
|
|
||||||
---
|
gridtv/
|
||||||
|
│
|
||||||
|
├── index.php
|
||||||
|
├── setup.php
|
||||||
|
├── config.example.json
|
||||||
|
├── .gitignore
|
||||||
|
└── README.md
|
||||||
|
|
||||||
## 🤝 Contributing
|
`config.json` is ignored by git to prevent leaking private URLs.
|
||||||
|
|
||||||
PRs are welcome! Got an idea, a fix, or a feature request — open an issue or send a PR directly.
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
---
|
# 🤝 Contributing
|
||||||
|
|
||||||
## 📄 License
|
Pull requests are welcome.
|
||||||
|
|
||||||
GNU Affero (AGPLv3)
|
Feel free to open issues for:
|
||||||
|
|
||||||
|
- bug reports
|
||||||
|
- feature requests
|
||||||
|
- improvements
|
||||||
|
|
||||||
|
------------------------------------------------------------------------
|
||||||
|
|
||||||
|
# 📄 License
|
||||||
|
|
||||||
|
GNU Affero General Public License v3 (AGPLv3)
|
||||||
|
|||||||
Reference in New Issue
Block a user