app.py

# app.py — Video Editor API (v0.5.9) good 2 multi  rectangle
# v0.5.9:
# - Centrages "Aller à #" / "Frame #" 100% fiables (attend rendu + image chargée)
# - /mask, /mask/rename, /mask/delete : Body(...) explicite => plus de 422 silencieux
# - Bouton "Enregistrer masque" : erreurs visibles (alert) si l’API ne répond pas OK
from fastapi import FastAPI, UploadFile, File, HTTPException, Request, Body, Response
from fastapi.responses import HTMLResponse, FileResponse, RedirectResponse
from fastapi.staticfiles import StaticFiles
from pathlib import Path
from typing import Optional, Dict, Any
import uuid
import shutil
import cv2
import json
import time
import urllib.parse
import sys
import threading
# <<<< HUGINFACE PATCH: WARMUP IMPORTS START >>>>
from typing import List
from huggingface_hub import snapshot_download
from copy import deepcopy

# <<<< HUGINFACE PATCH: WARMUP IMPORTS END >>>>
import subprocess

import shutil as _shutil
# --- POINTEUR DE BACKEND (lit l'URL actuelle depuis une source externe) ------
import os
import httpx

print("[BOOT] Video Editor API starting…")
POINTER_URL = os.getenv("BACKEND_POINTER_URL", "").strip()
FALLBACK_BASE = os.getenv("BACKEND_BASE_URL", "http://127.0.0.1:8765").strip()
print(f"[BOOT] POINTER_URL={POINTER_URL or '(unset)'}")
print(f"[BOOT] FALLBACK_BASE={FALLBACK_BASE}")
_backend_url_cache = {"url": None, "ts": 0.0}

# <<< IMPORTANT : créer l'app AVANT tout décorateur @app.* >>>
app = FastAPI(title="Video Editor API", version="0.5.9")

# --- Instance ID (utile si plusieurs répliques derrière un proxy) -------------
INSTANCE_ID = os.getenv("INSTANCE_ID", uuid.uuid4().hex[:6])

@app.middleware("http")
async def inject_instance_id_header(request: Request, call_next):
    resp = await call_next(request)
    try:
        resp.headers["x-instance-id"] = INSTANCE_ID
    except Exception:
        pass
    return resp
# ------------------------------------------------------------------------------

def get_backend_base() -> str:
    try:
        if POINTER_URL:
            now = time.time()
            need_refresh = (not _backend_url_cache["url"] or now - _backend_url_cache["ts"] > 30)
            if need_refresh:
                r = httpx.get(POINTER_URL, timeout=5, follow_redirects=True)
                url = (r.text or "").strip()
                if url.startswith("http"):
                    _backend_url_cache["url"] = url
                    _backend_url_cache["ts"] = now
                else:
                    return FALLBACK_BASE
            return _backend_url_cache["url"] or FALLBACK_BASE
        return FALLBACK_BASE
    except Exception:
        return FALLBACK_BASE

DATA_DIR = Path("/app/data")
THUMB_DIR = DATA_DIR / "_thumbs"
MASK_DIR = DATA_DIR / "_masks"
for p in (DATA_DIR, THUMB_DIR, MASK_DIR):
    p.mkdir(parents=True, exist_ok=True)

app.mount("/data", StaticFiles(directory=str(DATA_DIR)), name="data")
app.mount("/thumbs", StaticFiles(directory=str(THUMB_DIR)), name="thumbs")


# --- PROXY VERS LE BACKEND (pas de CORS côté navigateur) --------------------
@app.api_route("/p/{full_path:path}", methods=["GET","POST","PUT","PATCH","DELETE","OPTIONS"])
async def proxy_all(full_path: str, request: Request):
    base = get_backend_base().rstrip("/")
    target = f"{base}/{full_path}"
    qs = request.url.query
    if qs:
        target = f"{target}?{qs}"
    body = await request.body()
    headers = dict(request.headers)
    headers.pop("host", None)
    async with httpx.AsyncClient(follow_redirects=True, timeout=60) as client:
        r = await client.request(request.method, target, headers=headers, content=body)
    drop = {"content-encoding","transfer-encoding","connection",
            "keep-alive","proxy-authenticate","proxy-authorization",
            "te","trailers","upgrade"}
    out_headers = {k:v for k,v in r.headers.items() if k.lower() not in drop}
    return Response(content=r.content, status_code=r.status_code, headers=out_headers)
# -------------------------------------------------------------------------------
# Global progress dict (vid_stem -> {percent, logs, done})
progress_data: Dict[str, Dict[str, Any]] = {}
# <<<< HUGINFACE PATCH: WARMUP STATE+HELPERS START >>>>
# État global du warm-up (progression, logs, etc.)
warmup_state: Dict[str, Any] = {
    "running": False,
    "percent": 0,
    "logs": [],
    "ok_count": 0,
    "done": False,
    "current": None,
    "total": 0,
    "idx": 0,
    "job_id": "default",
    # NOUVEAUX CHAMPS POUR RÉCAP
    "asked": [],           # liste demandée au lancement
    "ok_repos": [],        # liste des repos téléchargés OK
    "cache_repos": [],     # liste des repos ignorés car déjà en cache
    "downloaded_repos": [],# liste des repos réellement téléchargés pendant ce run
    "failed_repos": [],    # liste des repos en échec
    "started_at": 0.0,     # timestamp début
    "finished_at": 0.0,    # timestamp fin
}

warmup_lock = threading.Lock()
warmup_stop = threading.Event()
# --- Shim anti-avertissement Pylance (défini si absent) ----------------------
if "_hf_cache_dir" not in globals():
    def _hf_cache_dir() -> str:
        return os.path.expanduser(os.getenv("HF_HOME", "/home/user/.cache/huggingface"))

if "_is_repo_cached" not in globals():
    def _is_repo_cached(repo_id: str) -> bool:
        local_dir = os.path.join(_hf_cache_dir(), "models", repo_id.replace("/", "__"))
        try:
            return os.path.isdir(local_dir) and any(os.scandir(local_dir))
        except FileNotFoundError:
            return False
# ---------------------------------------------------------------------------

def _default_model_list() -> List[str]:
    """
    Liste par défaut lue depuis l'env WARMUP_MODELS (JSON array) sinon vide.
    Exemple env:
      WARMUP_MODELS=["runwayml/stable-diffusion-v1-5","facebook/sam2-hiera-base"]
    """
    env = (os.getenv("WARMUP_MODELS") or "").strip()
    if env:
        try:
            lst = json.loads(env)
            if isinstance(lst, list):
                # correction douce de typos connues
                fixups = {"stabilityai/sd-vae-ft-ms": "stabilityai/sd-vae-ft-mse"}
                cleaned = [fixups.get(str(x).strip(), str(x).strip()) for x in lst if str(x).strip()]
                return cleaned



        except Exception:
            pass
    return []

def _log_warmup(msg: str):
    # >>> ICONES LOGS (ajout) <<<
    if msg.startswith("[CACHE]"):
        msg = "⬛ " + msg   # ignoré: déjà en cache
    elif msg.startswith("[START]"):
        msg = "⏳ " + msg   # démarrage d'un dépôt
    elif msg.startswith("[DONE]"):
        msg = "✅ " + msg   # téléchargement OK
    elif msg.startswith("[FAIL]"):
        msg = "❌ " + msg   # échec
    elif msg.startswith("[STOP]"):
        msg = "⏹️ " + msg   # arrêt demandé

    print(f"[WARMUP] {msg}", file=sys.stdout)

    with warmup_lock:
        warmup_state["logs"].append(msg)
        if len(warmup_state["logs"]) > 400:
            warmup_state["logs"] = warmup_state["logs"][-400:]

def _dir_size_bytes(path: str) -> int:
    try:
        total = 0
        for root, _, files in os.walk(path):
            for f in files:
                try:
                    total += os.path.getsize(os.path.join(root, f))
                except Exception:
                    pass
        return total
    except Exception:
        return 0

def _download_one(repo_id: str, tries: int = 3) -> str:
    """
    Renvoie un statut précis :
      - "cache"   : déjà présent localement, rien à faire
      - "ok"      : téléchargé avec succès
      - "fail"    : échec après toutes les tentatives
      - "stopped" : arrêt demandé pendant le run
    """
    cache_home = os.path.expanduser(os.getenv("HF_HOME", "/home/user/.cache/huggingface"))
    local_dir = os.path.join(cache_home, "models", repo_id.replace("/", "__"))

    # 1) Déjà en cache ?
    try:
        if _is_repo_cached(repo_id):
            sz = _dir_size_bytes(local_dir)
            _log_warmup(f"[CACHE] {repo_id} • {local_dir} • {sz/1e6:.1f} MB (skip)")
            return "cache"
    except Exception:
        pass

    # 2) Tentatives de téléchargement
    for attempt in range(1, tries + 1):
        if warmup_stop.is_set():
            _log_warmup(f"[STOP] Abandon demandé avant téléchargement de {repo_id}")
            return "stopped"

        t0 = time.time()
        _log_warmup(f"[START] {repo_id} • tentative {attempt}/{tries} • {local_dir}")
        try:
            snapshot_download(
                repo_id,
                local_dir=local_dir,
                local_dir_use_symlinks=False,
                resume_download=True,
            )
            dt = time.time() - t0
            sz = _dir_size_bytes(local_dir)
            _log_warmup(f"[DONE]  {repo_id} • {dt:.1f}s • {sz/1e6:.1f} MB")
            return "ok"
        except Exception as e:
            dt = time.time() - t0
            _log_warmup(f"[FAIL]  {repo_id} • {dt:.1f}s • {type(e).__name__}: {e}")
            time.sleep(min(10, 2 * attempt))
    return "fail"


def _warmup_thread(models: List[str]):
    ok_count = 0
    t_global = time.time()
    _log_warmup(f"[JOB] start • {len(models)} dépôts")

    for i, repo in enumerate(models):
        if warmup_stop.is_set():
            _log_warmup("[STOP] Arrêt demandé — fin du job après ce point")
            break

        with warmup_lock:
            warmup_state["idx"] = i
            warmup_state["current"] = repo
            warmup_state["percent"] = int((i / max(1, len(models))) * 100)

        res = _download_one(repo)

        with warmup_lock:
            if res == "ok":
                ok_count += 1
                warmup_state["ok_count"] = ok_count
                warmup_state.setdefault("downloaded_repos", []).append(repo)
            elif res == "cache":
                warmup_state.setdefault("cache_repos", []).append(repo)
            elif res == "fail":
                warmup_state.setdefault("failed_repos", []).append(repo)
            elif res == "stopped":
                _log_warmup("[STOP] Fin anticipée — demande reçue pendant le run")
                warmup_state["percent"] = int(((i + 1) / max(1, len(models))) * 100)
                break

            warmup_state["percent"] = int(((i + 1) / max(1, len(models))) * 100)

        if warmup_stop.is_set():
            _log_warmup("[STOP] Fin anticipée — demande reçue pendant le run")
            break

    with warmup_lock:
        warmup_state["percent"] = 100
        warmup_state["done"] = True
        warmup_state["running"] = False
        warmup_state["ok_count"] = ok_count
        warmup_state["finished_at"] = time.time()

    _log_warmup(f"[JOB] done • {ok_count}/{len(models)} • {time.time()-t_global:.1f}s")

# <<<< HUGINFACE PATCH: WARMUP STATE+HELPERS END >>>>
# ---------- Helpers ----------

def _is_video(p: Path) -> bool:
    return p.suffix.lower() in {".mp4", ".mov", ".mkv", ".webm"}

def _safe_name(name: str) -> str:
    return Path(name).name.replace(" ", "_")

def _has_ffmpeg() -> bool:
    return _shutil.which("ffmpeg") is not None

def _ffmpeg_scale_filter(max_w: int = 320) -> str:
    return f"scale=min(iw\\,{max_w}):-2"

def _meta(video: Path):
    cap = cv2.VideoCapture(str(video))
    if not cap.isOpened():
        print(f"[META] OpenCV cannot open: {video}", file=sys.stdout)
        return None
    frames = int(cap.get(cv2.CAP_PROP_FRAME_COUNT) or 0)
    fps = float(cap.get(cv2.CAP_PROP_FPS) or 0.0) or 30.0
    w = int(cap.get(cv2.CAP_PROP_FRAME_WIDTH) or 0)
    h = int(cap.get(cv2.CAP_PROP_FRAME_HEIGHT) or 0)
    cap.release()
    print(f"[META] {video.name} -> frames={frames}, fps={fps:.3f}, size={w}x{h}", file=sys.stdout)
    return {"frames": frames, "fps": fps, "w": w, "h": h}

