Initial commit for ChickSense Space

.gitattributes

@@ -0,0 +1,5 @@
+*.pt filter=lfs diff=lfs merge=lfs -text
+*.pth filter=lfs diff=lfs merge=lfs -text
+*.mp4 filter=lfs diff=lfs merge=lfs -text
+*.m4a filter=lfs diff=lfs merge=lfs -text
+static/assets/logo-.jpeg filter=lfs diff=lfs merge=lfs -text

Dockerfile

@@ -0,0 +1,22 @@
+FROM python:3.10
+
+# The two following lines are required for Hugging Face Spaces Dev Mode
+RUN useradd -m -u 1000 user
+WORKDIR /app
+
+# Install dependencies
+COPY --chown=user ./requirements.txt requirements.txt
+RUN pip install --no-cache-dir --upgrade -r requirements.txt
+
+# Copy application code, models, and static assets
+COPY --chown=user . /app
+
+# Switch to non-root user
+USER user
+
+# Set environment variables for Hugging Face
+ENV HOME=/home/user \
+    PATH=/home/user/.local/bin:$PATH
+
+# Start FastAPI app
+CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "7860"]

config.py

@@ -0,0 +1,67 @@
+import os
+
+# Main Config
+APP_CONFIG = {
+    "YOLO_MODEL_PATH" : "./models/yolov8n.pt",
+    "VOCAL_MODEL_PATH" : "./models/Chicken_CNN_Disease_Detection_Model.pth",
+
+    "AUDIO_ANALYSIS_DURATION_S" : 30,
+    "AUDIO_ANALYSIS_INTERVAL_S" : 60
+}
+
+# Processing Config
+TUNING = {
+    # How Video Processed
+    "YOLO_IMG_SIZE" : 512,
+    "DETECTION_INTERVAL_FRAMES" : 24,
+    "FRAME_READER_BUFFER_SIZE" : 5,
+    "FRAME_READER_FPS" : 15,
+
+    # How Streaming Processed
+    "WEBSOCKET_TARGET_FPS" : 8,
+    "WEBSOCKET_JPEG_QUALITY" : 40, # JPEG quality ( 0-100 )
+    "WEBSOCKET_DISPLAY_MAX_WIDTH" : 640
+}
+
+# Inactivity Config
+INACTIVITY_CFG = {
+    "EMA_ALPHA" : 0.2,
+    "ENTER_THRESH_NORM_SPEED" : 0.02,
+    "EXIT_THRESH_NORM_SPEED" : 0.05,
+    "MIN_DURATION_S" : 60, # (7200) 2 Hours inactive of an object before flag as inactive
+    "MAX_UNSEEN_GAP_S" : 1.5
+}
+
+# Density Clustering Config
+DENSITY_DBSCAN_CFG = {
+    "EPS_PX" : 60.0, # Max pixels between to object to be called neighbors
+    "MIN_NEIGHBORS" : 4 # Min objects required to form a dense cluster
+}
+
+# Database Config
+DATA_STORAGE = {
+    "SQLITE_DB_PATH" : "data/metrics.sqlite",
+    "DB_RETENTION_DAYS" : 90,
+    "DB_WRITE_BUFFER_SIZE" : 500,
+    "DB_WRITE_INTERVAL_S" : 1.0
+}
+
+# Visual Config
+VISUALS = {
+    "COLOR_DETECTED" : (0, 255, 0), # Green
+    "COLOR_DENSE" : (0, 165, 255), # Orange
+    "COLOR_INACTIVE": (0, 0, 255), # Red
+}
+
+# Notifier Config
+NOTIFIER = {
+    "ENABLE_TELEGRAM_NOTIFICATIONS" : os.environ.get("ENABLE_TELEGRAM_NOTIFICATIONS", "n").lower().startswith("y"),
+    "SENSOR_DATA_JSON_PATH" : "data/sensor_data.json",
+    "TELEGRAM_BOT_TOKEN": os.environ.get("TELEGRAM_BOT_TOKEN", ""),
+    "TELEGRAM_CHAT_ID": os.environ.get("TELEGRAM_CHAT_ID", ""),
+
+    "INACTIVE_PERCENTAGE_THRESHOLD": 0.15, # The percentage threshold of inactive objects
+    "UNHEALTHY_HISTORY_LENGTH": 5, # The number of recent data points to be stored in the history
+    "UNHEALTHY_ALERT_THRESHOLD": 5, # The number of consecutive "unhealthy" statuses required within the history
+    "DENSITY_COUNT_THRESHOLD": 5 # The number of Unique Density before alret was sent
+}

main.py

