From b4a72115b56eec5dca2fbcc087e4ef0384ac766e Mon Sep 17 00:00:00 2001
From: "hehihoho3@gmail.com" <hehihoho3@gmail.com>
Date: Wed, 2 Sep 2026 09:15:35 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EC=88=8F=ED=8F=BC=20=ED=81=90=20?=
 =?UTF-8?q?=EB=B3=B5=EC=82=AC=20=EC=99=84=EB=A3=8C=20=ED=9D=90=EB=A6=84=20?=
 =?UTF-8?q?=EA=B0=84=EC=86=8C=ED=99=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/main/resources/templates/shortform.html | 39 ++++++++++-----------
 1 file changed, 19 insertions(+), 20 deletions(-)

diff --git a/src/main/resources/templates/shortform.html b/src/main/resources/templates/shortform.html
index 07698cb..79d5b73 100644
--- a/src/main/resources/templates/shortform.html
+++ b/src/main/resources/templates/shortform.html
@@ -158,16 +158,10 @@
                 }
                 const detail = await api('/api/shortform/jobs/' + id);
                 const toolbar = `<div class="sf-clip-head" style="margin-bottom:0.6rem;">
-                    <button class="btn btn-primary" data-copy="${encodeURIComponent(detail.rawOutput || '')}"
-                        data-label="전체 Output 복사 (capcut2 오팔 JSON 탭용)"
-                        ${detail.rawOutput ? '' : 'disabled'}>전체 Output 복사 (capcut2 오팔 JSON 탭용)</button>
-                    <button class="btn btn-secondary" data-copy="${encodeURIComponent(detail.step1Output || '')}"
-                        data-label="Step 1 후보구간 복사"
-                        ${detail.step1Output ? '' : 'disabled'}>Step 1 후보구간 복사</button>
                     <button class="btn btn-secondary" data-copy="${encodeURIComponent(detail.youtubeUrl || '')}"
-                        data-label="영상 URL 복사">영상 URL 복사</button>
+                        data-complete-on-copy>영상 URL 복사</button>
                     <button class="btn btn-secondary" data-subtitle-copy
-                        data-label="타임스탬프 자막 복사" ${detail.subtitleVtt ? '' : 'disabled'}>타임스탬프 자막 복사</button>
+                        data-complete-on-copy ${detail.subtitleVtt ? '' : 'disabled'}>타임스탬프 자막 복사</button>
                     ${detail.subtitleStatus === 'READY' || detail.subtitleStatus === 'COLLECTING' ? '' : `
                     <button class="btn btn-secondary" onclick="retrySubtitles(${detail.id}, event)">자막 다시 수집</button>`}
                 </div>`;
@@ -184,20 +178,25 @@
                 openJobIds.add(id);
                 el.querySelectorAll('[data-copy]').forEach(btn => {
                     const label = btn.dataset.label || 'capcut2 JSON 복사';
-                    btn.onclick = (e) => {
+                    btn.onclick = async (e) => {
                         e.stopPropagation();
-                        navigator.clipboard.writeText(decodeURIComponent(btn.dataset.copy));
-                        btn.textContent = '복사됨!';
-                        setTimeout(() => btn.textContent = label, 1200);
+                        await navigator.clipboard.writeText(decodeURIComponent(btn.dataset.copy));
+                        if (btn.hasAttribute('data-complete-on-copy')) {
+                            btn.textContent = '완료';
+                            btn.disabled = true;
+                        } else {
+                            btn.textContent = '복사됨!';
+                            setTimeout(() => btn.textContent = label, 1200);
+                        }
                     };
                 });
                 const subtitleButton = el.querySelector('[data-subtitle-copy]');
                 if (subtitleButton && detail.subtitleVtt) {
-                    subtitleButton.onclick = (e) => {
+                    subtitleButton.onclick = async (e) => {
                         e.stopPropagation();
-                        navigator.clipboard.writeText(detail.subtitleVtt);
-                        subtitleButton.textContent = '복사됨!';
-                        setTimeout(() => subtitleButton.textContent = '타임스탬프 자막 복사', 1200);
+                        await navigator.clipboard.writeText(detail.subtitleVtt);
+                        subtitleButton.textContent = '완료';
+                        subtitleButton.disabled = true;
                     };
                 }
             }
@@ -299,11 +298,11 @@
                 const button = card.querySelector('[data-subtitle-copy]');
                 if (!button || !detail.subtitleVtt) return;
                 button.disabled = false;
-                button.onclick = (e) => {
+                button.onclick = async (e) => {
                     e.stopPropagation();
-                    navigator.clipboard.writeText(detail.subtitleVtt);
-                    button.textContent = '복사됨!';
-                    setTimeout(() => button.textContent = '타임스탬프 자막 복사', 1200);
+                    await navigator.clipboard.writeText(detail.subtitleVtt);
+                    button.textContent = '완료';
+                    button.disabled = true;
                 };
             }