Update app-backup4.py

app-backup4.py

@@ -1,7 +1,7 @@
-from fastapi import FastAPI, BackgroundTasks
+from fastapi import FastAPI, BackgroundTasks, UploadFile, File, Form
 from fastapi.responses import HTMLResponse, JSONResponse, Response
 from fastapi.staticfiles import StaticFiles
-import pathlib, os, uvicorn, base64, json
+import pathlib, os, uvicorn, base64, json, shutil
 from typing import Dict, List, Any
 import asyncio
 import logging
@@ -21,23 +21,38 @@ PDF_DIR = BASE / "pdf"
 if not PDF_DIR.exists():
     PDF_DIR.mkdir(parents=True)
 
+# 영구 PDF 디렉토리 설정 (Hugging Face 영구 디스크)
+PERMANENT_PDF_DIR = pathlib.Path("/data/pdfs") if os.path.exists("/data") else BASE / "permanent_pdfs"
+if not PERMANENT_PDF_DIR.exists():
+    PERMANENT_PDF_DIR.mkdir(parents=True)
+
 # 캐시 디렉토리 설정
 CACHE_DIR = BASE / "cache"
 if not CACHE_DIR.exists():
     CACHE_DIR.mkdir(parents=True)
 
+# 관리자 비밀번호
+ADMIN_PASSWORD = os.getenv("PASSWORD", "admin")  # 환경 변수에서 가져오기, 기본값은 테스트용
+
 # 전역 캐시 객체
 pdf_cache: Dict[str, Dict[str, Any]] = {}
 # 캐싱 락
 cache_locks = {}
 
-# PDF 파일 목록 가져오기
+# PDF 파일 목록 가져오기 (메인 디렉토리용)
 def get_pdf_files():
     pdf_files = []
     if PDF_DIR.exists():
         pdf_files = [f for f in PDF_DIR.glob("*.pdf")]
     return pdf_files
 
+# 영구 저장소의 PDF 파일 목록 가져오기
+def get_permanent_pdf_files():
+    pdf_files = []
+    if PERMANENT_PDF_DIR.exists():
+        pdf_files = [f for f in PERMANENT_PDF_DIR.glob("*.pdf")]
+    return pdf_files
+
 # PDF 썸네일 생성 및 프로젝트 데이터 준비
 def generate_pdf_projects():
     projects_data = []
@@ -213,7 +228,13 @@ async def cache_pdf(pdf_path: str):
 # 시작 시 모든 PDF 파일 캐싱
 async def init_cache_all_pdfs():
     logger.info("PDF 캐싱 작업 시작")
-    pdf_files = get_pdf_files()
+    
+    # 메인 및 영구 디렉토리에서 PDF 파일 모두 가져오기
+    pdf_files = get_pdf_files() + get_permanent_pdf_files()
+    
+    # 중복 제거
+    unique_pdf_paths = set(str(p) for p in pdf_files)
+    pdf_files = [pathlib.Path(p) for p in unique_pdf_paths]
     
     # 이미 캐시된 PDF 파일 로드 (빠른 시작을 위해 먼저 수행)
     for cache_file in CACHE_DIR.glob("*_cache.json"):
@@ -245,6 +266,21 @@ async def startup_event():
 async def get_pdf_projects_api():
     return generate_pdf_projects()
 
+# API 엔드포인트: 영구 저장된 PDF 프로젝트 목록
+@app.get("/api/permanent-pdf-projects")
+async def get_permanent_pdf_projects_api():
+    pdf_files = get_permanent_pdf_files()
+    projects_data = []
+    
+    for pdf_file in pdf_files:
+        projects_data.append({
+            "path": str(pdf_file),
+            "name": pdf_file.stem,
+            "cached": pdf_file.stem in pdf_cache and pdf_cache[pdf_file.stem].get("status") == "completed"
+        })
+    
+    return projects_data
+
 # API 엔드포인트: PDF 썸네일 제공 (최적화)
 @app.get("/api/pdf-thumbnail")
 async def get_pdf_thumbnail(path: str):
@@ -369,6 +405,110 @@ async def get_pdf_content(path: str, background_tasks: BackgroundTasks):
         logger.error(f"PDF 콘텐츠 로드 오류: {str(e)}\n{error_details}")
         return JSONResponse(content={"error": str(e)}, status_code=500)
 