@@ -0,0 +1,540 @@
+import os
+import json
+import time
+import asyncio
+import threading
+from collections import deque
+from concurrent.futures import ThreadPoolExecutor
+from typing import Dict, Optional
+from datetime import datetime, timezone, timedelta
+import csv
+import io
+
+import cv2
+import torch
+from fastapi import FastAPI, WebSocket, WebSocketDisconnect, HTTPException
+from fastapi.middleware.cors import CORSMiddleware
+from fastapi.responses import FileResponse, HTMLResponse, StreamingResponse
+from fastapi.staticfiles import StaticFiles
+from pydantic import BaseModel
+from ultralytics import YOLO
+
+from config import APP_CONFIG, TUNING, VISUALS, NOTIFIER
+from utils.audio.audio_ingest import background_audio_task
+from utils.video.stream_processor import StreamRegistry
+from utils.audio.vocalization_prediction import load_model
+from utils.metrics_store import MetricsStore
+import utils.notifications as notifications
+
+# -- FastAPI ---
+app = FastAPI()
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins = ["*"],
+    allow_credentials = True,
+    allow_methods = ["*"],
+    allow_headers = ["*"]
+)
+
+app.mount("/static", StaticFiles(directory = "static"), name = "static")
+INDEX_FILE_PATH = os.path.join("static", "index.html")
+
+@app.get("/", response_class = FileResponse)
+async def read_index():
+    if not os.path.exists(INDEX_FILE_PATH):
+        return HTMLResponse("index.html missing", status_code = 404)
+    return FileResponse(INDEX_FILE_PATH)
+
+# -- Global state --
+latest_audio_result = {
+    "prediction": None,
+    "probabilities": None
+}
+
+audio_result_pending = False
+analysis_in_progress = False
+_last_appended_audio_sig = None
+
+last_audio_trigger_time = 0.0
+stream_registry: Optional[StreamRegistry] = None
+executor = ThreadPoolExecutor(max_workers=4)
+
+audio_seek_state = {"url": None, "seek_seconds": 0}
+current_audio_url: Optional[str] = None
+audio_loop_task: Optional[asyncio.Task] = None
+
+# - Notifications JSON builder -
+_sensor_json_lock = threading.Lock()
+sensor_state: Dict[str, dict] = {}
+inactive_since: Dict[str, float] = {}
+
+global_vocal_history: deque[str] = deque(maxlen=5)
+metrics_store = MetricsStore()
+
+# -- Models --
+class AudioTriggerRequest(BaseModel):
+    audio_url_: str
+
+# -- Helpers method --
+
+def _draw_overlays(frame, tracks, display_settings: Dict[str, bool]):
+    """ Ensure boxes/labels displayed according to the toggles """
+    for t in tracks:
+        x1, y1, x2, y2 = map(int, t["box"])
+        color = None
+        if t.get("inactive") and display_settings["show_inactive"]:
+            color = VISUALS["COLOR_INACTIVE"]
+        elif t.get("dense") and display_settings["show_density"]:
+            color = VISUALS["COLOR_DENSE"]
+        elif display_settings["show_detected"]:
+            color = VISUALS["COLOR_DETECTED"]
+
+        if color is not None:
+            cv2.rectangle(frame, (x1, y1), (x2, y2), color, 2)
+            cv2.putText(frame, f"ID {t['id']}", (x1, max(0, y1 - 6)), cv2.FONT_HERSHEY_SIMPLEX, 0.6, color, 2)
+    
+    return frame
+
+def _encode_frame_jpeg(frame, jpeg_q: int) -> Optional[bytes]:
+    ok, jpg = cv2.imencode(".jpg", frame, [int(cv2.IMWRITE_JPEG_QUALITY), jpeg_q])
+    return jpg.tobytes() if ok else None
+
+def _scale_frame(frame, max_w: int):
+    h, w = frame.shape[:2]
+    if w <= max_w:
+        return frame
+    scale = max_w / float(w)
+    return cv2.resize(frame, (int(w * scale), int(h * scale)), interpolation=cv2.INTER_AREA)
+
+def _update_sensor_json(camera_id: int, detected_count: int, inactive_count: int, dense_clusters: int, latest_audio: Dict):
+    """ Build or rewrite camera record in sensor_data.json """
+    now = time.time()
+    cam_key = str(camera_id)
+
+    # Update Inactivity
+    if inactive_count > 0:
+        if cam_key not in inactive_since:
+            inactive_since[cam_key] = now
+    else:
+        inactive_since.pop(cam_key, None)
+
+    raw_pred = (latest_audio or {}).get("prediction")
+    global audio_result_pending, _last_appended_audio_sig
+
+    pred = str(raw_pred).strip() if raw_pred else None
+    sig = None
+    probs = {}
+    if latest_audio and pred:
+        try:
+            probs = dict(latest_audio.get("probabilities") or {})
+            rounded_probs = {k: round(float(v), 4) for k, v in probs.items()}
+            sig = (pred, tuple(sorted(rounded_probs.items())))
+        except (ValueError, TypeError, OverflowError):
+            sig = (pred, None)
+    else:
+        sig = (pred, None) if pred else None
+    
+    # Append "IF" prediction changed
+    if pred and (audio_result_pending or sig != _last_appended_audio_sig):
+        global_vocal_history.append(pred)
+        _last_appended_audio_sig = sig
+        audio_result_pending = False
+    
+    mic_entry = {
+        "camera_id": "MIC",
+        "vocalization_history": list(global_vocal_history)  # Full history
+    }
+
+    if pred:
+        rounded_probs = {k: round(float(v), 4) for k, v in probs.items()}
+        mic_entry["latest_prediction"] = pred
+        mic_entry["latest_probabilities"] = rounded_probs
+    
+    sensor_state["MIC"] = mic_entry
+
+    # Update entry
+    sensor_state[cam_key] = {
+        "camera_id": cam_key,
+        "detected_count": int(detected_count),
+        "inactive_count": int(inactive_count),
+        "density_count": int(dense_clusters or 0)
+    }
+
+    # Write to sensor_data.json
+    json_path = NOTIFIER["SENSOR_DATA_JSON_PATH"]
+    tmp_path = json_path + ".tmp"
+    os.makedirs(os.path.dirname(json_path) or ".", exist_ok=True)
+
+    with _sensor_json_lock:
+        try:
+            with open(tmp_path, "w", encoding="utf-8") as f:
+                json.dump(list(sensor_state.values()), f, indent=2, ensure_ascii=False)
+            os.replace(tmp_path, json_path)
+        except Exception as e:
+            print(f"[Error] Failed to write sensor_data.json: {e}")
+            if os.path.exists(tmp_path):
+                os.remove(tmp_path)
+
+def clear_sensor_data_json():
+    """ Initialize empty sensor_data.json went startup """
+    json_path = NOTIFIER["SENSOR_DATA_JSON_PATH"]
+    os.makedirs(os.path.dirname(json_path) or ".", exist_ok=True)
+    with open(json_path, "w", encoding="utf-8") as f:
+        json.dump([], f, indent=2)
+
+async def periodic_audio_analyzer():
+    """ Handle audio analysis """
+    global last_audio_trigger_time, latest_audio_result, audio_result_pending, audio_seek_state
+
+    await asyncio.sleep(15)
+
+    print("[Audio Loop] Starting audio analysis.")
+
+    while True:
+        if not current_audio_url:
+            print("[Audio Loop] Waiting for an audio URL to be provided by a client.")
+            await asyncio.sleep(APP_CONFIG["AUDIO_ANALYSIS_INTERVAL_S"])
+            continue
+
+        if current_audio_url != audio_seek_state["url"]:
+            print(f"[Audio Loop] New audio source detected. Resetting seek time for {current_audio_url}")
+            audio_seek_state["url"] = current_audio_url
+            audio_seek_state["seek_seconds"] = 0
+
+        now = time.time()
+        if now - last_audio_trigger_time >= APP_CONFIG["AUDIO_ANALYSIS_INTERVAL_S"]:
+
+            # Get the current bookmark/seek time
+            seek_time = audio_seek_state["seek_seconds"]
+            duration = APP_CONFIG["AUDIO_ANALYSIS_DURATION_S"]
+
+            print(f"[Audio Loop] Triggering analysis for: {current_audio_url} (starting at {seek_time}s)")
+            last_audio_trigger_time = now
+
+            latest_audio_result["prediction"] = None
+            latest_audio_result["probabilities"] = None
+            audio_result_pending = True
+
+            executor.submit(
+                background_audio_task,
+                current_audio_url,
+                duration,
+                vocal_model,
+                vocal_device,
+                latest_audio_result,
+                seek_seconds=seek_time  # Pass the seek time to the task
+            )
+
+            # Move the bookmark forward for the next run
+            audio_seek_state["seek_seconds"] += duration
+        
+        await asyncio.sleep(1)
+
+# -- Websocket --
+@app.websocket("/ws/video_feed")
+async def websocket_endpoint(websocket: WebSocket):
+    """ Push JPEG frames with stats over WS """
+    await websocket.accept()
+    video_url = None
+    audio_url = None
+    sp = None
+
+    global current_audio_url
+
+    try:
+        # Made initial handshake with config
+        init_msg = await asyncio.wait_for(websocket.receive_text(), timeout = 10.0)
+        init_data = json.loads(init_msg)
+
+        target_fps = int(init_data.get("target_fps", TUNING["WEBSOCKET_TARGET_FPS"]))
+        jpeg_q = int(init_data.get("jpeg_quality", TUNING["WEBSOCKET_JPEG_QUALITY"]))
+        max_w = int(init_data.get("display_max_width", TUNING["WEBSOCKET_DISPLAY_MAX_WIDTH"]))
+
+        min_dt = 1.0 / max(1, target_fps)
+        last_send = 0.0
+
+        video_url = init_data.get("video_url")
+        audio_url_from_client = init_data.get("audio_url", video_url)
+        if audio_url_from_client:
+            current_audio_url = audio_url_from_client
+
+        camera_id = int(init_data.get("camera_id", 0))
+        last_stats_sent = 0.0
+
+        if not video_url:
+            await websocket.send_text(json.dumps({"type": "status", "message": "Error: URL type unkown"}))
+            raise WebSocketDisconnect(code=1008, reason="URL not provided")
+        
+        display_settings = {
+            "show_detected": bool(init_data.get("show_detected", False)),
+            "show_density": bool(init_data.get("show_density", False)),
+            "show_inactive": bool(init_data.get("show_inactive", False))
+        }
+
+        print(f"[WebSocket {websocket.client}] Stream start : {video_url}, Audio start: {audio_url}")
+
+        # Get or create the stream processor instance
+        sp = stream_registry.get(
+            video_url,
+            model = yolo_model,
+            device = _device,
+            half = (_device == "cuda")
+        )
+
+        while True:
+
+            # WS control messages (toggles display)
+            try:
+                msg_str = await asyncio.wait_for(websocket.receive_text(), timeout=0.3)
+                msg = json.loads(msg_str)
+                if msg.get("type") == "display_settings_update":
+                    for key in ["show_detected", "show_density", "show_inactive"]:
+                        if key in msg:
+                            display_settings[key] = bool(msg[key])
+                    await websocket.send_text(json.dumps({"type": "status", "message": "Display settings updated"}))
+                elif msg.get("type") == "update_audio_url" and msg.get("audio_url"):
+                    audio_url = msg["audio_url"]
+                    await websocket.send_text(json.dumps({"type": "status", "message": f"Audio start updated: {audio_url}"}))
+            except asyncio.TimeoutError:
+                pass
+
+            # Fetch latest processed frame and tracks
+            payload = sp.get_latest()
+            if payload is None:
+                await asyncio.sleep(0.01)
+                continue
+
+            frame = payload["frame"]
+            tracks = payload["tracks"]
+
+            _draw_overlays(frame, tracks, display_settings)
+
+            # Scale and encode
+            frame = _scale_frame(frame, max_w)
+            jpg_bytes = _encode_frame_jpeg(frame, jpeg_q)
+            if jpg_bytes is not None:
+                now = time.time()
+                if now - last_send >= min_dt:  # Cap send rate
+                    await websocket.send_bytes(jpg_bytes)
+                    last_send = now
+            
+            # Stats
+            stats = payload.get("stats", {}) or {}
+            now = time.time()
+            if now - last_stats_sent > 1.0:
+                detected = int(stats.get("detected", 0))
+                inactive = int(stats.get("inactive", 0))
+                dense_clusters = int(stats.get("dense_clusters", 0))
+
+                await websocket.send_text(
+                    json.dumps(
+                        {
+                            "type": "stats",
+                            "detected": detected,
+                            "inactive": inactive,
+                            "dense_areas": dense_clusters
+                        }
+                    )
+                )
+
+                # Write to DB
+                metrics_store.write(
+                    ts=now,
+                    camera_id=camera_id,
+                    detected=detected,
+                    dense_areas=dense_clusters,
+                    inactive=inactive
+                )
+                last_stats_sent = now
+
+                # Update sensor JSON with full counts
+                try:
+                    _update_sensor_json(
+                        camera_id=camera_id,
+                        detected_count=detected,
+                        inactive_count=inactive,
+                        dense_clusters=dense_clusters,
+                        latest_audio=latest_audio_result
+                    )
+                except Exception as e:
+                    print(f"[Notif] sensor_data.json failed to update on camera {camera_id}: {e}")
+            
+            await asyncio.sleep(max(0.005, min_dt * 0.25))
+
+    except WebSocketDisconnect as e:
+        print(f"WebSocket client {websocket.client} disconnected: (Code: {e.code}, Reason: {e.reason})")
+    except asyncio.TimeoutError:
+        print(f"WebSocket {websocket.client} timed out waiting for initial message.")
+    except Exception as e:
+        print(f"[Error] WebSocket failed for {websocket.client}: {e}")
+    finally:
+        if video_url and stream_registry:
+            stream_registry.release(video_url)
+        try:
+            await websocket.close()
+        except Exception:
+            pass
+        print(f"[WebSocket] Cleaned up for {websocket.client}.")
+
+# Audio Endpoints
+@app.post("/trigger_audio_analysis", status_code=202)
+async def trigger_audio_analysis(request: AudioTriggerRequest):
+    """Manual, fire-and-forget trigger for short audio analysis window."""
+    global audio_result_pending, analysis_in_progress
+    if analysis_in_progress:
+        return {"message": "Analysis already running; skipping duplicate trigger."}
+
+    print(f"[API] Audio analysis triggered: {request.audio_url_}")
+    latest_audio_result["prediction"] = None
+    latest_audio_result["probabilities"] = None
+    audio_result_pending = True
+
+    executor.submit(
+        background_audio_task,
+        request.audio_url_,
+        APP_CONFIG["AUDIO_ANALYSIS_DURATION_S"],
+        vocal_model,
+        vocal_device,
+        latest_audio_result,
+    )
+    return {"message": "Audio analysis started"}
+
+@app.get("/get_latest_audio_result")
+async def get_latest_audio_result_endpoint():
+    """ Return last result or status if analysis is pending """
+    if analysis_in_progress:
+        return {
+            "prediction": None,
+            "probabilities": None,
+            "status": "analyzing"
+        }
+    elif latest_audio_result["prediction"] is not None:
+        return {
+            **latest_audio_result,
+            "status": "completed"
+        }
+    else:
+        return {
+            "prediction": None,
+            "probabilities": None,
+            "status": "no_data"
+        }
+
+# Startup
+@app.on_event("startup")
+async def startup_event():
+    """ setup for model and background notifier """
+    clear_sensor_data_json()
+
+    global yolo_model, vocal_model, vocal_device, _device, stream_registry, audio_loop_task
+    print("Trying to load model")
+
+    _device = "cuda" if torch.cuda.is_available() else "cpu"
+
+    # Load YOLO model
+    try:
+        yolo_model = YOLO(APP_CONFIG["YOLO_MODEL_PATH"])
+        yolo_model.fuse()
+        yolo_model.to(_device)
+        try:
+            if _device == "cuda" and hasattr(yolo_model, "model"):
+                yolo_model.model.half()  # FP16 on CUDA
+                print("[Startup] yolo model run on FP16 CUDA")
+        except Exception:
+            pass
+        print(f"YOLO model loaded on {_device}")
+    except Exception as e:
+        print(f"[Error] Failed to load YOLO model: {e}")
+    
+    # Load Vocal model
+    try:
+        vocal_device = torch.device(_device)
+        vocal_model = load_model(APP_CONFIG["VOCAL_MODEL_PATH"]).to(vocal_device).eval()
+        print(f"Vocal model loaded on {vocal_device}.")
+    except Exception as e:
+        print("[Error] Failed to load Vocal model", e)
+
+    stream_registry = StreamRegistry()
+    print("Models has been load succesfully")
+
+    # Start single centralized audio analysis loop
+    audio_loop_task = asyncio.create_task(periodic_audio_analyzer())
+
+    # Run Notifications
+    try:
+        if NOTIFIER["ENABLE_TELEGRAM_NOTIFICATIONS"]:
+            threading.Thread(target=notifications.main, daemon=True).start()
+            print("[Notifications] started")
+        else:
+            print("[Notifications] Disabled (ENABLE_TELEGRAM_NOTIFICATIONS=False)")
+    except Exception as e:
+        print(f"[Notifications] Failed to start: {e}")
+
+# CSV exporter helper and endpoints
+def _parse_date_yyyy_mm_dd(s: str) -> int:
+    """Parse 'YYYY-MM-DD' as midnight UTC (returns seconds)."""
+    try:
+        dt = datetime.strptime(s, "%Y-%m-%d").replace(tzinfo=timezone.utc)
+        return int(dt.timestamp())
+    except Exception:
+        raise HTTPException(status_code=400, detail="Dates must be in YYYY-MM-DD format")
+
+def _fallback_offset_minutes() -> int:
+    off = datetime.now().astimezone().utcoffset() or timedelta(0)
+    return int(off.total_seconds() // 60)
+
+@app.get("/metrics/available")
+async def metrics_available(tz_offset_minutes: int | None = None):
+    min_ts, max_ts = metrics_store.get_bounds()
+    if min_ts is None or max_ts is None:
+        return {"min": None, "max": None}
+    minutes = tz_offset_minutes if tz_offset_minutes is not None else _fallback_offset_minutes()
+    offset = timedelta(minutes=int(minutes))
+    min_day = (datetime.fromtimestamp(min_ts, tz=timezone.utc) + offset).date().isoformat()
+    max_day = (datetime.fromtimestamp(max_ts, tz=timezone.utc) + offset).date().isoformat()
+    return {"min": min_day, "max": max_day}
+
+@app.get("/metrics/export")
+async def export_metrics(
+    start: str,
+    end: str,
+    camera_id: int | None = None,
+    tz_offset_minutes: int = 7 * 60,
+    raw: bool = True # ensure retained (we want to use raw data)
+):
+    """ Export metrics into CSV : datetime_local,camera_id,detected,dense_areas,inactive """
+    start_ts_utc = _parse_date_yyyy_mm_dd(start)
+    end_ts_utc = _parse_date_yyyy_mm_dd(end) + 86399 # 86399 (seconds) -> 24-hours - 1 sec
+
+    rows = metrics_store.fetch_range(start_ts_utc, end_ts_utc, camera_id=camera_id)
+
+    minutes = tz_offset_minutes if tz_offset_minutes is not None else _fallback_offset_minutes()
+    offset_seconds = int(minutes) * 60
+    
+    start_local = datetime.strptime(start, "%Y-%m-%d").date()
+    end_local = datetime.strptime(end, "%Y-%m-%d").date()
+
+    def csv_iter_raw():
+        sio = io.StringIO()
+        w = csv.writer(sio)
+        w.writerow(["datetime_local", "camera_id", "detected", "dense_areas", "inactive"])
+        yield sio.getvalue(); sio.seek(0); sio.truncate(0)
+
+        for ts, cam, det, dense, ina in rows:
+            local_dt = datetime.fromtimestamp(ts + offset_seconds, tz=timezone.utc)
+            d = local_dt.date()
+            if start_local <= d <= end_local:
+                w.writerow([local_dt.strftime("%Y-%m-%d %H:%M:%S"), cam, int(det), int(dense), int(ina)])
+                yield sio.getvalue(); sio.seek(0); sio.truncate(0)
+    
+    fname = f"metrics_raw_{start}_to_{end}{('_cam' + str(camera_id)) if camera_id else ''}.csv"
+    return StreamingResponse(
+        csv_iter_raw(),
+        media_type="text/csv",
+        headers={"Content-Disposition": f'attachment; filename="{fname}"'},
+    )
+
+if __name__ == "__main__":
+    import uvicorn
+    uvicorn.run("main:app", reload=False)
+    

models/Chicken_CNN_Disease_Detection_Model.pth

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:976749066e43bd72a2ffff18199f9d3deb6e9c066bcc1d6b222fb8d85d5c49cc
+size 26077850

models/yolov8n.pt

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:d83cb483af507be3d9a195ed764422b06c1f59b23adbbb6c8307caa5208b333f
+size 6234410

requirements.txt

@@ -0,0 +1,20 @@
+torch==2.6.0
+torchvision==0.21.0
+torchaudio==2.6.0
+
+ultralytics==8.3.163
+opencv-python==4.11.0.86
+numpy==2.0.2
+scikit-learn==1.7.1
+
+boxmot==15.0.2
+
+librosa==0.11.0
+soundfile==0.13.1
+yt-dlp==2025.7.21
+
+fastapi==0.116.1
+uvicorn[standard]==0.35.0
+pydantic==2.11.7
+
+python-telegram-bot==22.3

static/css/style.css

@@ -0,0 +1,186 @@
+:root {
+    --bg-main: #f1f5f9;
+    --bg-card: #ffffff;
+    --text-primary: #1e293b;
+    --text-secondary: #64748b;
+    --border-color: #e2e8f0;
+    --primary: #3b82f6;
+    --primary-hover: #2563eb;
+
+    --spacing-xs: 0.25rem;
+    --spacing-sm: 0.5rem;
+    --spacing-md: 0.75rem;
+    --spacing-lg: 1rem;
+    --spacing-xl: 1.25rem;
+    
+    --radius-sm: 0.375rem;
+    --radius-md: 0.5rem;
+    --radius-lg: 0.75rem;
+    
+    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+    --shadow-md: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+    --shadow-lg: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+}
+
+body {
+    font-family: 'Inter', sans-serif;
+    background-color: var(--bg-main);
+    color: var(--text-primary);
+    line-height: 1.5;
+}
+
+.card {
+    background-color: var(--bg-card);
+    border: 1px solid var(--border-color);
+    border-radius: var(--radius-lg);
+    box-shadow: var(--shadow-sm);
+}
+
+.card-header {
+    padding: var(--spacing-md) var(--spacing-lg);
+    border-bottom: 1px solid var(--border-color);
+}
+
+.btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--spacing-sm);
+    border-radius: var(--radius-md);
+    padding: 0.6rem var(--spacing-lg);
+    font-weight: 600;
+    transition: all 0.2s ease-in-out;
+    cursor: pointer;
+    border: 1px solid transparent;
+}
+
+.btn-primary {
+    background-color: var(--primary);
+    color: #ffffff;
+    border-color: var(--primary);
+}
+
+.btn-primary:hover {
+    background-color: var(--primary-hover);
+    border-color: var(--primary-hover);
+}
+
+.control-button {
+    transition: all 0.2s ease-in-out;
+    background-color: #f8fafc;
+    border: 1px solid var(--border-color);
+    color: var(--text-secondary);
+}
+
+.control-button.active {
+    background-color: var(--primary);
+    color: #ffffff;
+    border-color: var(--primary);
+    box-shadow: 0 2px 5px rgba(59, 130, 246, 0.3);
+}
+
+.control-button .icon-solid { 
+    display: none; 
+}
+
+.control-button.active .icon-outline { 
+    display: none; 
+}
+
+.control-button.active .icon-solid { 
+    display: inline-block; 
+}
+
+.cam-badge {
+    position: absolute;
+    left: 12px;
+    bottom: 12px;
+    background-color: rgba(15, 23, 42, 0.75);
+    color: #ffffff;
+    font-weight: 700;
+    font-size: 0.75rem;
+    padding: var(--spacing-xs) var(--spacing-sm);
+    border-radius: var(--radius-sm);
+    letter-spacing: 0.05em;
+    z-index: 10;
+    pointer-events: none;
+}
+
+.modal {
+    position: fixed;
+    inset: 0;
+    display: none;
+    z-index: 50;
+}
+
+.modal.show {
+    display: block;
+}
+
+.modal-backdrop {
+    position: absolute;
+    inset: 0;
+    background-color: rgba(15, 23, 42, 0.5);
+    backdrop-filter: blur(2px);
+}
+
+.modal-container {
+    position: absolute;
+    inset: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: var(--spacing-lg);
+}
+
+.modal-close-btn {
+    color: var(--text-secondary);
+    background: transparent;
+    border: none;
+    font-size: 1.25rem;
+    line-height: 1;
+    cursor: pointer;
+    padding: var(--spacing-xs);
+    border-radius: var(--radius-sm);
+}
+
+.modal-close-btn:hover {
+    color: var(--text-primary);
+    background-color: #f1f5f9;
+}
+
+.modal-input {
+    width: 100%;
+    padding: var(--spacing-sm) var(--spacing-md);
+    border: 1px solid var(--border-color);
+    border-radius: var(--radius-sm);
+    font-size: 0.875rem;
+    background-color: #f8fafc;
+    transition: all 0.2s ease-in-out;
+}
+
+.modal-input:focus {
+    outline: 2px solid var(--primary);
+    outline-offset: 2px;
+    border-color: var(--primary);
+    background-color: #ffffff;
+}
+
+@media (prefers-reduced-motion: reduce) {
+    * {
+        animation-duration: 0.01ms !important;
+        animation-iteration-count: 1 !important;
+        transition-duration: 0.01ms !important;
+    }
+}
+
+@media (max-width: 768px) {
+    :root {
+        --spacing-lg: 1rem;
+        --spacing-xl: 1rem;
+    }
+    
+    .card-header {
+        padding: var(--spacing-sm) var(--spacing-md);
+    }
+}

