# vps/fleet

> A self-hosted VPS fleet tracker with a dark GitHub-style UI, interactive map, and zero-config local storage.

![Node.js](https://img.shields.io/badge/Node.js-18%2B-339933?style=flat-square&logo=node.js&logoColor=white)
![Express](https://img.shields.io/badge/Express-4.18-000000?style=flat-square&logo=express&logoColor=white)
![License](https://img.shields.io/badge/license-MIT-blue?style=flat-square)
![No Build Step](https://img.shields.io/badge/build-none-brightgreen?style=flat-square)

---

## Features

- **Fleet overview** — live stats for total servers, online / offline / maintenance counts, and total monthly spend
- **Server cards** — glanceable cards showing name, IP, status dot, CPU / RAM / disk chips, and price
- **Add · Edit · Delete** — modal form with full field set: provider, plan, specs, IPv4/IPv6, location, region, sites, notes
- **Interactive map** — Leaflet.js world map; server locations are geocoded automatically via OpenStreetMap
- **Persistent storage** — flat-file JSON, no database required
- **Dark theme** — GitHub-flavored dark palette (`#0d1117`) with IBM Plex Mono / Sans typography
- **Single HTML file** — no bundler, no framework, no build step

---

## Requirements

| Dependency | Version              |
| ---------- | -------------------- |
| Node.js    | 18 or higher         |
| npm        | included with Node   |

---

## Installation

```bash
# 1. Clone the repo
git clone https://github.com/your-username/vps-manager.git
cd vps-manager

# 2. Install dependencies
npm install

# 3. Start the server
npm start
```

Then open `http://localhost:8095` in your browser.

> **Windows:** double-click `start.bat` instead of step 3.
>
> **Linux / macOS:** run `chmod +x start.sh && ./start.sh` instead of step 3.

---

## Usage

### Adding a server

Click **+ Add Server** in the top-right corner. Fill in any combination of fields — only the name is required. If you enter a location, coordinates are resolved automatically and a pin is placed on the map.

### Editing a server

Click the **pencil icon** on any server card to reopen the form pre-filled with its data.

### Deleting a server

Click the **trash icon** on a server card. The change is saved immediately.

### Map view

The map tab shows all servers that have a resolvable location. Click any pin to see a summary popup.

---

## API

The Express server exposes a simple REST API on port `8095`.

| Method   | Endpoint           | Description                                        |
| -------- | ------------------ | -------------------------------------------------- |
| `GET`    | `/api/servers`     | Return all servers                                 |
| `POST`   | `/api/servers`     | Create or update a server (include `id` to update) |
| `DELETE` | `/api/servers/:id` | Delete a server by ID                              |

### Server object

```json
{
  "id": "srv_1700000000000",
  "name": "prod-app-01",
  "status": "online",
  "ipv4": "203.0.113.42",
  "ipv6": "2001:db8::1",
  "provider": "DigitalOcean",
  "plan": "s-2vcpu-4gb",
  "cpu": "2",
  "ram": "4",
  "disk": "80",
  "price": "24.00",
  "billing": "monthly",
  "renewal": "2026-07-01",
  "location": "Toronto, Canada",
  "region": "ca-central",
  "sites": "myapp.example.com",
  "notes": "Primary application node"
}
```

---

## Configuration

| Variable | Default | Description                  |
| -------- | ------- | ---------------------------- |
| `PORT`   | `8095`  | Port the server listens on   |

```bash
PORT=3000 npm start
```

---

## Project structure

```text
vps-manager/
├── server.js          # Express server + REST API + geocoding
├── vps_manager.html   # Complete UI (HTML + CSS + JS, single file)
├── package.json       # Dependencies
├── start.bat          # Windows one-click launcher
├── start.sh           # Linux / macOS one-click launcher
└── data/
    └── servers.json   # Auto-created on first run
```

---

## License

MIT