Mise à jour de l'interface et de la récupération et du rejeu des signaux

coquille/Jalon2OPTI.py

@@ -1,3 +1,4 @@
+import time
 import cv2
 from mediapipe.tasks import python
 from mediapipe.tasks.python import vision
@@ -5,224 +6,265 @@ from mediapipe import Image, ImageFormat
 import numpy as np
 import urllib.request
 import csv
+import os
+import sys
+import subprocess
+import shutil
+
+if len(sys.argv) < 2:
+    print("Usage: python Jalon2OPTI.py <video_file> [nom_personnalise]")
+    sys.exit(1)
+
+video_path = sys.argv[1]
+if not os.path.exists(video_path):
+    print(f"Erreur: Le fichier '{video_path}' n'existe pas.")
+    sys.exit(1)
+
+video_name_with_ext = os.path.basename(video_path)
+video_ext = os.path.splitext(video_name_with_ext)[1]
+
+if len(sys.argv) >= 3 and sys.argv[2].strip():
+    video_name = sys.argv[2].strip()
+else:
+    video_name = os.path.splitext(video_name_with_ext)[0]
+
+dossier = os.path.dirname(os.path.abspath(sys.argv[0]))
+
+output_video_path = os.path.join(dossier, f"{video_name}(landmarks){video_ext}")
+output_csv_path   = os.path.join(dossier, f"{video_name}.csv")
+temp_video_path   = os.path.join(dossier, f"{video_name}_temp_raw.mp4")
+
+print(f"Vidéo d'entrée   : {video_path}")
+print(f"CSV de sortie    : {output_csv_path}")
+print(f"Vidéo annotée    : {output_video_path}")
+
+model_path = os.path.join(dossier, "face_landmarker.task")
+if not os.path.exists(model_path):
+    print("Téléchargement du modèle face_landmarker...")
+    urllib.request.urlretrieve(
+        "https://storage.googleapis.com/mediapipe-models/face_landmarker/face_landmarker/float16/1/face_landmarker.task",
+        model_path
+    )
 