static/demo/3_usa.mp4

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:ff725a879421bf8498e8c76da02d0dde9632883b810a85f396fa3558d958ade2
+size 13738686

static/demo/5_usa.mp4

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:89f6c7ea774b9fcac0d05a0220686d7c6c17db76f772809daab53725c1cce004
+size 14045255

static/demo/6_usa.mp4

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:6acaab10818e29036a5bc5809b23dee1d23cc8035992e32c7d3126a44b7df44b
+size 13040025

static/demo/7_usa.mp4

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:c4392b38c43a37586b46fceb48fa25b8f9b4ae7ccf2fd9586807a6bb1c381452
+size 13456819

static/demo/audio.m4a

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:5bf2def5961ddf5e3cf5dc7d1975b2528cda3497ebab4bbf364bbbe594818569
+size 9032152

static/index.html

@@ -0,0 +1,308 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>ChickSense</title>
+    <meta name="description" content=" Sistem Pemantauan Otomatis Kesehatan dan Kesejahteraan Ayam" />
+    
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
+    <link rel="stylesheet" href="/static/css/style.css">
+</head>
+<body class="p-4 lg:p-5">
+    <div class="max-w-screen-2x1 mx-auto">
+        <header class="flex flex-col md:flex-row justify-between items-start md:items-center mb-4 gap-3">
+            <div class="flex items-center gap-3">
+
+                <!-- Logo -->
+                <div class="w-12 h-12 bg-amber-100 rounded-lg flex items-center justify-center border border-amber-200" aria-hidden="true">
+                    <img src="/static/assets/logo-.jpeg" alt="ChickSense Logo" class="rounded-lg">
+                </div>
+
+                <!-- Judul dan Waktu -->
+                 <div>
+                    <h1 class="text-xl md:text-2xl font-bold text-slate-800">ChickSense Dashboard</h1>
+                    <p id="datetime" class="text-xs md:text-sm text-slate-500" aria-live="polite">Tunggu memuat Waktu...</p>
+                 </div>
+            </div>
+        </header>
+
+        <main class="grid grid-cols-1 lg:grid-cols-12 gap-4">
+            <section class="lg:col-span-9 flex flex-col gap-4" aria-label="Video streams and controls">
+                <!-- Grid Kamera 2x2 -->
+                <div class="grid grid-cols-1 md:grid-cols-2 gap-4" role="region">
+                    <!-- Kamera 1 -->
+                    <div class="card relative">
+                        <div class="p-2">
+                            <div class="aspect-video bg-slate-800 rounded-md">
+                                 <canvas id="video-canvas-0" class="w-full h-full rounded-md"></canvas>
+                            </div>
+                            <div class="cam-badge">CAM 1</div>
+                        </div>
+                    </div>
+                    <!-- Kamera 2 -->
+                    <div class="card relative">
+                        <div class="p-2">
+                            <div class="aspect-video bg-slate-800 rounded-md">
+                                <canvas id="video-canvas-1" class="w-full h-full rounded-md"></canvas>
+                            </div>
+                            <div class="cam-badge">CAM 2</div>
+                        </div>
+                    </div>
+                    <!-- Kamera 3 -->
+                    <div class="card relative">
+                        <div class="p-2">
+                            <div class="aspect-video bg-slate-800 rounded-md">
+                                <canvas id="video-canvas-2" class="w-full h-full rounded-md"></canvas>
+                            </div>
+                            <div class="cam-badge">CAM 3</div>
+                        </div>
+                    </div>
+                    <!-- Kamera 4 -->
+                    <div class="card relative">
+                        <div class="p-2">
+                            <div class="aspect-video bg-slate-800 rounded-md">
+                                <canvas id="video-canvas-3" class="w-full h-full rounded-md"></canvas>
+                            </div>
+                            <div class="cam-badge">CAM 4</div>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- Grid Kontrol Tampilan dan Log Sistem -->
+                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                    <!-- Kontrol Tampilan -->
+                    <div class="card" role="region">
+                        <div class="card-header flex items-center justify-between">
+                            <div class="flex items-center gap-2">
+                                <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 text-slate-600" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                                    <path stroke-linecap="round" stroke-linejoin="round" d="M6 13.5V3.75m0 9.75a1.5 1.5 0 010 3m0-3a1.5 1.5 0 000 3m0 3.75V16.5m12-3V3.75m0 9.75a1.5 1.5 0 010 3m0-3a1.5 1.5 0 000 3m0 3.75V16.5m-6-9V3.75m0 3.75a1.5 1.5 0 010 3m0-3a1.5 1.5 0 000 3m0 9.75V10.5" />
+                                </svg>
+                                <h3 class="font-semibold text-slate-700 text-sm">Kontrol Tampilan</h3>
+                            </div>
+
+                            <!-- Button Setting Kamera -->
+                            <button id="settings-button" title="Double-click to change camera URLs" class="p-1 text-slate-500 hover:text-blue-600 hover:bg-slate-300 rounded-md transition-colors">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                    <circle cx="12" cy="12" r="3"></circle>
+                                    <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path>
+                                </svg>
+                            </button>
+                        </div>
+
+                        <!-- Button Toggle -->
+                        <div id="toggle-controls" class="p-3 grid grid-cols-3 gap-3">
+                            <button id="toggle-detected" data-control="show_detected" class="control-button flex items-center justify-center gap-2 p-2.5 rounded-lg text-xs md:text-sm font-medium" aria-pressed="true">
+                                <svg class="w-6 h-6 icon-outline" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                                    <path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z"/>
+                                </svg>
+                                <svg class="w-6 h-6 icon-solid" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
+                                    <path fill-rule="evenodd" d="M10.5 3.75a6.75 6.75 0 100 13.5 6.75 6.75 0 000-13.5zM2.25 10.5a8.25 8.25 0 1114.59 5.28l4.69 4.69a.75.75 0 11-1.06 1.06l-4.69-4.69A8.25 8.25 0 012.25 10.5z" clip-rule="evenodd"/>
+                                </svg>
+                                <span>Deteksi</span>
+                            </button>
+
+                            </button>
+                            
+                            <button id="toggle-density" data-control="show_density" class="control-button flex items-center justify-center gap-2 p-2.5 rounded-lg text-xs md:text-sm font-medium" aria-pressed="false">
+                            <svg class="w-6 h-6 icon-outline" xmlns="http://www.w3.org/2000/svg"
+                                viewBox="0 0 512 512" fill="none" stroke="currentColor" stroke-width="24">
+                                <circle cx="256" cy="256" r="240"/> <circle cx="220" cy="120" r="64"/> <circle cx="356" cy="92"  r="34"/> <circle cx="420" cy="160" r="26"/> <circle cx="120" cy="100" r="28"/> <circle cx="104" cy="196" r="44"/> <circle cx="208" cy="240" r="28"/>
+                                <circle cx="320" cy="236" r="44"/> <circle cx="420" cy="236" r="52"/> <circle cx="180" cy="372" r="88"/> <circle cx="300" cy="372" r="40"/> <circle cx="408" cy="372" r="52"/>
+                                <circle cx="272" cy="460" r="28"/> <circle cx="88"  cy="288" r="20"/>
+                            </svg>
+                            <svg class="w-6 h-6 icon-solid" xmlns="http://www.w3.org/2000/svg"
+                                viewBox="0 0 512 512" fill="none" stroke="currentColor" stroke-width="24">
+                                <circle cx="256" cy="256" r="240"/> <circle cx="220" cy="120" r="64"/> <circle cx="356" cy="92"  r="34"/> <circle cx="420" cy="160" r="26"/> <circle cx="120" cy="100" r="28"/> <circle cx="104" cy="196" r="44"/> <circle cx="208" cy="240" r="28"/>
+                                <circle cx="320" cy="236" r="44"/> <circle cx="420" cy="236" r="52"/> <circle cx="180" cy="372" r="88"/> <circle cx="300" cy="372" r="40"/> <circle cx="408" cy="372" r="52"/>
+                                <circle cx="272" cy="460" r="28"/> <circle cx="88"  cy="288" r="20"/>
+                            </svg>
+
+                            <span>Kepadatan</span>
+                            </button>
+
+                            <button id="toggle-inactive" data-control="show_inactive" class="control-button flex items-center justify-center gap-2 p-2.5 rounded-lg text-xs md:text-sm font-medium" aria-pressed="false">
+                                <svg class="w-6 h-6 icon-outline" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                                    <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z"/>
+                                </svg>
+                                <svg class="w-6 h-6 icon-solid" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
+                                    <path fill-rule="evenodd" d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25zM12.75 6a.75.75 0 00-1.5 0v6c0 .414.336.75.75.75h4.5a.75.75 0 000-1.5h-3.75V6z" clip-rule="evenodd"/>
+                                </svg>
+                                <span>Inaktivitas</span>
+                            </button>
+                        </div>
+                    </div>
+
+                    <!-- Sistem Log Chart -->
+                    <div class="card" role="region">
+                        <div class="card-header flex items-center gap-2">
+                            <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 text-slate-600" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                                <path stroke-linecap="round" stroke-linejoin="round" d="M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9 5.25h.008v.008H12v-.008z" />
+                            </svg>
+                            <h3 class="font-semibold text-slate-700 text-sm">Log Sistem</h3>
+                        </div>
+                        <div id="system-log" class="p-4 text-xs text-slate-500 space-y-2 h-28 overflow-y-auto" role="log" aria-live="polite"></div>
+                    </div>
+                 </div>
+            </section>
+
+            <aside class="lg:col-span-3 flex flex-col gap-4" aria-label="Analysis and export panels">
+                <!-- Card Ringkasan Analisis -->
+                 <div class="card" role="region">
+                    <div class="card-header flex items-center gap-2">
+                        <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 text-blue-600" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 12h16.5m-16.5 3.75h16.5M3.75 19.5h16.5M5.625 4.5h12.75a1.875 1.875 0 010 3.75H5.625a1.875 1.875 0 010-3.75z" />
+                        </svg>
+                        <h3 class="font-semibold text-slate-700 text-sm">Ringkasan Analisis</h3>
+                    </div>
+                    <div class="p-4 space-y-3 text-sm">
+                        <!-- Jumlah Terdeteksi -->
+                        <div class="flex items-center gap-3 p-2.5 bg-slate-50 rounded-lg">
+                            <div class="w-9 h-9 bg-blue-100 text-blue-600 rounded-md flex items-center justify-center flex-shrink-0">
+                                <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
+                                    <path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z" />
+                                </svg>
+                            </div>
+                            <div>
+                                <p class="text-slate-500 text-xs font-medium">Jumlah Terdeteksi</p>
+                                <p id="detected-count" class="text-lg font-bold text-slate-800">0</p>
+                            </div>
+                        </div>
+                         <!-- Kluster Kepadatan -->
+                        <div class="flex items-center gap-3 p-2.5 bg-slate-50 rounded-lg">
+                            <div class="w-9 h-9 bg-amber-100 text-amber-600 rounded-md flex items-center justify-center flex-shrink-0">
+                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="none" stroke="currentColor" stroke-width="24">
+                                        <circle cx="256" cy="256" r="240"/> <circle cx="220" cy="120" r="64"/> <circle cx="356" cy="92"  r="34"/> <circle cx="420" cy="160" r="26"/> <circle cx="120" cy="100" r="28"/> <circle cx="104" cy="196" r="44"/>
+                                        <circle cx="208" cy="240" r="28"/> <circle cx="320" cy="236" r="44"/> <circle cx="420" cy="236" r="52"/> <circle cx="180" cy="372" r="88"/> <circle cx="300" cy="372" r="40"/> <circle cx="408" cy="372" r="52"/>
+                                        <circle cx="272" cy="460" r="28"/> <circle cx="88"  cy="288" r="20"/>
+                                </svg>
+                            </div>
+                            <div>
+                                <p class="text-slate-500 text-xs font-medium">Kluster Kepadatan</p>
+                                <p id="density-count" class="text-lg font-bold text-slate-800">0</p>
+                            </div>
+                        </div>
+                        <!-- Ayam Tidak Aktif -->
+                        <div class="flex items-center gap-3 p-2.5 bg-slate-50 rounded-lg">
+                            <div class="w-9 h-9 bg-red-100 text-red-600 rounded-md flex items-center justify-center flex-shrink-0">
+                                <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
+                                    <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z" />
+                                </svg>
+                            </div>
+                            <div>
+                                <p class="text-slate-500 text-xs font-medium">Ayam Tidak Aktif</p>
+                                <p id="inactive-count" class="text-lg font-bold text-slate-800">0</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <!-- Card Analisis Vokalisasi -->
+                <div class="card" role="region">
+                    <div class="card-header flex items-center gap-2">
+                        <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 text-green-600" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" d="M19.114 5.636a9 9 0 010 12.728M16.463 8.288a5.25 5.25 0 010 7.424M6.75 8.25l4.72-4.72a.75.75 0 011.28.53v15.88a.75.75 0 01-1.28.53l-4.72-4.72H4.51c-.88 0-1.704-.507-1.938-1.354A9.01 9.01 0 012.25 12c0-.83.112-1.633.322-2.396C2.806 8.756 3.63 8.25 4.51 8.25H6.75z" />
+                        </svg>
+                        <h3 class="font-semibold text-slate-700 text-sm">Analisis Vokalisasi</h3>
+                    </div>
+
+                    <div id="vocalization-content" class="p-4">
+                        <!-- Populated by app.js -->
+                    </div>
+                </div>
+
+                <!-- Card Ekspor Data Metrik -->
+                 <div class="card" role="region">
+                    <div class="card-header flex items-center gap-2">
+                        <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 text-slate-600" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5M16.5 12L12 16.5m0 0L7.5 12m4.5 4.5V3" />
+                        </svg>
+                        <h3 class="font-semibold text-slate-700 text-sm">Ekspor Data Metrik (CSV)</h3>
+                    </div>
+                    <div class="p-4">
+                        <button id="open-export-modal-btn" class="btn btn-primary w-full text-sm">
+                            Ekspor CSV
+                        </button>
+                        <p class="text-[11px] text-slate-500 mt-2 text-center">Ekspor data dengan double-klik tombol diatas.</p>
+                    </div>
+                 </div>
+            </aside>
+        </main>
+    </div>
+
+    <!-- Modal Section -->
+    <div id="settings-modal" class="modal z-50" role="dialog" aria-labelledby="settings-modal-title" aria-hidden="true">
+        <div class="modal-backdrop"></div>
+        <div class="modal-container">
+            <div class="card w-full max-w-lg">
+                <div class="card-header flex items-center justify-between">
+                    <h3 id="settings-modal-title" class="font-semibold text-slate-700 text-sm">Pengaturan URL</h3>
+                    <button class="modal-close-btn" aria-label="Close">✕</button>
+                </div>
+                <div class="p-4 space-y-4 text-sm">
+                    <div>
+                        <label for="cam1-url" class="block text-xs font-medium text-slate-600 mb-1">URL Kamera 1</label>
+                        <input type="text" id="cam1-url" class="modal-input" placeholder="Masukkan URL untuk Kamera 1">
+                    </div>
+                    <div>
+                        <label for="cam2-url" class="block text-xs font-medium text-slate-600 mb-1">URL Kamera 2</label>
+                        <input type="text" id="cam2-url" class="modal-input" placeholder="Masukkan URL untuk Kamera 2">
+                    </div>
+                    <div>
+                        <label for="cam3-url" class="block text-xs font-medium text-slate-600 mb-1">URL Kamera 3</label>
+                        <input type="text" id="cam3-url" class="modal-input" placeholder="Masukkan URL untuk Kamera 3">
+                    </div>
+                    <div>
+                        <label for="cam4-url" class="block text-xs font-medium text-slate-600 mb-1">URL Kamera 4</label>
+                        <input type="text" id="cam4-url" class="modal-input" placeholder="Masukkan URL untuk Kamera 4">
+                    </div>
+                    <hr class="border-slate-200">
+                    <div>
+                        <label for="audio-url" class="block text-xs font-medium text-slate-600 mb-1">URL Audio</label>
+                        <input type="text" id="audio-url" class="modal-input" placeholder="Masukkan URL untuk Audio Source">
+                    </div>
+                    <div class="flex justify-end gap-2 pt-2">
+                        <button id="stop-all-streams-btn" class="btn bg-red-600 hover:bg-red-700 text-white text-sm">Stop Semua Stream</button>
+                        <button id="save-settings-btn" class="btn btn-primary text-sm">Simpan & Mulai Ulang</button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <div id="export-modal" class="modal z-50" role="dialog" aria-labelledby="export-modal-title" aria-hidden="true">
+        <div class="modal-backdrop"></div>
+        <div class="modal-container">
+            <div class="card w-full max-w-md">
+                <div class="card-header flex items-center justify-between">
+                    <h3 id="export-modal-title" class="font-semibold text-slate-700 text-sm">Ekspor Data Metrik</h3>
+                    <button class="modal-close-btn" aria-label="Close">✕</button>
+                </div>
+                <div class="p-4 space-y-3 text-sm">
+                    <div>
+                        <label for="start-date" class="block text-xs font-medium text-slate-600 mb-1">Tanggal Mulai</label>
+                        <input type="date" id="start-date" class="modal-input">
+                    </div>
+                    <div>
+                        <label for="end-date" class="block text-xs font-medium text-slate-600 mb-1">Tanggal Akhir</label>
+                        <input type="date" id="end-date" class="modal-input">
+                    </div>
+                    <div>
+                        <label for="camera-select" class="block text-xs font-medium text-slate-600 mb-1">Pilih Kamera</label>
+                        <select id="camera-select" class="modal-input bg-white">
+                            <option value="">Semua Kamera</option>
+                            <option value="1">Kamera 1</option>
+                            <option value="2">Kamera 2</option>
+                            <option value="3">Kamera 3</option>
+                            <option value="4">Kamera 4</option>
+                        </select>
+                    </div>
+                    <button id="download-csv-btn" class="btn btn-primary w-full">Unduh CSV</button>
+                </div>
+            </div>
+        </div>
+    </div>
+    <script src="/static/js/app.js"></script>
+    
+</body>
+</html>

