# Thanos Systems Monitor

A cyberpunk-themed dashboard for monitoring Unraid server status, designed to run on Raspberry Pi 3.

## Features

- **Disk Usage Monitoring**
  - Total disk usage visualization
  - Individual disk statistics (Docker, Photos, Media)
  - Ring chart displays with percentage and capacity
  - Detailed disk array with progress bars

- **System Metrics**
  - CPU usage monitoring
  - Memory usage tracking
  - Parity status display with error reporting
  - Last parity check date

- **Docker Containers**
  - Container status display (Running/Offline)
  - Visual grid layout with color-coded states

- **Cyberpunk Theme**
  - Black background with teal accents
  - Pink warning indicators (70-89% usage)
  - White critical alerts (90%+ usage)
  - Animated borders and glowing effects
  - Scanline animation

## Requirements

- Unraid server with GraphQL API enabled
- API key with appropriate permissions
- Modern web browser
- Raspberry Pi 3 (or any device with a web browser)

## Installation

1. Clone this repository:
   ```bash
   git clone <repository-url>
   cd unraid-dash
   ```

2. Configure API settings:
   - Open `script.js`
   - Update the `API_CONFIG` object at the top of the file:
     ```javascript
     const API_CONFIG = {
         serverUrl: 'http://YOUR_UNRAID_IP:PORT/graphql',
         apiKey: 'YOUR_API_KEY_HERE'
     };
     ```

3. Open `index.html` in a web browser

## Configuration

### Disk Categories

The dashboard categorizes disks as follows:
- **Total Disk**: All disks combined
- **Docker**: Disk 6 only
- **Photos**: Disk 7 only
- **Media**: All disks except Disk 6 and Disk 7

To modify these categories, edit the disk processing logic in `script.js` (lines 373-389).

### Update Interval

The dashboard refreshes data every 5 seconds by default. To change this, modify line 373 in `script.js`:

```javascript
setInterval(updateDashboard, 5000); // Change 5000 to desired milliseconds
```

### Color Thresholds

Warning and critical thresholds are defined in the update functions:
- **Normal** (< 70%): Teal (#00ffff)
- **Warning** (70-89%): Pink (#ff00ff)
- **Critical** (90%+): White (#ffffff)

## File Structure

```
unraid-dash/
├── index.html              # Main dashboard HTML
├── styles.css              # Cyberpunk styling
├── script.js               # API integration and update logic
├── schema-test.html        # GraphQL schema exploration tool
├── config-example.js       # Configuration template
├── graph_scheme.txt        # Complete GraphQL schema
├── GRAPHQL_SCHEMA_FINDINGS.md  # Schema discovery documentation
├── PROJECT_SUMMARY.md      # Development history
└── README.md               # This file
```

## API Permissions

The dashboard requires read access to:
- System metrics (CPU, Memory)
- Array information (disks, capacity, parity)
- Docker containers

## Browser Compatibility

Tested and working on:
- Chrome/Chromium
- Firefox
- Safari
- Edge

## Performance

Optimized for Raspberry Pi 3:
- Lightweight vanilla JavaScript (no frameworks)
- CSS-based animations
- Minimal DOM manipulation
- Efficient data fetching with Promise.all()

## Troubleshooting

### Dashboard shows "ERROR: Failed to fetch data from Unraid server"

1. Verify server URL is correct
2. Ensure API key has proper permissions
3. Check network connectivity to Unraid server
4. Open browser console (F12) to view detailed error messages

### Disk usage shows 0%

1. Ensure disks are mounted and accessible
2. Check that GraphQL query includes `fsSize` and `fsUsed` fields
3. Verify array is started on Unraid server

### Docker containers not displaying

1. Confirm Docker service is running on Unraid
2. Verify API key has Docker read permissions
3. Check browser console for error messages

## Development

To explore the GraphQL API schema:
1. Open `schema-test.html` in a browser
2. Use the introspection query tool
3. Test custom queries before adding to dashboard

## Security Note

**IMPORTANT**: The `script.js` file contains your API key. Do not commit this file with real credentials to public repositories. Use `config-example.js` as a template.

## License

This project is provided as-is for personal use.

## Credits

Developed with Claude Code by Anthropic.