def _frame_jpg(video: Path, idx: int) -> Path:
    out = THUMB_DIR / f"f_{video.stem}_{idx}.jpg"
    if out.exists():
        return out
    if _has_ffmpeg():
        m = _meta(video) or {"fps": 30.0}
        fps = float(m.get("fps") or 30.0) or 30.0
        t = max(0.0, float(idx) / fps)
        cmd = [
            "ffmpeg", "-hide_banner", "-loglevel", "error", "-y",
            "-ss", f"{t:.6f}",
            "-i", str(video),
            "-frames:v", "1",
            "-vf", _ffmpeg_scale_filter(320),
            "-q:v", "8",
            str(out)
        ]
        try:
            subprocess.run(cmd, check=True)
            return out
        except subprocess.CalledProcessError as e:
            print(f"[FRAME:FFMPEG] seek fail t={t:.4f} idx={idx}: {e}", file=sys.stdout)
    cap = cv2.VideoCapture(str(video))
    if not cap.isOpened():
        print(f"[FRAME] Cannot open video for frames: {video}", file=sys.stdout)
        raise HTTPException(500, "OpenCV ne peut pas ouvrir la vidéo.")
    total = int(cap.get(cv2.CAP_PROP_FRAME_COUNT) or 0)
    if total <= 0:
        cap.release()
        print(f"[FRAME] Frame count invalid for: {video}", file=sys.stdout)
        raise HTTPException(500, "Frame count invalide.")
    idx = max(0, min(idx, total - 1))
    cap.set(cv2.CAP_PROP_POS_FRAMES, idx)
    ok, img = cap.read()
    cap.release()
    if not ok or img is None:
        print(f"[FRAME] Cannot read idx={idx} for: {video}", file=sys.stdout)
        raise HTTPException(500, "Impossible de lire la frame demandée.")
    h, w = img.shape[:2]
    if w > 320:
        new_w = 320
        new_h = int(h * (320.0 / w)) or 1
        img = cv2.resize(img, (new_w, new_h), interpolation=getattr(cv2, 'INTER_AREA', cv2.INTER_LINEAR))
    cv2.imwrite(str(out), img, [int(cv2.IMWRITE_JPEG_QUALITY), 80])
    return out

def _poster(video: Path) -> Path:
    out = THUMB_DIR / f"poster_{video.stem}.jpg"
    if out.exists():
        return out
    try:
        cap = cv2.VideoCapture(str(video))
        cap.set(cv2.CAP_PROP_POS_FRAMES, 0)
        ok, img = cap.read()
        cap.release()
        if ok and img is not None:
            cv2.imwrite(str(out), img)
    except Exception as e:
        print(f"[POSTER] Failed: {e}", file=sys.stdout)
    return out

def _mask_file(vid: str) -> Path:
    return MASK_DIR / f"{Path(vid).name}.json"

def _load_masks(vid: str) -> Dict[str, Any]:
    f = _mask_file(vid)
    if f.exists():
        try:
            return json.loads(f.read_text(encoding="utf-8"))
        except Exception as e:
            print(f"[MASK] Read fail {vid}: {e}", file=sys.stdout)
    return {"video": vid, "masks": []}

def _save_masks(vid: str, data: Dict[str, Any]):
    _mask_file(vid).write_text(json.dumps(data, ensure_ascii=False, indent=2), encoding="utf-8")

def _gen_thumbs_background(video: Path, vid_stem: str):
    progress_data[vid_stem] = {'percent': 0, 'logs': [], 'done': False}
    try:
        m = _meta(video)
        if not m:
            progress_data[vid_stem]['logs'].append("Erreur métadonnées")
            progress_data[vid_stem]['done'] = True
            return
        total_frames = int(m["frames"] or 0)
        if total_frames <= 0:
            progress_data[vid_stem]['logs'].append("Aucune frame détectée")
            progress_data[vid_stem]['done'] = True
            return
        for f in THUMB_DIR.glob(f"f_{video.stem}_*.jpg"):
            f.unlink(missing_ok=True)
        if _has_ffmpeg():
            out_tpl = str(THUMB_DIR / f"f_{video.stem}_%d.jpg")
            cmd = [
                "ffmpeg", "-hide_banner", "-loglevel", "error", "-y",
                "-i", str(video),
                "-vf", _ffmpeg_scale_filter(320),
                "-q:v", "8",
                "-start_number", "0",
                out_tpl
            ]
            progress_data[vid_stem]['logs'].append("FFmpeg: génération en cours…")
            proc = subprocess.Popen(cmd)
            last_report = -1
            while proc.poll() is None:
                generated = len(list(THUMB_DIR.glob(f"f_{video.stem}_*.jpg")))
                percent = int(min(99, (generated / max(1, total_frames)) * 100))
                progress_data[vid_stem]['percent'] = percent
                if generated != last_report and generated % 50 == 0:
                    progress_data[vid_stem]['logs'].append(f"Gen {generated}/{total_frames}")
                    last_report = generated
                time.sleep(0.4)
            proc.wait()
            generated = len(list(THUMB_DIR.glob(f"f_{video.stem}_*.jpg")))
            progress_data[vid_stem]['percent'] = 100
            progress_data[vid_stem]['logs'].append("OK FFmpeg: {}/{} thumbs".format(generated, total_frames))
            progress_data[vid_stem]['done'] = True
            print(f"[PRE-GEN:FFMPEG] {generated} thumbs for {video.name}", file=sys.stdout)
        else:
            progress_data[vid_stem]['logs'].append("OpenCV (FFmpeg non dispo) : génération…")
            cap = cv2.VideoCapture(str(video))
            if not cap.isOpened():
                progress_data[vid_stem]['logs'].append("OpenCV ne peut pas ouvrir la vidéo.")
                progress_data[vid_stem]['done'] = True
                return
            idx = 0
            last_report = -1
            while True:
                ok, img = cap.read()
                if not ok or img is None:
                    break
                out = THUMB_DIR / f"f_{video.stem}_{idx}.jpg"
                h, w = img.shape[:2]
                if w > 320:
                    new_w = 320
                    new_h = int(h * (320.0 / w)) or 1
                    img = cv2.resize(img, (new_w, new_h), interpolation=getattr(cv2, 'INTER_AREA', cv2.INTER_LINEAR))
                cv2.imwrite(str(out), img, [int(cv2.IMWRITE_JPEG_QUALITY), 80])
                idx += 1
                if idx % 50 == 0:
                    progress_data[vid_stem]['percent'] = int(min(99, (idx / max(1, total_frames)) * 100))
                    if idx != last_report:
                        progress_data[vid_stem]['logs'].append(f"Gen {idx}/{total_frames}")
                        last_report = idx
            cap.release()
            progress_data[vid_stem]['percent'] = 100
            progress_data[vid_stem]['logs'].append(f"OK OpenCV: {idx}/{total_frames} thumbs")
            progress_data[vid_stem]['done'] = True
            print(f"[PRE-GEN:CV2] {idx} thumbs for {video.name}", file=sys.stdout)
    except Exception as e:
        progress_data[vid_stem]['logs'].append(f"Erreur: {e}")
        progress_data[vid_stem]['done'] = True

# ---------- API ----------
@app.get("/", tags=["meta"])
def root():
    return {
        "ok": True,
                                "routes": ["/", "/health", "/files", "/upload", "/meta/{vid}", "/frame_idx", "/poster/{vid}", "/window/{vid}",
                   "/mask", "/mask/{vid}", "/mask/rename", "/mask/delete", "/progress/{vid_stem}", "/ui",
                   "/warmup/start", "/warmup/status", "/warmup/stop", "/warmup/audit", "/warmup/catalog"]

    }

@app.get("/health", tags=["meta"])
def health():
    return {"status": "ok"}

@app.get("/_env", tags=["meta"])
def env_info():
    return {"pointer_set": bool(POINTER_URL), "resolved_base": get_backend_base()}

@app.get("/files", tags=["io"])
def files():
    items = [p.name for p in sorted(DATA_DIR.glob("*")) if _is_video(p)]
    return {"count": len(items), "items": items}

@app.get("/meta/{vid}", tags=["io"])
def video_meta(vid: str):
    v = DATA_DIR / vid
    if not v.exists():
        raise HTTPException(404, "Vidéo introuvable")
    m = _meta(v)
    if not m:
        raise HTTPException(500, "Métadonnées indisponibles")
    return m

@app.post("/upload", tags=["io"])
async def upload(request: Request, file: UploadFile = File(...), redirect: Optional[bool] = True):
    # Sécuriser le nom de fichier (UploadFile.filename peut être None)
    fname = file.filename or "upload.mp4"
    base = _safe_name(fname)
    ext = (Path(base).suffix or ".mp4").lower()

    if ext not in {".mp4", ".mov", ".mkv", ".webm"}:
        raise HTTPException(400, "Formats acceptés : mp4/mov/mkv/webm")

    dst = DATA_DIR / base
    if dst.exists():
        dst = DATA_DIR / f"{Path(base).stem}__{uuid.uuid4().hex[:8]}{ext}"

    with dst.open("wb") as f:
        shutil.copyfileobj(file.file, f)

    print(f"[UPLOAD] Saved {dst.name} ({dst.stat().st_size} bytes)", file=sys.stdout)

    _poster(dst)
    stem = dst.stem
    threading.Thread(target=_gen_thumbs_background, args=(dst, stem), daemon=True).start()

    accept = (request.headers.get("accept") or "").lower()
    if redirect or "text/html" in accept:
        msg = urllib.parse.quote(f"Vidéo importée : {dst.name}. Génération thumbs en cours…")
        return RedirectResponse(url=f"/ui?v={urllib.parse.quote(dst.name)}&msg={msg}", status_code=303)

    return {"name": dst.name, "size_bytes": dst.stat().st_size, "gen_started": True}


@app.get("/progress/{vid_stem}", tags=["io"])
def progress(vid_stem: str):
    return progress_data.get(vid_stem, {'percent': 0, 'logs': [], 'done': False})



@app.delete("/delete/{vid}", tags=["io"])
def delete_video(vid: str):
    v = DATA_DIR / vid
    if not v.exists():
        raise HTTPException(404, "Vidéo introuvable")
    (THUMB_DIR / f"poster_{v.stem}.jpg").unlink(missing_ok=True)
    for f in THUMB_DIR.glob(f"f_{v.stem}_*.jpg"):
        f.unlink(missing_ok=True)
    _mask_file(vid).unlink(missing_ok=True)
    v.unlink(missing_ok=True)
    print(f"[DELETE] {vid}", file=sys.stdout)
    return {"deleted": vid}

@app.get("/frame_idx", tags=["io"])
def frame_idx(vid: str, idx: int):
    v = DATA_DIR / vid
    if not v.exists():
        raise HTTPException(404, "Vidéo introuvable")
    try:
        out = _frame_jpg(v, int(idx))
        print(f"[FRAME] OK {vid} idx={idx}", file=sys.stdout)
        return FileResponse(str(out), media_type="image/jpeg")
    except HTTPException as he:
        print(f"[FRAME] FAIL {vid} idx={idx}: {he.detail}", file=sys.stdout)
        raise
    except Exception as e:
        print(f"[FRAME] FAIL {vid} idx={idx}: {e}", file=sys.stdout)
        raise HTTPException(500, "Frame error")

@app.get("/poster/{vid}", tags=["io"])
def poster(vid: str):
    v = DATA_DIR / vid
    if not v.exists():
        raise HTTPException(404, "Vidéo introuvable")
    p = _poster(v)
    if p.exists():
        return FileResponse(str(p), media_type="image/jpeg")
    raise HTTPException(404, "Poster introuvable")

