Added review mode

README.md

@@ -36,3 +36,7 @@ Behaviors carry a tiny colored crescent to hint how long the move lasts:
 - Seafoam (`#73E0A9`) — short (≤ 4 s)
 - Amber (`#FFC857`) — medium (between 4 s and 8 s)
 - Rose (`#FF6B6B`) — long (> 8 s)
+
+## Review mode (developer only)
+
+Set the environment variable `EMOTIONS_REVIEW_MODE=1` before launching the app to unlock a hidden review panel in the GUI (Shift + R or double-click the status chip). Each move can then be tagged with a quality (`Excellent`, `OK`, `Bad`) and precision (`Clear`, `Ambiguous`). Ratings are stored back inside `ressources/emotions.yml`.

emotions/main.py

@@ -6,8 +6,9 @@ import time
 from collections import defaultdict
 from dataclasses import dataclass, field
 from datetime import datetime
+import os
 from pathlib import Path
-from typing import Any
+from typing import Any, Literal
 
 from fastapi import HTTPException
 from pydantic import BaseModel, Field
@@ -24,6 +25,11 @@ _RESOURCE_CANDIDATES = [
 ]
 RESOURCE_ROOT = next((path for path in _RESOURCE_CANDIDATES if path.exists()), _RESOURCE_CANDIDATES[0])
 EMOTIONS_YAML_PATH = RESOURCE_ROOT / "emotions.yml"
+REVIEW_MODE_ENABLED = os.getenv("EMOTIONS_REVIEW_MODE", "").lower() not in {"0", "false", "no"}
+QUALITY_SCALE: tuple[str, ...] = ("excellent", "ok", "bad")
+PRECISION_SCALE: tuple[str, ...] = ("clear", "ambiguous")
+QualityLiteral = Literal["excellent", "ok", "bad"]
+PrecisionLiteral = Literal["clear", "ambiguous"]
 COHERENCE_DURATION_TOLERANCE = 0.25
 YAML_LOADER = YAML()
 YAML_LOADER.preserve_quotes = True
@@ -87,6 +93,8 @@ class WheelMove:
     recorded_duration: float | None
     order: int
     layout: dict[str, float] | None = None
+    quality: str | None = None
+    precision: str | None = None
 
     def to_dict(self) -> dict[str, Any]:
         return {
@@ -105,6 +113,8 @@ class WheelMove:
             "recorded_duration": self.recorded_duration,
             "order": self.order,
             "layout": self.layout,
+            "quality": self.quality,
+            "precision": self.precision,
         }
 
 
@@ -173,6 +183,15 @@ class SaveLayoutPayload(BaseModel):
     positions: dict[str, MovePositionPayload]
 
 
+class ReviewPayload(BaseModel):
+    quality: QualityLiteral | None = Field(
+        default=None, description="Quality rating for the move"
+    )
+    precision: PrecisionLiteral | None = Field(
+        default=None, description="Precision rating for the move"
+    )
+
+
 def slugify(value: str) -> str:
     slug = re.sub(r"[^a-z0-9]+", "-", value.lower()).strip("-")
     return slug or "sector"
@@ -387,6 +406,16 @@ def build_catalog(spec: dict[str, Any], recorded_emotions: RecordedMoves) -> Emo
                 layout = None
 
         sector_type_map[wheel_sector].add(move_type)
+        quality = move_data.get("quality")
+        if isinstance(quality, str) and quality.lower() in QUALITY_SCALE:
+            quality = quality.lower()
+        else:
+            quality = None
+        precision = move_data.get("precision")
+        if isinstance(precision, str) and precision.lower() in PRECISION_SCALE:
+            precision = precision.lower()
+        else:
+            precision = None
         move = WheelMove(
             move_id=move_id,
             clean_name=clean_name,
@@ -403,6 +432,8 @@ def build_catalog(spec: dict[str, Any], recorded_emotions: RecordedMoves) -> Emo
             recorded_duration=recorded_duration,
             order=order,
             layout=layout,
+            quality=quality,
+            precision=precision,
         )
         moves_by_type[move_type].append(move)
         move_lookup[move_id] = move
@@ -562,6 +593,48 @@ class Emotions(ReachyMiniApp):
             dump_emotions_spec_tree(tree)
             self._refresh_catalog(tree)
 
