MayaTheShy/Homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add automatic health checks and status indicators for services

Browse Source
This commit is contained in:
MayaChat
2025-11-24 00:03:14 -05:00
parent f14955e534
commit 5c798c075d
4 changed files with 92 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
README.md
View File

@@ -18,6 +18,7 @@ A lightweight, self-hosted dashboard for quick access to your Docker services wi
- ℹ️ **Connection Details** - Info button shows hostname/port for each service
- 🎮 **Keyboard Navigation** - Arrow keys to navigate, Enter to open, Esc to clear
- 🟢 **Status Indicators** - Optional visual status (online/offline/maintenance)
- 🏥 **Automatic Health Checks** - Real-time ping tests to detect service availability
## Quick Start
@@ -68,7 +69,8 @@ docker-compose restart
| `port` | No | Port number | `"8080"` |
| `host` | No | Custom hostname or full URL | `"nextcloud.example.com"` |
| `logo` | No | Icon filename in `/logos/` | `"nextcloud.svg"` |
| `status` | No | Service status indicator | `"online"`, `"offline"`, or `"maintenance"` |
| `status` | No | Set to `"maintenance"` to skip health check | `"maintenance"` |
| `check-health` | No | Enable/disable auto health check | `"true"` (default) or `"false"` |
### URL Resolution Logic
@@ -115,23 +117,34 @@ When a service has both a hostname and port configured, a small info button (ⓘ
## Status Indicators
Add optional status indicators to services by including a `status` attribute:
Services are automatically checked for availability when the page loads. Status indicators appear in the top-right corner of each card:
```xml
<!-- Green pulsing dot for online services -->
<service name="Jellyfin" status="online" proto="http" port="8096" logo="jellyfin.svg" />
<!-- Automatic health check (default behavior) -->
<service name="Jellyfin" proto="http" port="8096" logo="jellyfin.svg" />
<!-- Red dot for offline services -->
<service name="Legacy App" status="offline" proto="http" port="8080" logo="app.svg" />
<!-- Orange dot for services under maintenance -->
<!-- Manual maintenance mode (skips health check) -->
<service name="Nextcloud" status="maintenance" host="cloud.example.com" logo="nextcloud.svg" />
<!-- Disable health check for a service -->
<service name="Legacy App" check-health="false" proto="http" port="8080" logo="app.svg" />
```
Status colors:
- **Green** (online) - Service is running normally, pulsing animation
- **Red** (offline) - Service is not available
- **Orange** (maintenance) - Service is under maintenance
- **Gray spinning** (checking) - Currently testing service availability
- **Green pulsing** (online) - Service responded successfully to health check
- **Red** (offline) - Service failed to respond or timed out (5 seconds)
- **Orange** (maintenance) - Manual maintenance mode, health check skipped
### How Health Checks Work
- Each service is automatically pinged when the page loads
- Uses a 5-second timeout per service
- Checks run in parallel for all services
- Services marked `status="maintenance"` skip the health check
- Set `check-health="false"` to disable checking for specific services
- No server-side component needed - runs entirely in the browser
## Icon Management