+# PDF 업로드 엔드포인트 - 영구 저장소에 저장
+@app.post("/api/upload-pdf")
+async def upload_pdf(file: UploadFile = File(...)):
+    try:
+        # 파일 이름 확인
+        if not file.filename.lower().endswith('.pdf'):
+            return JSONResponse(
+                content={"success": False, "message": "PDF 파일만 업로드 가능합니다"}, 
+                status_code=400
+            )
+        
+        # 영구 저장소에 파일 저장
+        file_path = PERMANENT_PDF_DIR / file.filename
+        
+        # 파일 읽기 및 저장
+        content = await file.read()
+        with open(file_path, "wb") as buffer:
+            buffer.write(content)
+        
+        # 메인 디렉토리에도 복사 (필요시 선택 가능, 관리자가 선택한 PDF만 표시)
+        # with open(PDF_DIR / file.filename, "wb") as buffer:
+        #     buffer.write(content)
+        
+        # 백그라운드에서 캐싱 시작
+        asyncio.create_task(cache_pdf(str(file_path)))
+        
+        return JSONResponse(
+            content={"success": True, "path": str(file_path), "name": file_path.stem},
+            status_code=200
+        )
+    except Exception as e:
+        import traceback
+        error_details = traceback.format_exc()
+        logger.error(f"PDF 업로드 오류: {str(e)}\n{error_details}")
+        return JSONResponse(
+            content={"success": False, "message": str(e)}, 
+            status_code=500
+        )
+
+# 관리자 인증 엔드포인트
+@app.post("/api/admin-login")
+async def admin_login(password: str = Form(...)):
+    if password == ADMIN_PASSWORD:
+        return {"success": True}
+    return {"success": False, "message": "인증 실패"}
+
+# 관리자용 PDF 삭제 엔드포인트
+@app.delete("/api/admin/delete-pdf")
+async def delete_pdf(path: str):
+    try:
+        pdf_file = pathlib.Path(path)
+        if not pdf_file.exists():
+            return {"success": False, "message": "파일을 찾을 수 없습니다"}
+        
+        # PDF 파일 삭제
+        pdf_file.unlink()
+        
+        # 관련 캐시 파일 삭제
+        pdf_name = pdf_file.stem
+        cache_path = get_cache_path(pdf_name)
+        if cache_path.exists():
+            cache_path.unlink()
+            
+        # 캐시 메모리에서도 제거
+        if pdf_name in pdf_cache:
+            del pdf_cache[pdf_name]
+            
+        return {"success": True}
+    except Exception as e:
+        logger.error(f"PDF 삭제 오류: {str(e)}")
+        return {"success": False, "message": str(e)}
+
+# PDF를 메인 디렉토리에 표시 설정
+@app.post("/api/admin/feature-pdf")
+async def feature_pdf(path: str):
+    try:
+        pdf_file = pathlib.Path(path)
+        if not pdf_file.exists():
+            return {"success": False, "message": "파일을 찾을 수 없습니다"}
+        
+        # 메인 디렉토리에 복사
+        target_path = PDF_DIR / pdf_file.name
+        shutil.copy2(pdf_file, target_path)
+            
+        return {"success": True}
+    except Exception as e:
+        logger.error(f"PDF 표시 설정 오류: {str(e)}")
+        return {"success": False, "message": str(e)}
+
+# PDF를 메인 디렉토리에서 제거 (영구 저장소에서는 유지)
+@app.delete("/api/admin/unfeature-pdf")
+async def unfeature_pdf(path: str):
+    try:
+        pdf_name = pathlib.Path(path).name
+        target_path = PDF_DIR / pdf_name
+        
+        if target_path.exists():
+            target_path.unlink()
+            
+        return {"success": True}
+    except Exception as e:
+        logger.error(f"PDF 표시 해제 오류: {str(e)}")
+        return {"success": False, "message": str(e)}
+
 # HTML 파일 읽기 함수
 def get_html_content():
     html_path = BASE / "flipbook_template.html"