static/js/app.js

@@ -0,0 +1,682 @@
+const CONFIG = {
+    API_URL: "",
+    WEBSOCKET_URL: "ws://"+window.location.host+"/ws/video_feed",
+    TRIGGER_AUDIO_URL: "/trigger_audio_analysis",
+    GET_AUDIO_RESULT_URL: "/get_latest_audio_result",
+    POLLING_INTERVAL_MS: 30000,
+    DEFAULT_VIDEO_URLS: [
+        "/static/demo/3_usa.mp4",
+        "/static/demo/5_usa.mp4",
+        "/static/demo/7_usa.mp4",
+        "/static/demo/6_usa.mp4",
+    ],
+    DEFAULT_AUDIO_URL: "/static/demo/audio.m4a",
+};
+
+// --- Global State ---
+const state = {
+    show_detected: true,
+    show_density: false,
+    show_inactive: false,
+    
+    isStreaming: false,
+    cameraWebSockets: [null, null, null, null],
+    audioPollInterval: null,
+    
+    cameraUrls: [...CONFIG.DEFAULT_VIDEO_URLS],
+    audioUrl: CONFIG.DEFAULT_AUDIO_URL,
+    
+    cameraStats: Array(4).fill().map(() => ({
+        detected: 0,
+        inactive: 0,
+        dense_areas: 0
+    })),
+
+    lastVocalization: null,
+    isAnalyzingAudio: false,
+    lastAnalyzedAudioUrl: null,
+    lastAnalysisTimestamp: null,
+
+    lastInactiveAlert: {},
+    INACTIVE_THRESHOLD: 0.15 //percentage
+};
+
+// --- DOM Elements ---
+const $ = (selector) => document.querySelector(selector);
+
+const DOMElements = { // Cache
+    datetime: $('#datetime'),
+
+    canvases: Array.from({ length: 4 }, (_, i) => $(`#video-canvas-${i}`)),
+    contexts: [],
+
+    toggleControls: $('#toggle-controls'),
+    settingsButton: $('#settings-button'),
+
+    detectedCount: $('#detected-count'),
+    densityCount: $('#density-count'),
+    inactiveCount: $('#inactive-count'),
+
+    vocalizationContent: $('#vocalization-content'),
+
+    systemLog: $('#system-log'),
+
+    settingsModal: $('#settings-modal'),
+    saveSettingsBtn: $('#save-settings-btn'),
+    stopAllStreamsBtn: $('#stop-all-streams-btn'),
+    camUrlInputs: Array.from({ length: 4 }, (_, i) => $(`#cam${i+1}-url`)),
+    audioUrlInput: $('#audio-url'),
+    
+    exportModal: $('#export-modal'),
+    openExportModalBtn: $('#open-export-modal-btn'),
+    startDateInput: $('#start-date'),
+    endDateInput: $('#end-date'),
+    cameraSelect: $('#camera-select'),
+    downloadCsvBtn: $('#download-csv-btn'),
+};
+
+// Init canvas contexts
+DOMElements.contexts = DOMElements.canvases.map(canvas => 
+    canvas ? canvas.getContext('2d') : null
+);
+
+// --- Utils Functions ---
+function updateDateTime() {
+    if (!DOMElements.datetime) return;
+    
+    DOMElements.datetime.textContent = new Date().toLocaleString('id-ID', {
+        dateStyle: 'full',
+        timeStyle: 'short'
+    });
+}
+
+function addLog(message, type = 'info') {
+    if (!DOMElements.systemLog) return;
+    
+    const timestamp = new Date().toLocaleTimeString('id-ID', { hour12: false });
+    const typeClass = {
+        info: 'text-slate-500',
+        warning: 'text-amber-600',
+        danger: 'text-red-600 font-semibold'
+    }[type] || 'text-slate-500';
+    
+    const logEntry = document.createElement('p');
+    logEntry.className = typeClass;
+    logEntry.innerHTML = `<span class="font-semibold text-slate-400 mr-2">${timestamp}</span> ${message}`;
+    
+    DOMElements.systemLog.prepend(logEntry);
+    
+    if (DOMElements.systemLog.children.length > 30) {
+        DOMElements.systemLog.removeChild(DOMElements.systemLog.lastChild);
+    }
+}
+
+function updateToggleButtons() {
+    const buttons = DOMElements.toggleControls.querySelectorAll('button');
+    const activeColors = {
+        show_detected: '#22c55e', // Green
+        show_density: '#f97316',  // Orange
+        show_inactive: '#ef4444'  // Red
+    };
+    
+    buttons.forEach(button => {
+        const control = button.dataset.control;
+        const isActive = state[control];
+        
+        button.classList.toggle('active', isActive);
+        button.setAttribute('aria-pressed', isActive);
+        
+        if (isActive) {
+            const color = activeColors[control];
+            button.style.backgroundColor = color;
+            button.style.borderColor = color;
+            button.style.color = '#ffffff';
+        } else {
+            button.style.backgroundColor = '';
+            button.style.borderColor = '';
+            button.style.color = '';
+        }
+    });
+}
+
+function updateDailyAnalysisUI() {
+    const totals = state.cameraStats.reduce((acc, stats) => ({
+        detected: acc.detected + (stats.detected || 0),
+        inactive: acc.inactive + (stats.inactive || 0),
+        denseAreas: acc.denseAreas + (stats.dense_areas || 0)
+    }), { detected: 0, inactive: 0, denseAreas: 0 });
+    
+    if (DOMElements.detectedCount) DOMElements.detectedCount.textContent = totals.detected;
+    if (DOMElements.inactiveCount) DOMElements.inactiveCount.textContent = totals.inactive;
+    if (DOMElements.densityCount) DOMElements.densityCount.textContent = totals.denseAreas;
+}
+
+function displayAudioResults(data) {
+    if (!DOMElements.vocalizationContent) return;
+    
+    if (!data) {
+        DOMElements.vocalizationContent.innerHTML = `<p class="text-sm text-slate-500">No response from server.</p>`;
+        return;
+    }
+
+    if (data.status === "analyzing") {
+        DOMElements.vocalizationContent.innerHTML = `<p class="text-sm text-amber-600">Analisis vokalisasi sedang berlangsung...</p>`;
+        return;
+    }
+
+    if (data.status === "no_data" || data.prediction === null) {
+        DOMElements.vocalizationContent.innerHTML = `<p class="text-sm text-slate-500">Menunggu analisis vokalisasi berlangsung...</p>`;
+        return;
+    }
+    
+    if (data.prediction === "Error") {
+        DOMElements.vocalizationContent.innerHTML = `<p class="text-sm text-red-600">Error during audio analysis.</p>`;
+        return;
+    }
+    
+    const probabilities = data.probabilities || {};
+    const statusMap = {
+        'Healthy': { text: 'Sehat', color: 'green' },
+        'Unhealthy': { text: 'Tidak Sehat', color: 'red' },
+        'Noise': { text: 'Bising', color: 'amber' },
+    };
+    
+    const dominantStatus = statusMap[data.prediction] || { 
+        text: data.prediction, 
+        color: 'slate' 
+    };
+
+    if(
+        (data.prediction === "Unhealthy" || dominantStatus.text === "Tidak Sehat") &&
+        state.lastVocalization !== "Unhealthy"
+    ){
+        addLog("Status Vokal: <strong>Tidak Sehat Terdeteksi</strong>", "danger");
+        state.lastVocalization = "Unhealthy";
+    }
+    else if (data.prediction === "Healthy"){
+        state.lastVocalization = "Healthy";
+    }
+    
+    let barsHtml = '';
+    for (const [key, value] of Object.entries(probabilities)) {
+        const status = statusMap[key] || { text: key, color: 'slate' };
+        const percentage = (value * 100).toFixed(1);
+        
+        barsHtml += `
+            <div>
+                <div class="flex justify-between text-xs mb-1">
+                    <span class="font-medium text-${status.color}-700">${status.text}</span>
+                    <span>${percentage}%</span>
+                </div>
+                <div class="w-full bg-slate-200 rounded-full h-2">
+                    <div class="bg-${status.color}-500 h-2 rounded-full" style="width:${percentage}%"></div>
+                </div>
+            </div>
+        `;
+    }
+
+    DOMElements.vocalizationContent.innerHTML = `
+        <div class="flex items-center justify-between mb-3">
+            <span class="text-slate-500 text-xs">Status Dominan:</span>
+            <span class="font-bold text-base text-${dominantStatus.color}-600">${dominantStatus.text}</span>
+        </div>
+        <div class="space-y-2">${barsHtml}</div>
+    `;
+
+
+}
+
+// --- Modal function ---
+function openModal(modalEl) {
+    modalEl.classList.add('show');
+    modalEl.setAttribute('aria-hidden', 'false');
+    document.body.classList.add('overflow-hidden');
+}
+
+function closeModal(modalEl) {
+    modalEl.classList.remove('show');
+    modalEl.setAttribute('aria-hidden', 'true');
+    document.body.classList.remove('overflow-hidden');
+}
+
+function populateSettingsModal() {
+    DOMElements.camUrlInputs.forEach((input, i) => {
+        if (input) input.value = state.cameraUrls[i] || '';
+    });
+    
+    if (DOMElements.audioUrlInput) {
+        DOMElements.audioUrlInput.value = state.audioUrl || '';
+    }
+}
+
+// Make Local Storage for url when change
+function loadSettingsFromStorage() {
+    const savedCameraUrls = localStorage.getItem('chickSenseCameraUrls');
+    const savedAudioUrl = localStorage.getItem('chickSenseAudioUrl');
+
+    if (savedCameraUrls) {
+        try {
+            state.cameraUrls = JSON.parse(savedCameraUrls);
+        } catch (e) {
+            console.error("Failed to parse saved camera URLs, using defaults.", e);
+            state.cameraUrls = [...CONFIG.DEFAULT_VIDEO_URLS];
+        }
+    }
+    if (savedAudioUrl) {
+        state.audioUrl = savedAudioUrl;
+    }
+    addLog('Settings dimuat dari penyimpanan browser', 'info');
+}
+
+// --- Websocket Streaming functions ---
+function connectWebSocket(cameraIndex) {
+    const videoUrl = state.cameraUrls[cameraIndex];
+    if (!videoUrl) {
+        console.warn(`No URL for Camera ${cameraIndex + 1}, skipping connection.`);
+        return;
+    }
+    
+    if (state.cameraWebSockets[cameraIndex]) {
+        state.cameraWebSockets[cameraIndex].close();
+    }
+    
+    try {
+        const ws = new WebSocket(CONFIG.WEBSOCKET_URL);
+        ws.binaryType = "blob";
+        state.cameraWebSockets[cameraIndex] = ws;
+        
+        ws.onopen = () => {
+            addLog(`Menghubungkan ke Kamera ${cameraIndex + 1}`, 'info');
+            
+            ws.send(JSON.stringify({
+                type: 'start_stream',
+                video_url: videoUrl,
+                audio_url: state.audioUrl,
+                show_detected: state.show_detected,
+                show_density: state.show_density,
+                show_inactive: state.show_inactive,
+                camera_id: cameraIndex + 1
+            }));
+            
+            state.isStreaming = true;
+        };
+        
+        ws.onmessage = (event) => {
+            if (event.data instanceof Blob) {
+                handleBlobMessage(event.data, cameraIndex);
+            } else if (typeof event.data === 'string') {
+                handleTextMessage(event.data, cameraIndex);
+            }
+        };
+        
+        ws.onclose = () => {
+            addLog(`Kamera ${cameraIndex + 1} terputus.`, 'warning');
+            
+            const ctx = DOMElements.contexts[cameraIndex];
+            if (ctx) ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+            
+            state.cameraWebSockets[cameraIndex] = null;
+            state.cameraStats[cameraIndex] = { detected: 0, inactive: 0, dense_areas: 0 };
+            updateDailyAnalysisUI();
+            
+            state.isStreaming = state.cameraWebSockets.some(ws => ws !== null);
+            if (!state.isStreaming) {
+                addLog("Semua streams terputus.", 'danger');
+            }
+        };
+        
+        ws.onerror = (error) => {
+            console.error(`WebSocket Error for Camera ${cameraIndex + 1}:`, error);
+            addLog(`Koneksi gagal untuk Kamera ${cameraIndex + 1}.`, 'danger');
+        };
+    } catch (error) {
+        console.error(`Failed to create WebSocket for Camera ${cameraIndex + 1}:`, error);
+        addLog(`Gagal terhubung ke Kamera ${cameraIndex + 1}.`, 'danger');
+    }
+}
+
+function handleBlobMessage(blob, cameraIndex) {
+    const imageUrl = URL.createObjectURL(blob);
+    const img = new Image();
+    
+    img.onload = () => {
+        const ctx = DOMElements.contexts[cameraIndex];
+        if (ctx) {
+            ctx.canvas.width = img.width;
+            ctx.canvas.height = img.height;
+            ctx.drawImage(img, 0, 0);
+        }
+        URL.revokeObjectURL(imageUrl);
+    };
+    
+    img.onerror = () => {
+        console.error(`Failed to load image for Camera ${cameraIndex + 1}`);
+        URL.revokeObjectURL(imageUrl);
+    };
+    
+    img.src = imageUrl;
+}
+
+function handleTextMessage(data, cameraIndex) {
+    try {
+        const parsedData = JSON.parse(data);
+        
+        if (parsedData.type === 'stats') {
+            const stats = {
+                detected: Number(parsedData.detected || 0),
+                inactive: Number(parsedData.inactive || 0),
+                dense_areas: Number(parsedData.dense_areas || 0),
+            };
+
+            state.cameraStats[cameraIndex] = stats;
+            updateDailyAnalysisUI();
+
+            if (stats.detected > 0) {
+                const inactiveRatio = stats.inactive / stats.detected;
+                const percent = Math.round(inactiveRatio * 100);
+                const cameraId = cameraIndex + 1;
+
+                const isAboveThreshold = inactiveRatio > state.INACTIVE_THRESHOLD;
+                const hasAlerted = state.lastInactiveAlert[cameraId];
+
+                if (isAboveThreshold && !hasAlerted){
+                    const message = `Camera ${cameraId}: <strong> Persentase ayam tidak aktif cukup tinggi (${percent}%) </strong>`;
+
+                    addLog(message, "danger");
+                    state.lastInactiveAlert[cameraId] = true;
+                }
+                else if (!isAboveThreshold && hasAlerted){
+                    state.lastInactiveAlert[cameraId] = false;
+                }
+            }
+
+        }else if (parsedData.type === 'status') {
+            const msg = parsedData.message;
+            if (msg === "Display settings updated") {
+                return;
+            }
+            addLog(`[Global] ${msg}`, 'info');
+        }
+    } catch (e) {
+        console.error("Error parsing WebSocket JSON message:", e, data);
+    }
+}
+
+function startAllStreams() {
+    addLog("Mencoba memulai semua stream yang terkonfigurasi...", 'info');
+    
+    for (let i = 0; i < 4; i++) {
+        setTimeout(() => connectWebSocket(i), i * 100);
+    }
+    
+    if (!state.audioPollInterval) {
+        fetchLatestAudioResult();
+        state.audioPollInterval = setInterval(
+            fetchLatestAudioResult, 
+            CONFIG.POLLING_INTERVAL_MS
+        );
+    }
+}
+
+function stopAllStreams() {
+    addLog("Menghentikan semua stream...", 'warning');
+    
+    state.cameraWebSockets.forEach((ws, index) => {
+        if (ws) {
+            ws.close();
+            state.cameraWebSockets[index] = null;
+        }
+    });
+    
+    if (state.audioPollInterval) {
+        clearInterval(state.audioPollInterval);
+        state.audioPollInterval = null;
+    }
+    
+    displayAudioResults(null);
+    state.isStreaming = false;
+}
+
+async function fetchLatestAudioResult() {
+    try {
+        const response = await fetch(`${CONFIG.API_URL}${CONFIG.GET_AUDIO_RESULT_URL}`);
+        
+        if (!response.ok) {
+            if(response.status === 404){
+                return;
+            }throw new Error(`Server status ${response.status}`)
+        }
+        
+        const audioData = await response.json();
+
+        const resultKey = JSON.stringify(audioData);
+        const wasAnalyzing = state.isAnalyzingAudio;
+
+        if (state.lastAudioResultKey && state.lastAudioResultKey === resultKey){
+            return;
+        }
+
+        state.lastAudioResultKey = resultKey;
+
+        if (wasAnalyzing){
+            addLog("Hasil vokalisasi diperbarui", "info");
+            state.isAnalyzingAudio = false;
+            state.lastAnalysisTimestamp = new Date();
+        }else{
+            addLog("Hasil vokalisasi tersedia", "info");
+        }
+
+
+        displayAudioResults(audioData);
+    } catch (error) {
+        console.error("Error fetching audio result:", error);
+        
+        if (state.isAnalyzingAudio){
+            addLog("Analisis audio gagal", "danger");
+            state.isAnalyzingAudio = false;
+        }
+    }
+}
+
+async function downloadCSV() {
+    const start = DOMElements.startDateInput.value;
+    const end = DOMElements.endDateInput.value;
+    const cameraId = DOMElements.cameraSelect.value;
+    
+    if (!start || !end) {
+        addLog("Silakan pilih tanggal mulai dan tanggal selesai untuk ekspor.", 'warning');
+        return;
+    }
+    
+    try {
+        const url = new URL(`${CONFIG.API_URL}/metrics/export`);
+        url.searchParams.set('start', start);
+        url.searchParams.set('end', end);
+        if (cameraId) url.searchParams.set('camera_id', cameraId);
+        
+        addLog(`Exporting CSV for ${start} to ${end}...`, 'info');
+        
+        const response = await fetch(url.toString());
+        if (!response.ok) {
+            throw new Error(`Export failed with status ${response.status}`);
+        }
+        
+        const blob = await response.blob();
+        const downloadUrl = URL.createObjectURL(blob);
+        
+        const a = document.createElement('a');
+        a.href = downloadUrl;
+        a.download = `metrics_${start}_to_${end}${cameraId ? `_cam${cameraId}` : ''}.csv`;
+        document.body.appendChild(a);
+        a.click();
+        
+        // Clean up
+        setTimeout(() => {
+            document.body.removeChild(a);
+            URL.revokeObjectURL(downloadUrl);
+        }, 100);
+        
+        addLog("CSV download started.", 'info');
+        closeModal(DOMElements.exportModal);
+    } catch (error) {
+        console.error("CSV Download Error:", error);
+        addLog(error.message, 'danger');
+    }
+}
+
+// -- Event Handlers --
+function handleToggleControlClick(e) {
+    const button = e.target.closest('button');
+    if (!button) return;
+    
+    const control = button.dataset.control;
+    if (!control) return;
+    
+    state[control] = !state[control];
+    updateToggleButtons();
+
+    const labelMap = {
+        show_detected: 'Deteksi',
+        show_density: 'Kepadatan',
+        show_inactive: 'Inaktivitas'
+    };
+
+    const displayName = labelMap[control] || control;
+    addLog(`Tampilan diperbarui: ${displayName} ${state[control] ? 'dinyalakan' : 'dimatikan'}`, 'info');
+
+    const payload = JSON.stringify({
+        type: 'display_settings_update',
+        show_detected: state.show_detected,
+        show_density: state.show_density,
+        show_inactive: state.show_inactive
+    });
+    
+    state.cameraWebSockets.forEach(ws => {
+        if (ws && ws.readyState === WebSocket.OPEN) {
+            ws.send(payload);
+        }
+    });
+}
+
+function handleSettingsButtonClick() {
+    addLog('Tip: Double-click pada ikon gear untuk membuka setting kamera.', 'info');
+}
+
+function handleSettingsButtonDoubleClick() {
+    populateSettingsModal();
+    openModal(DOMElements.settingsModal);
+}
+
+function handleSaveSettingsClick() {
+    state.cameraUrls = DOMElements.camUrlInputs.map(input => 
+        input ? input.value.trim() : ''
+    );
+    state.audioUrl = DOMElements.audioUrlInput ? 
+        DOMElements.audioUrlInput.value.trim() : '';
+    
+    try {
+        localStorage.setItem('chickSenseCameraUrls', JSON.stringify(state.cameraUrls));
+        localStorage.setItem('chickSenseAudioUrl', state.audioUrl);
+        addLog('Pengaturan disimpan ke penyimpanan peramban.', 'info');
+    } catch (e) {
+        console.error("Failed to save settings to local storage:", e);
+        addLog('Tidak dapat menyimpan pengaturan.', 'danger');
+    }
+
+    addLog('Pengaturan disimpan. Memulai ulang aliran...', 'info');
+    closeModal(DOMElements.settingsModal);
+    
+    stopAllStreams();
+    setTimeout(startAllStreams, 500);
+}
+
+function handleStopStreamsClick() {
+    stopAllStreams();
+    closeModal(DOMElements.settingsModal);
+}
+
+function handleExportButtonClick() {
+    addLog('Tip: Double-click pada "Export CSV" untuk mengekspor metric ke CSV.', 'info');
+}
+
+function handleExportButtonDoubleClick() {
+    openModal(DOMElements.exportModal);
+}
+
+function handleModalCloseClick(e) {
+    const modal = e.currentTarget;
+    
+    if (e.target.classList.contains('modal-backdrop') || 
+        e.target.closest('.modal-close-btn')) {
+        closeModal(modal);
+    }
+}
+
+function handleEscapeKey(e) {
+    if (e.key === 'Escape') {
+        document.querySelectorAll('.modal.show').forEach(closeModal);
+    }
+}
+
+// -- Add Event Listener --
+function setupEventListeners() {
+    if (DOMElements.toggleControls) {
+        DOMElements.toggleControls.addEventListener('click', handleToggleControlClick);
+    }
+    
+    if (DOMElements.settingsButton) {
+        DOMElements.settingsButton.addEventListener('click', handleSettingsButtonClick);
+        DOMElements.settingsButton.addEventListener('dblclick', handleSettingsButtonDoubleClick);
+    }
+    
+    if (DOMElements.saveSettingsBtn) {
+        DOMElements.saveSettingsBtn.addEventListener('click', handleSaveSettingsClick);
+    }
+    
+    if (DOMElements.stopAllStreamsBtn) {
+        DOMElements.stopAllStreamsBtn.addEventListener('click', handleStopStreamsClick);
+    }
+    
+    if (DOMElements.openExportModalBtn) {
+        DOMElements.openExportModalBtn.addEventListener('click', handleExportButtonClick);
+        DOMElements.openExportModalBtn.addEventListener('dblclick', handleExportButtonDoubleClick);
+    }
+    
+    if (DOMElements.downloadCsvBtn) {
+        DOMElements.downloadCsvBtn.addEventListener('click', downloadCSV);
+    }
+    
+    document.querySelectorAll('.modal').forEach(modal => {
+        modal.addEventListener('click', handleModalCloseClick);
+    });
+    
+    window.addEventListener('keydown', handleEscapeKey);
+}
+
+// -- Init --
+function initialize() {
+    updateDateTime();
+    updateToggleButtons();
+    updateDailyAnalysisUI();
+    displayAudioResults(null);
+    loadSettingsFromStorage();
+
+    setupEventListeners();
+
+    const today = new Date().toISOString().split('T')[0];
+    if (DOMElements.startDateInput) DOMElements.startDateInput.value = today;
+    if (DOMElements.endDateInput) DOMElements.endDateInput.value = today;
+    
+    setInterval(updateDateTime, 30000); 
+    
+    addLog('Sistem diinisialisasi. Selamat datang! IKGC', 'info');
+    startAllStreams();
+}
+
+if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', initialize);
+} else {
+    initialize();
+}
+
+

