Update app.py

app.py

@@ -136,7 +136,7 @@ with gr.Blocks() as demo:
     remove_timeline_button = gr.Button("타임라인 제거")
 
     # 출력창 3개: 강의1 타임라인 제거, 강의2 타임라인 제거, 강의3 타임라인 제거 (가로로 나열)
-    # 각 Textbox에 elem_id를 부여하여 JavaScript로 접근할 수 있게 함.
+    # 각 Textbox에 elem_id를 부여하여 JavaScript에서 접근할 수 있게 함.
     with gr.Row():
         cleaned1 = gr.Textbox(label="강의1 타임라인 제거", lines=10, elem_id="cleaned1")
         cleaned2 = gr.Textbox(label="강의2 타임라인 제거", lines=10, elem_id="cleaned2")
@@ -172,28 +172,41 @@ with gr.Blocks() as demo:
     # 클립보드 복사 기능을 위한 JavaScript 코드를 포함하는 HTML 컴포넌트
     custom_script = """
     <script>
-    function setupClipboard(copyButtonId, textBoxId, resultBoxId) {
+    function setupClipboard(copyButtonId, textContainerId, resultContainerId) {
         const copyButton = document.getElementById(copyButtonId);
-        if(copyButton){
-            copyButton.addEventListener('click', function() {
-                const textBox = document.getElementById(textBoxId);
-                const resultBox = document.getElementById(resultBoxId);
-                if (textBox && resultBox) {
-                    var text = textBox.value;
+        if (!copyButton) {
+            console.error("버튼 " + copyButtonId + "를 찾을 수 없습니다.");
+            return;
+        }
+        copyButton.addEventListener('click', function() {
+            console.log(copyButtonId + " 클릭됨");
+            // 텍스트박스 컨테이너 내부의 textarea 요소를 찾음
+            const textContainer = document.getElementById(textContainerId);
+            const resultContainer = document.getElementById(resultContainerId);
+            if (textContainer && resultContainer) {
+                const textarea = textContainer.querySelector("textarea");
+                const resultArea = resultContainer.querySelector("textarea");
+                if (textarea && resultArea) {
+                    var text = textarea.value;
                     if (text.trim() === "") {
-                        resultBox.value = "복사할 내용이 없습니다.";
+                        resultArea.value = "복사할 내용이 없습니다.";
                     } else {
                         navigator.clipboard.writeText(text).then(function() {
-                            resultBox.value = "복사완료";
+                            console.log("클립보드에 복사됨: " + text);
+                            resultArea.value = "복사완료";
                         }, function(err) {
-                            resultBox.value = "복사 실패";
+                            console.error("복사 실패: " + err);
+                            resultArea.value = "복사 실패";
                         });
                     }
+                } else {
+                    console.error("textarea 요소를 찾지 못했습니다.");
                 }
-            });
-        }
+            } else {
+                console.error("텍스트 또는 결과 컨테이너를 찾지 못했습니다.");
+            }
+        });
     }
-    // DOMContentLoaded 이후에 이벤트 설정
     document.addEventListener("DOMContentLoaded", function(){
         setupClipboard("copy1", "cleaned1", "copy_result1");
         setupClipboard("copy2", "cleaned2", "copy_result2");