Update app.py

app.py

@@ -7,6 +7,21 @@ import requests
 # 디버깅 로깅 설정 (전체 통합을 위해 포맷 포함)
 logging.basicConfig(level=logging.DEBUG, format="%(asctime)s - %(levelname)s - %(message)s")
 
+# ---------- 사용자 정의 CSS (왼쪽과 오른쪽 영역의 높이를 동일하게 맞춤) ----------
+css = """
+<style>
+    /* 왼쪽 '전체 페이지 HTML 입력' 영역의 textarea 높이 설정 */
+    #html_input textarea {
+        height: 400px !important;
+    }
+    /* 오른쪽 영역을 감싸는 컨테이너의 높이 설정 */
+    #right_panel {
+        height: 400px;
+        overflow-y: auto;
+    }
+</style>
+"""
+
 # ---------- [모듈1: 기존 기본코드] 시작 ----------
 # 영어 월을 한국어 월로 변환하기 위한 매핑
 month_mapping = {
@@ -206,7 +221,6 @@ def process_html_sections(html_text):
     logging.debug("HTML 처리 완료 (섹션별 분리)")
     sections_list = list(sections_dict.keys())
     default_val = sections_list[0] if sections_list else None
-    # gr.Dropdown.update() 대신 gr.update() 사용
     return subject_name, gr.update(choices=sections_list, value=default_val), sections_dict
 
 def update_lecture_and_urls(selected_section, sections_dict):
@@ -214,14 +228,13 @@ def update_lecture_and_urls(selected_section, sections_dict):
     선택한 섹션을 바탕으로 강의 목록 텍스트와 URL들을 추출하여
       - 강의 목록 텍스트(없으면 "강의가 없습니다" 반환)
       - 최대 3개의 강의 URL (강의 URL이 없으면 빈 문자열)
-    를 반환.
+    을 반환.
     """
     if not selected_section or not sections_dict:
         return "", "", "", ""
     lectures_text, url_list = sections_dict.get(selected_section, ("", []))
     if not lectures_text:
         lectures_text = "강의가 없습니다"
-    # 강의 URL 3개 채우기 (없으면 빈 문자열)
     url1 = url_list[0] if len(url_list) >= 1 else ""
     url2 = url_list[1] if len(url_list) >= 2 else ""
     url3 = url_list[2] if len(url_list) >= 3 else ""
@@ -310,7 +323,6 @@ def process_full(lecture_url):
     """
     입력된 강의 URL로부터 스크립트 URL을 생성하고,
     해당 스크립트를 가져온 후 타임라인을 제거한 최종 강의 내용을 반환하는 함수.
-    (중간 단계는 출력하지 않고 최종 결과만 반환)
     """
     script_url = create_script_url(lecture_url)
     if not script_url:
@@ -324,10 +336,9 @@ def process_full(lecture_url):
     return cleaned
 # ---------- [모듈2: 추가코드] 끝 ----------
 
-# ---------- [모듈3: 강의내용 합치기 추가코드] 시작 ----------
+# ---------- [모듈3: 강의 내용 합치기 추가코드] 시작 ----------
 with gr.Blocks() as merge_demo:
-    gr.Markdown("## 강의내용 합치기")
-    # "강의내용 합치기" 버튼 삭제 (요청사항에 따라 삭제)
+    gr.Markdown("## 강의 내용 합치기")
     merged_content = gr.Textbox(label="전체 강의 내용", lines=10, elem_id="merged_content")
     with gr.Row():
         merge_copy_btn = gr.Button("전체 강의 내용 복사하기", elem_id="merge_copy_btn")
@@ -347,8 +358,6 @@ with gr.Blocks() as merge_demo:
             merged += "[강의3]\n" + l3.strip()
         return merged
     
-    # "강의내용 합치기" 버튼 삭제에 따라 merge_btn 관련 코드 제거
-    
     merge_copy_script = """
     <script>
     function setupMergeCopy(copyBtnId, textBoxId, resultBoxId) {
@@ -384,7 +393,7 @@ with gr.Blocks() as merge_demo:
     </script>
     """
     gr.HTML(merge_copy_script)
-# ---------- [모듈3: 강의내용 합치기 추가코드] 끝 ----------
+# ---------- [모듈3: 강의 내용 합치기 추가코드] 끝 ----------
 
 # ---------- 새로운 기능: '선택한 섹션 강의 목록'에서 강의 URL 추출 및 강의 내용 자동 업데이트 기능 추가 ----------
 def merge_contents_global(l1, l2, l3):
@@ -430,13 +439,14 @@ def handle_fetch_all(lecture_list_text):
 
 # ---------- 통합 Gradio 앱 구성 (한 페이지에 모두 표시) ----------
 with gr.Blocks() as additional_demo:
-    gr.Markdown("※ 강의 URL 및 강의 내용, 복사 기능은 아래에 표시됩니다.") 
+    # [모듈2] - 강의 내용 가져오기 영역 (삭제내용 제거 및 타이틀 수정)
+    gr.Markdown("## 강의 내용 가져오기")
     with gr.Row():
         url1 = gr.Textbox(label="강의1 URL", elem_id="url1")
         url2 = gr.Textbox(label="강의2 URL", elem_id="url2")
         url3 = gr.Textbox(label="강의3 URL", elem_id="url3")
     with gr.Row():
-        # 개별 '강의 내용 가져오기' 버튼 삭제 (요청사항에 따라 삭제)
+        # 개별 '강의 내용 가져오기' 버튼은 삭제됨 (요청사항에 따라 제거)
         pass
     with gr.Row():
         lecture_content1 = gr.Textbox(label="강의 내용", lines=10, elem_id="lecture_content1")
@@ -488,37 +498,37 @@ with gr.Blocks() as additional_demo:
     </script>
     """
     gr.HTML(custom_script)
-    gr.Markdown("디버깅 모드 활성화됨: 로그가 콘솔에 출력됩니��.")
+    # (삭제내용 관련 gr.Markdown 제거)
     
 with gr.Blocks() as app:
+    gr.HTML(css)  # 사용자 정의 CSS 삽입
     gr.Markdown("# 캐롤라인대학 강의 추출기")
-    gr.Markdown("전체 페이지 HTML을 입력하면 과목명과 각 섹션별 동영상 강의 목록을 추출합니다. (디버깅 정보는 콘솔에 출력됩니다.)")
+    gr.Markdown("[사용방법] \n1. 추출을 원하는 강의 페이지에서 \"Ctrl + U\"를 눌러 페이지 소스를 확인하거나, 마우스 우클릭 후 \"페이지 소스 보기\"를 선택합니다. \n2. 페이지 소스에서 전체 복사 합니다. (\"Ctrl+A\" → \"Ctrl+C\")\n3. 복사한 내용을 해당 페이지 \"전체 페이지 HTML 입력\"에 붙여 놓고(Ctrl+V) \"Submit\" 버튼을 클릭합니다.\n4. 오른쪽 창에서 원하는 섹션을 선택 후 \"강의 내용 가져오기\" 버튼을 클릭합니다.\n5. 가져온 강의 내용 중에서 필요한 내용만 복사하여 사용 가능합니다.")
     gr.HTML(
         """
         <div style="background-color: #f0f0f0; padding: 10px; margin-bottom: 20px;">
-            <strong>사용방법</strong>
+            <strong>[사용방법]</strong>
             <ol>
                 <li>추출을 원하는 강의 페이지에서 "Ctrl + U"를 눌러 페이지 소스를 확인하거나, 마우스 우클릭 후 "페이지 소스 보기"를 선택합니다.</li>
-                <li>페이지 소스에서 전체 복사 후 ("Ctrl+A" → "Ctrl+C"), 왼쪽의 "전체 페이지 HTML 입력"에 붙여넣습니다.</li>
-                <li>"Submit" 버튼을 클릭하면 오른쪽에 과목명, 섹션 선택, 선택한 섹션의 강의 목록이 표시됩니다.</li>
-                <li>강의 목록에 출력된 강의 URL은 별도로 자동 입력되지 않습니다. 필요한 경우 아래의 "강의 내용 가져오기" 버튼을 클릭하여 업데이트하세요.</li>
-                <li>업데이트 후, 각 강의의 내용을 복사하여 사용 가능합니다.</li>
+                <li>페이지 소스에서 전체 복사 합니다. ("Ctrl+A" → "Ctrl+C")</li>
+                <li>복사한 내용을 해당 페이지 "전체 페이지 HTML 입력"에 붙여 놓고(Ctrl+V) "Submit" 버튼을 클릭합니다.</li>
+                <li>오른쪽 창에서 원하는 섹션을 선택 후 "강의 내용 가져오기" 버튼을 클릭합니다.</li>
+                <li>가져온 강의 내용 중에서 필요한 내용만 복사하여 사용 가능합니다.</li>
             </ol>
         </div>
         """
     )
-    # 모듈1: HTML 입력 및 오른쪽에 과목/섹션/강의 목록 표시
+    # 모듈1: HTML 입력 및 과목/섹션 표시 (왼쪽과 오른쪽 영역의 높이를 동일하게 맞춤)
     with gr.Tab("HTML 파싱 및 섹션 선택"):
         with gr.Row():
             with gr.Column():
-                html_input = gr.Textbox(label="전체 페이지 HTML 입력", lines=20, placeholder="HTML 코드를 입력하세요...")
+                html_input = gr.Textbox(label="전체 페이지 HTML 입력", lines=20, placeholder="HTML 코드를 입력하세요...", elem_id="html_input")
                 parse_btn = gr.Button("Submit")
-            with gr.Column():
-                subject_out = gr.Textbox(label="과목명", interactive=False)
+            with gr.Column(elem_id="right_panel"):
+                subject_out = gr.Textbox(label="과목명", interactive=False, lines=20)
                 section_dropdown = gr.Dropdown(label="섹션 선택", choices=[], interactive=True)
-                lecture_out = gr.Textbox(label="선택한 섹션 강의 목록", lines=10, interactive=False)
+                lecture_out = gr.Textbox(label="선택한 섹션 강의 목록", lines=20, interactive=False)
                 with gr.Row():
-                    # [요청사항]에 따라 "선택한 섹션 강의 목록" 아래에 '강의 내용 가져오기' 버튼 추가
                     fetch_all_btn = gr.Button("강의 내용 가져오기", elem_id="fetch_all_btn")
         sections_state = gr.State()
     
@@ -527,13 +537,13 @@ with gr.Blocks() as app:
             inputs=html_input, 
             outputs=[subject_out, section_dropdown, sections_state]
         )
-        # 섹션 선택시 강의목록 텍스트만 업데이트하는 이벤트 등록
+        # 섹션 선택 시 강의목록 텍스트만 업데이트
         section_dropdown.change(
             fn=update_lecture_text_only,
             inputs=[section_dropdown, sections_state],
             outputs=lecture_out
         )
-        # "강의 내용 가져오기" 버튼 클릭시 강의 URL과 내용 업데이트 (버튼 클릭 시 [행동] 실행)
+        # "강의 내용 가져오기" 버튼 클릭 시 강의 URL과 내용 업데이트 ([행동] 실행)
         fetch_all_btn.click(
             fn=handle_fetch_all,
             inputs=lecture_out,
@@ -541,7 +551,7 @@ with gr.Blocks() as app:
         )
     
     gr.Markdown("---")
-    gr.Markdown("동영상 강의 목록에서 필요한 강의의 URL을 복사하여 사용하세요.")
+    # (삭제내용 관련 gr.Markdown 제거)
     additional_demo.render()
     merge_demo.render()