@@ -415,14 +555,21 @@ HTML = """
     --transition: all 0.3s ease;
   }
 
-  body {
-    margin: 0;
-    background: var(--bg-color);
-    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-    color: var(--text-color);
-    background-image: linear-gradient(120deg, var(--tertiary-color) 0%, var(--bg-color) 100%);
-    background-attachment: fixed;
-  }
+
+    body {
+      margin: 0;
+      background: var(--bg-color);
+      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+      color: var(--text-color);
+      /* 새로운 퍼플 계통 고급스러운 그라디에이션 배경 */
+      background-image: linear-gradient(135deg, #2a0845 0%, #6441a5 50%, #c9a8ff 100%);
+      background-attachment: fixed;
+    }
+
+    /* 뷰어 모드일 때 배경 변경 */
+    .viewer-mode {
+      background-image: linear-gradient(135deg, #30154e 0%, #6b47ad 50%, #d5b8ff 100%) !important;
+    }
 
   /* 헤더 제목 제거 및 Home 버튼 레이어 처리 */
   .floating-home {
@@ -450,6 +597,11 @@ HTML = """
   }
   
   .floating-home .icon {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 100%;
     font-size: 22px;
     color: var(--primary-color);
     transition: var(--transition);
@@ -480,7 +632,99 @@ HTML = """
     transform: translateX(0);
   }
 
-  #home, #viewerPage {
+  /* 관리자 버튼 스타일 */
+  #adminButton {
+    position: fixed;
+    top: 20px;
+    right: 20px;
+    background: rgba(255, 255, 255, 0.9);
+    backdrop-filter: blur(10px);
+    box-shadow: var(--shadow-md);
+    border-radius: 30px;
+    padding: 8px 20px;
+    display: flex;
+    align-items: center;
+    font-weight: 600;
+    font-size: 14px;
+    cursor: pointer;
+    transition: var(--transition);
+    z-index: 9999;
+  }
+  
+  #adminButton i {
+    margin-right: 8px;
+    color: var(--accent-color);
+  }
+  
+  #adminButton:hover {
+    transform: translateY(-3px);
+    box-shadow: var(--shadow-lg);
+  }
+
+  /* 관리자 로그인 모달 */
+  .modal {
+    display: none;
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.5);
+    backdrop-filter: blur(5px);
+    z-index: 10000;
+    align-items: center;
+    justify-content: center;
+  }
+  
+  .modal-content {
+    background: white;
+    border-radius: var(--radius-md);
+    padding: 30px;
+    width: 90%;
+    max-width: 400px;
+    box-shadow: var(--shadow-lg);
+    text-align: center;
+  }
+  
+  .modal-content h2 {
+    margin-top: 0;
+    color: var(--accent-color);
+    margin-bottom: 20px;
+  }
+  
+  .modal-content input {
+    width: 100%;
+    padding: 12px;
+    margin-bottom: 20px;
+    border: 1px solid #ddd;
+    border-radius: var(--radius-sm);
+    font-size: 16px;
+    box-sizing: border-box;
+  }
+  
+  .modal-content button {
+    padding: 10px 20px;
+    border: none;
+    border-radius: var(--radius-sm);
+    background: var(--accent-color);
+    color: white;
+    font-weight: 600;
+    cursor: pointer;
+    margin: 0 5px;
+    transition: var(--transition);
+  }
+  
+  .modal-content button:hover {
+    opacity: 0.9;
+    transform: translateY(-2px);
+  }
+  
+  .modal-content #adminLoginClose {
+    background: #f1f3f5;
+    color: var(--text-color);
+  }
+
+  #home, #viewerPage, #adminPage {
     padding-top: 100px;
     max-width: 1200px;
     margin: 0 auto;
@@ -649,6 +893,51 @@ HTML = """
     z-index: 5;
     box-shadow: var(--shadow-sm);
   }
+  
+  /* 관리자 카드 추가 스타일 */
+  .admin-card {
+    height: 300px;
+  }
+  
+  .admin-card .card-inner {
+    width: 100%;
+    height: 100%;
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+  
+  .delete-btn, .feature-btn, .unfeature-btn {
+    position: absolute;
+    bottom: 60px;
+    left: 50%;
+    transform: translateX(-50%);
+    background: #ff7675;
+    color: white;
+    border: none;
+    border-radius: 20px;
+    padding: 5px 15px;
+    font-size: 12px;
+    cursor: pointer;
+    z-index: 10;
+    transition: var(--transition);
+  }
+  
+  .feature-btn {
+    bottom: 95px;
+    background: #74b9ff;
+  }
+  
+  .unfeature-btn {
+    bottom: 95px;
+    background: #a29bfe;
+  }
+  
+  .delete-btn:hover, .feature-btn:hover, .unfeature-btn:hover {
+    opacity: 0.9;
+    transform: translateX(-50%) scale(1.05);
+  }
 
   /* 뷰어 스타일 */
   #viewer {
@@ -798,7 +1087,7 @@ HTML = """
   /* 헤더 로고 및 타이틀 */
   .library-header {
     position: fixed;
-    top: 20px;
+    top: 12px;
     left: 0;
     right: 0;
     text-align: center;
@@ -806,21 +1095,21 @@ HTML = """
     pointer-events: none;
   }
   
