Fix zendriver daemon robustness and switch to FF_3.10 environment

info.yaml

@@ -1,5 +1,5 @@
 title: "애니 다운로더"
-version: 0.7.7
+version: 0.7.8
 package_name: "anime_downloader"
 developer: "projectdx"
 description: "anime downloader"

lib/zendriver_daemon.py

@@ -187,8 +187,11 @@ async def ensure_browser() -> Any:
 
                 # 사용자 데이터 디렉토리 설정 (Mac/Root 권한 이슈 대응)
                 import tempfile
+                import platform
                 uid = os.getuid() if hasattr(os, 'getuid') else 'win'
                 
+                log_debug(f"[ZendriverDaemon] Environment: Python {sys.version.split()[0]} on {platform.system()}")
+                
                 browser_args = [
                     "--no-sandbox", 
                     "--disable-setuid-sandbox", 
@@ -284,8 +287,28 @@ async def fetch_with_browser(url: str, timeout: int = 30, headers: Optional[Dict
             
             # 페이지 로드 시도
             try:
-                # 탭(페이지) 열기 (브라우저가 없으면 생성)
+                # zendriver/core/browser.py:304 에서 self.targets가 비어있을 때 StopIteration 발생 가능
-                page = await browser.get("about:blank") # 새 탭 열기 대신 기존 탭 재활용 혹은 about:blank 이동
+                # 이를 방지하기 위해 tabs가 생길 때까지 잠시 대기하거나 직접 생성 시도
+                
+                # 탭(페이지) 확보
+                page = None
+                for attempt in range(5):
+                    try:
+                        if browser.tabs:
+                            page = browser.tabs[0]
+                            log_debug(f"[ZendriverDaemon] Using existing tab (Attempt {attempt+1})")
+                            break
+                        else:
+                            log_debug(f"[ZendriverDaemon] No tabs found, trying browser.get('about:blank') (Attempt {attempt+1})")
+                            page = await browser.get("about:blank")
+                            break
+                    except (StopIteration, RuntimeError, Exception) as tab_e:
+                        log_debug(f"[ZendriverDaemon] Tab acquisition failed: {tab_e}. Retrying...")
+                        await asyncio.sleep(0.5)
+                
+                if not page:
+                    result["error"] = "Failed to acquire browser tab"
+                    return result
 
                 # 헤더 설정 (CDP 사용)
                 if headers:

static/css/mobile_custom.css

@@ -76,8 +76,8 @@
         width: 100% !important; 
         max-width: 100% !important;
         min-width: 0 !important;
-        padding-left: 6px !important; 
+        padding-left: 5px !important; 
-        padding-right: 6px !important;
+        padding-right: 5px !important;
         margin-left: 0 !important; 
         margin-right: 0 !important;
         box-sizing: border-box !important;

static/css/ohli24.css

@@ -40,8 +40,8 @@ body {
 
 /* General Layout Fixes */
 .container-fluid {
-    padding-left: 8px !important;
+    padding-left: 5px !important;
-    padding-right: 8px !important; 
+    padding-right: 5px !important; 
     max-width: 100%;
 }
 

templates/anime_downloader_anilife_request.html

@@ -40,14 +40,13 @@ body {
                            placeholder="URL 또는 코드를 입력하세요" 
                            style="background: rgba(30, 27, 75, 0.8); color: #e0e7ff; box-shadow: inset 0 2px 4px rgba(0,0,0,0.3); border-radius: 12px 0 0 12px;">
                     <div class="input-group-append">
-                        <button id="analysis_btn" class="btn px-2 px-md-4 font-weight-bold" type="button"
+                        <button id="analysis_btn" class="btn px-3 font-weight-bold" type="button"
-                                style="background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%); color: white; box-shadow: 0 0 15px rgba(139, 92, 246, 0.4);">
+                                style="background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%); color: white; box-shadow: 0 0 15px rgba(139, 92, 246, 0.4); min-width: 80px;">
                             <i class="fa fa-cogs mr-1"></i> 분석
                         </button>
-                        <button id="go_anilife_btn" class="btn px-2 px-md-3" type="button"
+                        <button id="go_anilife_btn" class="btn px-3 font-weight-bold" type="button"
-                                style="background: rgba(167, 139, 250, 0.2); border: 1px solid rgba(167, 139, 250, 0.4); color: #c4b5fd; border-radius: 0 12px 12px 0;">
+                                style="background: rgba(167, 139, 250, 0.2); border: 1px solid rgba(167, 139, 250, 0.4); color: #c4b5fd; border-radius: 0 12px 12px 0; min-width: 80px;">
-                            <span class="d-none d-md-inline">Go 애니라이프</span>
+                            GO
-                            <span class="d-md-none">Go</span>
                         </button>
                     </div>
                 </div>

templates/anime_downloader_linkkf_list.html

@@ -769,9 +769,9 @@ $(document).ready(function(){
                     str += '<button class="action-btn btn-merge-sub" data-id="' + item.id + '" data-filename="' + item.filename + '"><i class="fa fa-cc"></i> 자막합침</button>';
                 }
                 
-                // [작품소개] 버튼 추가 - JSON 버튼 왼쪽에 배치
+                // [보기] 버튼 추가 - JSON 버튼 왼쪽에 배치
                 if (item.content_code) {
-                    str += '<button class="action-btn" onclick="location.href=\'/' + package_name + '/' + sub + '/request?code=' + item.content_code + '\'"><i class="fa fa-info-circle"></i> 작품소개</button>';
+                    str += '<button class="action-btn" onclick="location.href=\'/' + package_name + '/' + sub + '/request?code=' + item.content_code + '\'"><i class="fa fa-eye"></i> 보기</button>';
                 }
                 
                 str += '<button class="action-btn" onclick="m_modal(current_data.list[' + i + '])"><i class="fa fa-code"></i> JSON</button>';

templates/anime_downloader_linkkf_request.html

@@ -316,15 +316,12 @@
 
         $("body").on('click', '#check_download_btn', function (e) {
             e.preventDefault();
-            all = $('input[id^="checkbox_"]');
+            $('input[id^="checkbox_"]').each(function() {
-            let data = [];
+                if ($(this).prop('checked')) {
-            let idx;
+                    idx = parseInt($(this).attr('id').split('_')[1])
-            for (let i in all) {
-                if (all[i].checked) {
-                    idx = parseInt(all[i].id.split('_')[1])
                     data.push(current_data.episode[idx]);
                 }
-            }
+            });
             if (data.length == 0) {
                 $.notify('<strong>선택하세요.</strong>', {type: 'warning'});
                 return;
@@ -343,15 +340,12 @@
 
         $("body").on('click', '#down_subtitle_btn', function (e) {
             e.preventDefault();
-            all = $('input[id^="checkbox_"]');
+            $('input[id^="checkbox_"]').each(function() {
-            let data = [];
+                if ($(this).prop('checked')) {
-            let idx;
+                    idx = parseInt($(this).attr('id').split('_')[1]);
-            for (let i in all) {
-                if (all[i].checked) {
-                    idx = parseInt(all[i].id.split('_')[1])
                     data.push(current_data.episode[idx]);
                 }
-            }
+            });
             if (data.length == 0) {
                 $.notify('<strong>선택하세요.</strong>', {type: 'warning'});
                 return;

templates/anime_downloader_log.html

@@ -1,193 +1,159 @@
 {% extends "base.html" %}
 {% block content %}
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="{{ url_for('.static', filename='css/mobile_custom.css') }}"/>
+
 <style>
-    /* Premium Dark Theme Variables */
+    /* Match gds_dviewer Log Page Design */
-    :root {
-        --bg-color: #0f172a; /* Slate 900 */
-        --card-bg: #1e293b; /* Slate 800 */
-        --text-color: #f8fafc; /* Slate 50 */
-        --text-muted: #94a3b8; /* Slate 400 */
-        --accent-color: #3b82f6; /* Blue 500 */
-        --accent-hover: #2563eb; /* Blue 600 */
-        --terminal-bg: #000000;
-        --terminal-text: #4ade80; /* Green 400 */
-        --border-color: #334155; /* Slate 700 */
-    }
-
-    /* Global Override */
     body {
-        background-color: var(--bg-color) !important;
+        background: linear-gradient(145deg, #0f172a, #1e293b) !important;
-        background-image: radial-gradient(circle at top right, #1e293b 0%, transparent 60%), radial-gradient(circle at bottom left, #1e293b 0%, transparent 60%);
+        color: #f8fafc;
-        color: var(--text-color);
+        font-family: 'Inter', -apple-system, sans-serif;
-        font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
-        /* overflow: hidden 제거 - 모바일 스크롤 허용 */
     }
 
-    /* Container & Typography */
+    .log-card {
-    .container-fluid {
+        background: linear-gradient(145deg, rgba(20, 30, 48, 0.95), rgba(36, 59, 85, 0.9));
-        padding: 8px; /* 최소 여백 */
+        border: 1px solid rgba(100, 150, 180, 0.25);
-    }
-    
-    @media (max-width: 768px) {
-        body {
-            overflow-x: hidden !important;
-            overflow-y: auto !important; /* 세로 스크롤 허용 */
-        }
-        .container-fluid {
-            padding: 4px; /* 모바일 더 작은 여백 */
-        }
-        .tab-pane {
-            padding: 8px;
-        }
-        .dashboard-card {
-            margin-top: 8px;
-            border-radius: 6px;
-        }
-        /* 로그 테이블 뷰포트 기반 높이 */
-        textarea#log, textarea#add {
-            max-height: 60vh !important;
-            height: auto !important;
-            min-height: 300px !important;
-        }
-    }
-
-    h1, h2, h3, h4, h5, h6 {
-        color: var(--text-color);
-        font-weight: 700;
-        letter-spacing: -0.025em;
-    }
-
-    /* Main Card */
-    .dashboard-card {
-        background-color: var(--card-bg);
-        border: 1px solid var(--border-color);
         border-radius: 12px;
-        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
         overflow: hidden;
         margin-top: 20px;
     }
 
+    .log-card-header {
+        background: transparent;
+        border-bottom: 1px solid rgba(100, 150, 180, 0.2);
+        padding: 16px 20px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+    }
+
+    .log-card-header h5 {
+        margin: 0;
+        color: #e2e8f0;
+        font-weight: 600;
+    }
+
+    .log-card-header h5 i {
+        color: #7dd3fc;
+        margin-right: 8px;
+    }
+
+    .btn-log {
+        background: linear-gradient(180deg, rgba(45, 55, 72, 0.95), rgba(35, 45, 60, 0.98));
+        border: 1px solid rgba(100, 150, 180, 0.25);
+        color: #7dd3fc;
+        padding: 6px 14px;
+        font-size: 12px;
+        cursor: pointer;
+        border-radius: 6px;
+        margin-left: 8px;
+    }
+
+    .btn-log:hover {
+        background: linear-gradient(180deg, rgba(55, 65, 82, 0.95), rgba(45, 55, 70, 0.98));
+        color: #fff;
+    }
+
+    .btn-log.danger {
+        background: rgba(239, 68, 68, 0.15);
+        border: 1px solid rgba(239, 68, 68, 0.4);
+        color: #fca5a5;
+    }
+
+    .btn-log.danger:hover {
+        background: rgba(239, 68, 68, 0.3);
+    }
+
+    .log-container {
+        height: calc(100vh - 200px);
+        min-height: 400px;
+        overflow-y: auto;
+        padding: 16px;
+        font-family: 'SF Mono', 'Consolas', 'Monaco', monospace;
+        font-size: 12px;
+        line-height: 1.6;
+        background: rgba(0, 0, 0, 0.3);
+        color: #94a3b8;
+    }
+
+    .log-line-error { color: #f87171; }
+    .log-line-warning { color: #fbbf24; }
+    .log-line-info { color: #5eead4; }
+    .log-line-debug { color: #94a3b8; }
+
     /* Tabs Styling */
     .nav-tabs {
-        border-bottom: 1px solid var(--border-color);
+        border-bottom: 1px solid rgba(100, 150, 180, 0.2);
-        background-color: rgba(0,0,0,0.2);
+        background: rgba(0, 0, 0, 0.2);
         padding: 10px 10px 0 10px;
     }
 
     .nav-tabs .nav-link {
-        color: var(--text-muted) !important;
+        color: #94a3b8 !important;
         border: none !important;
         border-radius: 8px 8px 0 0 !important;
         padding: 10px 20px;
         font-weight: 500;
-        transition: all 0.2s ease;
         background: transparent;
     }
 
     .nav-tabs .nav-link:hover {
-        color: var(--text-color) !important;
+        color: #e2e8f0 !important;
-        background-color: rgba(255,255,255,0.05);
+        background: rgba(255, 255, 255, 0.05);
     }
 
     .nav-tabs .nav-link.active {
-        color: var(--accent-color) !important;
+        color: #7dd3fc !important;
-        background-color: var(--card-bg) !important;
+        background: rgba(20, 30, 48, 0.95) !important;
-        border-bottom: 2px solid var(--accent-color) !important;
+        border-bottom: 2px solid #7dd3fc !important;
     }
 
-    /* Content Area */
-    .tab-content {
-        padding: 0; /* Removing default padding to let terminal fill */
-    }
-
-    .tab-pane {
-        padding: 20px;
-    }
-
-    /* Terminal Styling */
-    textarea#log, textarea#add {
-        background-color: var(--terminal-bg) !important;
-        color: var(--terminal-text) !important;
-        border: 1px solid #333;
-        border-radius: 6px;
-        font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
-        font-size: 14px;
-        line-height: 1.5;
-        padding: 16px;
-        width: 100%;
-        box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.5);
-        resize: none; /* Disable manual resize */
-        overscroll-behavior: contain; /* 스크롤 체인 방지 */
-        transform: translateZ(0); /* GPU 가속화 */
-        will-change: scroll-position;
-    }
-
-    textarea#log:focus, textarea#add:focus {
-        outline: none;
-        border-color: var(--accent-color);
-        box-shadow: 0 0 0 1px var(--accent-color);
-    }
-
-    /* Controls Bar */
     .controls-bar {
         display: flex;
         align-items: center;
         justify-content: flex-end;
         padding: 12px 20px;
-        background-color: rgba(0,0,0,0.2);
+        background: rgba(0, 0, 0, 0.2);
-        border-top: 1px solid var(--border-color);
+        border-top: 1px solid rgba(100, 150, 180, 0.2);
-    }
+        gap: 12px;
-
-    /* Toggle Switch */
-    .form-check-input {
-        background-color: #334155;
-        border-color: #475569;
-        cursor: pointer;
     }
 
     .form-check-input:checked {
-        background-color: var(--accent-color);
+        background-color: #7dd3fc;
-        border-color: var(--accent-color);
+        border-color: #7dd3fc;
     }
 
     .form-check-label {
-        color: var(--text-muted);
+        color: #94a3b8;
         font-weight: 500;
-        margin-right: 12px;
-        user-select: none;
     }
 
-    /* Buttons */
+    @media (max-width: 768px) {
-    .btn-action {
+        .log-container {
-        background-color: transparent;
+            height: calc(100vh - 180px);
-        border: 1px solid var(--border-color);
+            min-height: 300px;
-        color: var(--text-color);
+            padding: 12px;
-        border-radius: 6px;
+        }
-        padding: 6px 16px;
+        .log-card-header {
-        font-size: 14px;
+            flex-direction: column;
-        font-weight: 500;
+            gap: 12px;
-        transition: all 0.2s;
+            align-items: flex-start;
-        margin-left: 12px;
+        }
     }
 
-    .btn-action:hover {
+    /* Smooth Load */
-        background-color: var(--accent-color);
+    .content-cloak {
-        border-color: var(--accent-color);
+        opacity: 0;
-        color: white;
+        transition: opacity 0.5s ease-out;
+    }
+    .content-cloak.visible {
+        opacity: 1;
     }
-
 </style>
 
-<div class="container-fluid content-cloak" id="main_container">
+<div class="container-fluid content-cloak" id="main_container" style="max-width: 1400px;">
-    <!-- Header -->
+    <div class="log-card">
-    <div class="d-flex justify-content-between align-items-center mb-4">
-        <div>
-            <h2 class="mb-1">System Logs</h2>
-            <p class="text-muted mb-0" style="color: var(--text-muted);">Real-time application logs and history.</p>
-        </div>
-    </div>
-
-    <div class="dashboard-card">
         <nav>
             {{ macros.m_tab_head_start() }}
                 {{ macros.m_tab_head('old', 'History', true) }}
@@ -196,27 +162,20 @@
         </nav>
         
         <div class="tab-content" id="nav-tabContent">
-            <!-- Old Logs -->
+            <!-- History Logs -->
             {{ macros.m_tab_content_start('old', true) }}
-                <div>
+                <div class="log-container" id="log-history"></div>
-                    <textarea id="log" rows="30" disabled spellcheck="false"></textarea>
-                </div>
             {{ macros.m_tab_content_end() }}
             
-            <!-- New Logs -->
+            <!-- Real-time Logs -->
             {{ macros.m_tab_content_start('new', false) }}
-                <div>
+                <div class="log-container" id="log-realtime"></div>
-                    <textarea id="add" rows="30" disabled spellcheck="false"></textarea>
-                </div>
-                
                 <div class="controls-bar">
-                    <div class="d-flex align-items-center">
+                    <label class="form-check-label" for="auto_scroll">Auto Scroll</label>
-                        <label class="form-check-label" for="auto_scroll">Auto Scroll</label>
+                    <div class="form-check form-switch mb-0">
-                        <div class="form-check form-switch mb-0">
+                        <input id="auto_scroll" name="auto_scroll" class="form-check-input" type="checkbox" checked>
-                            <input id="auto_scroll" name="auto_scroll" class="form-check-input" type="checkbox" checked>
-                        </div>
-                        <button id="clear" class="btn btn-action">Clear Console</button>
                     </div>
+                    <button id="clear" class="btn-log">Clear</button>
                 </div>
             {{ macros.m_tab_content_end() }}
         </div>
@@ -224,90 +183,58 @@
 </div>
 
 <script type="text/javascript">
-$(document).ready(function() {
+function escapeHtml(text) {
-  // Force fluid layout
+    const div = document.createElement('div');
-  $("#main_container").removeClass("container").addClass("container-fluid");
+    div.appendChild(document.createTextNode(text));
-  
+    return div.innerHTML;
-  $('#loading').show();
-  ResizeTextAreaLog()
-})
-
-function ResizeTextAreaLog() {
-  // Dynamic height calculation
-  ClientHeight = window.innerHeight;
-  // Adjust calculation based on new layout (header + padding + tabs + toolbars)
-  // Approx header: 80, padding: 80, tabs: 50, footer: 60 => ~270
-  var offset = 340; 
-  var newHeight = ClientHeight - offset;
-  if (newHeight < 400) newHeight = 400; // Min height
-
-  $("#log").height(newHeight);
-  $("#add").height(newHeight);
 }
 
-$(window).resize(function() {
+function formatLogLine(line) {
-  ResizeTextAreaLog();
+    let className = '';
+    if (line.includes('ERROR')) className = 'log-line-error';
+    else if (line.includes('WARNING')) className = 'log-line-warning';
+    else if (line.includes('INFO')) className = 'log-line-info';
+    else if (line.includes('DEBUG')) className = 'log-line-debug';
+    return '<div class="' + className + '">' + escapeHtml(line) + '</div>';
+}
+
+$(document).ready(function() {
+    $("#main_container").removeClass("container").addClass("container-fluid");
+    $('#loading').show();
+    setTimeout(function() {
+        $('.content-cloak').addClass('visible');
+    }, 100);
 });
 
 var protocol = window.location.protocol;
 var socket = io.connect(protocol + "//" + document.domain + ":" + location.port + "/log");
 
-socket.emit("start", {'package':'{{package}}'} );
+socket.emit("start", {'package':'{{package}}'});
-socket.on('on_start', function(data){
+
-  var logEl = document.getElementById("log");
+socket.on('on_start', function(data) {
-  logEl.innerHTML += data.data;
+    var container = document.getElementById("log-history");
-  logEl.scrollTop = logEl.scrollHeight;
+    var lines = data.data.split('\n');
-  logEl.style.visibility = 'visible';
+    var html = '';
-  $('#loading').hide();
+    lines.forEach(function(line) {
+        html += formatLogLine(line);
+    });
+    container.innerHTML = html || '<div class="text-muted text-center">로그가 비어 있습니다.</div>';
+    container.scrollTop = container.scrollHeight;
+    $('#loading').hide();
 });
 
-socket.on('add', function(data){
+socket.on('add', function(data) {
-  if (data.package == "{{package}}") {
+    if (data.package == "{{package}}") {
-    var chk = $('#auto_scroll').is(":checked");
+        var chk = $('#auto_scroll').is(":checked");
-    var addEl = document.getElementById("add");
+        var container = document.getElementById("log-realtime");
-    addEl.innerHTML += data.data;
+        container.innerHTML += formatLogLine(data.data);
-    if (chk) addEl.scrollTop = addEl.scrollHeight;
+        if (chk) container.scrollTop = container.scrollHeight;
-  }
+    }
 });
 
 $("#clear").click(function(e) {
-  e.preventDefault(); 
+    e.preventDefault(); 
-  document.getElementById("add").innerHTML = '';
+    document.getElementById("log-realtime").innerHTML = '';
-});
-</script>    
-
-<style>
-    /* Smooth Load Transition */
-    .content-cloak, 
-    #menu_module_div, 
-    #menu_page_div {
-        opacity: 0;
-        transition: opacity 0.5s ease-out;
-    }
-    
-    /* Staggered Delays for Natural Top-Down Flow */
-    #menu_module_div.visible {
-        opacity: 1;
-        transition-delay: 0ms;
-    }
-
-    #menu_page_div.visible {
-        opacity: 1;
-        transition-delay: 150ms;
-    }
-
-    .content-cloak.visible {
-        opacity: 1;
-        transition-delay: 300ms;
-    }
-</style>
-
-<script type="text/javascript">
-$(document).ready(function(){
-  // Smooth Load Trigger
-  setTimeout(function() {
-      $('.content-cloak, #menu_module_div, #menu_page_div').addClass('visible');
-  }, 100);
 });
 </script>
 {% endblock %}