+    def _find_move_entry(self, tree: Any, move_id: str) -> dict[str, Any] | None:
+        moves_section = tree.get("moves", [])
+        for entry in moves_section:
+            if isinstance(entry, dict) and entry.get("id") == move_id:
+                return entry
+        return None
+
+    def _save_review(self, move_id: str, payload: ReviewPayload) -> dict[str, Any]:
+        if not payload.model_fields_set:
+            raise HTTPException(status_code=400, detail="No review fields provided.")
+
+        with self._config_lock:
+            tree = load_emotions_spec_tree()
+            target = self._find_move_entry(tree, move_id)
+            if target is None:
+                raise HTTPException(status_code=404, detail=f"Move {move_id} not found in spec.")
+
+            def assign(field: str, value: str | None, allowed: tuple[str, ...]) -> None:
+                if value is None:
+                    target.pop(field, None)
+                    return
+                normalized = value.lower()
+                if normalized not in allowed:
+                    raise HTTPException(status_code=400, detail=f"Invalid {field} value: {value}")
+                target[field] = normalized
+
+            if "quality" in payload.model_fields_set:
+                assign("quality", payload.quality, QUALITY_SCALE)
+
+            if "precision" in payload.model_fields_set:
+                assign("precision", payload.precision, PRECISION_SCALE)
+
+            dump_emotions_spec_tree(tree)
+            self._refresh_catalog(tree)
+
+        updated_move = self._catalog.move_lookup.get(move_id)
+        return {
+            "status": "ok",
+            "quality": updated_move.quality if updated_move else None,
+            "precision": updated_move.precision if updated_move else None,
+        }
+
     def _register_routes(self) -> None:
         @self.settings_app.get("/api/emotions")
         def list_emotions() -> dict[str, Any]:
@@ -625,6 +698,20 @@ class Emotions(ReachyMiniApp):
             self._reset_positions()
             return {"status": "ok"}
 
+        @self.settings_app.get("/api/review/config")
+        def review_config() -> dict[str, Any]:
+            return {
+                "enabled": REVIEW_MODE_ENABLED,
+                "quality_options": QUALITY_SCALE,
+                "precision_options": PRECISION_SCALE,
+            }
+
+        @self.settings_app.post("/api/review/{move_id}")
+        def save_review(move_id: str, payload: ReviewPayload) -> dict[str, Any]:
+            if not REVIEW_MODE_ENABLED:
+                raise HTTPException(status_code=404, detail="Review mode is disabled.")
+            return self._save_review(move_id, payload)
+
     def run(self, reachy_mini: ReachyMini, stop_event: threading.Event) -> None:
         while not stop_event.is_set():
             move_to_play: str | None = None

emotions/static/index.html

@@ -31,6 +31,47 @@
             <button id="layoutModeBtn" class="control-btn">Manual layout</button>
             <button id="layoutSaveBtn" class="control-btn" disabled>Save layout</button>
             <button id="layoutResetBtn" class="control-btn secondary">Reset layout</button>
+            <button id="reviewToggleBtn" class="control-btn tertiary" hidden type="button">Review mode</button>
+        </section>
+
+        <section class="review-panel" id="reviewPanel" hidden>
+            <header>
+                <div>
+                    <strong>Review mode</strong>
+                    <details class="review-instructions">
+                        <summary>How to tag moves</summary>
+                        <ul>
+                            <li>Click a move (or press the play button) to focus it.</li>
+                            <li>Use 1/2/3 to set quality (Excellent / OK / Bad).</li>
+                            <li>Use Q/W for precision (Clear / Ambiguous).</li>
+                            <li>Press N to jump to the next unrated move.</li>
+                            <li>Ratings are saved straight into <code>ressources/emotions.yml</code>.</li>
+                        </ul>
+                    </details>
+                </div>
+                <div class="review-progress" id="reviewProgress">0 / 0</div>
+                <button id="reviewExitBtn" class="chip soft" type="button">Exit</button>
+            </header>
+            <div class="review-current">
+                <div>
+                    <p id="reviewMoveLabel">Select a move to begin.</p>
+                    <small id="reviewMoveId" class="muted"></small>
+                </div>
+                <div class="review-current-actions">
+                    <button id="reviewNextBtn" class="control-btn secondary" type="button">Next unrated</button>
+                    <button id="reviewClearBtn" class="control-btn secondary" type="button">Clear rating</button>
+                </div>
+            </div>
+            <div class="review-controls">
+                <article>
+                    <h3>Quality</h3>
+                    <div class="review-options" id="reviewQualityOptions"></div>
+                </article>
+                <article>
+                    <h3>Precision</h3>
+                    <div class="review-options" id="reviewPrecisionOptions"></div>
+                </article>
+            </div>
         </section>
 
         <section class="wheel-stage">