# Remove redundant import and ensure imports are at the top of the file
@app.post("/warmup/start", tags=["warmup"])
async def warmup_start(payload: Optional[Dict[str, Any]] = Body(None)):
    """
    Démarre le téléchargement séquentiel des modèles.
    Corps JSON optionnel: { "models": ["repo1","repo2", ...] }
    Si vide: lit la variable d'env WARMUP_MODELS (JSON).
    """
    # Nettoie un éventuel stop précédent pour permettre un nouveau run
    warmup_stop.clear()

    # 1) Prendre la liste fournie si présente
    if payload and isinstance(payload, dict):
        models = [str(x).strip() for x in (payload.get("models") or []) if str(x).strip()]
    else:
        models = []

    # 2) Sinon charger la liste par défaut (depuis WARMUP_MODELS)
    if not models:
        models = _default_model_list()

    # 3) Normaliser (fix typos) + dédoublonner
    fixups = {"stabilityai/sd-vae-ft-ms": "stabilityai/sd-vae-ft-mse"}
    models = [fixups.get(m, m) for m in models]
    seen = set()
    models = [m for m in models if not (m in seen or seen.add(m))]

    # 4) Encore vide ? -> 400
    if not models:
        raise HTTPException(400, "Aucun modèle fourni (payload.models) et WARMUP_MODELS vide")

    # 5) Lancer le job
    with warmup_lock:
        if warmup_state.get("running"):
            return {"ok": False, "already_running": True, "status": deepcopy(warmup_state)}
        # RESET d’un nouveau job
        job_id = uuid.uuid4().hex[:8]
        warmup_state.update({
            "job_id": job_id,
            "asked": models[:],
            "ok_repos": [],
            "cache_repos": [],
            "downloaded_repos": [],
            "failed_repos": [],
            "ok_count": 0,
            "logs": [],
            "idx": 0,
            "total": len(models),
            "percent": 0,
            "running": True,
            "done": False,
            "current": None,
            "started_at": time.time(),
            "finished_at": 0.0,
        })
        th = threading.Thread(target=_warmup_thread, args=(models,), daemon=True)
        th.start()

    return {"ok": True, "started": True, "total": len(models), "job_id": job_id}

@app.get("/warmup/status", tags=["warmup"])
def warmup_status():
    """Retourne l'état courant du warm-up (progression, logs, etc.)."""
    # On copie l'état sous verrou pour éviter les lectures concurrentes
    with warmup_lock:
        data = deepcopy(warmup_state)
        data["instance_id"] = INSTANCE_ID  # aide au diagnostic multi-répliques

    # Infos d’audit du cache (hors verrou)
    cached = _list_cached_repos()
    data["audit_count"] = len(cached)
    data["audit_cached"] = cached

    data["ts"] = time.time()
    return data

@app.post("/warmup/stop", tags=["warmup"])
def warmup_stop_api():
    """Demande l'arrêt propre (on termine le modèle en cours puis on stoppe)."""
    with warmup_lock:
        running = bool(warmup_state.get("running"))
    if running:
        warmup_stop.set()
        _log_warmup("[STOP] Demande d'arrêt reçue — arrêt après le dépôt en cours")
        return {"ok": True, "was_running": True}
    return {"ok": True, "was_running": False}

# >>> B1_END warmup_routes


# >>> B2_BEGIN warmup_audit
def _hf_cache_dir() -> str:
    return os.path.expanduser(os.getenv("HF_HOME", "/home/user/.cache/huggingface"))

def _is_repo_cached(repo_id: str) -> bool:
    local_dir = os.path.join(_hf_cache_dir(), "models", repo_id.replace("/", "__"))
    try:
        return os.path.isdir(local_dir) and any(os.scandir(local_dir))
    except FileNotFoundError:
        return False

def _list_cached_repos() -> List[str]:
    base = os.path.join(_hf_cache_dir(), "models")
    out: List[str] = []
    try:
        for e in os.scandir(base):
            if e.is_dir():
                out.append(e.name.replace("__", "/"))
    except FileNotFoundError:
        pass
    return sorted(out)

@app.get("/warmup/audit", tags=["warmup"])
def warmup_audit():
    """
    Retourne l'état du cache HF côté serveur.
    - cached: tous les repos détectés localement
    - present_default / missing_default: croisement avec WARMUP_MODELS (si défini)
    """
    cached = _list_cached_repos()
    defaults = _default_model_list()
    present_default = [r for r in defaults if r in cached]
    missing_default = [r for r in defaults if r not in cached]
    return {
        "count": len(cached),
        "cached": cached,
        "present_default": present_default,
        "missing_default": missing_default,
    }
@app.get("/warmup/catalog", tags=["warmup"])
def warmup_catalog():
    try:
        env = (os.getenv("WARMUP_MODELS") or "").strip()
        base = []
        if env:
            try:
                lst = json.loads(env)
                if isinstance(lst, list) and lst:
                    base = [str(x).strip() for x in lst if str(x).strip()]
            except Exception:
                base = []
    except Exception:
        base = []

    if not base:
        base = [
            "runwayml/stable-diffusion-v1-5",
            "facebook/sam-vit-base",
            "stabilityai/sd-vae-ft-mse",
            "lixiaowen/diffuEraser",
            "facebook/sam2-hiera-base",
        ]
    # Correction douce de typos connues (catalog)
    fixups = {"stabilityai/sd-vae-ft-ms": "stabilityai/sd-vae-ft-mse"}
    base = [fixups.get(m, m) for m in base]

    seen = set()
    out = [m for m in base if not (m in seen or seen.add(m))]
    return {"count": len(out), "models": out}


