Fix metadata output.

public/app.js

@@ -3,7 +3,7 @@
 document.addEventListener('DOMContentLoaded', () => {
 
     // =================================================
-    // 0. 로그아웃 로직 (추가됨)
+    // 0. 로그아웃 로직
     // =================================================
     const logoutBtn = document.getElementById('logout-button');
     if (logoutBtn) {
@@ -338,6 +338,7 @@ document.addEventListener('DOMContentLoaded', () => {
             const data = event.data;
             if (typeof data === "string") {
                 try {
+                    console.log("-----" + data);
                     const meta = JSON.parse(data);
                     if (meta.type === "frame") {
                         lastFrameMeta = meta;
@@ -372,14 +373,41 @@ document.addEventListener('DOMContentLoaded', () => {
         };
     }
 
+    /**
+     * [수정됨] 상세 탐지 정보 출력 함수
+     * 입력 예: {"type": "det", "ch": 0, "seq": 16939, "ts_us": 833298660, "items": [{"x1": ..., "tag": 1, ...}]}
+     */
     function showDetections(meta) {
-        bboxContainerEl.innerHTML = "";
+        bboxContainerEl.innerHTML = ""; // 기존 bbox 초기화 (필요시 여기에 박스 그리기 로직 추가 가능)
+
+        // 1. 메타 정보 라인 구성 (ch, seq, ts_us)
+        const ch = meta.ch !== undefined ? meta.ch : '-';
+        const seq = meta.seq !== undefined ? meta.seq : '-';
+        const ts = meta.ts_us !== undefined ? meta.ts_us : '-';
+
+        let outputLines = [];
+        outputLines.push(`[META] CH:${ch} | SEQ:${seq} | TS:${ts}`);
+
+        // 2. 탐지 객체 리스트 구성
         const items = meta.items || [];
-        let lines = [];
+        if (items.length === 0) {
+            outputLines.push("No detections");
+        } else {
             items.forEach((it, i) => {
-             lines.push(`#${i} cls=${it.cls} score=${it.conf || 0}`);
+                // 좌표값 소수점 2자리로 반올림
+                const x1 = it.x1 ? it.x1.toFixed(2) : 0;
+                const y1 = it.y1 ? it.y1.toFixed(2) : 0;
+                const x2 = it.x2 ? it.x2.toFixed(2) : 0;
+                const y2 = it.y2 ? it.y2.toFixed(2) : 0;
+                const tag = it.tag !== undefined ? it.tag : '-';
+                const cls = it.cls !== undefined ? it.cls : '-';
+
+                outputLines.push(`#${i} | Class:${cls} | Tag:${tag} | Box:[${x1}, ${y1}, ${x2}, ${y2}]`);
             });
-        detListEl.textContent = lines.join("\n");
+        }
+
+        // 3. 화면 출력
+        detListEl.textContent = outputLines.join("\n");
     }
 
     function updateBboxContainerPosition() {