utils/audio/audio_ingest.py

@@ -0,0 +1,118 @@
+import numpy as np
+import random
+import json
+import os
+import subprocess
+from io import BytesIO
+from typing import Optional, Dict
+from datetime import datetime
+import soundfile as sf
+from .vocalization_prediction import vocalization_prediction
+
+def _resolve_youtube_audio_url(url: str) -> str:
+    if "youtube.com" in url or "youtu.be" in url:
+        try:
+            meta = subprocess.run(
+                ["yt-dlp", "--no-cache-dir", "-J", url],
+                capture_output=True, text=True, check=True, timeout=30
+            )
+            info = json.loads(meta.stdout)
+            is_live = bool(info.get("is_live"))
+            fmt = "best[protocol^=m3u8]/best" if is_live else "bestaudio/best"
+            out = subprocess.run(
+                ["yt-dlp", "--no-cache-dir", "--get-url", "-f", fmt, url],
+                capture_output=True, text=True, check=True, timeout=30
+            )
+            return out.stdout.strip()
+        except Exception as e:
+            print(f"[FFmpeg Audio] yt-dlp resolve failed: {e}")
+    return url
+
+def record_audio_ffmpeg(src_url: str, duration: int = 60, sample_rate: int = 22050, seek_seconds: int = 0) -> Optional[bytes]:
+    src = _resolve_youtube_audio_url(src_url)
+
+    # --- This block is to make sure different kind of audio type can be extracted correctly ---
+    cmd = ["ffmpeg", "-hide_banner", "-loglevel", "error"]
+
+    if seek_seconds > 0 and not ("youtube.com" in src_url or "youtu.be" in src_url):
+         cmd += ["-ss", str(seek_seconds)]
+
+    if str(src).startswith(("http://", "https://")):
+        cmd += [
+            "-reconnect", "1",
+            "-reconnect_streamed", "1",
+            "-reconnect_on_network_error", "1",
+            "-fflags", "+genpts",
+            "-flags", "low_delay"
+        ]
+
+    cmd += [
+        "-i", src,
+        "-map", "a:0?",    
+        "-t", str(duration),
+        "-vn",
+        "-acodec", "pcm_s16le",
+        "-ar", str(sample_rate),
+        "-ac", "1",
+        "-f", "wav", "pipe:1",
+        "-y"
+    ]
+    # --- ---
+
+
+    try:
+        print(f"[FFmpeg] extracting audio: {src} ({duration}s @ {sample_rate}Hz)")
+        proc = subprocess.run(cmd, stdout=subprocess.PIPE, stderr=subprocess.PIPE,
+                              check=True, timeout=duration + 15)
+        return proc.stdout
+    except subprocess.CalledProcessError as e:
+        print(f"[FFmpeg] error (rc={e.returncode}): {e.stderr.decode(errors='ignore')}")
+    except subprocess.TimeoutExpired:
+        print("[FFmpeg] timed out reading audio.")
+    return None
+
+def background_audio_task(
+        audio_url: str,
+        duration: int,
+        vocal_model,
+        vocal_device,
+        target_dict: Dict,
+        seek_seconds: int = 0
+):
+    global analysis_in_progress
+    try:
+        analysis_in_progress = True
+        wav_bytes = record_audio_ffmpeg(audio_url, duration=duration, seek_seconds=seek_seconds)
+        if not wav_bytes:
+            raise RuntimeError("FFmpeg no data")
+        
+        # --- Below is to save analyzed audio into local ---
+        # output_dir = os.path.join("static", "audio_captures")
+        # os.makedirs(output_dir, exist_ok=True)
+        # timestamp = datetime.now().strftime("%Y%m%d_%H%M%S")
+        # output_filename = f"capture_{timestamp}.wav"
+        # output_filepath = os.path.join(output_dir, output_filename)
+        # with open(output_filepath, "wb") as f:
+        #    f.write(wav_bytes)
+        # print(f"[Audio Task] Saved captured audio to {output_filepath}")
+
+        with BytesIO(wav_bytes) as bio:
+            y, sr = sf.read(bio, dtype="float32")
+        
+        if hasattr(y, "ndim") and y.ndim > 1:
+            y = np.mean(y, axis=1)
+        sr = int(sr)
+
+        pred, probs = vocalization_prediction(y, sr, vocal_model, vocal_device)
+
+        target_dict["prediction"] = pred
+        target_dict["probabilities"] = probs
+        print("[Audio Task] Completed (ffmpeg path)")
+    
+    except Exception as e:
+        print(f"[Audio Task] Failed: {e}")
+        target_dict["prediction"] = "Error"
+        target_dict["probabilities"] = None
+    finally:
+        analysis_in_progress = False
+        

