Temp Dash - System Monitor Dashboard

A beautiful, customizable Flutter dashboard for monitoring system resources, media playback, and displaying a clock.

Features

System Monitoring

• CPU Monitoring: Track CPU usage, temperature, frequency, and core utilization
• GPU Monitoring: Monitor GPU temperature, driver version, and resolution
• Memory Monitoring: Track memory usage, available memory, and total memory

Media Integration

• Media Player Integration: Display currently playing media with album art
• Media Controls: View and control media playback directly from the dashboard
• Detailed Media View: Access a dedicated page with expanded media information

Customization

• Layout Options: Choose between free-form, grid, or preset layouts
• Widget Visibility: Show/hide individual widgets as needed
• Background Options:
  • Static image backgrounds
  • Animated gradient backgrounds with customizable colors
  • Local or asset-based images

Clock Mode

• Full-screen Clock: Elegant clock display with date
• Fallback Mode: Automatically switches to clock mode when server connection is lost
• Customizable: Adjust clock appearance and background

Responsive Design

• Landscape Mode: Optimized for landscape orientation
• Portrait Mode: Scrollable layout for portrait orientation
• Adaptive Sizing: Widgets resize based on screen dimensions

Getting Started

Prerequisites

• Flutter SDK (2.0.0 or higher)
• Dart SDK (2.12.0 or higher)
• A system monitoring server (see Server Setup)

Installation

1. Clone the repository:

   git clone https://github.com/Mechres/temp_dash.git
   cd temp_dash
   

2. Install dependencies:

   flutter pub get
   

3. Run the application:

   flutter run
   

Server Setup

TempDash requires a server to provide system monitoring data. You have two options:

1. Use the official TempDash Server:

   • Download from: https://github.com/Mechres/temp_dash_server
   • Provides all required metrics out of the box
   • Easy setup and configuration

2. Use a custom server implementation:

   • Must provide the required system metrics (CPU, GPU, Memory, Media)
   • Should follow the API specification below
   • Needs to support real-time updates via Socket.IO

Server Requirements:

1. Run on the same network as the client
2. Expose an API endpoint at /api/system/stats that returns JSON data
3. Implement Socket.IO for real-time updates

Example server response format:

{
  "cpu": {
    "usage": 45.2,
    "temperature": 65.3,
    "frequency": 3600,
    "cores": [
      {"id": 0, "usage": 42.1},
      {"id": 1, "usage": 38.7}
    ]
  },
  "gpu": [
    {
      "name": "NVIDIA GeForce RTX 3080",
      "temperature": 72.5,
      "driver_version": "512.15",
      "current_resolution": "1920x1080"
    }
  ],
  "memory": {
    "total": 16777216,
    "used": 8388608,
    "available": 8388608,
    "percent": 50.0
  },
  "media": {
    "status": "playing",
    "title": "Song Title",
    "artist": "Artist Name",
    "album": "Album Name",
    "thumbnail": "base64_encoded_image_data"
  }
}

Configuration

Settings

Access settings by tapping the settings icon in the bottom right corner:

• Server Configuration: Set the IP address of your monitoring server
• Layout Settings: Choose layout mode and lock/unlock widget positions
• Widget Visibility: Toggle which widgets are displayed
• Background Settings: Configure background image or gradient
• Animation Settings: Control gradient animation speed and movement

Widget Order

Drag and drop widgets to rearrange them in the dashboard. The order is saved between sessions.

Acknowledgments

• Flutter team for the amazing framework
• Socket.IO for real-time communication