-  .library-header .title {
-    display: inline-block;
-    padding: 12px 30px;
-    background: rgba(255, 255, 255, 0.85);
-    backdrop-filter: blur(10px);
-    border-radius: 30px;
-    box-shadow: var(--shadow-md);
-    font-size: 1.5rem;
-    font-weight: 600;
-    background-image: linear-gradient(120deg, #667eea 0%, #764ba2 100%);
-    -webkit-background-clip: text;
-    background-clip: text;
-    color: transparent;
-    pointer-events: all;
-  }
+.library-header .title {
+  display: inline-block;
+  padding: 8px 24px; /* 패딩 축소 */
+  background: rgba(255, 255, 255, 0.85);
+  backdrop-filter: blur(10px);
+  border-radius: 25px; /* 테두리 모서리 축소 */
+  box-shadow: var(--shadow-md);
+  font-size: 1.25rem; /* 글자 크기 축소 (1.5rem에서 1.25rem으로) */
+  font-weight: 600;
+  background-image: linear-gradient(120deg, #8e74eb 0%, #9d66ff 100%); /* 제목 색상도 바탕화면과 어울리게 변경 */
+  -webkit-background-clip: text;
+  background-clip: text;
+  color: transparent;
+  pointer-events: all;
+}
   
   /* 점진적 로딩 표시 */
   .loading-pages {
@@ -837,6 +1126,50 @@ HTML = """
     z-index: 9998;
     text-align: center;
   }
+  
+  /* 관리자 페이지 스타일 */
+  #adminPage {
+    color: white;
+    max-width: 1400px;
+  }
+  
+  #adminPage h1 {
+    font-size: 2rem;
+    margin-bottom: 30px;
+    text-align: center;
+    background-image: linear-gradient(120deg, #e0c3fc 0%, #8ec5fc 100%);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+  }
+  
+  #adminBackButton {
+    position: absolute;
+    top: 20px;
+    left: 20px;
+    background: rgba(255, 255, 255, 0.9);
+    backdrop-filter: blur(10px);
+    box-shadow: var(--shadow-md);
+    border: none;
+    border-radius: 30px;
+    padding: 8px 20px;
+    display: flex;
+    align-items: center;
+    font-weight: 600;
+    font-size: 14px;
+    cursor: pointer;
+    transition: var(--transition);
+  }
+  
+  #adminBackButton:hover {
+    transform: translateY(-3px);
+    box-shadow: var(--shadow-lg);
+  }
+  
+  /* 관리자 그리드 */
+  #adminGrid {
+    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
+  }
 
   /* 반응형 디자인 */
   @media (max-width: 768px) {
@@ -862,6 +1195,11 @@ HTML = """
     .floating-home .icon {
       font-size: 18px;
     }
+    
+    #adminButton {
+      padding: 6px 15px;
+      font-size: 12px;
+    }
   }
   </style>
 </head>
@@ -872,21 +1210,34 @@ HTML = """
     <div class="title">홈으로 돌아가기</div>
   </div>
   
+  <!-- 관리자 버튼 -->
+  <div id="adminButton">
+    <i class="fas fa-cog"></i> Admin
+  </div>
+  
+  <!-- 관리자 로그인 모달 -->
+  <div id="adminLoginModal" class="modal">
+    <div class="modal-content">
+      <h2>관리자 로그인</h2>
+      <input type="password" id="adminPasswordInput" placeholder="관리자 비밀번호">
+      <div>
+        <button id="adminLoginButton">로그인</button>
+        <button id="adminLoginClose">취소</button>
+      </div>
+    </div>
+  </div>
+  
   <!-- 센터 정렬된 타이틀 -->
   <div class="library-header">
-    <div class="title">FlipBook Library</div>
+    <div class="title">AI FlipBook Maker</div>
   </div>
 
   <section id="home" class="fade-in">
     <div class="upload-container">
-      <button class="upload">
-        <i class="fas fa-images"></i> 이미지 추가
-        <input id="imgInput" type="file" accept="image/*" multiple hidden>
-      </button>
-      <button class="upload">
+      <button class="upload" id="pdfUploadBtn">
         <i class="fas fa-file-pdf"></i> PDF 추가
-        <input id="pdfInput" type="file" accept="application/pdf" hidden>
       </button>
+      <input id="pdfInput" type="file" accept="application/pdf" style="display:none">
     </div>
     
     <div class="section-title">내 프로젝트</div>
@@ -894,7 +1245,7 @@ HTML = """
       <!-- 카드가 여기에 동적으로 추가됩니다 -->
     </div>
     <div id="noProjects" class="no-projects" style="display: none;">
-      프로젝트가 없습니다. 이미지나 PDF를 추가하여 시작하세요.
+      프로젝트가 없습니다. PDF를 추가하여 시작하세요.
     </div>
   </section>
 
@@ -902,10 +1253,24 @@ HTML = """
     <div id="viewer"></div>
     <div id="loadingPages" class="loading-pages" style="display:none;">페이지 로딩 중... <span id="loadingPagesCount">0/0</span></div>
   </section>
+  
+  <!-- 관리자 페이지 -->
+  <section id="adminPage" style="display:none" class="fade-in">
+    <h1>관리자 페이지</h1>
+    <button id="adminBackButton"><i class="fas fa-arrow-left"></i> 뒤로 가기</button>
+    
+    <div class="section-title">저장된 PDF 목록</div>
+    <div class="grid" id="adminGrid">
+      <!-- 관리자 PDF 카드가 여기에 동적으로 추가됩니다 -->
+    </div>
+    <div id="noAdminProjects" class="no-projects" style="display: none;">
+      저장된 PDF가 없습니다. PDF를 업로드하여 시작하세요.
+    </div>
+  </section>
 
   <script>
     let projects=[], fb=null;
-    const grid=$id('grid'), viewer=$id('viewer');
+    const grid=document.getElementById('grid'), viewer=document.getElementById('viewer');
     pdfjsLib.GlobalWorkerOptions.workerSrc='/static/pdf.worker.js';
 
     // 서버에서 미리 로드된 PDF 프로젝트
@@ -921,10 +1286,84 @@ HTML = """
             .play().then(a=>a.pause()).catch(()=>{});document.removeEventListener(evt,u,{capture:true});},
             {once:true,capture:true});
     });