utils/audio/vocalization_prediction.py

@@ -0,0 +1,112 @@
+import numpy as np
+import librosa
+import torch
+import torch.nn as nn
+import torch.nn.functional as F
+
+class ModdifiedModel(nn.Module):
+    def __init__(self, num_classes=3):
+        super(ModdifiedModel, self).__init__()
+        self.features = nn.Sequential(
+            nn.Conv2d(1, 32, kernel_size=3),
+            nn.BatchNorm2d(32),
+            nn.ReLU(),
+            nn.MaxPool2d(2),
+            nn.Conv2d(32, 64, kernel_size=3),
+            nn.BatchNorm2d(64),
+            nn.ReLU(),
+            nn.MaxPool2d(2),
+            nn.Conv2d(64, 128, kernel_size=3),
+            nn.BatchNorm2d(128),
+            nn.ReLU(),
+            nn.MaxPool2d(2),
+        )
+        self.classifier = nn.Sequential(
+            nn.Flatten(),
+            nn.Linear(25088, 256),
+            nn.Dropout(0.5),
+            nn.ReLU(),
+            nn.Linear(256, num_classes)
+        )
+
+    def forward(self, x):
+        x = self.features(x)
+        return self.classifier(x)
+
+def audio_to_log_mel_spec(audio_data, sr=22050, wav_size=int(1.5 * 22050)):
+    """
+    Convert raw audio waveform to log-mel spectrogram.
+    Args:
+        audio_data: np.ndarray, audio waveform
+        sr: int, sample rate
+        wav_size: int, target length in samples (1.5 seconds)
+    Returns:
+        mel_spec_db: log-mel spectrogram (n_mels, time)
+    """
+    wav = librosa.util.normalize(audio_data)
+    if len(wav) > wav_size:
+        wav = wav[:wav_size]
+    else:
+        wav = np.pad(wav, (0, max(0, wav_size - len(wav))), "constant")
+    
+    n_fft = 2048
+    hop_length = 256
+    n_mels = 128
+    mel_spec = librosa.feature.melspectrogram(y=wav, sr=sr, n_fft=n_fft,
+                                              hop_length=hop_length, n_mels=n_mels)
+    mel_spec_db = librosa.power_to_db(mel_spec, ref=np.max)
+    return mel_spec_db
+
+def load_model(model_path):
+    """Load trained model from .pth file."""
+    model = ModdifiedModel()
+    model.load_state_dict(torch.load(model_path, map_location=torch.device('cpu')))
+    model.eval()
+    return model
+
+def vocalization_prediction(audio_data, sample_rate, model, device=None):
+    """
+    Predict vocalization class from long audio by averaging over 1.5s windows.
+    Args:
+        audio_data: np.ndarray, long audio (e.g., 30 seconds)
+        sample_rate: int, sample rate
+        model: trained PyTorch model
+        device: torch.device
+    Returns:
+        predicted_label: str
+        probabilities: dict
+    """
+    if device is None:
+        device = torch.device("cuda" if torch.cuda.is_available() else "cpu")
+
+    wav_size_samples = int(1.5 * sample_rate)
+    step_size = wav_size_samples // 2  # 50% overlap
+    class_labels = {0: 'Healthy', 1: 'Noise', 2: 'Unhealthy'}
+    total_probs = np.zeros(len(class_labels))
+    n_predictions = 0
+
+    for start in range(0, len(audio_data) - wav_size_samples + 1, step_size):
+        chunk = audio_data[start:start + wav_size_samples]
+        try:
+            mel_spec_db = audio_to_log_mel_spec(chunk, sr=sample_rate)
+            X_tensor = torch.tensor(mel_spec_db, dtype=torch.float32).unsqueeze(0).unsqueeze(0).to(device)
+            model = model.to(device)
+
+            with torch.no_grad():
+                output = model(X_tensor)
+                probs = F.softmax(output, dim=1)[0].cpu().numpy()
+            total_probs += probs
+            n_predictions += 1
+        except Exception as e:
+            print(f"[Error] Failed on audio chunk: {e}")
+            continue
+
+    if n_predictions == 0:
+        return "Error", {"Healthy": 0.0, "Noise": 0.0, "Unhealthy": 0.0}
+
+    avg_probs = total_probs / n_predictions
+    pred_class = np.argmax(avg_probs)
+    predicted_label = class_labels[pred_class]
+    prob_dict = {class_labels[i]: avg_probs[i] for i in range(len(class_labels))}
+
+    return predicted_label, prob_dict

utils/metrics_store.py

@@ -0,0 +1,83 @@
+import os
+import sqlite3
+import threading
+import queue
+import time
+from config import DATA_STORAGE
+
+SCHEMA = """
+CREATE TABLE IF NOT EXISTS metrics (
+    ts INTEGER NOT NULL, -- seconds (unix)
+    camera_id INTEGER NOT NULL,
+    detected INTEGER NOT NULL,
+    dense_areas INTEGER NOT NULL,
+    inactive INTEGER NOT NULL,
+    PRIMARY KEY (ts, camera_id)
+);
+CREATE INDEX IF NOT EXISTS idx_metrics_cam_ts ON metrics(camera_id, ts);
+"""
+
+class MetricsStore:
+    def __init__(self):
+        path = DATA_STORAGE["SQLITE_DB_PATH"]
+        retention_days = DATA_STORAGE["DB_RETENTION_DAYS"]
+        os.makedirs(os.path.dirname(path) or ".", exist_ok=True)
+        self.conn = sqlite3.connect(path, check_same_thread=False)
+        self.conn.execute("PRAGMA journal_mode=WAL;")
+        self.conn.execute("PRAGMA synchronous=NORMAL;")
+        self.conn.executescript(SCHEMA)
+        self.retention_days = retention_days
+        self.q = queue.Queue(maxsize=10000)
+        self.t = threading.Thread(target=self._worker, daemon=True)
+        self.t.start()
+    
+    def _worker(self):
+        buf, last_flush, last_ret = [], time.time(), time.time()
+        while True:
+            try:
+                item = self.q.get(timeout = 1.0)
+                buf.append(item)
+            except queue.Empty:
+                pass
+
+            now = time.time()
+            if buf and (len(buf) >= DATA_STORAGE["DB_WRITE_BUFFER_SIZE"] or now - last_flush > DATA_STORAGE["DB_WRITE_INTERVAL_S"]):
+                self.conn.executemany(
+                    "INSERT OR REPLACE INTO metrics(ts,camera_id,detected,dense_areas,inactive) VALUES (?,?,?,?,?)",
+                    buf
+                )
+                self.conn.commit()
+                buf.clear()
+                last_flush = now
+
+            # keep retention on check every hour
+            if now - last_ret > 3600:
+                cutoff = int(time.time()) - self.retention_days * 86400
+                self.conn.execute("DELETE FROM metrics WHERE ts < ?", (cutoff,))
+                self.conn.commit()
+                last_ret = now
+                
+    def write(self, ts, camera_id, detected, dense_areas, inactive):
+        try:
+            self.q.put_nowait((int(ts), int(camera_id), int(detected), int(dense_areas), int(inactive)))
+        except queue.Full:
+            pass  # drop if overloaded (rare), avoids blocking video loop
+    
+    def fetch_range(self, start_ts, end_ts, camera_id=None):
+        """ retrieve data from database with specific time window """
+        cur = self.conn.cursor()
+        sql = "SELECT ts, camera_id, detected, dense_areas, inactive FROM metrics WHERE ts BETWEEN ? AND ?"
+        params = [int(start_ts), int(end_ts)]
+        if camera_id is not None:
+            sql += " AND camera_id = ?"
+            params.append(int(camera_id))
+        sql += " ORDER BY ts ASC, camera_id ASC"
+        cur.execute(sql, params)
+        return cur.fetchall()
+
+    def get_bounds(self):
+        """ help to find the earliest and latest timestamps on the table """
+        cur = self.conn.cursor()
+        cur.execute("SELECT MIN(ts), MAX(ts) FROM metrics")
+        row = cur.fetchone() or (None, None)
+        return row

