websocket update, fishtracker added

README.md

@@ -1,6 +1,6 @@
 # Fishtank Monitor
 
-A local dashboard for fishtank.live that shows live camera feeds, polls, TTS messages, stock prices, and more — all in one place without needing the main site open.
+A local dashboard for fishtank.live that shows live camera feeds, polls, TTS messages, stock prices, real-time notifications, and more — all in one place without needing the main site open.
 
 ---
 
@@ -34,7 +34,19 @@ Put both files in the **same folder** anywhere on your computer (e.g. your Deskt
 
 ---
 
-## Step 3 — Start the Server
+## Step 3 — Install Dependencies
+
+The server requires one npm package. Open a terminal in your folder (see Step 4 for how to do that) and run:
+
+```
+npm install ws
+```
+
+You only need to do this once. It creates a `node_modules` folder in the same directory — leave it there.
+
+---
+
+## Step 4 — Start the Server
 
 **On Windows:**
 1. Open the folder where you put the files
@@ -54,16 +66,14 @@ Put both files in the **same folder** anywhere on your computer (e.g. your Deskt
 
 You should see:
 ```
-✓ Dashboard  → http://localhost:3000
-✓ API proxy  → http://localhost:3000/api/v1/...
-✓ Cam proxy  → http://localhost:3000/cam/<stream>/index.m3u8
+✓ Dashboard → http://localhost:3000
 ```
 
 **Leave this window open** — closing it stops the dashboard.
 
 ---
 
-## Step 4 — Open the Dashboard
+## Step 5 — Open the Dashboard
 
 Open your browser and go to:
 
@@ -75,9 +85,9 @@ The dashboard will load with camera feeds starting automatically.
 
 ---
 
-## Step 5 — Link Your Account (Optional)
+## Step 6 — Link Your Account
 
-Linking your fishtank.live account unlocks polls, TTS messages, stock prices, and other live data. The cameras work without it.
+Linking your fishtank.live account unlocks polls, TTS messages, stock prices, live notifications, contestant locations, and other live data. The cameras work without it.
 
 **To get your token:**
 1. Go to **fishtank.live** and log in
@@ -91,7 +101,8 @@ Linking your fishtank.live account unlocks polls, TTS messages, stock prices, an
 1. Click the **LINK API** button in the top-left of the dashboard
 2. Paste the value you copied into the input field
 3. Press Enter or click **CONNECT**
-4. The dot turns green and shows **API LIVE** when connected
+4. The API dot turns green and shows **API LIVE**
+5. The WS dot (next to the clock) also turns green and shows **WS LIVE** — this is the live WebSocket connection to fishtank
 
 Your token is saved automatically — you won't need to do this again unless you log out or clear your browser data. The dashboard also refreshes the token automatically so it stays connected.
 
@@ -122,6 +133,19 @@ If you closed the terminal window and need to stop it:
 - **Cameraman** feed displayed in its own panel next to the stocks chart, same switching behaviour
 - **THUMBS / LIVE toggle** — Thumbs mode refreshes a snapshot every 30 seconds (saves bandwidth). Live mode streams all cameras simultaneously
 
+### 🧑‍🤝‍🧑 Contestant Locations
+- Contestant avatar icons appear **directly on the camera thumbnails** showing who is currently in each room
+- Updated in real time via facial recognition data from the fishtank WebSocket feed
+- Hover over an avatar to see the contestant's name, current action (sitting, standing, etc.), and mood
+- The featured camera also shows avatars, slightly larger
+- Contestants whose location is unknown (off-camera) show no icon
+
+### 🔔 Live Notifications
+- **Production announcements** (evictions, challenges, events, etc.) appear as a **popup overlay** in the top-center of the dashboard
+- A notification sound plays when a new one arrives
+- Auto-dismisses after 8 seconds, or click ✕ to close manually
+- If a new notification arrives before the previous one dismisses, it replaces it immediately
+
 ### 📊 Polls
 - Shows the current active poll with live vote bars
 - Displays the winner of the last poll
@@ -161,6 +185,12 @@ Make sure the server is running (`node server.js`) and you're visiting `http://l
 **"LINK API" not working:**
 Make sure you copied the full cookie value starting with `%5B%22eyJ`. Just the token alone (starting with `eyJ`) also works but won't enable auto-refresh.
 
+**WS dot stays red / no notifications or contestant locations:**
+Make sure you've linked your account — the WebSocket connection requires auth. If it was already linked, try logging out and back in to refresh the token.
+
+**Server won't start — "Cannot find module 'ws'":**
+You need to install the ws package. Run `npm install ws` in the folder containing `server.js`, then try again.
+
 **Server won't start:**
 Make sure Node.js is installed. Open a terminal and type `node --version` — if it prints a version number, Node is installed. If not, go back to Step 1.