-
+    
     /* ── 유틸 ── */
     function $id(id){return document.getElementById(id)}
     
+    // 파일 업로드 이벤트 처리
+    document.addEventListener("DOMContentLoaded", function() {
+      console.log("DOM 로드 완료, 이벤트 설정 시작");
+      
+      // PDF 업로드 버튼
+      const pdfBtn = document.getElementById('pdfUploadBtn');
+      const pdfInput = document.getElementById('pdfInput');
+      
+      if (pdfBtn && pdfInput) {
+        console.log("PDF 업로드 버튼 찾음");
+        
+        // 버튼 클릭 시 파일 입력 트리거
+        pdfBtn.addEventListener('click', function() {
+          console.log("PDF 버튼 클릭됨");
+          pdfInput.click();
+        });
+        
+        // 파일 선택 시 처리
+        pdfInput.addEventListener('change', function(e) {
+          console.log("PDF 파일 선택됨:", e.target.files.length);
+          const file = e.target.files[0];
+          if (!file) return;
+          
+          // 서버에 PDF 업로드 (영구 저장소에 저장)
+          uploadPdfToServer(file);
+        });
+      } else {
+        console.error("PDF 업로드 요소를 찾을 수 없음");
+      }
+      
+      // 서버 PDF 로드 및 캐시 상태 확인
+      loadServerPDFs();
+      
+      // 캐시 상태를 주기적으로 확인
+      setInterval(checkCacheStatus, 3000);
+      
+      // 관리자 버튼 이벤트 설정
+      setupAdminFunctions();
+    });
+    
+    // 서버에 PDF 업로드 함수
+    async function uploadPdfToServer(file) {
+      try {
+        showLoading("PDF 업로드 중...");
+        
+        const formData = new FormData();
+        formData.append('file', file);
+        
+        const response = await fetch('/api/upload-pdf', {
+          method: 'POST',
+          body: formData
+        });
+        
+        const result = await response.json();
+        
+        if (result.success) {
+          hideLoading();
+          
+          // 업로드 성공 시 서버 PDF 리스트 리로드
+          await loadServerPDFs();
+          
+          // 성공 메시지
+          showMessage("PDF가 성공적으로 업로드되었습니다!");
+        } else {
+          hideLoading();
+          showError("업로드 실패: " + (result.message || "알 수 없는 오류"));
+        }
+      } catch (error) {
+        console.error("PDF 업로드 오류:", error);
+        hideLoading();
+        showError("PDF 업로드 중 오류가 발생했습니다.");
+      }
+    }
+    
     function addCard(i, thumb, title, isCached = false) {
       const d = document.createElement('div');
       d.className = 'card fade-in';
@@ -952,54 +1391,6 @@ HTML = """
       $id('noProjects').style.display = 'none';
     }
 
-    /* ── 이미지 업로드 ── */
-    $id('imgInput').onchange=e=>{
-      const files=[...e.target.files]; if(!files.length) return;
-      
-      // 로딩 표시 추가
-      showLoading("이미지 로딩 중...");
-      
-      const pages=[],tot=files.length;let done=0;
-      files.forEach((f,i)=>{const r=new FileReader();r.onload=x=>{pages[i]={src:x.target.result,thumb:x.target.result};
-          if(++done===tot) {
-            save(pages, '이미지 컬렉션');
-            hideLoading();
-          }
-        };r.readAsDataURL(f);});
-    };
-
-    /* ── PDF 업로드 ── */
-    $id('pdfInput').onchange=e=>{
-      const file=e.target.files[0]; if(!file) return;
-      
-      // 로딩 표시 추가
-      showLoading("PDF 로딩 중...");
-      
-      const fr=new FileReader();
-      fr.onload=v=>{
-        pdfjsLib.getDocument({data:v.target.result}).promise.then(async pdf=>{
-          const pages=[];
-          
-          for(let p=1;p<=pdf.numPages;p++){
-            // 로딩 상태 업데이트
-            updateLoading(`PDF 페이지 로딩 중... (${p}/${pdf.numPages})`);
-            
-            const pg=await pdf.getPage(p), vp=pg.getViewport({scale:1});
-            const c=document.createElement('canvas');c.width=vp.width;c.height=vp.height;
-            await pg.render({canvasContext:c.getContext('2d'),viewport:vp}).promise;
-            pages.push({src:c.toDataURL(),thumb:c.toDataURL()});
-          }
-          
-          hideLoading();
-          save(pages, file.name.replace('.pdf', ''));
-        }).catch(error => {
-          console.error("PDF 로딩 오류:", error);
-          hideLoading();
-          showError("PDF 로딩 중 오류가 발생했습니다.");
-        });
-      };fr.readAsArrayBuffer(file);
-    };
-
     /* ── 프로젝트 저장 ── */
     function save(pages, title, isCached = false){
       const id=projects.push(pages)-1;
@@ -1022,6 +1413,10 @@ HTML = """
         const response = await fetch('/api/pdf-projects');
         serverProjects = await response.json();
         
+        // 기존 그리드 초기화
+        grid.innerHTML = '';
+        projects = [];
+        
         if (serverProjects.length === 0) {
           hideLoading();
           $id('noProjects').style.display = 'block';
@@ -1497,6 +1892,7 @@ HTML = """
       $id('home').style.display=showHome?'block':'none';
       $id('viewerPage').style.display=showHome?'none':'block';
       $id('homeButton').style.display=showHome?'none':'block';
+      $id('adminPage').style.display='none';
       
       // 뷰어 모드일 때 스타일 변경
       if(!showHome) {
@@ -1505,6 +1901,242 @@ HTML = """
         document.body.classList.remove('viewer-mode');
       }
     }