utils/notifications.py

@@ -0,0 +1,273 @@
+import asyncio
+import json
+import time
+import logging
+from telegram import Bot
+from dataclasses import dataclass
+from datetime import datetime
+from pathlib import Path
+from typing import Dict, List, Any, Optional
+
+from config import NOTIFIER
+
+ENABLE_TELEGRAM_NOTIFICATIONS = NOTIFIER["ENABLE_TELEGRAM_NOTIFICATIONS"]
+TELEGRAM_BOT_TOKEN = NOTIFIER["TELEGRAM_BOT_TOKEN"]
+TELEGRAM_CHAT_ID = NOTIFIER["TELEGRAM_CHAT_ID"]
+
+INACTIVE_PERCENTAGE_THRESHOLD = NOTIFIER["INACTIVE_PERCENTAGE_THRESHOLD"]
+UNHEALTHY_HISTORY_LENGTH = NOTIFIER["UNHEALTHY_HISTORY_LENGTH"]
+UNHEALTHY_ALERT_THRESHOLD = NOTIFIER["UNHEALTHY_ALERT_THRESHOLD"]
+DENSITY_COUNT_THRESHOLD = NOTIFIER["DENSITY_COUNT_THRESHOLD"]
+
+# --- Helper ---
+def _now_local() -> datetime:
+    return datetime.now().astimezone()
+
+@dataclass
+class AlertState:
+    """ Tracks each camera alert state and cooldown """
+    sent_inactive_danger: bool = False
+    sent_unhealthy_danger: bool = False
+    sent_density_danger: bool = False
+    last_danger_alert_time: float = 0.0 # timestamp
+    last_warning_alert_time: float = 0.0
+    cooldown_period_danger: int = 1800 # 30 minutes
+    cooldown_period_warning: int = 3600
+
+class TelegramNotifier:
+    def __init__(self, bot_token: str, chat_id: str, *, logger: Optional[logging.Logger] = None):
+        self.bot_token = bot_token
+        self.chat_id = chat_id
+        self._logger = logger or logging.getLogger(__name__)
+    
+    async def _send_async(self, text: str) -> bool:
+        try:
+            bot = Bot(token=self.bot_token)
+            await bot.send_message(chat_id=self.chat_id, text=text, parse_mode="HTML", disable_web_page_preview=True)
+            return True
+        except Exception as e:
+            self._logger.error("[Telegram] Gagal kirim pesan: %s", e)
+            return False
+    
+    def send(self, text: str) -> bool:
+        """ Send message """
+        try:
+            return asyncio.run(self._send_async(text))
+        except Exception as e:
+            self._logger.error("[Telegram] Gagal jalankan async: %s", e)
+            return False
+
+SENSOR_JSON_PATH = Path(NOTIFIER["SENSOR_DATA_JSON_PATH"])
+alert_states: Dict[str, AlertState] = {}
+
+def _load_sensor_data() -> List[Dict[str, Any]]:
+    """ Load sensor_data.json """
+    if not SENSOR_JSON_PATH.exists():
+        return []
+    try:
+        with SENSOR_JSON_PATH.open("r", encoding="utf-8") as f:
+            data = json.load(f)
+            return data if isinstance(data, list) else []
+    except Exception as e:
+        logging.error("[Sensor JSON] Gagal baca: %s", e)
+        return []
+
+def _count_unhealthy(vocal_history: List[str]) -> int:
+    """ Count 'Unhealthy' """
+    recent = vocal_history[-UNHEALTHY_HISTORY_LENGTH:]
+    return sum(1 for s in recent if isinstance(s, str) and s.strip() == "Unhealthy")
+
+def _get_prediction_with_prob(entry: Dict) -> tuple[str, float]:
+    pred = entry.get("prediction")
+    probs = entry.get("probabilities", {})
+    if pred and pred in probs:
+        return pred, float(probs[pred])
+    return pred or "Unknown", 0.0
+
+def generate_alert_message(
+        camera_id: str,
+        inactive_ratio: float,
+        audio_pred: str,
+        audio_prob: float,
+        density_count: int,
+        unhealthy_count: int,
+        timestamp: str
+) -> str:
+    details = []
+    is_danger = False
+    is_warning = False
+    is_mic = camera_id == "MIC"
+
+    # Inactivity Logic
+    if not is_mic:
+        if inactive_ratio >= INACTIVE_PERCENTAGE_THRESHOLD:
+            is_danger = True
+            pcnt = round(inactive_ratio * 100, 1)
+            details.append(f"Kamera {camera_id}: Inaktivitas ayam mencapai <b>{pcnt}%</b>.")
+        elif inactive_ratio > 0:
+            is_warning = True
+            details.append(f"Kamera {camera_id}: Terdeteksi beberapa ayam tidak aktif.")
+    
+    # Density Logic
+    if not is_mic:
+        if density_count >= DENSITY_COUNT_THRESHOLD:
+            is_danger = True
+            details.append(f"Kamera {camera_id}: Terdeteksi <b>{density_count}</b> area dengan kepadatan tinggi.")
+        elif density_count > 1:
+            is_warning = True
+            details.append(f"Kamera {camera_id}: Terdeteksi kepadatan ayam lokal.\n({density_count} cluster)")
+    
+    # Audio Logic
+    if audio_pred == "Unhealthy":
+        pcnt = round(audio_prob * 100, 1)
+        if unhealthy_count >= UNHEALTHY_ALERT_THRESHOLD:
+            is_danger = True
+            details.append(f"Audio {camera_id}: Tanda <b>Tidak Sehat</b> terdeteksi berulang (Prob: {pcnt}%).")
+        else:
+            is_warning = True
+            details.append(f"Audio {camera_id}: Terdengar tanda awal <b>Tidak Sehat</b> (Prob: {pcnt}%).")
+    
+    if not is_danger and not is_warning:
+        return ""
+    
+    end_parts = []
+    if is_danger:
+        end_parts.append("🔴 <b>[BAHAYA]</b>")
+    elif is_warning:
+        end_parts.append("🟠 <b>[PERINGATAN]</b>")
+    
+    # Build the message
+    end_parts.append("")
+    end_parts.extend(details)
+    end_parts.append("")
+    end_parts.append("<b>Mohon segera periksa kondisi kandang!</b>")
+    end_parts.append(f"<i>Waktu: {timestamp}</i>")
+
+    return "\n".join(end_parts)
+
+def monitor_once(notifier: Optional[TelegramNotifier]) -> None:
+    data = _load_sensor_data()
+    if not data:
+        return
+    
+    timestamp_str = _now_local().strftime("%Y-%m-%d %H:%M:%S")
+
+    for item in data:
+        camera_id = str(item.get("camera_id", "unknown"))
+        detected_count = item.get("detected_count", 0)
+        inactive_count = item.get("inactive_count", 0)
+        density_count = item.get("density_count", 0)
+        vocal_history = item.get("vocalization_history", [])
+        latest_audio_pred = vocal_history[-1] if vocal_history else None
+    
+        audio_pred, audio_prob = _get_prediction_with_prob({
+            "prediction": latest_audio_pred,
+            "probabilities": item.get("latest_probabilities", {})
+        })
+        unhealthy_count = _count_unhealthy(vocal_history)
+
+        inactive_ratio = inactive_count / detected_count if detected_count > 0 else 0.
+
+        if camera_id not in alert_states:
+            alert_states[camera_id] = AlertState()
+        state = alert_states[camera_id]
+    
+        # Send alert State
+        now = time.time()
+        should_send = False
+        message_type = "info"
+        is_mic = camera_id == "MIC"
+
+        # Type : Danger
+        danger_cooldown_expired = (now - state.last_danger_alert_time) >= state.cooldown_period_danger
+        if not is_mic and inactive_ratio >= INACTIVE_PERCENTAGE_THRESHOLD:
+            if not state.sent_inactive_danger or danger_cooldown_expired:
+                should_send = True
+                message_type = "danger"
+                state.sent_inactive_danger = True
+                state.last_danger_alert_time = now
+        
+        if unhealthy_count >= UNHEALTHY_ALERT_THRESHOLD:
+            if not state.sent_unhealthy_danger or danger_cooldown_expired:
+                should_send = True
+                message_type = "danger"
+                state.sent_unhealthy_danger = True
+                state.last_danger_alert_time = now
+        
+        if not is_mic and density_count >= DENSITY_COUNT_THRESHOLD:
+            if not state.sent_density_danger or danger_cooldown_expired:
+                should_send = True
+                message_type = "danger"
+                state.sent_density_danger = True
+                state.last_danger_alert_time = now
+    
+        # Type : Warning
+        warning_cooldown_expired = (now - state.last_warning_alert_time) >= state.cooldown_period_warning
+        if not should_send and not is_mic and inactive_count > 0 and not state.sent_inactive_danger:
+            if warning_cooldown_expired:
+                should_send = True
+                message_type = "warning"
+                state.last_warning_alert_time = now
+        
+        if not should_send and audio_pred == "Unhealthy" and not state.sent_unhealthy_danger:
+            if warning_cooldown_expired:
+                should_send = True
+                message_type = "warning"
+                state.last_warning_alert_time = now
+        
+        if not should_send and not is_mic and density_count > 1 and not state.sent_density_danger:
+            if warning_cooldown_expired:
+                should_send = True
+                message_type = "warning"
+                state.last_warning_alert_time = now
+    
+        # Send alert if TRUE
+        if should_send:
+            msg = generate_alert_message(
+                camera_id=camera_id,
+                inactive_ratio=inactive_ratio,
+                audio_pred=audio_pred,
+                audio_prob=audio_prob,
+                density_count=density_count,
+                unhealthy_count=unhealthy_count,
+                timestamp=timestamp_str
+            )
+
+            if msg.strip() and notifier and ENABLE_TELEGRAM_NOTIFICATIONS:
+                success = notifier.send(msg)
+                logging.info("[Notif] %s alert sent for Camera %s: %s", message_type.upper(), camera_id, success)
+            else:
+                print(f"[Notif][Dry-Run] {message_type.upper()}:\n{msg}\n")
+    
+        # State Reset
+        if inactive_ratio < INACTIVE_PERCENTAGE_THRESHOLD:
+            state.sent_inactive_danger = False
+        if unhealthy_count < UNHEALTHY_ALERT_THRESHOLD:
+            state.sent_unhealthy_danger = False
+        if density_count < DENSITY_COUNT_THRESHOLD:
+            state.sent_density_danger = False
+
+def main() -> None:
+    logging.basicConfig(level=logging.INFO, format='%(asctime)s | %(levelname)s | %(message)s')
+
+    # Initialize notifier
+    notifier: Optional[TelegramNotifier] = None
+    if ENABLE_TELEGRAM_NOTIFICATIONS and TELEGRAM_BOT_TOKEN and TELEGRAM_CHAT_ID:
+        notifier = TelegramNotifier(TELEGRAM_BOT_TOKEN, TELEGRAM_CHAT_ID, logger=logging.getLogger("Telegram"))
+        logging.info("[Notif] Telegram aktif.")
+    else:
+        logging.info("[Notif] Telegram dinonaktifkan. Mode dry-run.")
+
+    logging.info("[Notif] Memantau sensor_data.json setiap 60 detik...")
+    
+    while True:
+        try:
+            monitor_once(notifier)
+        except Exception as e:
+            logging.error("[Notif] Error saat monitoring: %s", e)
+        time.sleep(60)
+
+if __name__ == "__main__":
+    main()
+
+

utils/video/frame_reader.py