# >>> A1_BEGIN window_fix
@app.get("/window/{vid}", tags=["io"])
def window(vid: str, center: int = 0, count: int = 21):
    v = DATA_DIR / vid
    if not v.exists():
        raise HTTPException(404, "Vidéo introuvable")

    m = _meta(v)
    if not m:
        raise HTTPException(500, "Métadonnées indisponibles")

    frames = int(m.get("frames") or 0)
    count = max(3, int(count))
    center = max(0, min(int(center), max(0, frames - 1)))

    if frames <= 0:
        print(f"[WINDOW] frames=0 for {vid}", file=sys.stdout)
        return {
            "vid": vid,
            "start": 0,
            "count": 0,
            "selected": 0,
            "items": [],
            "frames": 0,
        }

    if frames <= count:
        start = 0
        sel = center
        n = frames
    else:
        start = max(0, min(center - (count // 2), frames - count))
        n = count
        sel = center - start

    items = []
    bust = int(time.time() * 1000)
    for i in range(n):
        idx = start + i
        url = f"/thumbs/f_{v.stem}_{idx}.jpg?b={bust}"
        items.append({"i": i, "idx": idx, "url": url})

    print(f"[WINDOW] {vid} start={start} n={n} sel={sel} frames={frames}", file=sys.stdout)
    return {
        "vid": vid,
        "start": start,
        "count": n,
        "selected": sel,
        "items": items,
        "frames": frames,
    }
# >>> A1_END window_fix

# ----- Masques -----

@app.post("/mask", tags=["mask"])
async def save_mask(payload: Dict[str, Any] = Body(...)):
    vid = payload.get("vid")
    if not vid:
        raise HTTPException(400, "vid manquant")
    pts = payload.get("points") or []
    if len(pts) != 4:
        raise HTTPException(400, "points rect (x1,y1,x2,y2) requis")
    data = _load_masks(vid)
    m = {
        "id": uuid.uuid4().hex[:10],
        "time_s": float(payload.get("time_s") or 0.0),
        "frame_idx": int(payload.get("frame_idx") or 0),
        "shape": "rect",
        "points": [float(x) for x in pts],
        "color": payload.get("color") or "#10b981",
        "note": payload.get("note") or ""
    }
    data.setdefault("masks", []).append(m)
    _save_masks(vid, data)
    print(f"[MASK] save {vid} frame={m['frame_idx']} note={m['note']}", file=sys.stdout)
    return {"saved": True, "mask": m}

@app.get("/mask/{vid}", tags=["mask"])
def list_masks(vid: str):
    return _load_masks(vid)

@app.post("/mask/rename", tags=["mask"])
async def rename_mask(payload: Dict[str, Any] = Body(...)):
    vid = payload.get("vid")
    mid = payload.get("id")
    new_note = (payload.get("note") or "").strip()
    if not vid or not mid:
        raise HTTPException(400, "vid et id requis")
    data = _load_masks(vid)
    for m in data.get("masks", []):
        if m.get("id") == mid:
            m["note"] = new_note
            _save_masks(vid, data)
            return {"ok": True}
    raise HTTPException(404, "Masque introuvable")

@app.post("/mask/delete", tags=["mask"])
async def delete_mask(payload: Dict[str, Any] = Body(...)):
    vid = payload.get("vid")
    mid = payload.get("id")
    if not vid or not mid:
        raise HTTPException(400, "vid et id requis")
    data = _load_masks(vid)
    data["masks"] = [m for m in data.get("masks", []) if m.get("id") != mid]
    _save_masks(vid, data)
    return {"ok": True}

# ---------- UI (multi-rects par frame) ----------
HTML_TEMPLATE = r"""
<!doctype html>
<html lang="fr"><meta charset="utf-8">
<title>Video Editor</title>
<style>
 :root{--b:#e5e7eb;--muted:#64748b; --controlsH:44px; --active-bg:#dbeafe; --active-border:#2563eb;}
 *{box-sizing:border-box}
 body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial;margin:16px;color:#111}
 h1{margin:0 0 8px 0}
 .topbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
 .card{border:1px solid var(--b);border-radius:12px;padding:10px;background:#fff}
 .muted{color:var(--muted);font-size:13px}
 .layout{display:grid;grid-template-columns:1fr 320px;gap:14px;align-items:start}
 .viewer{max-width:1024px;margin:0 auto; position:relative}
 .player-wrap{position:relative; padding-bottom: var(--controlsH);}
 video{display:block;width:100%;height:auto;max-height:58vh;border-radius:10px;box-shadow:0 0 0 1px #ddd}
 #editCanvas{position:absolute;left:0;right:0;top:0;bottom:var(--controlsH);border-radius:10px;pointer-events:none}
 .timeline-container{margin-top:10px}
 .timeline{position:relative;display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;overflow-y:hidden;padding:6px;border:1px solid var(--b);border-radius:10px;-webkit-overflow-scrolling:touch;width:100%}
 .thumb{flex:0 0 auto;display:inline-block;position:relative;transition:transform 0.2s;text-align:center}
 .thumb:hover{transform:scale(1.05)}
 .thumb img{height:var(--thumbH,110px);display:block;border-radius:6px;cursor:pointer;border:2px solid transparent;object-fit:cover}
 .thumb img.sel{border-color:var(--active-border)}
 .thumb img.sel-strong{outline:3px solid var(--active-border);box-shadow:0 0 0 3px #fff,0 0 0 5px var(--active-border)}
 .thumb.hasmask::after{content:"★";position:absolute;right:6px;top:4px;color:#f5b700;text-shadow:0 0 3px rgba(0,0,0,0.35);font-size:16px}
 .thumb-label{font-size:11px;color:var(--muted);margin-top:2px;display:block}
 .timeline.filter-masked .thumb:not(.hasmask){display:none}
 .tools .row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
 .btn{padding:8px 12px;border-radius:8px;border:1px solid var(--b);background:#f8fafc;cursor:pointer;transition:background 0.2s, border 0.2s}
 .btn:hover{background:var(--active-bg);border-color:var(--active-border)}
 .btn.active,.btn.toggled{background:var(--active-bg);border-color:var(--active-border)}
 .swatch{width:20px;height:20px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #ccc;cursor:pointer;transition:box-shadow 0.2s}
 .swatch.sel{box-shadow:0 0 0 2px var(--active-border)}
 ul.clean{list-style:none;padding-left:0;margin:6px 0}
 ul.clean li{margin:2px 0;display:flex;align-items:center;gap:6px}
 .rename-btn{font-size:12px;padding:2px 4px;border:none;background:transparent;cursor:pointer;color:var(--muted);transition:color 0.2s}
 .rename-btn:hover{color:#2563eb}
 .delete-btn{color:#ef4444;font-size:14px;cursor:pointer;transition:color 0.2s}
 .delete-btn:hover{color:#b91c1c}
 #loading-indicator{display:none;margin-top:6px;color:#f59e0b}
 .portion-row{display:flex;gap:6px;align-items:center;margin-top:8px}
 .portion-input{width:70px}
 #tl-progress-bar{background:#f3f4f6;border-radius:4px;height:8px;margin-top:10px}
 #tl-progress-fill{background:#2563eb;height:100%;width:0;border-radius:4px}
 #popup {position:fixed;top:20%;left:50%;transform:translate(-50%, -50%);background:#fff;padding:20px;border-radius:8px;box-shadow:0 0 10px rgba(0,0,0,0.2);z-index:1000;display:none;min-width:320px}
 #popup-progress-bar{background:#f3f4f6;border-radius:4px;height:8px;margin:10px 0}
 #popup-progress-fill{background:#2563eb;height:100%;width:0;border-radius:4px}
 #popup-logs {max-height:200px;overflow:auto;font-size:12px;color:#6b7280}
 #hud{position:absolute;right:10px;top:10px;background:rgba(17,24,39,.6);color:#fff;font-size:12px;padding:4px 8px;border-radius:6px}
 #toast{position:fixed;right:12px;bottom:12px;display:flex;flex-direction:column;gap:8px;z-index:2000}
 .toast-item{background:#111827;color:#fff;padding:8px 12px;border-radius:8px;box-shadow:0 6px 16px rgba(0,0,0,.25);opacity:.95}
 #portionBand{position:absolute;top:0;height:calc(var(--thumbH,110px) + 24px);background:rgba(37,99,235,.12);pointer-events:none;display:none}
 #inHandle,#outHandle{position:absolute;top:0;height:calc(var(--thumbH,110px) + 24px);width:6px;background:rgba(37,99,235,.9);border-radius:2px;cursor:ew-resize;display:none;pointer-events:auto}
 .playhead{position:absolute;top:0;bottom:0;width:2px;background:var(--active-border);opacity:.9;pointer-events:none;display:block}
 .repo-list{max-height:320px; overflow:auto; border:1px solid var(--b); border-radius:8px; padding:6px}
 .repo-item{display:flex; align-items:center; gap:8px; padding:6px; border-bottom:1px solid #f3f4f6}
 .repo-item:last-child{border-bottom:none}
 .repo-id{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size:12px}
 /* Popups déplaçables : poignée = <h3> */
 #warmupPopup h3, #warmupSelectPopup h3 { cursor: move; user-select: none; }

</style>
<h1>🎬 Video Editor</h1>
<div class="topbar card">
 <form action="/upload?redirect=1" method="post" enctype="multipart/form-data" style="display:flex;gap:8px;align-items:center" id="uploadForm">
 <strong>Charger une vidéo :</strong>
 <input type="file" name="file" accept="video/*" required>
 <button class="btn" type="submit">Uploader</button>
 </form>
 <span class="muted" id="msg">__MSG__</span>






 <span class="muted">Liens : <a href="/docs" target="_blank">/docs</a> • <a href="/files" target="_blank">/files</a></span>

<!-- >>> A2B2_BEGIN warmup_topbar -->
<div style="display:flex;gap:8px;align-items:center">
    <button id="warmupStartBtn" class="btn" title="Télécharger les modèles (séquentiel)">🔥 Télécharger modèles</button>
  <button id="warmupStopBtn" class="btn" title="Arrêter le téléchargement en cours" style="display:none">⏹️ Stop téléchargement</button>
  <button id="warmupSelectBtn" class="btn" title="Sélectionner les repos à télécharger">🧩 Choisir modèles</button>
  <button id="warmupLogsBtn" class="btn" title="Voir les logs du téléchargement">📜 Logs téléchargement</button>
  <span id="warmupStatus" class="muted"></span>

</div>
<!-- >>> A2B2_END warmup_topbar -->


</div>
<div class="layout">
 <div>
  <div class="viewer card" id="viewerCard">
   <div class="player-wrap" id="playerWrap">
    <video id="player" controls playsinline poster="/poster/__VID__">
     <source id="vidsrc" src="/data/__VID__" type="video/mp4">
    </video>
    <canvas id="editCanvas"></canvas>
    <div id="hud"></div>
   </div>
   <div class="muted" style="margin-top:6px">
    <label>Frame # <input id="goFrame" type="number" min="1" value="1" style="width:90px"> </label>
    <label>à <input id="endPortion" class="portion-input" type="number" min="1" placeholder="Optionnel pour portion"></label>
    <button id="isolerBoucle" class="btn">Isoler & Boucle</button>
    <button id="resetFull" class="btn" style="display:none">Retour full</button>
    <span id="posInfo" style="margin-left:10px"></span>
    <span id="status" style="margin-left:10px;color:#2563eb"></span>
   </div>
  </div>
  <div class="card timeline-container">
   <h4 style="margin:2px 0 8px 0">Timeline</h4>
   <div class="row" id="tlControls" style="margin:4px 0 8px 0;gap:8px;align-items:center">
     <button id="btnFollow" class="btn" title="Centrer pendant la lecture (OFF par défaut)">🔭 Suivre</button>
     <button id="btnFilterMasked" class="btn" title="Afficher uniquement les frames avec masque">⭐ Masquées</button>
     <label class="muted">Zoom <input id="zoomSlider" type="range" min="80" max="180" value="110" step="10"></label>
     <label class="muted">Aller à # <input id="gotoInput" type="number" min="1" style="width:90px"></label>
     <button id="gotoBtn" class="btn">Aller</button>
     <span class="muted" id="maskedCount"></span>
   </div>
   <div id="timeline" class="timeline"></div>
   <div class="muted" id="tlNote" style="margin-top:6px;display:none">Mode secours: vignettes générées dans le navigateur.</div>
   <div id="loading-indicator">Chargement des frames...</div>
   <div id="tl-progress-bar"><div id="tl-progress-fill"></div></div>
  </div>
 </div>
 <div class="card tools">
  <div class="row"><span class="muted">Mode : <strong id="modeLabel">Lecture</strong></span></div>
  <div class="row" style="margin-top:6px">
   <button id="btnEdit" class="btn" title="Passer en mode édition pour dessiner un masque">✏️ Éditer cette image</button>
   <button id="btnBack" class="btn" style="display:none" title="Retour au mode lecture">🎬 Retour lecteur</button>
   <button id="btnSave" class="btn" style="display:none" title="Enregistrer tous les masques dessinés sur cette frame">💾 Enregistrer masque</button>
   <button id="btnClear" class="btn" style="display:none" title="Effacer le dernier rectangle de cette frame">🧽 Effacer sélection</button>
  </div>
  <div style="margin-top:10px">
   <div class="muted">Couleur</div>
   <div class="row" id="palette" style="margin-top:6px">
    <div class="swatch" data-c="#10b981" style="background:#10b981" title="Vert"></div>
    <div class="swatch" data-c="#2563eb" style="background:#2563eb" title="Bleu"></div>
    <div class="swatch" data-c="#ef4444" style="background:#ef4444" title="Rouge"></div>
    <div class="swatch" data-c="#f59e0b" style="background:#f59e0b" title="Orange"></div>
    <div class="swatch" data-c="#a21caf" style="background:#a21caf" title="Violet"></div>
   </div>
  </div>
  <div style="margin-top:12px">
   <details open>
    <summary><strong>Masques</strong></summary>
    <div id="maskList" class="muted">—</div>
    <button class="btn" style="margin-top:8px" id="exportBtn" title="Exporter la vidéo avec les masques appliqués (bientôt IA)">Exporter vidéo modifiée</button>
   </details>
   <div style="margin-top:6px">
    <strong>Vidéos disponibles</strong>
    <ul id="fileList" class="clean muted" style="max-height:180px;overflow:auto">Chargement…</ul>
   </div>
  </div>
 </div>
</div>
<div id="popup">
 <h3>Génération thumbs en cours</h3>
 <div id="popup-progress-bar"><div id="popup-progress-fill"></div></div>
 <div id="popup-logs"></div>
</div>

<!-- >>> A2B2_BEGIN warmup_popup -->
<div id="warmupPopup" style="display:none; position:fixed; top:22%; left:50%; transform:translate(-50%,-50%); background:#fff; padding:20px; border-radius:8px; box-shadow:0 0 10px rgba(0,0,0,0.2); z-index:1001; min-width:360px">
    <h3>Téléchargement des modèles (warm-up)</h3>

  <div class="muted" id="warmupPopupStatus">—</div>
  <div style="background:#f3f4f6;border-radius:4px;height:8px;margin:10px 0">
    <div id="warmup-progress-fill" style="background:#2563eb;height:100%;width:0;border-radius:4px"></div>
  </div>
  <div id="warmup-logs" style="max-height:220px; overflow:auto; font-size:12px; color:#6b7280; white-space:pre-wrap"></div>
  <div style="margin-top:10px; display:flex; gap:8px; justify-content:flex-end">
          <button id="warmupCopyBtn" class="btn" title="Copier le contenu">Copier</button>
    <button id="warmupCloseBtn" class="btn">Fermer</button>
  </div>
</div>
<div id="warmupSelectPopup" style="display:none; position:fixed; top:24%; left:50%; transform:translate(-50%,-50%); background:#fff; padding:20px; border-radius:8px; box-shadow:0 0 10px rgba(0,0,0,0.2); z-index:1001; min-width:420px; max-width:720px; width:90%">
  <h3>Sélection des modèles à préparer</h3>
  <div id="repoList" class="repo-list"></div>
  <div style="margin-top:12px; display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap">
          <button id="selectCopyBtn" class="btn" title="Copier la liste visible">Copier</button>
    <button id="selectAllBtn" class="btn">Tout cocher</button>
    <button id="selectNoneBtn" class="btn">Tout décocher</button>
    <button id="selectCancelBtn" class="btn">Annuler</button>
        <button id="launchSelectedBtn" class="btn">Lancer le téléchargement</button>

  </div>
</div>
<!-- >>> A2B2_END warmup_popup -->
<div id="toast"></div>
<script>
const serverVid = "__VID__";
const serverMsg = "__MSG__";
document.getElementById('msg').textContent = serverMsg;
// Après affichage du message, on retire ?msg=... de l'URL pour éviter qu'il persiste au refresh.
try {
  const u = new URL(location.href);
  if (u.searchParams.has('msg')) {
    u.searchParams.delete('msg');
    const q = u.searchParams.toString();
    history.replaceState({}, '', u.pathname + (q ? ('?' + q) : ''));
  }
} catch (_) {}


// Références DOM globales pour l’éditeur (nécessaires à tout le code en dessous)
const statusEl = document.getElementById('status');
const player = document.getElementById('player');
const srcEl = document.getElementById('vidsrc');
const canvas = document.getElementById('editCanvas');
const ctx = canvas.getContext('2d');
const modeLabel = document.getElementById('modeLabel');
const btnEdit = document.getElementById('btnEdit');
const btnBack = document.getElementById('btnBack');
const btnSave = document.getElementById('btnSave');
const btnClear = document.getElementById('btnClear');
const posInfo = document.getElementById('posInfo');
const goFrame = document.getElementById('goFrame');
const palette = document.getElementById('palette');
const fileList = document.getElementById('fileList');
const tlBox = document.getElementById('timeline');
const tlNote = document.getElementById('tlNote');
const playerWrap = document.getElementById('playerWrap');
const loadingInd = document.getElementById('loading-indicator');
const isolerBoucle = document.getElementById('isolerBoucle');
const resetFull = document.getElementById('resetFull');
const endPortion = document.getElementById('endPortion');
const popup = document.getElementById('popup');
const popupLogs = document.getElementById('popup-logs');
const tlProgressFill = document.getElementById('tl-progress-fill');
const popupProgressFill = document.getElementById('popup-progress-fill');
const btnFollow = document.getElementById('btnFollow');
const btnFilterMasked = document.getElementById('btnFilterMasked');
const zoomSlider = document.getElementById('zoomSlider');
const maskedCount = document.getElementById('maskedCount');
const hud = document.getElementById('hud');
const toastWrap = document.getElementById('toast');
const gotoInput = document.getElementById('gotoInput');


// >>> A2B2_BEGIN warmup_dom
// Références DOM (topbar + popup)
const warmupStartBtn   = document.getElementById('warmupStartBtn');
const warmupStopBtn    = document.getElementById('warmupStopBtn');
const warmupLogsBtn    = document.getElementById('warmupLogsBtn');
const warmupStatusEl   = document.getElementById('warmupStatus');

const warmupPopup        = document.getElementById('warmupPopup');
const warmupPopupStatus  = document.getElementById('warmupPopupStatus');
const warmupProgressFill = document.getElementById('warmup-progress-fill');
const warmupLogs         = document.getElementById('warmup-logs');
const warmupCopyBtn       = document.getElementById('warmupCopyBtn');
const warmupSelectCopyBtn = document.getElementById('warmupSelectCopyBtn');

// Mémorise la dernière instance vue pour détecter les bascules
window._lastInstanceId = null;
// Job courant (pour ignorer d’éventuelles réponses d’un ancien run)
let currentJobId = null;



const warmupCloseBtn     = document.getElementById('warmupCloseBtn');

// Helpers popup
function buildFinalSummary(s){
    const asked  = Array.isArray(s.asked) ? s.asked : [];
  const cacheL = Array.isArray(s.cache_repos) ? s.cache_repos : [];
  const dlL    = Array.isArray(s.downloaded_repos) ? s.downloaded_repos : [];
  const failL  = Array.isArray(s.failed_repos) ? s.failed_repos : [];

  const lines = [];
  lines.push(`Terminé — demandés: ${asked.length} • ⬛ cache: ${cacheL.length} • ✅ téléchargés: ${dlL.length} • ❌ échecs: ${failL.length}`);
  lines.push("");

  lines.push("Demandés : " + asked.length);
  if (asked.length) lines.push(asked.map(m=>' • '+m).join('\n'));

  lines.push("");
  lines.push(`⬛ Ignorés (déjà en cache) : ${cacheL.length}`);
  if (cacheL.length) lines.push(cacheL.map(m=>' • '+m).join('\n'));

  lines.push("");
  lines.push(`✅ Téléchargés : ${dlL.length}`);
  if (dlL.length) lines.push(dlL.map(m=>' • '+m).join('\n'));

  lines.push("");
  lines.push(`❌ Échecs : ${failL.length}`);
  if (failL.length) lines.push(failL.map(m=>' • '+m).join('\n'));

  return lines.join('\n');
}

// >>> C2_BEGIN warmup_preface
let warmupPreface = '';
// >>> C2_END warmup_preface

// >>> A2B2P3_BEGIN warmup_defaults
// Modèles par défaut si l’utilisateur laisse la saisie vide.
// (Liste “safe” validée chez toi ; on pourra l’étendre plus tard.)
const DEFAULT_MODELS = [
  "runwayml/stable-diffusion-v1-5",
  "facebook/sam-vit-base",
  "stabilityai/sd-vae-ft-mse"
];
// >>> A2B2P3_END warmup_defaults

function openWarmupPopup(){ if(warmupPopup) warmupPopup.style.display = 'block'; }

function closeWarmupPopup(){ if(warmupPopup) warmupPopup.style.display = 'none'; } 
let userClosedWarmupPopup = false;

if (warmupCloseBtn) warmupCloseBtn.addEventListener('click', closeWarmupPopup);
// -- DRAG & COPY (popups warmup) --
(function(){
  const $popup = document.getElementById('warmupPopup');
  const $sel   = document.getElementById('warmupSelectPopup');
  const $copy  = document.getElementById('warmupCopyBtn');
  const $copy2 = document.getElementById('selectCopyBtn');

  function makeDraggable(box){
    if (!box) return;
    let sx=0, sy=0, ox=0, oy=0, drag=false;
    box.addEventListener('mousedown', e=>{
      if (e.target.tagName === 'BUTTON' || e.target.closest('button')) return;
      drag=true; box.style.transform='none';
      ox = box.offsetLeft; oy = box.offsetTop; sx = e.clientX; sy = e.clientY;
      document.body.style.userSelect='none';
    });
    window.addEventListener('mousemove', e=>{
      if(!drag) return;
      box.style.left = (ox + (e.clientX - sx)) + 'px';
      box.style.top  = (oy + (e.clientY - sy)) + 'px';
    });
    window.addEventListener('mouseup', ()=>{ drag=false; document.body.style.userSelect=''; });
  }
  makeDraggable($popup);
  makeDraggable($sel);

  function copyText(txt){
    if (navigator.clipboard && navigator.clipboard.writeText){
      navigator.clipboard.writeText(txt||'').then(()=> (window.showToast?showToast('Copié ✅'):alert('Copié ✅')) );
    } else {
      const ta=document.createElement('textarea'); ta.value=txt||''; document.body.appendChild(ta); ta.select();
      try{ document.execCommand('copy'); (window.showToast?showToast('Copié ✅'):alert('Copié ✅')); }catch{}
      ta.remove();
    }
  }
  if ($copy){
    $copy.addEventListener('click', ()=>{
      const s = document.getElementById('warmupPopupStatus');
      const l = document.getElementById('warmup-logs');
      copyText((s?('[Status] '+s.textContent+'\n\n'):'') + (l?l.textContent:''));
    });
  }
  if ($copy2){
    $copy2.addEventListener('click', ()=>{
      const list = document.getElementById('repoList');
      copyText(list ? list.innerText : '');
    });
  }
})();

// Rafraîchissement d’état
let warmupTimer = null;
async function refreshWarmupUI(){
  try{
      const r = await fetch('/warmup/status');
    if(!r.ok) return;
    const s = await r.json();

    // Instance courante (multi-répliques)
    const instanceId = s.instance_id || 'n/a';
    if (window._lastInstanceId && window._lastInstanceId !== instanceId) {
      showToast(`Bascule d'instance détectée : ${window._lastInstanceId} → ${instanceId}`);
    }
    window._lastInstanceId = instanceId;

    const pct = Math.max(0, Math.min(100, parseInt(s.percent || 0, 10)));
    const running = !!s.running;

    if (warmupStopBtn) warmupStopBtn.style.display = running ? 'inline-block' : 'none';

    if (warmupStatusEl) {
      const tot = (s.total ?? 0);
      if (running) {
        const idx = (s.idx ?? 0) + 1;
        warmupStatusEl.textContent = `⏳ ${pct}% — ${s.current||''} (${idx}/${tot}) [inst:${instanceId}]`;
      } else if (s.done) {
        const cacheN = Array.isArray(s.cache_repos) ? s.cache_repos.length : 0;
        const dlN    = Array.isArray(s.downloaded_repos) ? s.downloaded_repos.length : 0;
        const failN  = Array.isArray(s.failed_repos) ? s.failed_repos.length : Math.max(0, tot - (s.ok_count||0));
        warmupStatusEl.textContent = `✅ Terminé — ⬛ ${cacheN} • ✅ ${dlN} • ❌ ${failN} / ${tot} [inst:${instanceId}]`;
        if (warmupPopupStatus) warmupPopupStatus.textContent = 'Terminé';
        if (warmupLogs) warmupLogs.textContent = buildFinalSummary(s);
      } else {
        const nCache = Number.isFinite(s.audit_count)
          ? s.audit_count
          : (Array.isArray(s.audit_cached) ? s.audit_cached.length : 0);
        warmupStatusEl.textContent = nCache > 0
          ? `✅ Prêt — cache local: ${nCache} [inst:${instanceId}]`
          : `Prêt (aucun run)`;
      }
    }

    if (warmupProgressFill) warmupProgressFill.style.width = pct + '%';
    if (warmupPopupStatus)  warmupPopupStatus.textContent = running ? 'Téléchargement en cours…' : 'Terminé';

    // Logs live dans la popup pendant l’exécution
    if (running && warmupLogs) {
      const logsTxt = Array.isArray(s.logs) ? s.logs.join('\n') : '';
      const asked = Array.isArray(s.asked)
        ? s.asked
        : (Array.isArray(window.lastRequestedModels) ? window.lastRequestedModels : []);
      const preface = (warmupPreface && warmupPreface.trim())
        ? warmupPreface
        : ('Demandés (' + asked.length + '):\n' + asked.map(m=>' • '+m).join('\n'));
      warmupLogs.textContent = preface + '\n\n' + (logsTxt || '— en cours…');
      warmupLogs.scrollTop = warmupLogs.scrollHeight;
    }

    // Gestion du polling + ouverture/fermeture popup
    if (running) {
      if (!userClosedWarmupPopup) openWarmupPopup();
      if (!warmupTimer) warmupTimer = setInterval(refreshWarmupUI, 1000);
    } else {
      if (warmupTimer) { clearInterval(warmupTimer); warmupTimer = null; }
      userClosedWarmupPopup = false;
    }

  }catch(e){ /* no-op */ }
}

// Boutons
if (warmupStartBtn){
  warmupStartBtn.addEventListener('click', async ()=>{




    // Saisie optionnelle — accepte virgules, espaces, retours à la ligne, points-virgules
    const txt = prompt(
      'Modèles (optionnel). Tu peux séparer par virgule, espace ou retour à la ligne.\n' +
      'Laisse vide pour utiliser la liste par défaut.',
      ''
    );

    let models;
    if (txt && txt.trim()){
      // Découpe souple + nettoyage + dédoublonnage
      const mods = txt.split(/[\s,;]+/).map(s=>s.trim()).filter(Boolean);
      if (!mods.length){ alert('Aucun modèle détecté.'); return; }
      models = Array.from(new Set(mods));
    } else {
      // Liste par défaut définie plus haut (P4.1)
      models = DEFAULT_MODELS;
    }

    // Mémorise la demande en cours pour l’affichage des logs
    window.lastRequestedModels = models;


    // Préface (audit du cache serveur, pour afficher le cumul)
    try {
      const ra = await fetch('/warmup/audit');
      const audit = ra.ok ? await ra.json() : null;
      const cached = (audit && Array.isArray(audit.cached)) ? audit.cached : [];
      warmupPreface =
        'Déjà en cache (' + cached.length + '):\n' +
        cached.map(m => ' • ' + m).join('\n') + '\n\n' +
        'Demandé dans cette exécution (' + models.length + '):\n' +
        models.map(m => ' • ' + m).join('\n');
    } catch(e) {
      warmupPreface = '';
    }
    // Ouvre la popup et affiche immédiatement la liste demandée
    // >>> PRÉAMBULE EXPLICITE (ajout) <<<
    try {
      const ra2 = await fetch('/warmup/audit');
      const audit2 = ra2.ok ? await ra2.json() : null;
      const cached2 = (audit2 && Array.isArray(audit2.cached)) ? audit2.cached : [];
      const ignored = models.filter(m => cached2.includes(m));
      warmupPreface =
        'Demandés (' + models.length + '):\n' +
        models.map(m => ' • ' + m).join('\n') + '\n\n' +
        '⬛ Ignorés (déjà en cache) (' + ignored.length + '):\n' +
        ignored.map(m => ' • ' + m).join('\n') + '\n\n' +
        '📦 Déjà en cache global (' + cached2.length + '):\n' +
        cached2.map(m => ' • ' + m).join('\n');
    } catch(_) { /* no-op */ }
    // >>> FIN AJOUT <<<

    userClosedWarmupPopup = false;
    openWarmupPopup();
    if (warmupPopupStatus) warmupPopupStatus.textContent = 'Téléchargement en cours…';

        if (warmupLogs) {
      warmupLogs.textContent = (warmupPreface ? warmupPreface + '\n' : '') + '— démarrage…';
      warmupLogs.scrollTop = warmupLogs.scrollHeight; // auto-scroll vers le bas
    }


    // Sécurité : évite 2 timers concurrents
    if (warmupTimer) { clearInterval(warmupTimer); warmupTimer = null; }

    try{
            const r = await fetch('/warmup/start', {
        method:'POST',
        headers:{ 'Content-Type':'application/json' },
        body: JSON.stringify({ models })
      });
      if(!r.ok){
        const t = await r.text();
        alert('Échec démarrage: ' + r.status + ' ' + t);
        return;
      }

      // Lecture unique du payload (évite les doublons)
      const payload = await r.json().catch(()=>null);
      if (payload && payload.already_running) {
        showToast("Un warm-up est déjà en cours — j'affiche l'état.");
      }
      // Mémoriser un éventuel job_id renvoyé
      if (payload && (payload.job_id || payload.job)) {
        currentJobId = payload.job_id || payload.job;
      }

      // Rafraîchir l’UI + lancer le polling local
      await refreshWarmupUI();
      if (!warmupTimer) warmupTimer = setInterval(refreshWarmupUI, 1000);
    }catch(e){
      alert('Erreur réseau');
    }

  });
}

if (warmupLogsBtn){
  warmupLogsBtn.addEventListener('click', async ()=>{

    // Recalcule une préface à la volée (hors exécution)
    try{
      const ra = await fetch('/warmup/audit');
      const audit = ra.ok ? await ra.json() : null;
      const cached = (audit && Array.isArray(audit.cached)) ? audit.cached : [];
      if (!warmupPreface) {
        warmupPreface =
          'Déjà en cache (' + cached.length + '):\n' +
          cached.map(m => ' • ' + m).join('\n');
      }
    }catch(e){}


    openWarmupPopup();
    await refreshWarmupUI();
    if (!warmupTimer) warmupTimer = setInterval(refreshWarmupUI, 1000);
  });
}
if (warmupStopBtn){
  warmupStopBtn.addEventListener('click', async ()=>{
    try{ await fetch('/warmup/stop',{method:'POST'}); await refreshWarmupUI(); }catch(e){}
  });
}

// 1er affichage (badge de statut en topbar)
refreshWarmupUI();
// >>> A2B2_END warmup_dom

const warmupSelectBtn = document.getElementById('warmupSelectBtn');
const warmupSelectPopup = document.getElementById('warmupSelectPopup');
const repoListEl = document.getElementById('repoList');
const selectCancelBtn = document.getElementById('selectCancelBtn');
const selectAllBtn = document.getElementById('selectAllBtn');
const selectNoneBtn = document.getElementById('selectNoneBtn');
const launchSelectedBtn = document.getElementById('launchSelectedBtn');

function openSelect(){ if(warmupSelectPopup) warmupSelectPopup.style.display='block'; }
function closeSelect(){ if(warmupSelectPopup) warmupSelectPopup.style.display='none'; }

async function loadCatalog(){
  if(!repoListEl) return;
  repoListEl.innerHTML = '<div class="muted">Chargement…</div>';
  try{
    const r = await fetch('/warmup/catalog');
    if(!r.ok){ repoListEl.innerHTML = '<div class="muted">Erreur de chargement.</div>'; return; }
    const d = await r.json();
    const items = Array.isArray(d.models) ? d.models : [];
    if(!items.length){ repoListEl.innerHTML = '<div class="muted">Aucun modèle proposé.</div>'; return; }
    repoListEl.innerHTML = '';
    items.forEach(id=>{
      const row = document.createElement('div'); row.className='repo-item';
      const cb  = document.createElement('input'); cb.type='checkbox'; cb.value=id;
      const label = document.createElement('span'); label.className='repo-id'; label.textContent = id;
      row.appendChild(cb); row.appendChild(label);
      repoListEl.appendChild(row);
    });
  }catch(e){
    repoListEl.innerHTML = '<div class="muted">Erreur réseau.</div>';
  }
}

if (warmupSelectBtn){
  warmupSelectBtn.addEventListener('click', async ()=>{
    await loadCatalog();
    openSelect();
  });
}
if (selectCancelBtn){ selectCancelBtn.addEventListener('click', closeSelect); }
if (selectAllBtn){
  selectAllBtn.addEventListener('click', ()=>{
    repoListEl.querySelectorAll('input[type="checkbox"]').forEach(cb=> cb.checked=true);
  });
}
if (selectNoneBtn){
  selectNoneBtn.addEventListener('click', ()=>{
    repoListEl.querySelectorAll('input[type="checkbox"]').forEach(cb=> cb.checked=false);
  });
}
if (launchSelectedBtn){
  launchSelectedBtn.addEventListener('click', async ()=>{
    const picks = Array.from(repoListEl.querySelectorAll('input[type="checkbox"]'))
      .filter(cb=>cb.checked).map(cb=>cb.value);
          // Réinitialiser l’état d’affichage pour ce nouveau run
    warmupPreface = '';
    window.lastRequestedModels = picks.slice();

    // Construire immédiatement une préface exacte (Demandés + Ignorés + Cache global)
    try {
      const ra = await fetch('/warmup/audit');
      const audit = ra.ok ? await ra.json() : null;
      const cached = (audit && Array.isArray(audit.cached)) ? audit.cached : [];
      const ignored = picks.filter(m => cached.includes(m));
      warmupPreface =
        'Demandés (' + picks.length + '):\n' +
        picks.map(m => ' • ' + m).join('\n') + '\n\n' +
        '⬛ Ignorés (déjà en cache) (' + ignored.length + '):\n' +
        (ignored.length ? ignored.map(m => ' • ' + m).join('\n') : '') + '\n\n' +
        '📦 Déjà en cache global (' + cached.length + '):\n' +
        (cached.length ? cached.map(m => ' • ' + m).join('\n') : '');
    } catch(_) { /* no-op */ }

    if(!picks.length){ alert('Sélectionne au moins un modèle.'); return; }
    window.lastRequestedModels = picks.slice();
        userClosedWarmupPopup = false;
    if (typeof openWarmupPopup === 'function') openWarmupPopup();
    if (typeof refreshWarmupUI === 'function') await refreshWarmupUI();
    try{
      const r = await fetch('/warmup/start', {
        method:'POST',
        headers:{ 'Content-Type':'application/json' },
        body: JSON.stringify({ models: picks })
      });
      if(!r.ok){
        const t = await r.text();
        alert('Échec démarrage: ' + r.status + ' ' + t);
        return;
      }
      if (typeof refreshWarmupUI === 'function') {
      
        const id = setInterval(async ()=>{
          await refreshWarmupUI();
          try{
            const s = await (await fetch('/warmup/status')).json();
            if (!s.running) clearInterval(id);
          }catch(e){ clearInterval(id); }
        }, 1000);
      }
      closeSelect();
    }catch(e){
      alert('Erreur réseau.');
    }
  });
}



const gotoBtn = document.getElementById('gotoBtn');

// State
let vidName = serverVid || '';
function fileStem(name){ const i = name.lastIndexOf('.'); return i>0 ? name.slice(0,i) : name; }
let vidStem = '';
let bustToken = Date.now();
let fps = 30, frames = 0;
let metaPromise = null; // évite les doubles requêtes /meta
let currentIdx = 0;
let mode = 'view';

// ==== Multi-rects ====
let currentDraw = null;          // rect en cours de tracé
let rectsMap = new Map();        // frame_idx -> Array<rect>
let color = '#10b981';

// autres états inchangés
let masks = [];
let maskedSet = new Set();
let timelineUrls = [];
let portionStart = null;
let portionEnd = null;
let loopInterval = null;
let chunkSize = 50;
let timelineStart = 0, timelineEnd = 0;
let viewRangeStart = 0, viewRangeEnd = 0;
const scrollThreshold = 100;
let followMode = false;
let isPaused = true;
let thumbEls = new Map();
let lastCenterMs = 0;
const CENTER_THROTTLE_MS = 150;
const PENDING_KEY = 've_pending_masks_v1';
let maskedOnlyMode = false;

// Utils
function showToast(msg){ const el = document.createElement('div'); el.className='toast-item'; el.textContent=String(msg||''); toastWrap.appendChild(el); setTimeout(()=>{ el.remove(); }, 2000); }
function ensureOverlays(){
  if(!document.getElementById('playhead')){ const ph=document.createElement('div'); ph.id='playhead'; ph.className='playhead'; tlBox.appendChild(ph); }
  if(!document.getElementById('portionBand')){ const pb=document.createElement('div'); pb.id='portionBand'; tlBox.appendChild(pb); }
  if(!document.getElementById('inHandle')){ const ih=document.createElement('div'); ih.id='inHandle'; tlBox.appendChild(ih); }
  if(!document.getElementById('outHandle')){ const oh=document.createElement('div'); oh.id='outHandle'; tlBox.appendChild(oh); }
}
function playheadEl(){ return document.getElementById('playhead'); }
function portionBand(){ return document.getElementById('portionBand'); }
function inHandle(){ return document.getElementById('inHandle'); }
function outHandle(){ return document.getElementById('outHandle'); }
function findThumbEl(idx){ return thumbEls.get(idx) || null; }
function updateHUD(){ const total = frames || 0, cur = currentIdx+1; hud.textContent = `t=${player.currentTime.toFixed(2)}s • #${cur}/${total} • ${fps.toFixed(2)}fps`; }
function updateSelectedThumb(){
  tlBox.querySelectorAll('.thumb img.sel, .thumb img.sel-strong').forEach(img=>{ img.classList.remove('sel','sel-strong'); });
  const el = findThumbEl(currentIdx); if(!el) return; const img = el.querySelector('img');
  img.classList.add('sel'); if(isPaused) img.classList.add('sel-strong');
}
function rawCenterThumb(el){
  tlBox.scrollLeft = Math.max(0, el.offsetLeft + el.clientWidth/2 - tlBox.clientWidth/2);
}
async function ensureThumbVisibleCentered(idx){
  for(let k=0; k<40; k++){
    const el = findThumbEl(idx);
    if(el){
      const img = el.querySelector('img');
      if(!img.complete || img.naturalWidth === 0){
        await new Promise(r=>setTimeout(r, 25));
      }else{
        rawCenterThumb(el);
        updatePlayhead();
        return true;
      }
    }else{
      await new Promise(r=>setTimeout(r, 25));
    }
  }
  return false;
}
function centerSelectedThumb(){ ensureThumbVisibleCentered(currentIdx); }
function updatePlayhead(){
  ensureOverlays();
  const el = findThumbEl(currentIdx);
  const ph = playheadEl();
  if(!el){ ph.style.display='none'; return; }
  ph.style.display='block'; ph.style.left = (el.offsetLeft + el.clientWidth/2) + 'px';
}
function updatePortionOverlays(){
  ensureOverlays();
  const pb = portionBand(), ih = inHandle(), oh = outHandle();
  if(portionStart==null || portionEnd==null){ pb.style.display='none'; ih.style.display='none'; oh.style.display='none'; return; }
  const a = findThumbEl(portionStart), b = findThumbEl(portionEnd-1);
  if(!a || !b){ pb.style.display='none'; ih.style.display='none'; oh.style.display='none'; return; }
  const left = a.offsetLeft, right = b.offsetLeft + b.clientWidth;
  pb.style.display='block'; pb.style.left = left+'px'; pb.style.width = Math.max(0, right-left)+'px';
  ih.style.display='block'; ih.style.left = (left - ih.clientWidth/2) + 'px';
  oh.style.display='block'; oh.style.left = (right - oh.clientWidth/2) + 'px';
}
function nearestFrameIdxFromClientX(clientX){
  const rect = tlBox.getBoundingClientRect();
  const xIn = clientX - rect.left + tlBox.scrollLeft;
  let bestIdx = currentIdx, bestDist = Infinity;
  for(const [idx, el] of thumbEls.entries()){
    const mid = el.offsetLeft + el.clientWidth/2;
    const d = Math.abs(mid - xIn);
    if(d < bestDist){ bestDist = d; bestIdx = idx; }
  }
  return bestIdx;
}
function loadPending(){ try{ return JSON.parse(localStorage.getItem(PENDING_KEY) || '[]'); }catch{ return []; } }
function savePendingList(lst){ localStorage.setItem(PENDING_KEY, JSON.stringify(lst)); }
function addPending(payload){ const lst = loadPending(); lst.push(payload); savePendingList(lst); }
async function flushPending(){
  const lst = loadPending(); if(!lst.length) return;
  const kept = [];
  for(const p of lst){
    try{ const r = await fetch('/mask',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(p)}); if(!r.ok) kept.push(p); }
    catch{ kept.push(p); }
  }
  savePendingList(kept);
  if(kept.length===0) showToast('Masques hors-ligne synchronisés ✅');
}

// Layout
function syncTimelineWidth(){ const w = playerWrap.clientWidth; tlBox.style.width = w + 'px'; }
function fitCanvas(){
  const r=player.getBoundingClientRect();
  const ctrlH = parseInt(getComputedStyle(document.documentElement).getPropertyValue('--controlsH'));
  canvas.width=Math.round(r.width);
  canvas.height=Math.round(r.height - ctrlH);
  canvas.style.width=r.width+'px';
  canvas.style.height=(r.height - ctrlH)+'px';
  syncTimelineWidth();
}
function timeToIdx(t){ return Math.max(0, Math.min(frames-1, Math.round((fps||30) * t))); }
function idxToSec(i){ return (fps||30)>0 ? (i / fps) : 0; }

// ==== Multi-rects helpers ====
function getRectsForFrame(fi){
  let arr = rectsMap.get(fi);
  if(!arr){ arr = []; rectsMap.set(fi, arr); }
  return arr;
}
function draw(){
  ctx.clearRect(0,0,canvas.width,canvas.height);
  const arr = getRectsForFrame(currentIdx);
  for(const r of arr){
    const x=Math.min(r.x1,r.x2), y=Math.min(r.y1,r.y2);
    const w=Math.abs(r.x2-r.x1), h=Math.abs(r.y2-r.y1);
    ctx.strokeStyle=r.color||color; ctx.lineWidth=2; ctx.strokeRect(x,y,w,h);
    ctx.fillStyle=(r.color||color)+'28'; ctx.fillRect(x,y,w,h);
  }
  if(currentDraw){
    const x=Math.min(currentDraw.x1,currentDraw.x2), y=Math.min(currentDraw.y1,currentDraw.y2);
    const w=Math.abs(currentDraw.x2-currentDraw.x1), h=Math.abs(currentDraw.y2-currentDraw.y1);
    ctx.setLineDash([6,4]);
    ctx.strokeStyle=currentDraw.color||color; ctx.lineWidth=2; ctx.strokeRect(x,y,w,h);
    ctx.setLineDash([]);
  }
}
function setMode(m){
  mode=m;
  if(m==='edit'){
    player.pause();
    player.controls = false;
    playerWrap.classList.add('edit-mode');
    modeLabel.textContent='Édition';
    btnEdit.style.display='none'; btnBack.style.display='inline-block';
    btnSave.style.display='inline-block'; btnClear.style.display='inline-block';
    canvas.style.pointerEvents='auto';
    draw();
  }else{
    player.controls = true;
    playerWrap.classList.remove('edit-mode');
    modeLabel.textContent='Lecture';
    btnEdit.style.display='inline-block'; btnBack.style.display='none';
    btnSave.style.display='none'; btnClear.style.display='none';
    canvas.style.pointerEvents='none';
    currentDraw=null; draw();
  }
}

// Dessin multi-rectangles
let dragging=false, sx=0, sy=0;
canvas.addEventListener('mousedown',(e)=>{
  if(mode!=='edit' || !vidName) return;
  dragging=true; const r=canvas.getBoundingClientRect();
  sx=e.clientX-r.left; sy=e.clientY-r.top;
  currentDraw={x1:sx,y1:sy,x2:sx,y2:sy,color:color}; draw();
});
canvas.addEventListener('mousemove',(e)=>{
  if(!dragging) return;
  const r=canvas.getBoundingClientRect();
  currentDraw.x2=e.clientX-r.left; currentDraw.y2=e.clientY-r.top; draw();
});
['mouseup','mouseleave'].forEach(ev=>canvas.addEventListener(ev,()=>{
  if(!dragging) return;
  dragging=false;
  if(currentDraw){
    const arr = getRectsForFrame(currentIdx);
    // ignorer les clics trop petits
    if(Math.abs(currentDraw.x2-currentDraw.x1) > 3 && Math.abs(currentDraw.y2-currentDraw.y1) > 3){
      arr.push({...currentDraw});
    }
    currentDraw=null; draw();
  }
}));

btnClear.onclick=()=>{ 
  const arr = getRectsForFrame(currentIdx);
  if(arr.length){ arr.pop(); draw(); } 
};
btnEdit.onclick =()=> setMode('edit');
btnBack.onclick =()=> setMode('view');

// Palette
palette.querySelectorAll('.swatch').forEach(el=>{
  if(el.dataset.c===color) el.classList.add('sel');
  el.onclick=()=>{
    palette.querySelectorAll('.swatch').forEach(s=>s.classList.remove('sel'));
    el.classList.add('sel'); color=el.dataset.c;
    if(currentDraw){ currentDraw.color=color; draw(); }
  };
});

// === Timeline (identique sauf interactions internes) ===
async function loadTimelineUrls(){
  timelineUrls = [];
  const stem = vidStem, b = bustToken;
  for(let idx=0; idx<frames; idx++){
    timelineUrls[idx] = `/thumbs/f_${stem}_${idx}.jpg?b=${b}`;
  }
  tlProgressFill.style.width='0%';
}
async function renderTimeline(centerIdx){
  if(!vidName) return;
  loadingInd.style.display='block';
  if(timelineUrls.length===0) await loadTimelineUrls();
  tlBox.innerHTML = ''; thumbEls = new Map(); ensureOverlays();

  if(maskedOnlyMode){
    const idxs = Array.from(maskedSet).sort((a,b)=>a-b);
    for(const i of idxs){ addThumb(i,'append'); }
    setTimeout(async ()=>{ syncTimelineWidth(); updateSelectedThumb(); await ensureThumbVisibleCentered(currentIdx); loadingInd.style.display='none'; updatePlayhead(); updatePortionOverlays(); },0);
    return;
  }

  if(portionStart!=null && portionEnd!=null){
    const s = Math.max(0, portionStart), e = Math.min(frames, portionEnd);
    for(let i=s;i<e;i++){ addThumb(i,'append'); }
    setTimeout(async ()=>{ syncTimelineWidth(); updateSelectedThumb(); await ensureThumbVisibleCentered(currentIdx); loadingInd.style.display='none'; updatePlayhead(); updatePortionOverlays(); },0);
    return;
  }

  await loadWindow(centerIdx ?? currentIdx);
  loadingInd.style.display='none';
}
async function loadWindow(centerIdx){
  tlBox.innerHTML=''; thumbEls = new Map(); ensureOverlays();
  const rngStart = (viewRangeStart ?? 0);
  const rngEnd = (viewRangeEnd ?? frames);
  const mid = Math.max(rngStart, Math.min(centerIdx, Math.max(rngStart, rngEnd-1)));
  const start = Math.max(rngStart, Math.min(mid - Math.floor(chunkSize/2), Math.max(rngStart, rngEnd - chunkSize)));
  const end = Math.min(rngEnd, start + chunkSize);
  for(let i=start;i<end;i++){ addThumb(i,'append'); }
  timelineStart = start; timelineEnd = end;
  setTimeout(async ()=>{
    syncTimelineWidth();
    updateSelectedThumb();
    await ensureThumbVisibleCentered(currentIdx);
    updatePortionOverlays();
  },0);
}
function addThumb(idx, place='append'){
  if(thumbEls.has(idx)) return;
  const wrap=document.createElement('div'); wrap.className='thumb'; wrap.dataset.idx=idx;
  if(maskedSet.has(idx)) wrap.classList.add('hasmask');
  const img=new Image(); img.title='frame '+(idx+1);
  img.src=timelineUrls[idx];
    // Fallback solide : on affiche /frame_idx tout de suite,
  // puis on ne bascule vers /thumbs que si elle existe (sonde en tâche de fond).
  img.addEventListener('error', ()=>{
    const fallback = `/frame_idx?vid=${encodeURIComponent(vidName)}&idx=${idx}`;
    img.onerror = null;              // éviter les boucles d'erreur
    img.src = fallback;              // montrer la frame générée à la volée

    const trySwap = () => {
      const nu = `/thumbs/f_${vidStem}_${idx}.jpg?b=${Date.now()}`;
      const probe = new Image();
      probe.onload  = () => { timelineUrls[idx] = nu; img.src = nu; };
      probe.onerror = () => { setTimeout(trySwap, 1500); }; // réessaie plus tard
      probe.src = nu;
    };
    setTimeout(trySwap, 1500);
  }, { once:true });
  if(idx===currentIdx){ img.classList.add('sel'); if(isPaused) img.classList.add('sel-strong'); }
  img.onclick=async ()=>{
    currentIdx=idx; player.currentTime=idxToSec(currentIdx);
    draw();
    updateSelectedThumb(); await ensureThumbVisibleCentered(currentIdx); updatePlayhead();
  };
  wrap.appendChild(img);
  const label=document.createElement('span'); label.className='thumb-label'; label.textContent = `#${idx+1}`;
  wrap.appendChild(label);
  if(place==='append'){ tlBox.appendChild(wrap); }
  else if(place==='prepend'){ tlBox.insertBefore(wrap, tlBox.firstChild); }
  else{ tlBox.appendChild(wrap); }
  thumbEls.set(idx, wrap);
}

tlBox.addEventListener('scroll', ()=>{
  if (maskedOnlyMode || (portionStart!=null && portionEnd!=null)){
    updatePlayhead(); updatePortionOverlays();
    return;
  }
  const scrollLeft = tlBox.scrollLeft, scrollWidth = tlBox.scrollWidth, clientWidth = tlBox.clientWidth;
  if (scrollWidth - scrollLeft - clientWidth < scrollThreshold && timelineEnd < viewRangeEnd){
    const newEnd = Math.min(viewRangeEnd, timelineEnd + chunkSize);
    for(let i=timelineEnd;i<newEnd;i++){ addThumb(i,'append'); }
    timelineEnd = newEnd;
  }
  if (scrollLeft < scrollThreshold && timelineStart > viewRangeStart){
    const newStart = Math.max(viewRangeStart, timelineStart - chunkSize);
    for(let i=newStart;i<timelineStart;i++){ addThumb(i,'prepend'); }
    tlBox.scrollLeft += (timelineStart - newStart) * (110 + 8);
    timelineStart = newStart;
  }
  updatePlayhead(); updatePortionOverlays();
});

// Isoler & Boucle (inchangé)
isolerBoucle.onclick = async ()=>{
  const start = parseInt(goFrame.value || '1',10) - 1;
  const end = parseInt(endPortion.value || '',10);
  if(!endPortion.value || end <= start || end > frames){ alert('Portion invalide (fin > début)'); return; }
  if (end - start > 1200 && !confirm('Portion très large, cela peut être lent. Continuer ?')) return;
  portionStart = start; portionEnd = end;
  viewRangeStart = start; viewRangeEnd = end;
  player.pause(); isPaused = true;
  currentIdx = start; player.currentTime = idxToSec(start);
  await renderTimeline(currentIdx);
  resetFull.style.display = 'inline-block';
  startLoop(); updatePortionOverlays();
};
function startLoop(){
  if(loopInterval) clearInterval(loopInterval);
  if(portionEnd != null){
    loopInterval = setInterval(()=>{ if(player.currentTime >= idxToSec(portionEnd)) player.currentTime = idxToSec(portionStart); }, 100);
  }
}
resetFull.onclick = async ()=>{
  portionStart = null; portionEnd = null;
  viewRangeStart = 0; viewRangeEnd = frames;
  goFrame.value = 1; endPortion.value = '';
  player.pause(); isPaused = true;
  await renderTimeline(currentIdx);
  resetFull.style.display='none';
  clearInterval(loopInterval); updatePortionOverlays();
};

// Drag IN/OUT (inchangé)
function attachHandleDrag(handle, which){
  let draggingH=false;
  function onMove(e){
    if(!draggingH) return;
    const idx = nearestFrameIdxFromClientX(e.clientX);
    if(which==='in'){ portionStart = Math.min(idx, portionEnd ?? idx+1); goFrame.value = (portionStart+1); }
    else { portionEnd = Math.max(idx+1, (portionStart ?? idx)); endPortion.value = portionEnd; }
    viewRangeStart = (portionStart ?? 0); viewRangeEnd = (portionEnd ?? frames);
    updatePortionOverlays();
  }
  handle.addEventListener('mousedown', (e)=>{ draggingH=true; e.preventDefault(); });
  window.addEventListener('mousemove', onMove);
  window.addEventListener('mouseup', ()=>{ draggingH=false; });
}
ensureOverlays(); attachHandleDrag(document.getElementById('inHandle'), 'in'); attachHandleDrag(document.getElementById('outHandle'), 'out');

// Progress popup (inchangé)
async function showProgress(vidStem){
  popup.style.display = 'block';
  const interval = setInterval(async () => {
    const r = await fetch('/progress/' + vidStem);
    const d = await r.json();
    tlProgressFill.style.width = d.percent + '%';
    popupProgressFill.style.width = d.percent + '%';
    popupLogs.innerHTML = d.logs.map(x=>String(x)).join('<br>');
    if(d.done){
      clearInterval(interval);
      popup.style.display = 'none';
      await renderTimeline(currentIdx);
    }
  }, 800);
}

// Meta & boot
async function loadVideoAndMeta() {
  if(!vidName){ statusEl.textContent='Aucune vidéo sélectionnée.'; return; }
  vidStem = fileStem(vidName); bustToken = Date.now();
  const bust = Date.now();
  srcEl.src = '/data/'+encodeURIComponent(vidName)+'?t='+bust;
  player.setAttribute('poster', '/poster/'+encodeURIComponent(vidName)+'?t='+bust);
  player.load();
  fitCanvas();
  statusEl.textContent = 'Chargement vidéo…';
try{
        metaPromise = fetch('/meta/'+encodeURIComponent(vidName));
    const r = await metaPromise;
    if(r.ok){
      const m=await r.json();
      fps=m.fps||30; frames=m.frames||0;
      statusEl.textContent = `OK (${frames} frames @ ${fps.toFixed(2)} fps)`;
      viewRangeStart = 0; viewRangeEnd = frames;
      await loadTimelineUrls();
      await loadMasks();
      currentIdx = 0; player.currentTime = 0;
      await renderTimeline(0);
      showProgress(vidStem);
    }else{
      statusEl.textContent = 'Erreur meta';
    }
  }catch(err){
    statusEl.textContent = 'Erreur réseau meta';
  }
}
player.addEventListener('loadedmetadata', async ()=>{
  fitCanvas();
  if(!frames || frames<=0){
    try{
      if (metaPromise) {
        const r = await metaPromise;
        if (r.ok) { const m = await r.json(); fps = m.fps||30; frames = m.frames||0; }
      }
    }catch{}
  }
  currentIdx=0; goFrame.value=1; draw();
});
window.addEventListener('resize', ()=>{ fitCanvas(); draw(); });
player.addEventListener('pause', ()=>{ isPaused = true; updateSelectedThumb(); centerSelectedThumb(); });
player.addEventListener('play', ()=>{ isPaused = false; updateSelectedThumb(); });
player.addEventListener('timeupdate', ()=>{
  posInfo.textContent='t='+player.currentTime.toFixed(2)+'s';
  currentIdx=timeToIdx(player.currentTime);
  if(mode==='edit'){ draw(); }
  updateHUD(); updateSelectedThumb(); updatePlayhead();
  if(followMode && !isPaused){
    const now = Date.now();
    if(now - lastCenterMs > CENTER_THROTTLE_MS){ lastCenterMs = now; centerSelectedThumb(); }
  }
});
goFrame.addEventListener('change', async ()=>{
  if(!vidName) return;
  const val=Math.max(1, parseInt(goFrame.value||'1',10));
  player.pause(); isPaused = true;
  currentIdx=val-1; player.currentTime=idxToSec(currentIdx);
  await renderTimeline(currentIdx);
  draw();
  await ensureThumbVisibleCentered(currentIdx);
});

// Follow / Filter / Zoom / Goto
btnFollow.onclick = ()=>{ followMode = !followMode; btnFollow.classList.toggle('toggled', followMode); if(followMode) centerSelectedThumb(); };
btnFilterMasked.onclick = async ()=>{
  maskedOnlyMode = !maskedOnlyMode;
  btnFilterMasked.classList.toggle('toggled', maskedOnlyMode);
  tlBox.classList.toggle('filter-masked', maskedOnlyMode);
  await renderTimeline(currentIdx);
  await ensureThumbVisibleCentered(currentIdx);
};
zoomSlider.addEventListener('input', ()=>{ tlBox.style.setProperty('--thumbH', zoomSlider.value + 'px'); });
async function gotoFrameNum(){
  const v = parseInt(gotoInput.value||'',10);
  if(!Number.isFinite(v) || v<1 || v>frames) return;
  player.pause(); isPaused = true;
  currentIdx = v-1; player.currentTime = idxToSec(currentIdx);
  goFrame.value = v;
  await renderTimeline(currentIdx);
  draw();
  await ensureThumbVisibleCentered(currentIdx);
}
gotoBtn.onclick = ()=>{ gotoFrameNum(); };
gotoInput.addEventListener('keydown',(e)=>{ if(e.key==='Enter'){ e.preventDefault(); gotoFrameNum(); } });

// Drag & drop upload
const uploadZone = document.getElementById('uploadForm');
uploadZone.addEventListener('dragover', (e) => { e.preventDefault(); uploadZone.style.borderColor = '#2563eb'; });
uploadZone.addEventListener('dragleave', () => { uploadZone.style.borderColor = 'transparent'; });
uploadZone.addEventListener('drop', (e) => {
  e.preventDefault(); uploadZone.style.borderColor = 'transparent';
  const file = e.dataTransfer.files[0];
  if(file && file.type.startsWith('video/')){
    const fd = new FormData(); fd.append('file', file);
    fetch('/upload?redirect=1', {method: 'POST', body: fd}).then(() => location.reload());
  }
});

// Export placeholder
document.getElementById('exportBtn').onclick = () => { console.log('Export en cours... (IA à venir)'); alert('Fonctionnalité export IA en développement !'); };

// Fichiers & masques (chargement existants => rectsMap)
async function loadFiles(){
  const r=await fetch('/files'); const d=await r.json();
  if(!d.items || !d.items.length){ fileList.innerHTML='<li>(aucune)</li>'; return; }
  fileList.innerHTML='';
  d.items.forEach(name=>{
    const li=document.createElement('li');
    const delBtn = document.createElement('span'); delBtn.className='delete-btn'; delBtn.textContent='❌'; delBtn.title='Supprimer cette vidéo';
    delBtn.onclick=async()=>{
      if(!confirm(`Supprimer "${name}" ?`)) return;
      await fetch('/delete/'+encodeURIComponent(name),{method:'DELETE'});
      loadFiles(); if(vidName===name){ vidName=''; loadVideoAndMeta(); }
    };
    const a=document.createElement('a'); a.textContent=name; a.href='/ui?v='+encodeURIComponent(name); a.title='Ouvrir cette vidéo';
    li.appendChild(delBtn); li.appendChild(a); fileList.appendChild(li);
  });
}
async function loadMasks(){
  loadingInd.style.display='block';
  const box=document.getElementById('maskList');
  const r=await fetch('/mask/'+encodeURIComponent(vidName));
  const d=await r.json();
  masks=d.masks||[];
  maskedSet = new Set(masks.map(m=>parseInt(m.frame_idx||0,10)));

  // Reconstituer rectsMap depuis les masques existants
  rectsMap.clear();
  const normW = canvas.clientWidth, normH = canvas.clientHeight;
  masks.forEach(m=>{
    if(m.shape==='rect'){
      const [x1,y1,x2,y2] = m.points; // normalisés
      const rx = {x1:x1*normW, y1:y1*normH, x2:x2*normW, y2:y2*normH, color:m.color||'#10b981'};
      const arr = getRectsForFrame(parseInt(m.frame_idx||0,10));
      arr.push(rx);
    }
  });

  maskedCount.textContent = `(${maskedSet.size} ⭐)`;
  if(!masks.length){ box.textContent='—'; loadingInd.style.display='none'; draw(); return; }
  box.innerHTML='';
  const ul=document.createElement('ul'); ul.className='clean';
  masks.forEach(m=>{
    const li=document.createElement('li');
    const fr=(parseInt(m.frame_idx||0,10)+1);
    const t=(m.time_s||0).toFixed(2);
    const col=m.color||'#10b981';
    const label=m.note||(`frame ${fr}`);
    li.innerHTML = `<span style="display:inline-block;width:10px;height:10px;border-radius:50%;background:${col};margin-right:6px;vertical-align:middle"></span> <strong>${label.replace(/</g,'&lt;').replace(/>/g,'&gt;')}</strong> — #${fr} · t=${t}s`;
    const renameBtn=document.createElement('span'); renameBtn.className='rename-btn'; renameBtn.textContent='✏️'; renameBtn.title='Renommer le masque';
    renameBtn.onclick=async()=>{
      const nv=prompt('Nouveau nom du masque :', label);
      if(nv===null) return;
      const rr=await fetch('/mask/rename',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({vid:vidName,id:m.id,note:nv})});
      if(rr.ok){ await loadMasks(); await renderTimeline(currentIdx); draw(); showToast('Masque renommé ✅'); } else {
        const txt = await rr.text(); alert('Échec renommage: ' + rr.status + ' ' + txt);
      }
    };
    const delMaskBtn=document.createElement('span'); delMaskBtn.className='delete-btn'; delMaskBtn.textContent='❌'; delMaskBtn.title='Supprimer ce masque';
    delMaskBtn.onclick=async()=>{
      if(!confirm(`Supprimer masque "${label}" ?`)) return;
      const rr=await fetch('/mask/delete',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({vid:vidName,id:m.id})});
      if(rr.ok){ await loadMasks(); await renderTimeline(currentIdx); draw(); showToast('Masque supprimé ✅'); } else {
        const txt = await rr.text(); alert('Échec suppression: ' + rr.status + ' ' + txt);
      }
    };
    li.appendChild(renameBtn); li.appendChild(delMaskBtn); ul.appendChild(li);
  });
  box.appendChild(ul);
  loadingInd.style.display='none';
  draw();
}

// Save masks (tous les rectangles de la frame courante)
btnSave.onclick = async ()=>{
  const arr = getRectsForFrame(currentIdx);
  if(currentDraw){
    // finaliser le tracé en cours
    if(Math.abs(currentDraw.x2-currentDraw.x1) > 3 && Math.abs(currentDraw.y2-currentDraw.y1) > 3){
      arr.push({...currentDraw});
    }
    currentDraw=null;
  }
  if(!arr.length){ alert('Aucun rectangle sur cette frame.'); return; }
  const defaultName = `frame ${currentIdx+1}`;
  const baseNote = (prompt('Nom de base (optionnel) :', defaultName) || defaultName).trim();
  const normW = canvas.clientWidth, normH = canvas.clientHeight;

  // Sauvegarder séquentiellement pour éviter les erreurs réseau cumulées
  for(let i=0;i<arr.length;i++){
    const r = arr[i];
    const x=Math.min(r.x1,r.x2)/normW;
    const y=Math.min(r.y1,r.y2)/normH;
    const w=Math.abs(r.x2-r.x1)/normW;
    const h=Math.abs(r.y2-r.y1)/normH;
    const payload={vid:vidName,time_s:player.currentTime,frame_idx:currentIdx,shape:'rect',points:[x,y,x+w,y+h],color:r.color||color,note:`${baseNote} #${i+1}`};
    addPending(payload);
    try{
      const res = await fetch('/mask',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(payload)});
      if(!res.ok){
        const txt = await res.text();
        alert('Échec enregistrement masque: ' + res.status + ' ' + txt);
        break;
      }
    }catch(e){
      alert('Erreur réseau lors de l’enregistrement.');
      break;
    }
  }
  // Nettoyage des pendings naïf (optionnel)
  savePendingList([]); 
  await loadMasks(); await renderTimeline(currentIdx);
  showToast('Masques enregistrés ✅');
};

// Boot
async function boot(){
  const lst = JSON.parse(localStorage.getItem('ve_pending_masks_v1') || '[]'); if(lst.length){ /* flush pending si besoin */ }
  await loadFiles();
  if(serverVid){ vidName=serverVid; await loadVideoAndMeta(); }
  else{ const qs=new URLSearchParams(location.search); const v=qs.get('v')||''; if(v){ vidName=v; await loadVideoAndMeta(); } }
}
boot();

// Masquer les contrôles natifs en mode édition
const style = document.createElement('style');
style.textContent = `.player-wrap.edit-mode video::-webkit-media-controls { display: none !important; } .player-wrap.edit-mode video::before { content: none !important; }`;
document.head.appendChild(style);
</script>
</html>
"""

@app.get("/ui", response_class=HTMLResponse, tags=["meta"])
def ui(v: Optional[str] = "", msg: Optional[str] = ""):
    vid = v or ""
    try:
                safe_msg: str = urllib.parse.unquote(msg or "")
    except Exception:
        safe_msg = ""
    html = HTML_TEMPLATE.replace("__VID__", urllib.parse.quote(vid)).replace("__MSG__", safe_msg)
    return HTMLResponse(content=html)