+    
+    /* -- 관리자 기능 -- */
+    function setupAdminFunctions() {
+      // 관리자 버튼 클릭 - 모달 표시
+      $id('adminButton').addEventListener('click', function() {
+        $id('adminLoginModal').style.display = 'flex';
+        $id('adminPasswordInput').value = '';
+        $id('adminPasswordInput').focus();
+      });
+      
+      // 모달 닫기 버튼
+      $id('adminLoginClose').addEventListener('click', function() {
+        $id('adminLoginModal').style.display = 'none';
+      });
+      
+      // 엔터 키로 로그인
+      $id('adminPasswordInput').addEventListener('keyup', function(e) {
+        if (e.key === 'Enter') {
+          $id('adminLoginButton').click();
+        }
+      });
+      
+      // 로그인 버튼
+      $id('adminLoginButton').addEventListener('click', async function() {
+        const password = $id('adminPasswordInput').value;
+        
+        try {
+          showLoading("로그인 중...");
+          
+          const formData = new FormData();
+          formData.append('password', password);
+          
+          const response = await fetch('/api/admin-login', {
+            method: 'POST',
+            body: formData
+          });
+          
+          const data = await response.json();
+          
+          hideLoading();
+          
+          if (data.success) {
+            // 로그인 성공 - 관리자 페이지 표시
+            $id('adminLoginModal').style.display = 'none';
+            showAdminPage();
+          } else {
+            // 로그인 실패
+            showError("관리자 인증 실패: 비밀번호가 일치하지 않습니다.");
+          }
+        } catch (error) {
+          console.error("관리자 로그인 오류:", error);
+          hideLoading();
+          showError("로그인 처리 중 오류가 발생했습니다.");
+        }
+      });
+      
+      // 관리자 페이지 뒤로가기
+      $id('adminBackButton').addEventListener('click', function() {
+        $id('adminPage').style.display = 'none';
+        $id('home').style.display = 'block';
+      });
+    }
+    
+    // 관리자 페이지 표시
+    async function showAdminPage() {
+      showLoading("관리자 페이지 로딩 중...");
+      
+      // 다른 페이지 숨기기
+      $id('home').style.display = 'none';
+      $id('viewerPage').style.display = 'none';
+      
+      // 관리자 페이지의 PDF 목록 로드
+      try {
+        const response = await fetch('/api/permanent-pdf-projects');
+        const data = await response.json();
+        
+        const adminGrid = $id('adminGrid');
+        adminGrid.innerHTML = ''; // 기존 내용 지우기
+        
+        if (data.length === 0) {
+          $id('noAdminProjects').style.display = 'block';
+        } else {
+          $id('noAdminProjects').style.display = 'none';
+          
+          // 각 PDF 파일에 대한 카드 생성
+          const thumbnailPromises = data.map(async (pdf) => {
+            try {
+              // 썸네일 가져오기
+              const thumbResponse = await fetch(`/api/pdf-thumbnail?path=${encodeURIComponent(pdf.path)}`);
+              const thumbData = await thumbResponse.json();
+              
+              // 표시 여부 확인 (메인 페이지에 표시되는지)
+              const mainPdfPath = pdf.path.split('/').pop();
+              const isMainDisplayed = serverProjects.some(p => p.path.includes(mainPdfPath));
+              
+              // 관리자 카드 생성
+              const card = document.createElement('div');
+              card.className = 'admin-card card fade-in';
+              
+              // 썸네일 및 정보
+              card.innerHTML = `
+                <div class="card-inner">
+                  ${pdf.cached ? '<div class="cached-status">캐시됨</div>' : ''}
+                  <img src="${thumbData.thumbnail || ''}" alt="${pdf.name}" loading="lazy">
+                  <p title="${pdf.name}">${pdf.name.length > 15 ? pdf.name.substring(0, 15) + '...' : pdf.name}</p>
+                  ${isMainDisplayed ? 
+                    `<button class="unfeature-btn" data-path="${pdf.path}">메인에서 제거</button>` : 
+                    `<button class="feature-btn" data-path="${pdf.path}">메인에 표시</button>`}
+                  <button class="delete-btn" data-path="${pdf.path}">삭제</button>
+                </div>
+              `;
+              
+              adminGrid.appendChild(card);
+              
+              // 삭제 버튼 이벤트
+              const deleteBtn = card.querySelector('.delete-btn');
+              if (deleteBtn) {
+                deleteBtn.addEventListener('click', async function(e) {
+                  e.stopPropagation(); // 카드 클릭 이벤트 전파 방지
+                  
+                  if (confirm(`정말 "${pdf.name}" PDF를 삭제하시겠습니까?`)) {
+                    try {
+                      showLoading("PDF 삭제 중...");
+                      
+                      const response = await fetch(`/api/admin/delete-pdf?path=${encodeURIComponent(pdf.path)}`, {
+                        method: 'DELETE'
+                      });
+                      
+                      const result = await response.json();
+                      
+                      hideLoading();
+                      
+                      if (result.success) {
+                        card.remove();
+                        showMessage("PDF가 성공적으로 삭제되었습니다.");
+                        
+                        // 메인 PDF 목록 새로고침
+                        loadServerPDFs();
+                      } else {
+                        showError("삭제 실패: " + (result.message || "알 수 없는 오류"));
+                      }
+                    } catch (error) {
+                      console.error("PDF 삭제 오류:", error);
+                      hideLoading();
+                      showError("PDF 삭제 중 오류가 발생했습니다.");
+                    }
+                  }
+                });
+              }
+              
+              // 메인에 표시 버튼 이벤트
+              const featureBtn = card.querySelector('.feature-btn');
+              if (featureBtn) {
+                featureBtn.addEventListener('click', async function(e) {
+                  e.stopPropagation(); // 카드 클릭 이벤트 전파 방지
+                  
+                  try {
+                    showLoading("처리 중...");
+                    
+                    const response = await fetch(`/api/admin/feature-pdf?path=${encodeURIComponent(pdf.path)}`, {
+                      method: 'POST'
+                    });
+                    
+                    const result = await response.json();
+                    
+                    hideLoading();
+                    
+                    if (result.success) {
+                      showMessage("PDF가 메인 페이지에 표시됩니다.");
+                      // 관리자 페이지 새로고침
+                      showAdminPage();
+                      // 메인 PDF 목록 새로고침
+                      loadServerPDFs();
+                    } else {
+                      showError("처리 실패: " + (result.message || "알 수 없는 오류"));
+                    }
+                  } catch (error) {
+                    console.error("PDF 표시 설정 ��류:", error);
+                    hideLoading();
+                    showError("처리 중 오류가 발생했습니다.");
+                  }
+                });
+              }
+              
+              // 메인에서 제거 버튼 이벤트
+              const unfeatureBtn = card.querySelector('.unfeature-btn');
+              if (unfeatureBtn) {
+                unfeatureBtn.addEventListener('click', async function(e) {
+                  e.stopPropagation(); // 카드 클릭 이벤트 전파 방지
+                  
+                  try {
+                    showLoading("처리 중...");
+                    
+                    const response = await fetch(`/api/admin/unfeature-pdf?path=${encodeURIComponent(pdf.path)}`, {
+                      method: 'DELETE'
+                    });
+                    
+                    const result = await response.json();
+                    
+                    hideLoading();
+                    
+                    if (result.success) {
+                      showMessage("PDF가 메인 페이지에서 제거되었습니다.");
+                      // 관리자 페이지 새로고침
+                      showAdminPage();
+                      // 메인 PDF 목록 새로고침
+                      loadServerPDFs();
+                    } else {
+                      showError("처리 실패: " + (result.message || "알 수 없는 오류"));
+                    }
+                  } catch (error) {
+                    console.error("PDF 표시 해제 오류:", error);
+                    hideLoading();
+                    showError("처리 중 오류가 발생했습니다.");
+                  }
+                });
+              }
+            } catch (error) {
+              console.error(`PDF ${pdf.name} 처리 오류:`, error);
+            }
+          });
+          
+          await Promise.all(thumbnailPromises);
+        }
+        
+        // 관리자 페이지 표시
+        hideLoading();
+        $id('adminPage').style.display = 'block';
+        
+      } catch (error) {
+        console.error("관리자 페이지 로드 오류:", error);
+        hideLoading();
+        showError("관리자 페이지 로드 중 오류가 발생했습니다.");
+        $id('home').style.display = 'block'; // 오류 시 홈으로 복귀
+      }
+    }
 
     /* -- 로딩 및 오류 표시 -- */
     function showLoading(message, progress = -1) {
@@ -1593,14 +2225,36 @@ HTML = """
         }
       }, 5000);
     }
-
-    // 페이지 로드 시 서버 PDF 로드
-    window.addEventListener('DOMContentLoaded', () => {
-      loadServerPDFs();
+    
+    function showMessage(message) {
+      // 기존 메시지가 있다면 제거
+      const existingMessage = $id('messageContainer');
+      if (existingMessage) {
+        existingMessage.remove();
+      }
       
-      // 캐시 상태를 주기적으로 확인 (3초마다)
-      setInterval(checkCacheStatus, 3000);
-    });
+      const messageContainer = document.createElement('div');
+      messageContainer.className = 'loading-container fade-in';
+      messageContainer.id = 'messageContainer';
+      messageContainer.innerHTML = `
+        <p class="loading-text" style="color: #2ecc71;">${message}</p>
+        <button id="messageCloseBtn" style="margin-top: 15px; padding: 8px 16px; background: #3498db; color: white; border: none; border-radius: 4px; cursor: pointer;">확인</button>
+      `;
+      
+      document.body.appendChild(messageContainer);
+      
+      // 확인 버튼 클릭 이벤트
+      $id('messageCloseBtn').onclick = () => {
+        messageContainer.remove();
+      };
+      
+      // 3초 후 자동으로 닫기
+      setTimeout(() => {
+        if ($id('messageContainer')) {
+          $id('messageContainer').remove();
+        }
+      }, 3000);
+    }
   </script>
 </body>
 </html>