@@ -0,0 +1,105 @@
+import os
+import re
+import cv2
+import time
+import threading
+import subprocess
+from collections import deque
+from config import TUNING
+
+class FrameReader(threading.Thread):
+    def __init__(self, video_url: str):
+        super().__init__(daemon=True)
+        self.video_url = video_url
+        self.buffer = deque(maxlen=TUNING["FRAME_READER_BUFFER_SIZE"])
+        self.fps = TUNING["FRAME_READER_FPS"]
+        self.running = threading.Event()
+        self.cap = None
+        self._is_file = self._looks_like_file(video_url)
+    
+    def _looks_like_file(self, url: str) -> bool:
+        if os.path.exists(url):
+            return True
+        return not re.match(r'^[a-zA-Z]+://', url or "")
+    
+    def _resolve_url(self, url: str) -> str:
+        if "youtube.com" in url or "youtu.be" in url:
+            try:
+                print(f"[FrameReader] Resolving YouTube URL: {url}")
+
+                result = subprocess.run(
+                    ["yt-dlp", "--get-url", url],
+                    capture_output=True, text=True, check=True, timeout=30
+                )
+                urls = result.stdout.strip().splitlines()
+                if not urls:
+                    print("[FrameReader] No URLs returned by yt-dlp")
+                    return None
+
+                stream_url = urls[0]
+                print(f"[FrameReader] Resolved to stream: {stream_url}")
+                return stream_url
+
+            except subprocess.CalledProcessError as e:
+                stderr = e.stderr.strip()
+                print(f"[FrameReader] yt-dlp failed with error: {stderr}")
+                if "unavailable" in stderr:
+                    print("[FrameReader] Video may be offline, private, or geo-restricted.")
+                return None
+            except Exception as e:
+                print(f"[FrameReader] Unexpected error resolving YouTube URL: {e}")
+                return None
+
+        return url
+    
+    def run(self):
+        """ Read each frame of a video and store in buffer """
+        resolved = self._resolve_url(self.video_url)
+        self.cap = cv2.VideoCapture(resolved, cv2.CAP_FFMPEG)
+        if not self.cap.isOpened():
+            print(f"[FrameReader] Cannot open: {resolved}")
+            return
+        
+        try:
+            self.cap.set(cv2.CAP_PROP_BUFFERSIZE, 1)
+        except Exception:
+            pass
+        self.running.set()
+
+        # Count Time & FPS
+        src_fps = self.cap.get(cv2.CAP_PROP_FPS)
+        if not src_fps or src_fps <= 1e-3:
+            src_fps = float(self.fps) if self.fps else 30.0
+        frame_period = 1.0 / float(src_fps)
+        next_ts = time.monotonic()
+
+        # Read Frame Loop
+        while self.running.is_set():
+            ret, frame = self.cap.read()
+            if not ret:
+                if os.path.exists(self.video_url):
+                    break
+                time.sleep(0.5)
+                continue
+
+            if frame is not None:
+                self.buffer.append(frame)
+            
+            # Time Sync
+            next_ts += frame_period
+            sleep_for = next_ts - time.monotonic()
+            if sleep_for > 0:
+                time.sleep(sleep_for)
+            else:
+                next_ts = time.monotonic()
+        
+        if self.cap:
+            self.cap.release()
+    
+    def stop(self):
+        self.running.clear()
+        self.join()
+    
+    def read(self):
+        return self.buffer[-1].copy() if self.buffer else None
+    

utils/video/stream_processor.py

@@ -0,0 +1,250 @@
+import numpy as np
+import time
+from typing import Dict, List, Optional 
+import threading
+import torch
+from sklearn.cluster import DBSCAN
+
+# -- Local Imports --
+from config import APP_CONFIG, TUNING, INACTIVITY_CFG, DENSITY_DBSCAN_CFG
+from .frame_reader import FrameReader
+from .tracker import MOTTracker
+
+class StreamProcessor:
+    def __init__(self,
+                 video_url: str,
+                 model,
+                 device: str = "cpu",
+                 half: bool = False,
+                 infer_lock=None):
+        
+        # -- Inisialisasi --
+        self.video_url = video_url
+        self.model = model
+        self.device = device
+        self.detection_interval = max(1, int(TUNING["DETECTION_INTERVAL_FRAMES"]))
+        self.imgsz = int(TUNING["YOLO_IMG_SIZE"])
+        self.half = bool(half and device == "cuda")
+        self._infer_lock = infer_lock
+
+        self.frame_reader = FrameReader(video_url)
+        self.tracker = MOTTracker(tracker_type="bytetrack", device=device)
+        self._running = False
+        self._thread = threading.Thread(target=self._run, daemon=True)
+        self._lock = threading.Lock()
+
+        self._latest_payload = None
+        self._frame_idx = 0
+        self._last_dets = None
+        self.id_state: Dict[int, Dict] = {}
+
+    def start(self):
+        if self._running:
+            return
+        self._running = True
+        self.frame_reader.start()
+        self._thread.start()
+    
+    def stop(self):
+        self._running = False
+        self.frame_reader.stop()
+        self._thread.join()
+    
+    def get_latest(self) -> Optional[Dict]:
+        with self._lock:
+            if self._latest_payload is None:
+                return None
+            return {
+                "frame" : self._latest_payload["frame"].copy(), 
+                "tracks" : list(self._latest_payload["tracks"]),
+                "timestamp" : self._latest_payload["timestamp"],
+                "frame_idx" : self._latest_payload["frame_idx"],
+                "stats" : dict(self._latest_payload.get("stats", {}))
+            }
+    
+    
+    
+    def _size_norm(self, box: List[float]) -> float:
+        x1, y1, x2, y2 = box
+        w = max(1.0, x2- x1)
+        h = max(1.0, y2 - y1)
+        return (w*w + h*h) ** 0.5
+    
+    # -- Inactivity Logic --
+    def _update_inactivity(self, tracks: List[Dict], now: float):
+        current_ids = set(t["id"] for t in tracks)
+
+        for t in tracks:
+            tid = t["id"]
+            cx, cy = self._center(t["box"])
+            diag = self._size_norm(t["box"])
+            st = self.id_state.get(tid)
+
+            if st is None:
+                # please refer to "config.py" for each definition
+                st = {"pos": (cx, cy), "t": now, "ema_v": 0.0, "inactive": False, "since": None, "last_seen": now}
+                self.id_state[tid] = st
+                t["inactive"] = False
+                continue
+
+            dt = max(1e-3, now - st["t"])
+            dx = cx - st["pos"][0]
+            dy = cy - st["pos"][1]
+
+            v_norm = ((dx*dx + dy * dy)**0.5 / dt) / max(1.0, diag)
+            alpha = INACTIVITY_CFG["EMA_ALPHA"]
+            ema_v = alpha * v_norm + (1.0 - alpha) * st["ema_v"]
+
+            entry = INACTIVITY_CFG["ENTER_THRESH_NORM_SPEED"]
+            exit_ = INACTIVITY_CFG["EXIT_THRESH_NORM_SPEED"]
+            dwell = INACTIVITY_CFG["MIN_DURATION_S"]
+
+            if st["inactive"]:
+                if ema_v > exit_:
+                    st["since"] = st.get("since") or now
+                    if (now - st["since"]) >= dwell:
+                        st["inactive"] = False
+                        st['since'] = None
+                else:
+                    st["since"] = None
+            else:
+                if ema_v < entry:
+                    st["since"] = st.get("since") or now
+                    if (now - st["since"]) >= dwell:
+                        st["inactive"] = True
+                        st["since"] = None
+                else:
+                    st["since"] = None
+
+            st.update(pos = (cx, cy), t = now, ema_v = ema_v, last_seen = now)
+            t["inactive"] = st["inactive"]
+
+        # ensure old unseen ID removed
+        stale = [
+            tid for tid, st in list(self.id_state.items())
+            if tid not in current_ids and (now - st.get("last_seen", now)) > INACTIVITY_CFG["MAX_UNSEEN_GAP_S"]
+        ]
+        for tid in stale:
+            self.id_state.pop(tid, None)
+        
+    def _center(self, box: List[float]) -> tuple[float, float]:
+        x1, y1, x2, y2 = box
+        return ((x1 + x2) * 0.5, (y1 + y2) * 0.5)
+
+    # -- Density Logic -- 
+    def _compute_density_dbscan(self, tracks: List[Dict]) -> set:
+        if not tracks:
+            return set(), 0
+        
+        centers = np.array([self._center(t["box"]) for t in tracks], dtype=np.float32)
+        # please refer to "config.py" for each definition
+        min_samples = max(1, DENSITY_DBSCAN_CFG["MIN_NEIGHBORS"] + 1)
+        labels = DBSCAN(eps=DENSITY_DBSCAN_CFG["EPS_PX"], min_samples=min_samples).fit_predict(centers)
+
+        # below to count cluster that happend ( -1 is noise )
+        n_clusters = int(len(set(lbl for lbl in labels if lbl != -1)))
+        dense_ids = {t["id"] for t, lbl in zip(tracks, labels) if lbl != -1}
+        return dense_ids, n_clusters
+
+        # return {t["id"] for t, lbl in zip(tracks, labels) if lbl != -1}
+    
+
+    def _run(self):
+        """ Detect Object from The Frame and add its metadata (Inactivity / Density) """
+        while self._running:
+            frame = self.frame_reader.read()
+            if frame is None:
+                time.sleep(0.01)
+                continue
+            self._frame_idx += 1
+
+            # ensure frame to detect only on the interval
+            if self._frame_idx % self.detection_interval == 1:
+                try:
+                    with torch.no_grad():
+                        res = self.model.predict(
+                            frame,
+                            imgsz = self.imgsz,
+                            device = self.device,
+                            half = self.half,
+                            verbose = False 
+                        )[0]
+                    
+                    boxes = res.boxes
+                    if boxes is not None and len(boxes) > 0:
+                        dets = np.concatenate([
+                            boxes.xyxy.cpu().numpy(),
+                            boxes.conf.cpu().numpy()[:, None],
+                            boxes.cls.cpu().numpy()[:, None]
+                        ], axis = 1).astype("float32")
+                    else:
+                        dets = np.empty((0, 6), dtype="float32")
+                    self._last_dets = dets
+                except Exception as e:
+                    print(f"[StreamProcessor] detection error: {e}")
+                    self._last_dets = None
+            dets = self._last_dets # use last know tracking to ensure trackig is keept
+
+            # Update tracker
+            try:
+                tracks = self.tracker.update(dets, frame)
+            except Exception as e:
+                print(f"[StreamProcessor] tracking error: {e}")
+                tracks = []
+            
+            # Update metadata
+            now = time.time()
+            self._update_inactivity(tracks, now)
+            dense_ids, n_clusters = self._compute_density_dbscan(tracks)
+            for t in tracks:
+                t["dense"] = (t["id"] in dense_ids)
+            
+            stats = {
+                "detected": len(tracks),
+                "inactive": sum(1 for t in tracks if t.get("inactive")),
+                "dense_clusters": n_clusters
+            }
+
+            # Store latest result
+            with self._lock:
+                self._latest_payload = {
+                    "frame" : frame,
+                    "tracks" : tracks,
+                    "timestamp" : now,
+                    "frame_idx" : self._frame_idx,
+                    "stats" : stats
+                }
+
+class StreamRegistry:
+    def __init__(self):
+        self._by_url: Dict[str, StreamProcessor] = {}
+        self._ref_count: Dict[str, int] = {}
+        self._lock = threading.Lock()
+    
+    def get(self, url: str, model, device="cpu", half=False) -> StreamProcessor:
+        """ Gather and made new StreamProcessor from each Video URL"""
+        with self._lock:
+            sp = self._by_url.get(url)
+            if sp is None:
+                print(f"[Registry] Creating new stream processor for: {url}")
+                sp = StreamProcessor(url, model=model, device=device, half=half)
+                sp.start()
+                self._by_url[url] = sp
+                self._ref_count[url] = 0
+            self._ref_count[url] += 1
+            print(f"[Registry] URL {url} ref count is now {self._ref_count[url]}")
+            return sp
+    
+    def release(self, url: str):
+        """ Ensure when stream video stop, threading is stop too """
+        with self._lock:
+            if url in self._by_url:
+                self._ref_count[url] -= 1
+                print(f"[Registry] URL {url} ref count is now {self._ref_count[url]}")
+                if self._ref_count[url] <= 0:
+                    print(f"[Registry] Stopping and removing processor for {url}")
+                    try:
+                        self._by_url[url].stop()
+                    finally:
+                        self._by_url.pop(url, None)
+                        self._ref_count.pop(url, None)

utils/video/tracker.py

@@ -0,0 +1,56 @@
+import os
+import numpy as np
+import boxmot
+from boxmot.tracker_zoo import create_tracker
+
+def _find_tracker_config(tracker_type: str) -> str:
+    env_path = os.environ.get("BOXMOT_CFG", "")
+    if env_path and os.path.exists(env_path):
+        return env_path
+    
+    try:
+        bm_dir = os.path.dirname(boxmot.__file__)
+        candidates = [
+            os.path.join(bm_dir, "configs", "trackers", f"{tracker_type}.yaml"),
+            os.path.join(bm_dir, "trackers", "configs", f"{tracker_type}.yaml"),
+            os.path.join(bm_dir, "configs", f"{tracker_type}.yaml")
+        ]
+
+        for p in candidates:
+            if os.path.exists(p):
+                return p
+    except Exception:
+        pass
+    return ""
+
+class MOTTracker:
+    def __init__(self, tracker_type: str = "bytetrack", device: str = "cpu"):
+        cfg_path = _find_tracker_config(tracker_type)
+        if not cfg_path:
+            raise RuntimeError(
+                f"Could not locate config for '{tracker_type}'. "
+                f"Set BOXMOT_CFG to the YAML path or ensure boxmot is installed correctly."
+            )
+        
+        self.tracker = create_tracker(
+            tracker_type = tracker_type,
+            tracker_config = cfg_path,
+            reid_weights = None,
+            device = device,
+            half = False
+        )
+    
+    def update(self, dets_xyxy_conf_cls, frame):
+        """ ensure each tracker is new """
+        if dets_xyxy_conf_cls is None or len(dets_xyxy_conf_cls) == 0:
+            dets_xyxy_conf_cls = np.empty((0, 6), dtype = "float32")
+        
+        tracks = self.tracker.update(dets_xyxy_conf_cls.astype("float32"), frame)
+        
+        out = []
+        if tracks.shape[0] > 0:
+            for row in tracks:
+                x1, y1, x2, y2, tid, conf, cls = map(float, row[:7])
+                out.append({"id": int(tid), "box": [x1, y1, x2, y2], "conf": conf, "cls": int(cls)})
+        return out
+