emotions/static/main.js

@@ -10,6 +10,16 @@ const coherencePanel = document.getElementById("coherencePanel");
 const layoutModeBtn = document.getElementById("layoutModeBtn");
 const layoutSaveBtn = document.getElementById("layoutSaveBtn");
 const layoutResetBtn = document.getElementById("layoutResetBtn");
+const reviewPanel = document.getElementById("reviewPanel");
+const reviewToggleBtn = document.getElementById("reviewToggleBtn");
+const reviewMoveLabel = document.getElementById("reviewMoveLabel");
+const reviewMoveId = document.getElementById("reviewMoveId");
+const reviewProgressEl = document.getElementById("reviewProgress");
+const reviewExitBtn = document.getElementById("reviewExitBtn");
+const reviewNextBtn = document.getElementById("reviewNextBtn");
+const reviewClearBtn = document.getElementById("reviewClearBtn");
+const reviewQualityContainer = document.getElementById("reviewQualityOptions");
+const reviewPrecisionContainer = document.getElementById("reviewPrecisionOptions");
 
 const WHEEL_PADDING = 60;
 const MAX_LANES = 9;
@@ -18,6 +28,10 @@ const WHEEL_SETTINGS = {
     emotion: { nodeSize: 96, baseInnerRatio: 0.2, movesPerLane: 5 },
     behavior: { nodeSize: 96, baseInnerRatio: 0.2, movesPerLane: 5 },
 };