-### ÉTAPE 1 : CHARGER LE MODÈLE MEDIAPIPE ###
-
-urllib.request.urlretrieve(
-    "https://storage.googleapis.com/mediapipe-models/face_landmarker/face_landmarker/float16/1/face_landmarker.task",
-    "face_landmarker.task"
+options = vision.FaceLandmarkerOptions(
+    base_options=python.BaseOptions(model_asset_path=model_path),
+    running_mode=vision.RunningMode.VIDEO,
+    num_faces=1,
+    min_face_detection_confidence=0.7,
+    min_tracking_confidence=0.5
 )
+detector = vision.FaceLandmarker.create_from_options(options)
 
-### ÉTAPE 2 : CONFIGURATION DU MODÈLE ###
-
-options = vision.FaceLandmarkerOptions(                                             # Configuration d'un modèle de détection de visage
-    base_options = python.BaseOptions(model_asset_path="face_landmarker.task"),     # Indique le chemin vers le fichier du modèle
-    running_mode=vision.RunningMode.VIDEO,											# Activation du mode vidéo
-    num_faces = 1,                                                                  # Nombre de visage à détecter
-    min_face_detection_confidence = 0.7,                                            # Seuil minimum de confiance
-    min_tracking_confidence = 0.5)                                                  # Seuil de confiance dans le tracking
-
-detector = vision.FaceLandmarker.create_from_options(options)                       # Création du détecteur
-
-### ÉTAPE 3 : CHARGER LA VIDÉO ###
-
-video_path = "video.mp4"                                                           # Chemin de la vidéo
-cap = cv2.VideoCapture(video_path)                                                  # Créer un objet qui permet de lire la vidéo frame par frame
+cap          = cv2.VideoCapture(video_path)
+fps          = cap.get(cv2.CAP_PROP_FPS)
+frame_width  = int(cap.get(cv2.CAP_PROP_FRAME_WIDTH))
+frame_height = int(cap.get(cv2.CAP_PROP_FRAME_HEIGHT))
+frame_index  = 0
 
-fps = cap.get(cv2.CAP_PROP_FPS)                                                     # Récupère le nombre de frame par seconde de la vidéo
-frame_index = 0                                                                     # Initialise un compteur de frame
+fourcc = cv2.VideoWriter_fourcc(*'mp4v')
+out    = cv2.VideoWriter(temp_video_path, fourcc, fps, (frame_width, frame_height))
 
-### ÉTAPE 4 : CRÉATION DU FICHIER CSV ###
+csv_file   = open(output_csv_path, "w", newline="", encoding="utf-8")
+csv_writer = csv.writer(csv_file)
+csv_writer.writerow(["timestamp", "bouche", "oeil_g", "oeil_d", "pitch", "yaw", "roll", "norm_x", "norm_y"])
 
-csv_file = open("resultats.csv", "w", newline="", encoding="utf-8")					# Crée/Ouvre un fichier csv en mode écriture
-csv_writer = csv.writer(csv_file)													# Crée un objet pour écrire sur le fichier csv
-
-csv_writer.writerow([
-    "timestamp", "bouche", "oeil_g", "oeil_d",
-    "pitch", "yaw", "roll", "norm_x", "norm_y"										#Écrit l'en-tête du fichier
-])
-
-### FONCTIONS UTILITAIRES ###
 
 def generic_optic(width, height):
-    focal_length = width                                             # Estimation d'une optique générique en fonction d'une largeur et d'un centre moyens
+    focal_length = width
     cx, cy = width / 2, height / 2
-    camera_matrix = np.array([
-        [focal_length, 0,            cx],
-        [0,            focal_length, cy],
-        [0,            0,            1 ]
-    ], dtype=np.float64)
+    camera_matrix = np.array([[focal_length, 0, cx], [0, focal_length, cy], [0, 0, 1]], dtype=np.float64)
+    return camera_matrix, np.zeros((4, 1))
 
-    dist_coeffs = np.zeros((4, 1))                                  # Définition des distortions de l'objectif à 0
-    
-    return camera_matrix, dist_coeffs
 
 def compute_head_pose(landmarks, frame_w, frame_h):
-    
-    model_points = np.array([                                           # Modèle 3D générique d'un visage humain moyen
-        [0.0,    0.0,    0.0   ],                                       # Bout du nez
-        [0.0,   -330.0, -65.0 ],                                        # Menton
-        [-225.0, 170.0, -135.0],                                        # Coin oeil gauche
-        [225.0,  170.0, -135.0],                                        # Coin oeil droit
-        [-150.0,-150.0, -125.0],                                        # Coin bouche gauche
-        [150.0, -150.0, -125.0],                                        # Coin bouche droit
+    model_points = np.array([
+        [0.0, 0.0, 0.0], [0.0, -330.0, -65.0], [-225.0, 170.0, -135.0],
+        [225.0, 170.0, -135.0], [-150.0, -150.0, -125.0], [150.0, -150.0, -125.0]
     ], dtype=np.float64)
-
-    indices = [1, 152, 33, 263, 61, 291]                                # Indices des landmarks correspondant à ces derniers
-
-    image_points = np.array([                                           # Récupère la position 2D des 6 landmarks et les convertit en pixels
-        [landmarks[i].x * frame_w, landmarks[i].y * frame_h]
-        for i in indices
-    ], dtype=np.float64)
-
+    indices = [1, 152, 33, 263, 61, 291]
+    image_points = np.array([[landmarks[i].x * frame_w, landmarks[i].y * frame_h] for i in indices], dtype=np.float64)
     camera_matrix, dist_coeffs = generic_optic(frame_w, frame_h)
-    
-
-    success, rotation_vec, translation_vec = cv2.solvePnP(              # Permet de trouver l'orientation de la tête à partir des différents points
-        model_points, image_points, camera_matrix, dist_coeffs,
-        flags=cv2.SOLVEPNP_ITERATIVE
-    )
-
-    if not success:                                                     # Si détection ne marche pas alors ne renvoie rien
+    success, rotation_vec, translation_vec = cv2.solvePnP(model_points, image_points, camera_matrix, dist_coeffs, flags=cv2.SOLVEPNP_ITERATIVE)
+    if not success:
         return None, None, None, None, None
-
-    rotation_mat, _ = cv2.Rodrigues(rotation_vec)                                   # Conversion vecteur rotation -> matrice -> angles d'Euler
+    rotation_mat, _ = cv2.Rodrigues(rotation_vec)
     pose_mat = cv2.hconcat([rotation_mat, translation_vec])
     _, _, _, _, _, _, euler_angles = cv2.decomposeProjectionMatrix(pose_mat)
-
-    pitch = euler_angles[0, 0]                                                      # Haut / bas
-    yaw   = euler_angles[1, 0]                                                      # Gauche / droite
-    roll  = euler_angles[2, 0]                                                      # Inclinaison latérale
-
-    return pitch, yaw, roll, rotation_vec, translation_vec
+    return euler_angles[0, 0], euler_angles[1, 0], euler_angles[2, 0], rotation_vec, translation_vec
 
 
-def compute_face_position(landmarks, frame_w, frame_h):                             # Calcule la position et la taille du visage dans l'image
-
+def compute_face_position(landmarks, frame_w, frame_h):
     xs = [lm.x for lm in landmarks]
     ys = [lm.y for lm in landmarks]
-
     x_min, x_max = min(xs), max(xs)
     y_min, y_max = min(ys), max(ys)
-
-    center_x = int(((x_min + x_max) / 2) * frame_w)                                 # Centre du visage en pixels
+    center_x = int(((x_min + x_max) / 2) * frame_w)
     center_y = int(((y_min + y_max) / 2) * frame_h)
-
-    norm_x = ((x_min + x_max) / 2 - 0.5) * 2                                        # Position normalisée : 0,0 = centre de l'image, +=1 = bords
+    norm_x = ((x_min + x_max) / 2 - 0.5) * 2
     norm_y = ((y_min + y_max) / 2 - 0.5) * 2
-
-    face_w = int((x_max - x_min) * frame_w)                                         # Taille de la boite en pixels
+    face_w = int((x_max - x_min) * frame_w)
     face_h = int((y_max - y_min) * frame_h)
-
-    face_size_ratio = ((x_max - x_min) * (y_max - y_min)) ** 0.5                    # Ratio taille visage / taille image
-
+    face_size_ratio = ((x_max - x_min) * (y_max - y_min)) ** 0.5
     return center_x, center_y, norm_x, norm_y, face_w, face_h, face_size_ratio, \
-           (int(x_min * frame_w), int(y_min * frame_h),
-            int(x_max * frame_w), int(y_max * frame_h))                             # Renvoie la position du visage à partir des variables d'avant
+           (int(x_min * frame_w), int(y_min * frame_h), int(x_max * frame_w), int(y_max * frame_h))
 
 
-def draw_axes(frame, rotation_vec, translation_vec, camera_matrix, dist_coeffs, origin):        # Affiche les axes 3D : X=rouge, Y=vert et Z=bleu
-
-    axis_length = 160.0
-    axis_points = np.array([
-        [axis_length, 0.0,         0.0        ],  # X
-        [0.0,         axis_length, 0.0        ],  # Y
-        [0.0,         0.0,        -axis_length],  # Z (vers nous)
-    ], dtype=np.float64)
-
-    projected, _ = cv2.projectPoints(                                                           # Projette les 3 points en coordonnées 2D
-        axis_points, rotation_vec, translation_vec,
-        camera_matrix, dist_coeffs
-    )
-
-    o = (int(origin[0]), int(origin[1]))                                                        # Convertit le point d'origine en un entier
+def draw_axes(frame, rotation_vec, translation_vec, camera_matrix, dist_coeffs, origin):
+    axis_points = np.array([[160.0, 0.0, 0.0], [0.0, 160.0, 0.0], [0.0, 0.0, -160.0]], dtype=np.float64)
+    projected, _ = cv2.projectPoints(axis_points, rotation_vec, translation_vec, camera_matrix, dist_coeffs)
+    o = (int(origin[0]), int(origin[1]))
+    cv2.arrowedLine(frame, o, (int(projected[0][0][0]), int(projected[0][0][1])), (0, 0, 255), 2, tipLength=0.3)
+    cv2.arrowedLine(frame, o, (int(projected[1][0][0]), int(projected[1][0][1])), (0, 255, 0), 2, tipLength=0.3)
+    cv2.arrowedLine(frame, o, (int(projected[2][0][0]), int(projected[2][0][1])), (255, 0, 0), 2, tipLength=0.3)
 
-    cv2.arrowedLine(frame, o, (int(projected[0][0][0]), int(projected[0][0][1])),               # Dessine l'axe X en rouge
-                    (0, 0, 255), 2, tipLength=0.3)
-    cv2.arrowedLine(frame, o, (int(projected[1][0][0]), int(projected[1][0][1])),               # Dessine l'axe Y en vert
-                    (0, 255, 0), 2, tipLength=0.3)
-    cv2.arrowedLine(frame, o, (int(projected[2][0][0]), int(projected[2][0][1])),               # Dessine l'axe Z en bleu
-                    (255, 0, 0), 2, tipLength=0.3)
 
-### ÉTAPE 5 : BOUCLE PRINCIPALE ###
+list_timestamp, list_mouth_open, list_left_eye_open = [], [], []
+list_right_eye_open, list_pitch, list_yaw = [], [], []
+list_roll, list_norm_x, list_norm_y = [], [], []
 
 while True:
-    ret, frame = cap.read()                                             # Lit la frame suivante dans la vidéo
+    ret, frame = cap.read()
     if not ret:
         break
 
-    timestamp = frame_index / fps                                       # Calcule le temps en secondes de la frame actuelle
-    frame_index += 1                                                    # Incrémente le compteur de frame
+    timestamp   = frame_index / fps
+    frame_index += 1
+    h, w, _     = frame.shape
 
-    h, w, _ = frame.shape                                               # Extrait les dimensions de l'image
+    rgb_frame = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)
+    mp_image  = Image(image_format=ImageFormat.SRGB, data=rgb_frame)
+    results   = detector.detect_for_video(mp_image, int(timestamp * 1000))
 
-    rgb_frame = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)                      # Convertit l'image BGR en RGB
-    mp_image = Image(image_format=ImageFormat.SRGB, data=rgb_frame)         # Englobe le tableau numpy dans un objet Image Mediapipe
-
-    timestamp_ms = int(timestamp * 1000)
-    results = detector.detect_for_video(mp_image, timestamp_ms)                              # Detection des landmarks
-
-    if results.face_landmarks:                                          # Si un visage est détécté :
-        landmarks = results.face_landmarks[0]                           # Récupère le premier et le seul visage détécté
-
-        mouth_open = abs(landmarks[13].y - landmarks[14].y)             # Ouverture de la bouche
-
-        left_eye_open  = abs(landmarks[159].y - landmarks[145].y)       # Ouverture des yeux
+    if results.face_landmarks:
+        landmarks = results.face_landmarks[0]
+        mouth_open     = abs(landmarks[13].y - landmarks[14].y)
+        left_eye_open  = abs(landmarks[159].y - landmarks[145].y)
         right_eye_open = abs(landmarks[386].y - landmarks[374].y)
-
-        pitch, yaw, roll, rot_vec, trans_vec = compute_head_pose(landmarks, w, h)       # Orientation complète de la tête (pitch / yaw / roll)
-
-        (center_x, center_y,                                            # Position et taille du visage dans l'image
-         norm_x, norm_y,
-         face_w, face_h,
-         face_size_ratio,
-         bbox) = compute_face_position(landmarks, w, h)
-
-        print(
-            f"t={timestamp:.2f}s | "
-            f"bouche={mouth_open:.3f} | "
-            f"oeil_g={left_eye_open:.3f} | oeil_d={right_eye_open:.3f} | "
-            f"pitch={pitch:+.1f}° | yaw={yaw:+.1f}° | roll={roll:+.1f}° | "
-            f"pos=({norm_x:+.2f}, {norm_y:+.2f})"
-        )
-        csv_writer.writerow([
-            round(timestamp, 2),
-            round(mouth_open, 3),
-            round(left_eye_open, 3),
-            round(right_eye_open, 3),
-            round(pitch, 1),
-            round(yaw, 1),
-            round(roll, 1),
-            round(norm_x, 2),
-            round(norm_y, 2),
-        ])																# Sauvegarde les informations de l'image dans le fichier csv
-
-        for landmark in landmarks:                                      # Affichage des landmarks
-            x = int(landmark.x * w)
-            y = int(landmark.y * h)
-            cv2.circle(frame, (x, y), 1, (0, 255, 0), -1)
-
-        x1, y1, x2, y2 = bbox                                           # Dessine le rectangle autour du visage
-        cv2.rectangle(frame, (x1, y1), (x2, y2), (255, 165, 0), 1)
-
-        cv2.circle(frame, (center_x, center_y), 5, (0, 165, 255), -1)   # Dessine le centre du visage en orange
-
-        cv2.drawMarker(frame, (w // 2, h // 2), (128, 128, 128),        # Croix au centre de l'image
-                       cv2.MARKER_CROSS, 20, 1)
-
-        if rot_vec is not None:                                         # Si compute_head_pose réussit on execute sinon on arrête pour éviter le crash
-            camera_matrix, dist_coeffs = generic_optic(w, h)
-
-            nose_tip = (int(landmarks[1].x * w), int(landmarks[1].y * h))                   # Calcule la position du nez
-            draw_axes(frame, rot_vec, trans_vec, camera_matrix, dist_coeffs, nose_tip)      # Dessine les axes
-
-    cv2.imshow("Motion Capture", frame)                                                     # Affiche la frame
-    if cv2.waitKey(25) & 0xFF == ord('q'):                                                  # Quitte la vidéo avec q
-        break
-
-### ÉTAPE 6 : NETTOYAGE ###
-
-cap.release()                                           # Ferme la vidéo et libère la mémoire associée
-cv2.destroyAllWindows()                                 # Ferme la fenêtre
-detector.close()                                        # Libère le modèle
-csv_file.close()										# Ferme le ficher csv
+        pitch, yaw, roll, rot_vec, trans_vec = compute_head_pose(landmarks, w, h)
+        center_x, center_y, norm_x, norm_y, face_w, face_h, face_size_ratio, bbox = compute_face_position(landmarks, w, h)
+
+        if pitch is not None:
+            yaw   = -yaw
+            pitch = ((pitch + 180) % 360)
+            roll  = max(-40, min(40, roll))
+            pitch = max(-40, min(40, pitch))
+            yaw   = max(-180, min(180, yaw))
+
+            list_timestamp.append(round(timestamp, 2))
+            list_mouth_open.append(round(mouth_open, 3))
+            list_left_eye_open.append(round(left_eye_open, 3))
+            list_right_eye_open.append(round(right_eye_open, 3))
+            list_pitch.append(round(pitch, 1))
+            list_yaw.append(round(yaw, 1))
+            list_roll.append(round(roll, 1))
+            list_norm_x.append(round(norm_x, 2))
+            list_norm_y.append(round(norm_y, 2))
+
+            for landmark in landmarks:
+                cv2.circle(frame, (int(landmark.x * w), int(landmark.y * h)), 1, (0, 255, 0), -1)
+            cv2.rectangle(frame, (bbox[0], bbox[1]), (bbox[2], bbox[3]), (255, 165, 0), 1)
+            cv2.circle(frame, (center_x, center_y), 5, (0, 165, 255), -1)
+            cv2.drawMarker(frame, (w // 2, h // 2), (128, 128, 128), cv2.MARKER_CROSS, 20, 1)
+            if rot_vec is not None:
+                camera_matrix, dist_coeffs = generic_optic(w, h)
+                draw_axes(frame, rot_vec, trans_vec, camera_matrix, dist_coeffs, (int(landmarks[1].x * w), int(landmarks[1].y * h)))
+    elif list_mouth_open:
+        list_timestamp.append(round(timestamp, 2))
+        list_mouth_open.append(list_mouth_open[-1])
+        list_left_eye_open.append(list_left_eye_open[-1])
+        list_right_eye_open.append(list_right_eye_open[-1])
+        list_pitch.append(list_pitch[-1])
+        list_yaw.append(list_yaw[-1])
+        list_roll.append(list_roll[-1])
+        list_norm_x.append(list_norm_x[-1])
+        list_norm_y.append(list_norm_y[-1])
+    else:
+        list_timestamp.append(round(timestamp, 2))
+        list_mouth_open.append(0.0)
+        list_left_eye_open.append(0.0)
+        list_right_eye_open.append(0.0)
+        list_pitch.append(0.0)
+        list_yaw.append(0.0)
+        list_roll.append(0.0)
+        list_norm_x.append(0.0)
+        list_norm_y.append(0.0)
+
+    out.write(frame)
+
+if not list_mouth_open:
+    print("Erreur : aucun visage détecté.")
+    cap.release()
+    out.release()
+    cv2.destroyAllWindows()
+    detector.close()
+    csv_file.close()
+    sys.exit(1)
+
+def norm_list(lst, mi, ma, n_mi, n_ma):
+    return [((i - mi) / (ma - mi)) * (n_ma - n_mi) + n_mi if ma != mi else 0.0 for i in lst]
+
+list_mouth_open     = norm_list(list_mouth_open, min(list_mouth_open), max(list_mouth_open), -0.01, 0.01)
+list_norm_x         = norm_list(list_norm_x, min(list_norm_x), max(list_norm_x), -0.03, 0.03)
+list_norm_y         = norm_list(list_norm_y, min(list_norm_y), max(list_norm_y), -0.0075, 0.0075)
+list_left_eye_open  = norm_list(list_left_eye_open, min(list_left_eye_open), max(list_left_eye_open), 0, -50.0)
+list_right_eye_open = norm_list(list_right_eye_open, min(list_right_eye_open), max(list_right_eye_open), 0, 50.0)
+
+for i in range(len(list_timestamp)):
+    csv_writer.writerow([list_timestamp[i], list_mouth_open[i], list_left_eye_open[i],
+                         list_right_eye_open[i], list_pitch[i], list_yaw[i],
+                         list_roll[i], list_norm_x[i], list_norm_y[i]])
+
+cap.release()
+out.release()
+cv2.destroyAllWindows()
+detector.close()
+csv_file.close()
+
+print("\n[H264] Conversion pour compatibilité navigateur...")
+
+ffmpeg_cmd = shutil.which("ffmpeg")
+if not ffmpeg_cmd:
+    candidates = [
+        r"C:\ffmpeg\bin\ffmpeg.exe",
+        r"C:\Program Files\ffmpeg\bin\ffmpeg.exe",
+        r"C:\Users\adril\scoop\shims\ffmpeg.exe",
+    ]
+    for c in candidates:
+        if os.path.exists(c):
+            ffmpeg_cmd = c
+            break
+
+if ffmpeg_cmd:
+    result = subprocess.run(
+        [ffmpeg_cmd, "-y", "-i", temp_video_path,
+         "-c:v", "libx264", "-preset", "fast", "-crf", "23",
+         "-pix_fmt", "yuv420p", "-movflags", "+faststart",
+         "-an", output_video_path],
+        capture_output=True, text=True
+    )
+    if result.returncode == 0:
+        os.remove(temp_video_path)
+        print("[H264] Succès.")
+    else:
+        os.rename(temp_video_path, output_video_path)
+        print(f"[H264] ffmpeg a échoué : {result.stderr[-300:]}")
+else:
+    os.rename(temp_video_path, output_video_path)
+    print("[H264] ffmpeg introuvable, vidéo en mp4v (illisible dans le navigateur).")
+    print("Installez ffmpeg : winget install ffmpeg")
+
+print(f"\nTerminé : {video_name}")
+
+if ffmpeg_cmd:
+    output_wav_path = os.path.join(dossier, f"{video_name}.wav")
+    wav_result = subprocess.run(
+        [ffmpeg_cmd, "-y", "-i", video_path, "-vn", "-acodec", "pcm_s16le",
+         "-ar", "44100", "-ac", "2", output_wav_path],
+        capture_output=True, text=True
+    )
+    if wav_result.returncode == 0:
+        print(f"[WAV] Audio extrait : {output_wav_path}")
+    else:
+        print(f"[WAV] Échec extraction audio : {wav_result.stderr[-200:]}")
+else:
+    print("[WAV] ffmpeg introuvable, pas d'extraction audio.")

coquille/Jalon3.py

@@ -5,14 +5,23 @@ import numpy as np
 import time
 from pydantic import BaseModel
 import csv
+import soundfile as sf
+import scipy.signal
+import sys
+
+if len(sys.argv) < 3:
+    sys.exit(1)
+
+csv_path = sys.argv[1]
+wav_path = sys.argv[2]
 
 
 class Test(ReachyMiniApp):
     # Optional: URL to a custom configuration page for the app
-    # eg. "http://localhost:8042"
-    custom_app_url: str | None = "http://0.0.0.0:8042"
+    # eg. "http://localhost:8043"
+    custom_app_url: str | None = "http://0.0.0.0:8043"
     # Optional: specify a media backend ("gstreamer", "gstreamer_no_video", "default", etc.)
-    # On the wireless, use gstreamer_no_video to optimise CPU usage if the app does not use video streaming
+    #  On the wireless, use gstreamer_no_video to optimise CPU usage if the app does not use video streaming
     request_media_backend: str | None = None
 
     def run(self, reachy_mini: ReachyMini, stop_event: threading.Event):
@@ -21,71 +30,53 @@ class Test(ReachyMiniApp):
         antennas_enabled = True
         sound_play_requested = False
 
-        # You can ignore this part if you don't want to add settings to your app. If you set custom_app_url to None, you have to remove this part as well.
-        # === vvv ===
-        class AntennaState(BaseModel):
-            enabled: bool
+        # Main control loop
+        def apply_signals(signals_way, audio_way):
+            while not stop_event.is_set():
+                with open(signals_way, newline='') as csvfile:
+                    reader = csv.DictReader(csvfile)
+                    rows = list(reader)
 
-        @self.settings_app.post("/antennas")
-        def update_antennas_state(state: AntennaState):
-            nonlocal antennas_enabled
-            antennas_enabled = state.enabled
-            return {"antennas_enabled": antennas_enabled}
+                last_timestamp = 0
+                audio, samplerate_in = sf.read(audio_way, dtype="float32")
 
-        @self.settings_app.post("/play_sound")
-        def request_sound_play():
-            nonlocal sound_play_requested
-            sound_play_requested = True
+                if audio.ndim > 1:
+                    audio = np.mean(audio, axis=1)
 
-        # === ^^^ ===
+                output_sr = reachy_mini.media.get_output_audio_samplerate()
+                if samplerate_in != output_sr:
+                    audio = scipy.signal.resample(
+                        audio,
+                        int(len(audio) * (output_sr / samplerate_in))
+                    )
 
-        # Main control loop
-        while not stop_event.is_set():
-            with open('resultats.csv', newline='') as csvfile:
-                reader = csv.DictReader(csvfile)
-                rows = list(reader)
-                
-                val_bouche = [float(r["bouche"]) for r in rows]
-                bouche_min = min(val_bouche)
-                bouche_max = max(val_bouche)
-
-                val_norm_x = [float(r["norm_x"]) for r in rows]
-                norm_x_min = min(val_norm_x)
-                norm_x_max = max(val_norm_x)
-                
-                val_norm_y = [float(r["norm_y"]) for r in rows]
-                norm_y_min = min(val_norm_y)
-                norm_y_max = max(val_norm_y)
-
-                val_oeil_g = [float(r["oeil_g"]) for r in rows]
-                oeil_g_min = min(val_oeil_g)
-                oeil_g_max = max(val_oeil_g)
-
-                val_oeil_d = [float(r["oeil_d"]) for r in rows]
-                oeil_d_min = min(val_oeil_d)
-                oeil_d_max = max(val_oeil_d)
-    
-                last_timestamp = 0
+                reachy_mini.media.start_playing()
+                reachy_mini.media.push_audio_sample(audio)
                 for row in rows:
-                    x_pos = ((float(row["bouche"]) - bouche_min) / (bouche_max - bouche_min))*0.02-0.01
-                    y_pos = ((float(row["norm_x"]) - norm_x_min) / (norm_x_max - norm_x_min))*0.06-0.03
-                    z_pos = ((float(row["norm_y"]) - norm_y_min) / (norm_y_max - norm_y_min))*0.015-0.0075
-                    pitch_deg = ((float(row["pitch"])+180) % 360)
+                    x_pos = float(row["bouche"])
+                    y_pos = float(row["norm_x"])
+                    z_pos = float(row["norm_y"])
+                    pitch_deg = float(row["pitch"])
                     yaw_deg = float(row["yaw"])
                     roll_deg = float(row["roll"])
+
                     if antennas_enabled:
-                        amp_deg = 50.0
-                        g = ((float(row["oeil_g"]) - oeil_g_min) / (oeil_g_max - oeil_g_min))*amp_deg
-                        d = ((float(row["oeil_d"]) - oeil_d_min) / (oeil_d_max - oeil_d_min)) * amp_deg
-                        antennas_deg = np.array([-g, d])
+                        g = float(row["oeil_g"])
+                        d = float(row["oeil_d"])
+                        antennas_deg = np.array([g, d])
                     else:
                         antennas_deg = np.array([0.0, 0.0])
                     antennas_rad = np.deg2rad(antennas_deg)
-                    head_pose = create_head_pose(x=x_pos, y=y_pos, z=z_pos, pitch = pitch_deg, yaw = -yaw_deg, roll = roll_deg)
+
+                    head_pose = create_head_pose(x=x_pos, y=y_pos, z=z_pos, pitch=pitch_deg, yaw=yaw_deg, roll=roll_deg)
                     reachy_mini.set_target(head=head_pose, antennas=antennas_rad)
+
                     print(row["timestamp"])
                     time.sleep(float(row['timestamp']) - last_timestamp)
                     last_timestamp = float(row['timestamp'])
+                reachy_mini.media.stop_playing()
+                stop_event.set()
+        apply_signals(csv_path, wav_path)
 
 
 if __name__ == "__main__":
@@ -93,4 +84,4 @@ if __name__ == "__main__":
     try:
         app.wrapped_run()
     except KeyboardInterrupt:
-        app.stop()
+        app.stop()

coquille/main.py

@@ -1,75 +1,158 @@
 import threading
-from reachy_mini import ReachyMini, ReachyMiniApp
-from reachy_mini.utils import create_head_pose
-import numpy as np
+import subprocess
+import sys
+import os
 import time
-from pydantic import BaseModel
+from fastapi import Request
+from fastapi.responses import JSONResponse, FileResponse, StreamingResponse, Response
+from fastapi.staticfiles import StaticFiles
+from reachy_mini import ReachyMini, ReachyMiniApp
 
+DOSSIER = os.path.dirname(os.path.abspath(__file__))
+STATIC = os.path.join(DOSSIER, "static")
 
 class Coquille(ReachyMiniApp):
-    # Optional: URL to a custom configuration page for the app
-    # eg. "http://localhost:8042"
-    custom_app_url: str | None = "http://0.0.0.0:8042"
-    # Optional: specify a media backend ("gstreamer", "gstreamer_no_video", "default", etc.)
-    # On the wireless, use gstreamer_no_video to optimise CPU usage if the app does not use video streaming
+    custom_app_url: str | None = "http://localhost:8043"
     request_media_backend: str | None = None
 
-    def run(self, reachy_mini: ReachyMini, stop_event: threading.Event):
-        t0 = time.time()
+    def __init__(self, *args, **kwargs):
+        super().__init__(*args, **kwargs)
+        self.robot = None
+        self.stop_event = threading.Event()
 
-        antennas_enabled = True
-        sound_play_requested = False
+    def run(self, reachy_mini: ReachyMini, stop_event: threading.Event):
+        self.robot = reachy_mini
+        self.stop_event = stop_event
+        while not stop_event.is_set():
+            time.sleep(0.1)
 
-        # You can ignore this part if you don't want to add settings to your app. If you set custom_app_url to None, you have to remove this part as well.
-        # === vvv ===
-        class AntennaState(BaseModel):
-            enabled: bool
+app = Coquille()
 
-        @self.settings_app.post("/antennas")
-        def update_antennas_state(state: AntennaState):
-            nonlocal antennas_enabled
-            antennas_enabled = state.enabled
-            return {"antennas_enabled": antennas_enabled}
+app.settings_app.mount("/static", StaticFiles(directory=STATIC), name="static")
 
-        @self.settings_app.post("/play_sound")
-        def request_sound_play():
-            nonlocal sound_play_requested
-            sound_play_requested = True
+@app.settings_app.get("/")
+def index():
+    return FileResponse(os.path.join(STATIC, "index.html"))
 
-        # === ^^^ ===
+@app.settings_app.get("/favicon.ico")
+def favicon():
+    return Response(status_code=204)
 
-        # Main control loop
-        while not stop_event.is_set():
-            t = time.time() - t0
+@app.settings_app.get("/liste")
+def liste():
+    fichiers = os.listdir(DOSSIER)
+    noms = [f.replace(".csv", "") for f in fichiers if f.endswith(".csv") and f != "resultats.csv" and "video_temp" not in f]
+    return JSONResponse({"noms": noms})
 
-            yaw_deg = 30.0 * np.sin(2.0 * np.pi * 0.2 * t)
-            head_pose = create_head_pose(yaw=yaw_deg, degrees=True)
+@app.settings_app.post("/charger")
+async def charger(request: Request):
+    form = await request.form()
+    video_file = form.get("video")
+    nom = (form.get("nom") or "").strip()
 
-            if antennas_enabled:
-                amp_deg = 25.0
-                a = amp_deg * np.sin(2.0 * np.pi * 0.5 * t)
-                antennas_deg = np.array([a, -a])
-            else:
-                antennas_deg = np.array([0.0, 0.0])
+    if not video_file or not nom:
+        return JSONResponse({"succes": False, "message": "Vidéo ou nom manquant."}, status_code=400)
 
-            if sound_play_requested:
-                print("Playing sound...")
-                reachy_mini.media.play_sound("wake_up.wav")
-                sound_play_requested = False
+    video_path = os.path.join(DOSSIER, "video_temp.mp4")
+    contents = await video_file.read()
+    with open(video_path, "wb") as f:
+        f.write(contents)
 
-            antennas_rad = np.deg2rad(antennas_deg)
-
-            reachy_mini.set_target(
-                head=head_pose,
-                antennas=antennas_rad,
+    # Étape 1 : extraction landmarks + génération CSV + vidéo mp4v brute
+    try:
+        result = subprocess.run(
+            [sys.executable, os.path.join(DOSSIER, "Jalon2OPTI.py"), video_path, nom],
+            cwd=DOSSIER,
+            capture_output=True,
+            text=True,
+            check=True
+        )
+        print(f"[PIPELINE OK]\n{result.stdout}")
+    except subprocess.CalledProcessError as e:
+        print(f"[PIPELINE ERREUR]\nstdout: {e.stdout}\nstderr: {e.stderr}")
+        return JSONResponse({
+            "succes": False,
+            "message": f"Pipeline échoué : {e.stderr or e.stdout or 'erreur inconnue'}"
+        }, status_code=500)
+
+    # Étape 2 : réencodage H.264 via ffmpeg pour compatibilité navigateur
+    raw_path = os.path.join(DOSSIER, f"{nom}(landmarks).mp4")
+    tmp_path = os.path.join(DOSSIER, f"{nom}(landmarks)_raw.mp4")
+
+    if os.path.exists(raw_path):
+        try:
+            os.rename(raw_path, tmp_path)
+            ffmpeg = subprocess.run(
+                ["ffmpeg", "-y", "-i", tmp_path,
+                 "-vcodec", "libx264", "-pix_fmt", "yuv420p",
+                 "-movflags", "+faststart",
+                 "-an", raw_path],
+                capture_output=True, text=True
             )
-
-            time.sleep(0.02)
-
+            if ffmpeg.returncode == 0:
+                os.remove(tmp_path)
+                print("[FFMPEG] Encodage H.264 réussi")
+            else:
+                # ffmpeg absent ou erreur : on remet le fichier brut
+                os.rename(tmp_path, raw_path)
+                print(f"[FFMPEG] Échec (ffmpeg absent ?), on garde mp4v : {ffmpeg.stderr}")
+        except Exception as e:
+            if os.path.exists(tmp_path) and not os.path.exists(raw_path):
+                os.rename(tmp_path, raw_path)
+            print(f"[FFMPEG] Exception : {e}")
+
+    return JSONResponse({"succes": True, "nom": nom})
+
+@app.settings_app.post("/play")
+async def play(request: Request):
+    data = await request.json()
+    return JSONResponse({"succes": True, "nom": data.get("nom")})
+
+@app.settings_app.get("/video/{nom}")
+def video(nom: str, request: Request):
+    path = os.path.join(DOSSIER, f"{nom}(landmarks).mp4")
+
+    print(f"[VIDEO] Recherche : {path} | Existe : {os.path.exists(path)}")
+    if not os.path.exists(path):
+        mp4s = [f for f in os.listdir(DOSSIER) if f.endswith(".mp4")]
+        print(f"[VIDEO] MP4 disponibles : {mp4s}")
+        return JSONResponse({"succes": False, "message": f"Vidéo introuvable : {path}"}, status_code=404)
+
+    file_size = os.path.getsize(path)
+    range_header = request.headers.get("range")
+
+    if range_header:
+        range_val = range_header.replace("bytes=", "")
+        parts = range_val.split("-")
+        start = int(parts[0])
+        end = int(parts[1]) if parts[1] else file_size - 1
+        end = min(end, file_size - 1)
+        chunk_size = end - start + 1
+
+        def iter_file():
+            with open(path, "rb") as f:
+                f.seek(start)
+                remaining = chunk_size
+                while remaining > 0:
+                    chunk = f.read(min(65536, remaining))
+                    if not chunk:
+                        break
+                    remaining -= len(chunk)
+                    yield chunk
+
+        return StreamingResponse(
+            iter_file(),
+            status_code=206,
+            headers={
+                "Content-Range": f"bytes {start}-{end}/{file_size}",
+                "Accept-Ranges": "bytes",
+                "Content-Length": str(chunk_size),
+            },
+            media_type="video/mp4"
+        )
+    else:
+        return FileResponse(path, media_type="video/mp4", headers={"Accept-Ranges": "bytes"})
 
 if __name__ == "__main__":
-    app = Coquille()
-    try:
-        app.wrapped_run()
-    except KeyboardInterrupt:
-        app.stop()
+    import uvicorn
+    uvicorn.run(app.settings_app, host="127.0.0.1", port=8043)

coquille/programme1.py

@@ -8,8 +8,8 @@ from pydantic import BaseModel
 
 class Test(ReachyMiniApp):
     # Optional: URL to a custom configuration page for the app
-    # eg. "http://localhost:8042"
-    custom_app_url: str | None = "http://0.0.0.0:8042"
+    # eg. "http://localhost:8043"
+    custom_app_url: str | None = "http://0.0.0.0:8043"
     # Optional: specify a media backend ("gstreamer", "gstreamer_no_video", "default", etc.)
     # On the wireless, use gstreamer_no_video to optimise CPU usage if the app does not use video streaming
     request_media_backend: str | None = None

coquille/programme2.py

@@ -8,8 +8,8 @@ from pydantic import BaseModel
 
 class Test(ReachyMiniApp):
     # Optional: URL to a custom configuration page for the app
-    # eg. "http://localhost:8042"
-    custom_app_url: str | None = "http://0.0.0.0:8042"
+    # eg. "http://localhost:8043"
+    custom_app_url: str | None = "http://0.0.0.0:8043"
     # Optional: specify a media backend ("gstreamer", "gstreamer_no_video", "default", etc.)
     # On the wireless, use gstreamer_no_video to optimise CPU usage if the app does not use video streaming
     request_media_backend: str | None = None

coquille/static/index.html

@@ -1,27 +1,71 @@
 <!DOCTYPE html>
-<html lang="en">
-
+<html lang="fr">
 <head>
     <meta charset="UTF-8">
-    <title>Reachy Mini example app template</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Reachy Pipeline</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400;500&family=Syne:wght@400;600;700&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/static/style.css">
 </head>
-
 <body>
-    <h1>Reachy Mini – Control Panel</h1>
 
-    <div id="controls">
-        <label style="display:flex; align-items:center; gap:8px;">
-            <input type="checkbox" id="antenna-checkbox" checked>
-            Antennas
-        </label>
+    <header>
+        <div class="header-left">
+            <span class="logo-mark"></span>
+            <span class="logo-text">reachy<em>pipeline</em></span>
+        </div>
+        <div class="header-right">
+            <span class="status-indicator" id="daemon-status">
+                <span class="dot"></span>daemon offline
+            </span>
+        </div>
+    </header>
+
+    <main>
+
+        <section class="panel" id="panel-source">
+            <div class="panel-label">01 — source</div>
+
+            <div class="video-zone" id="video-zone">
+                <div class="video-placeholder" id="video-placeholder">
+                    <svg width="36" height="36" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.2">
+                        <path d="M15 10l4.553-2.069A1 1 0 0121 8.87v6.26a1 1 0 01-1.447.894L15 14M3 8a2 2 0 012-2h8a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2V8z"/>
+                    </svg>
+                    <span>aucune vidéo</span>
+                </div>
+                <video id="video-preview" style="display:none;" controls></video>
+            </div>
+
+            <div class="input-row">
+                <input type="text" id="recording-name" placeholder="nom de l'enregistrement" autocomplete="off" />
+                <label class="btn btn-ghost" for="file-input">
+                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4M17 8l-5-5-5 5M12 3v12"/></svg>
+                    charger
+                </label>
+                <input type="file" id="file-input" accept="video/*" style="display:none;" />
+            </div>
 
-        <button id="sound-btn">Play Sound</button>
-    </div>
+            <button class="btn btn-primary" id="btn-run" disabled>
+                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="5 3 19 12 5 21 5 3"/></svg>
+                lancer le pipeline
+            </button>
+        </section>
+
+        <section class="panel" id="panel-library">
+            <div class="panel-label">02 — bibliothèque</div>
+
+            <ul class="library-list" id="library-list"></ul>
+        </section>
+
+    </main>
+
+    <footer>
+        <div class="status-line" id="status-line">en attente</div>
+        <div class="progress-bar" id="progress-bar"></div>
+    </footer>
 
-    <div id="status">Antennas status: running</div>
     <script src="/static/main.js"></script>
 </body>
-
 </html>

coquille/static/main.js

@@ -1,47 +1,218 @@
-let antennasEnabled = true;
+document.addEventListener("DOMContentLoaded", () => {
+    const fileInput = document.getElementById('file-input');
+    const runBtn = document.getElementById('btn-run');
+    const nameInput = document.getElementById('recording-name');
+    const preview = document.getElementById('video-preview');
+    const placeholder = document.getElementById('video-placeholder');
 
-async function updateAntennasState(enabled) {
-    try {
-        const resp = await fetch("/antennas", {
-            method: "POST",
-            headers: { "Content-Type": "application/json" },
-            body: JSON.stringify({ enabled }),
-        });
-        const data = await resp.json();
-        antennasEnabled = data.antennas_enabled;
-        updateUI();
-    } catch (e) {
-        document.getElementById("status").textContent = "Backend error";
-    }
-}
+    let selectedFile = null;
+
+    // Chargement initial des éléments enregistrés
+    chargerBibliotheque();
+
+    // 1. Sélection et prévisualisation de la vidéo source brute
+    fileInput.addEventListener('change', (e) => {
+        const file = e.target.files[0];
+        if (!file) return;
+
+        selectedFile = file;
+        preview.src = URL.createObjectURL(file);
+        preview.style.display = 'block';
+        placeholder.style.display = 'none';
+
+        runBtn.disabled = false;
+        updateStatus(`Vidéo prête : ${file.name}`, 'active');
+    });
+
+    // 2. Traitement et envoi au pipeline Jalon2OPTI
+    runBtn.addEventListener('click', async () => {
+        const nom = nameInput.value.trim();
+        if (!nom) return updateStatus("Donnez un nom à l'enregistrement", 'error');
+        if (!selectedFile) return updateStatus("Chargez une vidéo d'abord", 'error');
+
+        runBtn.disabled = true;
+        updateStatus("Extraction des landmarks et génération des mouvements...", 'active');
+        setProgress(30);
+
+        const formData = new FormData();
+        formData.append('video', selectedFile);
+        formData.append('nom', nom);
+
+        try {
+            console.log("[DEBUG] Envoi POST à /charger...");
+            const response = await fetch('/charger', { method: 'POST', body: formData });
+            console.log("[DEBUG] Réponse reçue, status:", response.status);
+
+            if (!response.ok) {
+                console.error("[ERROR] Serveur retourne:", response.status, response.statusText);
+                const text = await response.text();
+                console.error("[ERROR] Body:", text);
+                updateStatus(`Erreur serveur (${response.status}): ${text}`, 'error');
+                runBtn.disabled = false;
+                return;
+            }
+
+            const data = await response.json();
+            console.log("[DEBUG] Données reçues:", data);
+
+            if (data.succes) {
+                setProgress(100);
+                updateStatus(`Enregistrement "${nom}" ajouté ! Lancement de la vidéo...`, 'done');
+
+                // Petit délai pour s'assurer que le fichier vidéo est bien écrit
+                setTimeout(() => {
+                    // Chargement et lecture de la vidéo landmarks générée
+                    preview.src = `/video/${encodeURIComponent(nom)}?t=${Date.now()}`;
+                    preview.style.display = 'block';
+                    placeholder.style.display = 'none';
+
+                    // Fonction pour lancer la vidéo
+                    const playVideo = () => {
+                        preview.play().catch(() => {
+                            // Autoplay bloqué : on affiche un bouton play natif
+                            preview.controls = true;
+                        });
+                    };
+
+                    // Si la vidéo est déjà prête, on lance directement
+                    if (preview.readyState >= 3) { // HAVE_FUTURE_DATA ou mieux
+                        playVideo();
+                    } else {
+                        // Sinon, on attend
+                        preview.addEventListener('canplay', playVideo, { once: true });
+                    }
+
+                    // Nettoyage des inputs pour le prochain enregistrement
+                    nameInput.value = '';
+                    selectedFile = null;
+                    chargerBibliotheque();
+                }, 500);  // Délai d'attente pour la génération vidéo
+            } else {
+                setProgress(0);
+                updateStatus(`Erreur : ${data.message}`, 'error');
+            }
+        } catch (err) {
+            setProgress(0);
+            console.error("[ERROR] Exception:", err);
+            updateStatus(`Erreur: ${err.message}`, 'error');
+        } finally {
+            runBtn.disabled = false;
+        }
+    });
+});
+
+// --- Fonctions Globales de la Bibliothèque ---
 
-async function playSound() {
+async function chargerBibliotheque() {
     try {
-        await fetch("/play_sound", { method: "POST" });
-    } catch (e) {
-        console.error("Error triggering sound:", e);
+        const response = await fetch('/liste');
+        if (!response.ok) throw new Error();
+        const data = await response.json();
+
+        const liste = document.getElementById('library-list');
+        liste.innerHTML = '';
+
+        if (data && data.noms) {
+            data.noms.forEach((nom, i) => {
+                const item = document.createElement('li');
+                item.className = 'library-item';
+                item.innerHTML = `
+                    <span class="item-index">${String(i + 1).padStart(2, '0')}</span>
+                    <span class="item-name">${nom}</span>
+                    <button class="btn btn-play" onclick="playRecording('${nom}', this)">play</button>
+                `;
+                liste.appendChild(item);
+            });
+        }
+    } catch (err) {
+        console.error("Erreur de chargement de la bibliothèque graphique", err);
     }
 }
 
-function updateUI() {
-    const checkbox = document.getElementById("antenna-checkbox");
-    const status = document.getElementById("status");
+async function playRecording(nom, btn) {
+    // Nettoyage visuel des anciens boutons en cours de lecture
+    document.querySelectorAll('.library-item').forEach(el => el.classList.remove('playing'));
+    document.querySelectorAll('.btn-play').forEach(b => {
+        b.classList.remove('active');
+        b.textContent = 'play';
+    });
+
+    // Activation visuelle de la ligne sélectionnée
+    btn.classList.add('active');
+    btn.textContent = '...';
+    btn.closest('.library-item').classList.add('playing');
+    updateStatus(`Synchronisation vidéo & simulation pour : ${nom}`, 'active');
+    setProgress(50);
 
-    checkbox.checked = antennasEnabled;
+    // Lancement de la vidéo annotée contenant les repères faciaux (landmarks)
+    const preview = document.getElementById('video-preview');
+    const placeholder = document.getElementById('video-placeholder');
+    preview.src = `/video/${encodeURIComponent(nom)}`;
+    preview.style.display = 'block';
+    placeholder.style.display = 'none';
 
-    if (antennasEnabled) {
-        status.textContent = "Antennas status: running";
+    // Fonction pour lancer la vidéo
+    const playVideo = () => {
+        preview.play().catch(err => {
+            console.error('Erreur lors de la lecture:', err);
+            updateStatus(`Erreur de lecture vidéo : ${err.message}`, 'error');
+            btn.classList.remove('active');
+            btn.textContent = 'play';
+            btn.closest('.library-item').classList.remove('playing');
+        });
+    };
+
+    // Attendre que la vidéo soit chargée
+    if (preview.readyState >= 3) {
+        playVideo();
     } else {
-        status.textContent = "Antennas status: stopped";
+        preview.addEventListener('canplay', playVideo, { once: true });
     }
-}
 
-document.getElementById("antenna-checkbox").addEventListener("change", (e) => {
-    updateAntennasState(e.target.checked);
-});
+    // Envoi synchrone de la commande pour faire réagir la simulation en direct
+    try {
+        const response = await fetch('/play', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ nom: nom })
+        });
+        const data = await response.json();
 
-document.getElementById("sound-btn").addEventListener("click", () => {
-    playSound();
-});
+        if (data.succes) {
+            setProgress(100);
+            updateStatus(`Lecture synchronisée en cours...`, 'done');
+        } else {
+            setProgress(0);
+            updateStatus(`Erreur simulation : ${data.message}`, 'error');
+        }
+    } catch (err) {
+        setProgress(0);
+        updateStatus("Erreur de communication de mouvements", 'error');
+    }
+
+    // Reset automatique de l'état du bouton dès que l'animation vidéo prend fin
+    preview.onended = () => {
+        btn.classList.remove('active');
+        btn.textContent = 'play';
+        btn.closest('.library-item').classList.remove('playing');
+        updateStatus(`Séquence "${nom}" terminée`, 'done');
+    };
+}
 
-updateUI();
+function updateStatus(msg, type) {
+    const el = document.getElementById('status-line');
+    if (el) {
+        el.textContent = msg;
+        el.className = `status-line ${type}`;
+    }
+}
+
+function setProgress(pct) {
+    const bar = document.getElementById('progress-bar');
+    if (bar) {
+        bar.style.width = `${pct}%`;
+        if (pct === 100) {
+            setTimeout(() => { bar.style.width = '0%'; }, 1200);
+        }
+    }
+}

coquille/static/style.css

@@ -1,25 +1,330 @@
-body {
-    font-family: sans-serif;
-    margin: 24px;
+*, *::before, *::after {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
 }
 
-#sound-btn {
-    padding: 10px 20px;
-    border: none;
-    color: white;
-    cursor: pointer;
+:root {
+    --bg: #0e0e0f;
+    --bg-panel: #141416;
+    --bg-input: #1a1a1d;
+    --border: #2a2a2e;
+    --border-active: #404046;
+    --text-primary: #f0eee8;
+    --text-secondary: #6b6b72;
+    --text-muted: #3d3d42;
+    --accent: #c8fa64;
+    --accent-dim: #8fba2a;
+    --accent-bg: #1a2408;
+    --font-display: 'Syne', sans-serif;
+    --font-mono: 'DM Mono', monospace;
+    --radius: 6px;
+    --radius-lg: 10px;
+}
+
+html, body {
+    height: 100%;
+    background: var(--bg);
+    color: var(--text-primary);
+    font-family: var(--font-mono);
+    font-size: 13px;
+    line-height: 1.5;
+    -webkit-font-smoothing: antialiased;
+}
+
+header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 18px 28px;
+    border-bottom: 1px solid var(--border);
+}
+
+.logo-mark {
+    display: inline-block;
+    width: 8px;
+    height: 8px;
+    background: var(--accent);
+    border-radius: 50%;
+    margin-right: 10px;
+    animation: pulse 2.4s ease-in-out infinite;
+}
+
+@keyframes pulse {
+    0%, 100% { opacity: 1; transform: scale(1); }
+    50% { opacity: 0.5; transform: scale(0.85); }
+}
+
+.logo-text {
+    font-family: var(--font-display);
     font-size: 16px;
-    border-radius: 6px;
-    background-color: #3498db;
+    font-weight: 700;
+    letter-spacing: -0.02em;
+    color: var(--text-primary);
+}
+
+.logo-text em {
+    font-style: normal;
+    color: var(--accent);
+}
+
+.status-indicator {
+    display: flex;
+    align-items: center;
+    gap: 7px;
+    font-size: 11px;
+    color: var(--text-secondary);
+    letter-spacing: 0.04em;
+}
+
+.status-indicator .dot {
+    width: 6px;
+    height: 6px;
+    border-radius: 50%;
+    background: var(--text-muted);
+    transition: background 0.3s;
+}
+
+.status-indicator.online .dot { background: var(--accent); }
+.status-indicator.online { color: var(--accent-dim); }
+
+main {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 1px;
+    background: var(--border);
+    height: calc(100vh - 56px - 48px);
+}
+
+.panel {
+    background: var(--bg-panel);
+    padding: 28px;
+    display: flex;
+    flex-direction: column;
+    gap: 18px;
+    overflow: hidden;
+}
+
+.panel-label {
+    font-family: var(--font-mono);
+    font-size: 10px;
+    font-weight: 500;
+    letter-spacing: 0.12em;
+    color: var(--text-muted);
+    text-transform: uppercase;
+}
+
+.video-zone {
+    flex: 1;
+    background: var(--bg);
+    border: 1px solid var(--border);
+    border-radius: var(--radius-lg);
+    overflow: hidden;
+    position: relative;
+    min-height: 0;
+}
+
+.video-placeholder {
+    position: absolute;
+    inset: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 12px;
+    color: var(--text-muted);
+    font-size: 11px;
+    letter-spacing: 0.08em;
+}
+
+#video-preview {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    display: block;
+}
+
+.input-row {
+    display: flex;
+    gap: 8px;
+}
+
+input[type="text"] {
+    flex: 1;
+    background: var(--bg-input);
+    border: 1px solid var(--border);
+    border-radius: var(--radius);
+    padding: 0 12px;
+    height: 36px;
+    color: var(--text-primary);
+    font-family: var(--font-mono);
+    font-size: 12px;
+    outline: none;
+    transition: border-color 0.15s;
+}
+
+input[type="text"]:focus {
+    border-color: var(--border-active);
 }
 
-#status {
-    margin-top: 16px;
-    font-weight: bold;
+input[type="text"]::placeholder {
+    color: var(--text-muted);
 }
 
-#controls {
+.btn {
+    display: inline-flex;
+    align-items: center;
+    gap: 7px;
+    padding: 0 14px;
+    height: 36px;
+    border-radius: var(--radius);
+    border: 1px solid var(--border);
+    background: transparent;
+    color: var(--text-secondary);
+    font-family: var(--font-mono);
+    font-size: 11px;
+    font-weight: 500;
+    letter-spacing: 0.06em;
+    cursor: pointer;
+    white-space: nowrap;
+    transition: border-color 0.15s, color 0.15s, background 0.15s;
+}
+
+.btn:hover {
+    border-color: var(--border-active);
+    color: var(--text-primary);
+}
+
+.btn:active { transform: scale(0.98); }
+
+.btn-ghost {
+    background: var(--bg-input);
+}
+
+.btn-primary {
+    background: var(--accent-bg);
+    border-color: var(--accent-dim);
+    color: var(--accent);
+    width: 100%;
+    justify-content: center;
+    font-size: 12px;
+}
+
+.btn-primary:hover:not(:disabled) {
+    background: #223210;
+    border-color: var(--accent);
+}
+
+.btn-primary:disabled {
+    opacity: 0.3;
+    cursor: not-allowed;
+    border-color: var(--border);
+    color: var(--text-muted);
+    background: transparent;
+}
+
+.library-list {
+    list-style: none;
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    flex: 1;
+    overflow-y: auto;
+}
+
+.library-list::-webkit-scrollbar { width: 3px; }
+.library-list::-webkit-scrollbar-track { background: transparent; }
+.library-list::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }
+
+.library-item {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    padding: 11px 14px;
+    border-radius: var(--radius);
+    border: 1px solid transparent;
+    transition: border-color 0.15s, background 0.15s;
+    animation: slide-in 0.25s ease both;
+}
+
+@keyframes slide-in {
+    from { opacity: 0; transform: translateY(6px); }
+    to   { opacity: 1; transform: translateY(0); }
+}
+
+.library-item:hover {
+    background: var(--bg-input);
+    border-color: var(--border);
+}
+
+.library-item.playing {
+    background: var(--accent-bg);
+    border-color: var(--accent-dim);
+}
+
+.item-index {
+    font-size: 10px;
+    color: var(--text-muted);
+    font-weight: 500;
+    min-width: 20px;
+}
+
+.item-name {
+    flex: 1;
+    font-size: 12px;
+    color: var(--text-primary);
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.item-date {
+    font-size: 10px;
+    color: var(--text-muted);
+}
+
+.btn-play {
+    padding: 0 10px;
+    height: 26px;
+    font-size: 10px;
+    border-radius: 4px;
+    flex-shrink: 0;
+}
+
+.btn-play.active {
+    border-color: var(--accent-dim);
+    color: var(--accent);
+    background: var(--accent-bg);
+}
+
+footer {
+    height: 48px;
+    border-top: 1px solid var(--border);
     display: flex;
     align-items: center;
-    gap: 20px;
+    padding: 0 28px;
+    position: relative;
+    overflow: hidden;
+}
+
+.status-line {
+    font-size: 11px;
+    color: var(--text-muted);
+    letter-spacing: 0.06em;
+    transition: color 0.3s;
+    z-index: 1;
+}
+
+.status-line.active { color: var(--accent-dim); }
+.status-line.done   { color: var(--accent); }
+.status-line.error  { color: #f56565; }
+
+.progress-bar {
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    height: 2px;
+    width: 0%;
+    background: var(--accent);
+    transition: width 0.4s ease;
 }