+const REVIEW_KEYMAP = {
+    quality: ["1", "2", "3"],
+    precision: ["q", "w"],
+};
 
 const appState = {
     wheels: {},
@@ -33,6 +47,14 @@ const appState = {
     manualMode: false,
     positionsDirty: false,
     layoutOverrides: new Map(),
+    moveOrder: [],
+    review: {
+        enabled: false,
+        active: false,
+        currentMoveId: null,
+        options: { quality: [], precision: [] },
+        saving: false,
+    },
 };
 const manualState = {
     drag: null,
@@ -70,6 +92,12 @@ function clamp(value, min, max) {
     return Math.min(max, Math.max(min, value));
 }
 
+function isTypingTarget(element) {
+    if (!element) return false;
+    const tag = element.tagName;
+    return tag === "INPUT" || tag === "TEXTAREA" || element.isContentEditable;
+}
+
 function hexToRgba(hex, alpha) {
     if (!hex) {
         return `rgba(255, 255, 255, ${alpha})`;
@@ -85,6 +113,19 @@ function hexToRgba(hex, alpha) {
     return `rgba(${r}, ${g}, ${b}, ${alpha})`;
 }
 
+function capitalize(value) {
+    if (!value) return "";
+    return value.charAt(0).toUpperCase() + value.slice(1);
+}
+
+function isMoveReviewed(move) {
+    return Boolean(move?.quality && move?.precision);
+}
+
+function needsReview(move) {
+    return Boolean(move) && (!move.quality || !move.precision);
+}
+
 function applySectorColor(element, color, { backgroundAlpha = 0.9, borderAlpha = 0.95 } = {}) {
     const base = hexToRgba(color, backgroundAlpha);
     const fade = hexToRgba(color, 0.45);
@@ -93,6 +134,35 @@ function applySectorColor(element, color, { backgroundAlpha = 0.9, borderAlpha =
     element.style.boxShadow = `0 15px 35px ${hexToRgba(color, 0.35)}`;
 }
 
+function updateNodeReviewBadge(node, move) {
+    const badge = node.querySelector(".node-review");
+    if (!badge) return;
+    const chunks = [];
+    if (move.quality) {
+        chunks.push(capitalize(move.quality));
+    }
+    if (move.precision) {
+        chunks.push(capitalize(move.precision));
+    }
+    if (!chunks.length) {
+        badge.textContent = "";
+        badge.classList.add("hidden");
+    } else {
+        badge.textContent = chunks.join(" · ");
+        badge.classList.remove("hidden");
+    }
+    node.classList.toggle("review-complete", isMoveReviewed(move));
+}
+
+function refreshMoveIndicators(moveId) {
+    if (!moveId) return;
+    const move = appState.moveIndex.get(moveId);
+    if (!move) return;
+    document.querySelectorAll(`.wheel-node[data-move="${moveId}"]`).forEach((node) => {
+        updateNodeReviewBadge(node, move);
+    });
+}
+
 function showToast(message) {
     toast.textContent = message;
     toast.classList.add("visible");
@@ -135,14 +205,21 @@ function buildStructures(data) {
     appState.positions = new Map();
     appState.positionsDirty = false;
     appState.layoutOverrides = new Map();
+    appState.moveOrder = [];
 
     Object.entries(appState.wheels).forEach(([, wheel]) => {
         (wheel.sectors || []).forEach((sector) => {
             (sector.moves || []).forEach((move) => {
+                if (!appState.moveIndex.has(move.id)) {
+                    appState.moveOrder.push(move.id);
+                }
                 appState.moveIndex.set(move.id, move);
             });
         });
     });
+    if (appState.review.currentMoveId && !appState.moveIndex.has(appState.review.currentMoveId)) {
+        appState.review.currentMoveId = null;
+    }
 }
 
 function getWheelSetting(key) {
@@ -199,7 +276,9 @@ function createNodeElement(move, wheelKey) {
     node.innerHTML = `
         <span class="node-title">${move.label}</span>
         <span class="node-meta">${move.duration_bucket.toUpperCase()}</span>
+        <span class="node-review${move.quality || move.precision ? "" : " hidden"}"></span>
     `;
+    updateNodeReviewBadge(node, move);
 
     if (!move.available) {
         node.classList.add("unavailable");
@@ -326,6 +405,9 @@ function renderAllWheels() {
     renderWheel("emotion");
     renderWheel("behavior");
     updateWheelStageSpacing();
+    if (appState.review.active) {
+        highlightReviewTarget(appState.review.currentMoveId);
+    }
 }
 
 function updateWheelStageSpacing() {
@@ -556,10 +638,19 @@ function showTooltip(move) {
         hasRecorded && Math.abs(move.recorded_duration - move.duration_seconds) > 0.01
             ? `<br><small>Recorded duration: ${move.recorded_duration.toFixed(2)}s</small>`
             : "";
+    const reviewBits = [];
+    if (move.quality) {
+        reviewBits.push(`Quality: ${capitalize(move.quality)}`);
+    }
+    if (move.precision) {
+        reviewBits.push(`Precision: ${capitalize(move.precision)}`);
+    }
+    const reviewLine = reviewBits.length ? `<small class="muted">Review · ${reviewBits.join(" · ")}</small>` : "";
     tooltip.innerHTML = `
         <strong>${move.label}</strong>
         <small class="muted">dataset: ${datasetId}</small>
         <span>${move.wheel_sector} • ${duration} • ${move.duration_bucket.toUpperCase()} ${availability}</span>
+        ${reviewLine}
         <p>${move.description || "No description yet."}</p>
         <small>Intensity ${move.intensity.toFixed(1)}${recorded}</small>
     `;
@@ -576,6 +667,12 @@ function highlightSector(sector, enabled) {
     });
 }
 
+function highlightReviewTarget(moveId) {
+    document.querySelectorAll(".wheel-node").forEach((node) => {
+        node.classList.toggle("review-target", node.dataset.move === moveId);
+    });
+}
+
 function summarizeList(items, formatter) {
     if (!items?.length) {
         return "";
@@ -707,6 +804,245 @@ function updateCoherencePanel(coherence) {
     `;
 }
 
+function reviewEnabled() {
+    return Boolean(appState.review.enabled);
+}
+
+function buildReviewOptionButtons() {
+    if (!reviewEnabled()) return;
+    if (reviewQualityContainer) {
+        reviewQualityContainer.innerHTML = "";
+        appState.review.options.quality.forEach((value, index) => {
+            const btn = document.createElement("button");
+            btn.type = "button";
+            btn.className = "review-option";
+            btn.dataset.type = "quality";
+            btn.dataset.value = value;
+            const shortcut = REVIEW_KEYMAP.quality[index];
+            btn.textContent = capitalize(value);
+            if (shortcut) {
+                btn.title = `Shortcut ${shortcut}`;
+                btn.dataset.shortcut = shortcut;
+            }
+            btn.addEventListener("click", () => handleReviewSelection("quality", value));
+            reviewQualityContainer.appendChild(btn);
+        });
+    }
+    if (reviewPrecisionContainer) {
+        reviewPrecisionContainer.innerHTML = "";
+        appState.review.options.precision.forEach((value, index) => {
+            const btn = document.createElement("button");
+            btn.type = "button";
+            btn.className = "review-option";
+            btn.dataset.type = "precision";
+            btn.dataset.value = value;
+            const shortcut = REVIEW_KEYMAP.precision[index];
+            btn.textContent = capitalize(value);
+            if (shortcut) {
+                btn.title = `Shortcut ${shortcut.toUpperCase()}`;
+                btn.dataset.shortcut = shortcut;
+            }
+            btn.addEventListener("click", () => handleReviewSelection("precision", value));
+            reviewPrecisionContainer.appendChild(btn);
+        });
+    }
+}
+
+function updateReviewButtonsState(move) {
+    if (!reviewPanel) return;
+    const buttons = reviewPanel.querySelectorAll(".review-option");
+    buttons.forEach((btn) => {
+        const type = btn.dataset.type;
+        const value = btn.dataset.value;
+        let isActive = false;
+        if (type === "quality") {
+            isActive = move?.quality === value;
+        } else if (type === "precision") {
+            isActive = move?.precision === value;
+        }
+        btn.classList.toggle("active", isActive);
+        btn.disabled = !appState.review.active;
+    });
+}
+
+function updateReviewProgress() {
+    if (!reviewProgressEl) return;
+    const total = appState.moveIndex.size;
+    if (!total) {
+        reviewProgressEl.textContent = "0 / 0";
+        return;
+    }
+    let reviewed = 0;
+    appState.moveIndex.forEach((move) => {
+        if (isMoveReviewed(move)) {
+            reviewed += 1;
+        }
+    });
+    reviewProgressEl.textContent = `${reviewed} / ${total}`;
+}
+
+function setReviewMode(active) {
+    if (!reviewEnabled()) return;
+    const nextState = Boolean(active);
+    if (nextState && appState.manualMode) {
+        toggleManualMode(false);
+    }
+    appState.review.active = nextState;
+    document.body.classList.toggle("review-mode", nextState);
+    if (reviewPanel) {
+        reviewPanel.hidden = !nextState;
+    }
+    if (!nextState) {
+        highlightReviewTarget(null);
+    } else if (!appState.review.currentMoveId) {
+        const next = findNextReviewTarget(true);
+        if (next) {
+            setActiveReviewMove(next);
+        }
+    }
+    updateReviewPanel();
+    if (reviewToggleBtn) {
+        reviewToggleBtn.textContent = nextState ? "Exit review mode" : "Review mode";
+    }
+}
+
+function setActiveReviewMove(moveId) {
+    if (!reviewEnabled()) return;
+    if (moveId && !appState.moveIndex.has(moveId)) {
+        return;
+    }
+    appState.review.currentMoveId = moveId || null;
+    updateReviewPanel();
+}
+
+function updateReviewPanel() {
+    if (!reviewPanel) return;
+    if (!appState.review.active || !reviewEnabled()) {
+        reviewPanel.hidden = true;
+        highlightReviewTarget(null);
+        updateReviewProgress();
+        return;
+    }
+    reviewPanel.hidden = false;
+
+    const moveId = appState.review.currentMoveId;
+    const move = moveId ? appState.moveIndex.get(moveId) : null;
+
+    if (reviewMoveLabel) {
+        reviewMoveLabel.textContent = move ? move.label : "Select a move to begin.";
+    }
+    if (reviewMoveId) {
+        reviewMoveId.textContent = move ? move.id : "";
+    }
+    if (reviewNextBtn) {
+        reviewNextBtn.disabled = !Boolean(findNextReviewTarget(true));
+    }
+    if (reviewClearBtn) {
+        reviewClearBtn.disabled = !move;
+    }
+
+    updateReviewButtonsState(move);
+    highlightReviewTarget(moveId);
+    updateReviewProgress();
+}
+
+function findNextReviewTarget(requireUnreviewed = false) {
+    if (!appState.moveOrder.length) return null;
+    const currentId = appState.review.currentMoveId;
+    let startIndex = currentId ? appState.moveOrder.indexOf(currentId) : -1;
+    if (startIndex === -1) {
+        startIndex = -1;
+    }
+    const total = appState.moveOrder.length;
+    for (let offset = 1; offset <= total; offset += 1) {
+        const idx = (startIndex + offset) % total;
+        const candidateId = appState.moveOrder[idx];
+        const move = appState.moveIndex.get(candidateId);
+        if (!move) continue;
+        if (!requireUnreviewed || needsReview(move)) {
+            return candidateId;
+        }
+    }
+    return null;
+}
+
+async function goToNextUnreviewed(autoPlay = false) {
+    const next = findNextReviewTarget(true);
+    if (!next) {
+        showToast("All moves have review notes.");
+        return;
+    }
+    setActiveReviewMove(next);
+    if (autoPlay && !appState.manualMode && !appState.busy) {
+        triggerPlay(next);
+    }
+}
+
+async function persistReviewMove(moveId, ratings) {
+    if (!reviewEnabled() || !moveId) return;
+    try {
+        appState.review.saving = true;
+        reviewPanel?.classList.add("saving");
+        const body = {
+            quality: ratings.quality ?? null,
+            precision: ratings.precision ?? null,
+        };
+        await fetchJson(`/api/review/${encodeURIComponent(moveId)}`, {
+            method: "POST",
+            body,
+        });
+        const move = appState.moveIndex.get(moveId);
+        if (move) {
+            move.quality = body.quality;
+            move.precision = body.precision;
+            refreshMoveIndicators(moveId);
+        }
+        updateReviewPanel();
+    } catch (error) {
+        console.error(error);
+        showToast("Failed to save review.");
+    } finally {
+        appState.review.saving = false;
+        reviewPanel?.classList.remove("saving");
+    }
+}
+
+function handleReviewSelection(type, value) {
+    if (!appState.review.active) {
+        showToast("Enable review mode first.");
+        return;
+    }
+    const moveId = appState.review.currentMoveId;
+    if (!moveId) {
+        showToast("Select a move to review.");
+        return;
+    }
+    const move = appState.moveIndex.get(moveId);
+    if (!move) {
+        showToast("Move unavailable.");
+        return;
+    }
+    const nextRatings = {
+        quality: move.quality ?? null,
+        precision: move.precision ?? null,
+    };
+    if (type === "quality") {
+        nextRatings.quality = move.quality === value ? null : value;
+    } else if (type === "precision") {
+        nextRatings.precision = move.precision === value ? null : value;
+    }
+    persistReviewMove(moveId, nextRatings);
+}
+
+function clearReviewForMove() {
+    const moveId = appState.review.currentMoveId;
+    if (!moveId) {
+        showToast("Select a move first.");
+        return;
+    }
+    persistReviewMove(moveId, { quality: null, precision: null });
+}
+
 function updateManualControls() {
     document.body.classList.toggle("manual-mode", appState.manualMode);
     if (layoutModeBtn) {
@@ -776,9 +1112,47 @@ async function loadAndRender() {
     setPositionsDirty(false);
     updateManualControls();
     setBusyState(appState.busy, appState.currentMove);
+    updateReviewPanel();
+}
+
+async function initReviewConfig() {
+    if (!reviewPanel) return;
+    try {
+        const config = await fetchJson("/api/review/config");
+        appState.review.enabled = Boolean(config.enabled);
+        appState.review.options = {
+            quality: config.quality_options || [],
+            precision: config.precision_options || [],
+        };
+        if (appState.review.enabled) {
+            buildReviewOptionButtons();
+            reviewPanel.hidden = true;
+            if (reviewToggleBtn) {
+                reviewToggleBtn.hidden = false;
+                reviewToggleBtn.textContent = "Review mode";
+            }
+        } else {
+            reviewPanel.hidden = true;
+            if (reviewToggleBtn) {
+                reviewToggleBtn.hidden = true;
+            }
+        }
+    } catch (error) {
+        console.info("Review mode unavailable", error);
+        appState.review.enabled = false;
+        if (reviewPanel) {
+            reviewPanel.hidden = true;
+        }
+        if (reviewToggleBtn) {
+            reviewToggleBtn.hidden = true;
+        }
+    }
 }
 
 async function triggerPlay(moveId) {
+    if (appState.review.active) {
+        setActiveReviewMove(moveId);
+    }
     if (appState.manualMode) {
         showToast("Exit layout mode to play moves.");
         return;
@@ -824,6 +1198,7 @@ async function pollState() {
 
 async function init() {
     try {
+        await initReviewConfig();
         await loadAndRender();
         setBusyState(false, null);
         pollState();
@@ -853,3 +1228,40 @@ layoutSaveBtn?.addEventListener("click", () => {
     saveLayout();
 });
 layoutResetBtn?.addEventListener("click", () => resetLayout());
+reviewToggleBtn?.addEventListener("click", () => {
+    if (!reviewEnabled()) return;
+    setReviewMode(!appState.review.active);
+});
+reviewExitBtn?.addEventListener("click", () => setReviewMode(false));
+reviewNextBtn?.addEventListener("click", () => goToNextUnreviewed(true));
+reviewClearBtn?.addEventListener("click", () => clearReviewForMove());
+window.addEventListener("keydown", (event) => {
+    if (!reviewEnabled()) return;
+    const key = event.key?.toLowerCase();
+    const rawKey = event.key;
+    if (!appState.review.active || isTypingTarget(event.target)) {
+        return;
+    }
+    if (REVIEW_KEYMAP.quality.includes(rawKey)) {
+        event.preventDefault();
+        const idx = REVIEW_KEYMAP.quality.indexOf(rawKey);
+        const option = appState.review.options.quality[idx];
+        if (option) {
+            handleReviewSelection("quality", option);
+        }
+        return;
+    }
+    if (REVIEW_KEYMAP.precision.includes(key)) {
+        event.preventDefault();
+        const idx = REVIEW_KEYMAP.precision.indexOf(key);
+        const option = appState.review.options.precision[idx];
+        if (option) {
+            handleReviewSelection("precision", option);
+        }
+        return;
+    }
+    if (key === "n") {
+        event.preventDefault();
+        goToNextUnreviewed(true);
+    }
+});

emotions/static/style.css

@@ -119,6 +119,11 @@ body {
     color: var(--text-muted);
 }
 
+.control-btn.tertiary {
+    border-style: dashed;
+    color: var(--text-muted);
+}
+
 .control-btn:disabled {
     opacity: 0.4;
     cursor: not-allowed;
@@ -337,6 +342,42 @@ body {
     display: none;
 }
 
+.node-review {
+    display: none;
+    font-size: 0.65rem;
+    text-transform: uppercase;
+    letter-spacing: 0.08em;
+    color: rgba(245, 247, 255, 0.55);
+    margin-top: 4px;
+}
+
+.review-mode .wheel-node .node-review {
+    display: block;
+}
+
+.node-review.hidden {
+    display: none;
+}
+
+.review-mode .wheel-node.review-complete::after {
+    content: "";
+    position: absolute;
+    inset: -6px;
+    border-radius: 50%;
+    border: 2px solid rgba(123, 211, 137, 0.8);
+    box-shadow: 0 0 18px rgba(123, 211, 137, 0.45);
+    pointer-events: none;
+}
+
+.review-mode .wheel-node.review-target::before {
+    content: "";
+    position: absolute;
+    inset: -10px;
+    border-radius: 50%;
+    border: 2px dashed rgba(100, 214, 255, 0.9);
+    pointer-events: none;
+}
+
 .coherence-panel {
     margin: 180px auto 0;
     padding: 16px 0;
@@ -399,6 +440,151 @@ body {
     font-style: italic;
 }
 
+.review-panel {
+    margin: 40px auto 20px;
+    max-width: 1100px;
+    border-radius: 24px;
+    border: 1px solid rgba(255, 255, 255, 0.08);
+    padding: 24px 28px;
+    color: var(--text-soft);
+    display: flex;
+    flex-direction: column;
+    gap: 18px;
+    background: rgba(7, 11, 22, 0.6);
+    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.55);
+}
+
+.review-panel.saving {
+    opacity: 0.75;
+    pointer-events: none;
+}
+
+.review-panel[hidden] {
+    display: none;
+}
+
+.review-panel header {
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    gap: 12px;
+    align-items: center;
+}
+
+.review-panel header strong {
+    text-transform: uppercase;
+    letter-spacing: 0.3em;
+    font-size: 0.85rem;
+}
+
+.review-instructions {
+    margin: 6px 0 0;
+    font-size: 0.85rem;
+    color: var(--text-muted);
+}
+
+.review-instructions summary {
+    cursor: pointer;
+    letter-spacing: 0.15em;
+    text-transform: uppercase;
+}
+
+.review-instructions ul {
+    margin: 8px 0 0 16px;
+    padding: 0;
+    list-style: disc;
+    color: var(--text-soft);
+    font-size: 0.9rem;
+}
+
+.review-instructions code {
+    background: rgba(255, 255, 255, 0.08);
+    padding: 2px 6px;
+    border-radius: 6px;
+    font-size: 0.8rem;
+}
+
+.review-progress {
+    font-variant-numeric: tabular-nums;
+    letter-spacing: 0.12em;
+    font-size: 0.85rem;
+    color: var(--text-muted);
+}
+
+.review-current {
+    display: flex;
+    justify-content: space-between;
+    gap: 24px;
+    flex-wrap: wrap;
+    align-items: center;
+    padding: 12px 0 0;
+}
+
+.review-current p {
+    margin: 0;
+    font-size: 1rem;
+}
+
+.review-current .muted {
+    color: var(--text-muted);
+}
+
+.review-current-actions {
+    display: flex;
+    gap: 10px;
+    flex-wrap: wrap;
+}
+
+.review-controls {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+    gap: 18px;
+}
+
+.review-controls article {
+    background: rgba(7, 11, 22, 0.65);
+    border: 1px solid rgba(255, 255, 255, 0.07);
+    border-radius: 14px;
+    padding: 18px;
+}
+
+.review-controls h3 {
+    margin: 0 0 10px;
+    text-transform: uppercase;
+    letter-spacing: 0.2em;
+    font-size: 0.8rem;
+    color: var(--text-muted);
+}
+
+.review-options {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 12px;
+}
+
+.review-option {
+    border: 1px solid rgba(255, 255, 255, 0.15);
+    background: transparent;
+    color: var(--text-strong);
+    border-radius: 999px;
+    padding: 8px 18px;
+    text-transform: uppercase;
+    letter-spacing: 0.18em;
+    font-size: 0.78rem;
+    cursor: pointer;
+    transition: background 0.2s ease, border-color 0.2s ease;
+}
+
+.review-option.active {
+    background: rgba(255, 255, 255, 0.12);
+    border-color: rgba(255, 255, 255, 0.35);
+}
+
+.review-option:disabled {
+    opacity: 0.4;
+    cursor: not-allowed;
+}
+
 .credits-panel {
     margin: 48px auto 0;
     padding: 18px 0 0;

ressources/emotions.yml

@@ -203,6 +203,8 @@ moves:
     position:
       angle: 22.5
       radius: 1.272667
+    quality: bad
+    precision: clear
   - id: come1
     clean_name: Come Here
     type: behavior
@@ -308,6 +310,8 @@ moves:
     position:
       angle: 292.5
       radius: 0.747667
+    quality: ok
+    precision: clear
   - id: displeased2
     clean_name: Displeased
     type: behavior
@@ -415,6 +419,8 @@ moves:
     position:
       angle: 292.5
       radius: 1.825667
+    precision: ambiguous
+    quality: ok
   - id: furious1
     clean_name: Furious
     type: emotion
@@ -427,6 +433,8 @@ moves:
     position:
       angle: 292.5
       radius: 2.917667
+    quality: ok
+    precision: ambiguous
   - id: go_away1
     clean_name: Go Away
     type: behavior
@@ -568,6 +576,8 @@ moves:
     position:
       angle: 292.5
       radius: 1.272667
+    precision: clear
+    quality: ok
   - id: irritated2
     clean_name: Irritated
     type: emotion
@@ -580,6 +590,8 @@ moves:
     position:
       angle: 292.5
       radius: 2.378667
+    precision: clear
+    quality: ok
   - id: laughing1
     clean_name: Laughing
     type: behavior
@@ -744,6 +756,8 @@ moves:
     position:
       angle: 292.5
       radius: 3.442667
+    quality: excellent
+    precision: clear
   - id: relief1
     clean_name: Relief
     type: emotion