Spaces:
Running
on
CPU Upgrade
Running
on
CPU Upgrade
Delete app.py
Browse files
app.py
DELETED
@@ -1,572 +0,0 @@
|
|
1 |
-
from fastapi import FastAPI
|
2 |
-
from fastapi.responses import HTMLResponse
|
3 |
-
from fastapi.staticfiles import StaticFiles
|
4 |
-
import pathlib, os, uvicorn, base64
|
5 |
-
|
6 |
-
BASE = pathlib.Path(__file__).parent
|
7 |
-
app = FastAPI()
|
8 |
-
app.mount("/static", StaticFiles(directory=BASE), name="static")
|
9 |
-
|
10 |
-
# PDF 디렉토리 설정
|
11 |
-
PDF_DIR = BASE / "pdf"
|
12 |
-
if not PDF_DIR.exists():
|
13 |
-
PDF_DIR.mkdir(parents=True)
|
14 |
-
|
15 |
-
# PDF 파일 목록 가져오기
|
16 |
-
def get_pdf_files():
|
17 |
-
pdf_files = []
|
18 |
-
if PDF_DIR.exists():
|
19 |
-
pdf_files = [f for f in PDF_DIR.glob("*.pdf")]
|
20 |
-
return pdf_files
|
21 |
-
|
22 |
-
# PDF 썸네일 생성 및 프로젝트 데이터 준비
|
23 |
-
def generate_pdf_projects():
|
24 |
-
projects_data = []
|
25 |
-
pdf_files = get_pdf_files()
|
26 |
-
|
27 |
-
for pdf_file in pdf_files:
|
28 |
-
projects_data.append({
|
29 |
-
"path": str(pdf_file),
|
30 |
-
"name": pdf_file.stem
|
31 |
-
})
|
32 |
-
|
33 |
-
return projects_data
|
34 |
-
|
35 |
-
HTML = """
|
36 |
-
<!doctype html><html lang="ko"><head>
|
37 |
-
<meta charset="utf-8"><title>FlipBook Space</title>
|
38 |
-
<link rel="stylesheet" href="/static/flipbook.css">
|
39 |
-
<script src="/static/three.js"></script>
|
40 |
-
<script src="/static/iscroll.js"></script>
|
41 |
-
<script src="/static/mark.js"></script>
|
42 |
-
<script src="/static/mod3d.js"></script>
|
43 |
-
<script src="/static/pdf.js"></script>
|
44 |
-
<script src="/static/flipbook.js"></script>
|
45 |
-
<script src="/static/flipbook.book3.js"></script>
|
46 |
-
<script src="/static/flipbook.scroll.js"></script>
|
47 |
-
<script src="/static/flipbook.swipe.js"></script>
|
48 |
-
<script src="/static/flipbook.webgl.js"></script>
|
49 |
-
<style>
|
50 |
-
body{margin:0;background:#f0f0f0;font-family:sans-serif}
|
51 |
-
header{max-width:960px;margin:0 auto;padding:18px 20px;display:flex;align-items:center}
|
52 |
-
#homeBtn{display:none;width:38px;height:38px;border:none;border-radius:50%;cursor:pointer;
|
53 |
-
background:#0077c2;color:#fff;font-size:20px;margin-right:12px}
|
54 |
-
#homeBtn:hover{background:#005999}
|
55 |
-
h2{margin:0;font-size:1.5rem;font-weight:600}
|
56 |
-
#home,#viewerPage{max-width:960px;margin:0 auto;padding:0 20px 40px}
|
57 |
-
.grid{display:grid;grid-template-columns:repeat(auto-fill,180px);gap:16px;margin-top:24px}
|
58 |
-
.card{
|
59 |
-
background:#fff url('/static/book2.jpg') no-repeat center center;
|
60 |
-
background-size: 169%; /* 배경 이미지를 현재보다 30% 더 키움 (130% * 1.3 = 169%) */
|
61 |
-
border:1px solid #ccc;
|
62 |
-
border-radius:6px;
|
63 |
-
cursor:pointer;
|
64 |
-
box-shadow:0 2px 4px rgba(0,0,0,.12);
|
65 |
-
width: 180px;
|
66 |
-
height: 240px;
|
67 |
-
position: relative;
|
68 |
-
display: flex;
|
69 |
-
flex-direction: column;
|
70 |
-
align-items: center;
|
71 |
-
justify-content: center;
|
72 |
-
}
|
73 |
-
.card img{
|
74 |
-
width:55%; /* 썸네일 크기 줄임 (배경이 커져서 비율 유지) */
|
75 |
-
height:auto;
|
76 |
-
object-fit:contain;
|
77 |
-
position:absolute; /* 절대 위치로 변경 */
|
78 |
-
top:50%; /* 상단에서 50% */
|
79 |
-
left:50%; /* 좌측에서 50% */
|
80 |
-
transform: translate(-50%, -70%); /* 정중앙에서 20% 위로 이동 */
|
81 |
-
border: 1px solid #ddd;
|
82 |
-
box-shadow: 0 2px 5px rgba(0,0,0,0.2);
|
83 |
-
}
|
84 |
-
.card p{
|
85 |
-
text-align:center;
|
86 |
-
margin:6px 0;
|
87 |
-
position: absolute;
|
88 |
-
bottom: 10px;
|
89 |
-
left: 50%;
|
90 |
-
transform: translateX(-50%);
|
91 |
-
background: rgba(255, 255, 255, 0.7);
|
92 |
-
padding: 4px 8px;
|
93 |
-
border-radius: 4px;
|
94 |
-
width: 85%;
|
95 |
-
white-space: nowrap;
|
96 |
-
overflow: hidden;
|
97 |
-
text-overflow: ellipsis;
|
98 |
-
max-width: 150px;
|
99 |
-
font-size: 11px; /* 기본 16px에서 약 30% 감소 */
|
100 |
-
}
|
101 |
-
button.upload{all:unset;cursor:pointer;border:1px solid #bbb;padding:8px 14px;border-radius:6px;background:#fff;margin:0 8px}
|
102 |
-
#viewer{
|
103 |
-
width:95%;
|
104 |
-
height:95vh;
|
105 |
-
max-width:95%;
|
106 |
-
margin:0;
|
107 |
-
background:#fff;
|
108 |
-
border:1px solid #ddd;
|
109 |
-
border-radius:8px;
|
110 |
-
position:fixed;
|
111 |
-
top:50%;
|
112 |
-
left:50%;
|
113 |
-
transform:translate(-50%, -50%);
|
114 |
-
z-index:1000;
|
115 |
-
box-shadow:0 4px 20px rgba(0,0,0,0.15);
|
116 |
-
/* 화면 비율에 맞게 조정 */
|
117 |
-
max-height: calc(95vh - 40px); /* 여백 고려 */
|
118 |
-
aspect-ratio: auto; /* 비율 자동 조정 */
|
119 |
-
object-fit: contain; /* 내용물 비율 유지 */
|
120 |
-
overflow: hidden; /* 내용 넘침 방지 */
|
121 |
-
}
|
122 |
-
|
123 |
-
/* FlipBook 컨트롤바 관련 스타일 오버라이드 */
|
124 |
-
.flipbook-container .fb3d-menu-bar {
|
125 |
-
z-index: 2000 !important; /* 컨트롤바가 다른 요소보다 위에 오도록 함 */
|
126 |
-
opacity: 1 !important; /* 항상 표시되도록 함 */
|
127 |
-
bottom: 0 !important; /* 하단에 고정 */
|
128 |
-
background-color: rgba(0,0,0,0.7) !important; /* 배경색 설정 */
|
129 |
-
border-radius: 0 0 8px 8px !important; /* 하단 모서리만 둥글게 */
|
130 |
-
padding: 8px 0 !important; /* 상하 패딩 추가 */
|
131 |
-
}
|
132 |
-
|
133 |
-
.flipbook-container .fb3d-menu-bar > ul > li > img,
|
134 |
-
.flipbook-container .fb3d-menu-bar > ul > li > div {
|
135 |
-
opacity: 1 !important; /* 메뉴 아이콘 항상 표시 */
|
136 |
-
transform: scale(1.2) !important; /* 아이콘 크기 약간 키움 */
|
137 |
-
}
|
138 |
-
|
139 |
-
.flipbook-container .fb3d-menu-bar > ul > li {
|
140 |
-
margin: 0 8px !important; /* 메뉴 아이템 간격 조정 */
|
141 |
-
}
|
142 |
-
|
143 |
-
/* 메뉴 툴팁 스타일 개선 */
|
144 |
-
.flipbook-container .fb3d-menu-bar > ul > li > span {
|
145 |
-
background-color: rgba(0,0,0,0.8) !important;
|
146 |
-
color: white !important;
|
147 |
-
border-radius: 4px !important;
|
148 |
-
padding: 4px 8px !important;
|
149 |
-
font-size: 12px !important;
|
150 |
-
bottom: 45px !important; /* 툴팁 위치 조정 */
|
151 |
-
}
|
152 |
-
</style></head><body>
|
153 |
-
|
154 |
-
<header>
|
155 |
-
<button id="homeBtn" title="홈으로">🏠</button>
|
156 |
-
<h2>My FlipBook Projects</h2>
|
157 |
-
</header>
|
158 |
-
|
159 |
-
<section id="home">
|
160 |
-
<div>
|
161 |
-
<label class="upload">📷 이미지 <input id="imgInput" type="file" accept="image/*" multiple hidden></label>
|
162 |
-
<label class="upload">📄 PDF <input id="pdfInput" type="file" accept="application/pdf" hidden></label>
|
163 |
-
</div>
|
164 |
-
<div class="grid" id="grid"></div>
|
165 |
-
</section>
|
166 |
-
|
167 |
-
<section id="viewerPage" style="display:none">
|
168 |
-
<div id="viewer"></div>
|
169 |
-
</section>
|
170 |
-
|
171 |
-
<script>
|
172 |
-
let projects=[], fb=null;
|
173 |
-
const grid=$id('grid'), viewer=$id('viewer');
|
174 |
-
pdfjsLib.GlobalWorkerOptions.workerSrc='/static/pdf.worker.js';
|
175 |
-
|
176 |
-
// 서버에서 미리 로드된 PDF 프로젝트
|
177 |
-
let serverProjects = [];
|
178 |
-
|
179 |
-
/* 🔊 오디오 unlock – 내장 Audio 와 같은 MP3 경로 사용 */
|
180 |
-
['click','touchstart'].forEach(evt=>{
|
181 |
-
document.addEventListener(evt,function u(){new Audio('static/turnPage2.mp3')
|
182 |
-
.play().then(a=>a.pause()).catch(()=>{});document.removeEventListener(evt,u,{capture:true});},
|
183 |
-
{once:true,capture:true});
|
184 |
-
});
|
185 |
-
|
186 |
-
/* ── 유틸 ── */
|
187 |
-
function $id(id){return document.getElementById(id)}
|
188 |
-
function addCard(i,thumb,title){
|
189 |
-
const d=document.createElement('div');
|
190 |
-
d.className='card';
|
191 |
-
d.onclick=()=>open(i);
|
192 |
-
|
193 |
-
// 제목 10글자 제한 및 말줄임표 처리
|
194 |
-
const displayTitle = title ?
|
195 |
-
(title.length > 10 ? title.substring(0, 10) + '...' : title) :
|
196 |
-
'프로젝트 ' + (i+1);
|
197 |
-
|
198 |
-
d.innerHTML=`<img src="${thumb}"><p title="${title || '프로젝트 ' + (i+1)}">${displayTitle}</p>`;
|
199 |
-
grid.appendChild(d);
|
200 |
-
}
|
201 |
-
|
202 |
-
/* ── 이미지 업로드 ── */
|
203 |
-
$id('imgInput').onchange=e=>{
|
204 |
-
const files=[...e.target.files]; if(!files.length) return;
|
205 |
-
const pages=[],tot=files.length;let done=0;
|
206 |
-
files.forEach((f,i)=>{const r=new FileReader();r.onload=x=>{pages[i]={src:x.target.result,thumb:x.target.result};
|
207 |
-
if(++done===tot) save(pages);};r.readAsDataURL(f);});
|
208 |
-
};
|
209 |
-
|
210 |
-
/* ── PDF 업로드 ── */
|
211 |
-
$id('pdfInput').onchange=e=>{
|
212 |
-
const file=e.target.files[0]; if(!file) return;
|
213 |
-
const fr=new FileReader();
|
214 |
-
fr.onload=v=>{
|
215 |
-
pdfjsLib.getDocument({data:v.target.result}).promise.then(async pdf=>{
|
216 |
-
const pages=[];
|
217 |
-
for(let p=1;p<=pdf.numPages;p++){
|
218 |
-
const pg=await pdf.getPage(p), vp=pg.getViewport({scale:1});
|
219 |
-
const c=document.createElement('canvas');c.width=vp.width;c.height=vp.height;
|
220 |
-
await pg.render({canvasContext:c.getContext('2d'),viewport:vp}).promise;
|
221 |
-
pages.push({src:c.toDataURL(),thumb:c.toDataURL()});
|
222 |
-
}
|
223 |
-
save(pages, file.name.replace('.pdf', ''));
|
224 |
-
});
|
225 |
-
};fr.readAsArrayBuffer(file);
|
226 |
-
};
|
227 |
-
|
228 |
-
/* ── 프로젝트 저장 ── */
|
229 |
-
function save(pages, title){
|
230 |
-
const id=projects.push(pages)-1;
|
231 |
-
addCard(id,pages[0].thumb, title);
|
232 |
-
}
|
233 |
-
|
234 |
-
/* ── 서버 PDF 로드 ── */
|
235 |
-
async function loadServerPDFs() {
|
236 |
-
try {
|
237 |
-
const response = await fetch('/api/pdf-projects');
|
238 |
-
serverProjects = await response.json();
|
239 |
-
|
240 |
-
// 서버 PDF 로드 및 썸네일 생성
|
241 |
-
for(let i = 0; i < serverProjects.length; i++) {
|
242 |
-
const project = serverProjects[i];
|
243 |
-
const response = await fetch(`/api/pdf-thumbnail?path=${encodeURIComponent(project.path)}`);
|
244 |
-
const data = await response.json();
|
245 |
-
|
246 |
-
if(data.thumbnail) {
|
247 |
-
const pages = [{
|
248 |
-
src: data.thumbnail,
|
249 |
-
thumb: data.thumbnail,
|
250 |
-
path: project.path
|
251 |
-
}];
|
252 |
-
|
253 |
-
save(pages, project.name);
|
254 |
-
}
|
255 |
-
}
|
256 |
-
} catch(error) {
|
257 |
-
console.error('서버 PDF 로드 실패:', error);
|
258 |
-
}
|
259 |
-
}
|
260 |
-
|
261 |
-
/* ── 카드 → FlipBook ── */
|
262 |
-
function open(i){
|
263 |
-
toggle(false);
|
264 |
-
const pages = projects[i];
|
265 |
-
|
266 |
-
// 로컬 프로젝트 또는 서버 PDF 로드
|
267 |
-
if(fb){fb.destroy();viewer.innerHTML='';}
|
268 |
-
|
269 |
-
if(pages[0].path) {
|
270 |
-
// 로딩 표시
|
271 |
-
viewer.innerHTML = '<div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;"><div style="border:4px solid #f3f3f3;border-top:4px solid #3498db;border-radius:50%;width:50px;height:50px;margin:0 auto;animation:spin 2s linear infinite;"></div><p style="margin-top:20px;font-size:16px;">PDF 로딩 중...</p></div>';
|
272 |
-
|
273 |
-
// 스타일 추가
|
274 |
-
if (!document.getElementById('loadingStyle')) {
|
275 |
-
const style = document.createElement('style');
|
276 |
-
style.id = 'loadingStyle';
|
277 |
-
style.textContent = '@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}';
|
278 |
-
document.head.appendChild(style);
|
279 |
-
}
|
280 |
-
|
281 |
-
// 서버 PDF 파일 로드
|
282 |
-
fetch(`/api/pdf-content?path=${encodeURIComponent(pages[0].path)}`)
|
283 |
-
.then(response => {
|
284 |
-
if (!response.ok) {
|
285 |
-
throw new Error('PDF 로드 실패: ' + response.statusText);
|
286 |
-
}
|
287 |
-
return response.arrayBuffer();
|
288 |
-
})
|
289 |
-
.then(pdfData => {
|
290 |
-
// PDF 데이터 로드 확인 로깅
|
291 |
-
console.log('PDF 데이터 로드 완료:', pdfData.byteLength + ' 바이트');
|
292 |
-
|
293 |
-
return pdfjsLib.getDocument({data: pdfData}).promise;
|
294 |
-
})
|
295 |
-
.then(async pdf => {
|
296 |
-
console.log('PDF 문서 로드 완료. 페이지 수:', pdf.numPages);
|
297 |
-
|
298 |
-
const pdfPages = [];
|
299 |
-
const progressElement = viewer.querySelector('p');
|
300 |
-
|
301 |
-
for(let p = 1; p <= pdf.numPages; p++) {
|
302 |
-
if (progressElement) {
|
303 |
-
progressElement.textContent = `PDF 페이지 로딩 중... (${p}/${pdf.numPages})`;
|
304 |
-
}
|
305 |
-
|
306 |
-
try {
|
307 |
-
const pg = await pdf.getPage(p);
|
308 |
-
const vp = pg.getViewport({scale: 1});
|
309 |
-
const c = document.createElement('canvas');
|
310 |
-
c.width = vp.width;
|
311 |
-
c.height = vp.height;
|
312 |
-
|
313 |
-
await pg.render({canvasContext: c.getContext('2d'), viewport: vp}).promise;
|
314 |
-
pdfPages.push({src: c.toDataURL(), thumb: c.toDataURL()});
|
315 |
-
} catch (pageError) {
|
316 |
-
console.error(`페이지 ${p} 렌더링 오류:`, pageError);
|
317 |
-
}
|
318 |
-
}
|
319 |
-
|
320 |
-
console.log('모든 페이지 렌더링 완료:', pdfPages.length);
|
321 |
-
|
322 |
-
if (pdfPages.length > 0) {
|
323 |
-
createFlipBook(pdfPages);
|
324 |
-
} else {
|
325 |
-
throw new Error('PDF에서 페이지를 추출할 수 없습니다.');
|
326 |
-
}
|
327 |
-
})
|
328 |
-
.catch(error => {
|
329 |
-
console.error('PDF 처리 중 오류 발생:', error);
|
330 |
-
viewer.innerHTML = `<div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;"><p style="color:red;font-size:16px;">PDF를 로드하는 중 오류가 발생했습니다:<br>${error.message}</p><button id="backBtn" style="margin-top:20px;padding:10px 20px;background:#0077c2;color:white;border:none;border-radius:4px;cursor:pointer;">홈으로 돌아가기</button></div>`;
|
331 |
-
|
332 |
-
document.getElementById('backBtn').addEventListener('click', function() {
|
333 |
-
toggle(true);
|
334 |
-
});
|
335 |
-
});
|
336 |
-
} else {
|
337 |
-
// 업로드된 프로젝트 보기
|
338 |
-
console.log('로컬 업로드된 프로젝트 렌더링:', pages.length + '페이지');
|
339 |
-
createFlipBook(pages);
|
340 |
-
}
|
341 |
-
}
|
342 |
-
|
343 |
-
function createFlipBook(pages) {
|
344 |
-
console.log('FlipBook 생성 시작. 페이지 수:', pages.length);
|
345 |
-
|
346 |
-
try {
|
347 |
-
// 화면 비율 계산
|
348 |
-
const calculateAspectRatio = () => {
|
349 |
-
const windowWidth = window.innerWidth;
|
350 |
-
const windowHeight = window.innerHeight;
|
351 |
-
const aspectRatio = windowWidth / windowHeight;
|
352 |
-
|
353 |
-
// 너비 또는 높이 기준으로 최대 95% 제한
|
354 |
-
let width, height;
|
355 |
-
if (aspectRatio > 1) { // 가로 화면
|
356 |
-
height = Math.min(windowHeight * 0.95, windowHeight - 40);
|
357 |
-
width = height * aspectRatio * 0.8; // 가로 화면에서는 약간 줄임
|
358 |
-
if (width > windowWidth * 0.95) {
|
359 |
-
width = windowWidth * 0.95;
|
360 |
-
height = width / (aspectRatio * 0.8);
|
361 |
-
}
|
362 |
-
} else { // 세로 화면
|
363 |
-
width = Math.min(windowWidth * 0.95, windowWidth - 40);
|
364 |
-
height = width / aspectRatio * 0.9; // 세로 화면에서는 약간 늘림
|
365 |
-
if (height > windowHeight * 0.95) {
|
366 |
-
height = windowHeight * 0.95;
|
367 |
-
width = height * aspectRatio * 0.9;
|
368 |
-
}
|
369 |
-
}
|
370 |
-
|
371 |
-
// 최적 사이즈 반환
|
372 |
-
return {
|
373 |
-
width: Math.round(width),
|
374 |
-
height: Math.round(height)
|
375 |
-
};
|
376 |
-
};
|
377 |
-
|
378 |
-
// 초기 화면 비율 계산
|
379 |
-
const size = calculateAspectRatio();
|
380 |
-
viewer.style.width = size.width + 'px';
|
381 |
-
viewer.style.height = size.height + 'px';
|
382 |
-
|
383 |
-
fb = new FlipBook(viewer, {
|
384 |
-
pages: pages,
|
385 |
-
viewMode: 'webgl',
|
386 |
-
autoSize: true,
|
387 |
-
flipDuration: 800,
|
388 |
-
backgroundColor: '#fff',
|
389 |
-
/* 🔊 내장 사운드 */
|
390 |
-
sound: true,
|
391 |
-
assets: {flipMp3: 'static/turnPage2.mp3', hardFlipMp3: 'static/turnPage2.mp3'},
|
392 |
-
controlsProps: {
|
393 |
-
enableFullscreen: true,
|
394 |
-
enableToc: true,
|
395 |
-
enableDownload: false,
|
396 |
-
enablePrint: false,
|
397 |
-
enableZoom: true,
|
398 |
-
enableShare: false,
|
399 |
-
enableSearch: true,
|
400 |
-
enableAutoPlay: true,
|
401 |
-
enableAnnotation: false,
|
402 |
-
enableSound: true,
|
403 |
-
enableLightbox: false,
|
404 |
-
layout: 10, // 레이아웃 옵션
|
405 |
-
skin: 'light', // 스킨 스타일
|
406 |
-
autoNavigationTime: 3600, // 자동 넘김 시간(초)
|
407 |
-
hideControls: false, // 컨트롤 숨김 비활성화
|
408 |
-
paddingTop: 10, // 상단 패딩
|
409 |
-
paddingLeft: 10, // 좌측 패딩
|
410 |
-
paddingRight: 10, // 우측 패딩
|
411 |
-
paddingBottom: 10, // 하단 패딩
|
412 |
-
pageTextureSize: 1024, // 페이지 텍스처 크기
|
413 |
-
thumbnails: true, // 섬네일 활성화
|
414 |
-
autoHideControls: false, // 자동 숨김 비활성화
|
415 |
-
controlsTimeout: 8000 // 컨트롤 표시 시간 연장
|
416 |
-
}
|
417 |
-
});
|
418 |
-
|
419 |
-
// 화면 크기 변경 시 FlipBook 크기 조정
|
420 |
-
window.addEventListener('resize', () => {
|
421 |
-
if (fb) {
|
422 |
-
const newSize = calculateAspectRatio();
|
423 |
-
viewer.style.width = newSize.width + 'px';
|
424 |
-
viewer.style.height = newSize.height + 'px';
|
425 |
-
fb.resize();
|
426 |
-
}
|
427 |
-
});
|
428 |
-
|
429 |
-
// FlipBook 생성 후 컨트롤바 강제 표시
|
430 |
-
setTimeout(() => {
|
431 |
-
try {
|
432 |
-
// 컨트롤바 관련 요소 찾기 및 스타일 적용
|
433 |
-
const menuBars = document.querySelectorAll('.flipbook-container .fb3d-menu-bar');
|
434 |
-
if (menuBars && menuBars.length > 0) {
|
435 |
-
menuBars.forEach(menuBar => {
|
436 |
-
menuBar.style.display = 'block';
|
437 |
-
menuBar.style.opacity = '1';
|
438 |
-
menuBar.style.visibility = 'visible';
|
439 |
-
menuBar.style.zIndex = '9999';
|
440 |
-
});
|
441 |
-
}
|
442 |
-
} catch (e) {
|
443 |
-
console.warn('컨트롤바 스타일 적용 중 오류:', e);
|
444 |
-
}
|
445 |
-
}, 1000);
|
446 |
-
|
447 |
-
console.log('FlipBook 생성 완료');
|
448 |
-
} catch (error) {
|
449 |
-
console.error('FlipBook 생성 중 오류 발생:', error);
|
450 |
-
alert('FlipBook을 생성하는 중 오류가 발생했습니다: ' + error.message);
|
451 |
-
}
|
452 |
-
}
|
453 |
-
|
454 |
-
/* ── 네비게이션 ── */
|
455 |
-
$id('homeBtn').onclick=()=>{
|
456 |
-
if(fb) {
|
457 |
-
fb.destroy();
|
458 |
-
viewer.innerHTML = '';
|
459 |
-
fb = null;
|
460 |
-
}
|
461 |
-
toggle(true);
|
462 |
-
};
|
463 |
-
|
464 |
-
function toggle(showHome){
|
465 |
-
$id('home').style.display=showHome?'block':'none';
|
466 |
-
$id('viewerPage').style.display=showHome?'none':'block';
|
467 |
-
$id('homeBtn').style.display=showHome?'none':'inline-block';
|
468 |
-
|
469 |
-
// 추가: 전체 화면 모드에서 homeBtn 위치 조정
|
470 |
-
if(!showHome) {
|
471 |
-
$id('homeBtn').style.position = 'fixed';
|
472 |
-
$id('homeBtn').style.top = '20px';
|
473 |
-
$id('homeBtn').style.left = '20px';
|
474 |
-
$id('homeBtn').style.zIndex = '9999'; // 최상위 z-index로 변경
|
475 |
-
$id('homeBtn').style.fontSize = '24px'; // 크기 증가
|
476 |
-
$id('homeBtn').style.width = '48px';
|
477 |
-
$id('homeBtn').style.height = '48px';
|
478 |
-
$id('homeBtn').style.boxShadow = '0 2px 10px rgba(0,0,0,0.2)'; // 그림자 추가
|
479 |
-
|
480 |
-
// 배경 오버레이 추가
|
481 |
-
document.body.style.backgroundColor = '#3a3a3a';
|
482 |
-
} else {
|
483 |
-
$id('homeBtn').style.position = '';
|
484 |
-
$id('homeBtn').style.top = '';
|
485 |
-
$id('homeBtn').style.left = '';
|
486 |
-
$id('homeBtn').style.zIndex = '';
|
487 |
-
$id('homeBtn').style.fontSize = '';
|
488 |
-
$id('homeBtn').style.width = '';
|
489 |
-
$id('homeBtn').style.height = '';
|
490 |
-
$id('homeBtn').style.boxShadow = '';
|
491 |
-
|
492 |
-
// 배경 원래대로
|
493 |
-
document.body.style.backgroundColor = '#f0f0f0';
|
494 |
-
}
|
495 |
-
}
|
496 |
-
|
497 |
-
// 페이지 로드 시 서버 PDF 로드
|
498 |
-
window.addEventListener('DOMContentLoaded', loadServerPDFs);
|
499 |
-
</script>
|
500 |
-
</body></html>
|
501 |
-
"""
|
502 |
-
|
503 |
-
# API 엔드포인트: PDF 프로젝트 목록
|
504 |
-
@app.get("/api/pdf-projects")
|
505 |
-
async def get_pdf_projects():
|
506 |
-
return generate_pdf_projects()
|
507 |
-
|
508 |
-
# API 엔드포인트: PDF 썸네일 생성
|
509 |
-
@app.get("/api/pdf-thumbnail")
|
510 |
-
async def get_pdf_thumbnail(path: str):
|
511 |
-
try:
|
512 |
-
import fitz # PyMuPDF
|
513 |
-
|
514 |
-
# PDF 파일 열기
|
515 |
-
doc = fitz.open(path)
|
516 |
-
|
517 |
-
# 첫 페이지 가져오기
|
518 |
-
if doc.page_count > 0:
|
519 |
-
page = doc[0]
|
520 |
-
# 썸네일용 이미지 렌더링 (해상도 조정)
|
521 |
-
pix = page.get_pixmap(matrix=fitz.Matrix(0.5, 0.5))
|
522 |
-
img_data = pix.tobytes("png")
|
523 |
-
|
524 |
-
# Base64 인코딩
|
525 |
-
b64_img = base64.b64encode(img_data).decode('utf-8')
|
526 |
-
return {"thumbnail": f"data:image/png;base64,{b64_img}"}
|
527 |
-
|
528 |
-
return {"thumbnail": None}
|
529 |
-
except Exception as e:
|
530 |
-
return {"error": str(e), "thumbnail": None}
|
531 |
-
|
532 |
-
@app.get("/api/pdf-content")
|
533 |
-
async def get_pdf_content(path: str):
|
534 |
-
try:
|
535 |
-
# 파일 존재 여부 확인
|
536 |
-
pdf_path = pathlib.Path(path)
|
537 |
-
if not pdf_path.exists():
|
538 |
-
return {"error": f"파일을 찾을 수 없습니다: {path}"}, 404
|
539 |
-
|
540 |
-
# 파일 읽기
|
541 |
-
with open(path, "rb") as pdf_file:
|
542 |
-
content = pdf_file.read()
|
543 |
-
|
544 |
-
# 파일명 처리 - URL 인코딩으로 한글 등 특수 문자 처리
|
545 |
-
import urllib.parse
|
546 |
-
filename = pdf_path.name
|
547 |
-
encoded_filename = urllib.parse.quote(filename)
|
548 |
-
|
549 |
-
# 응답 헤더 설정 - RFC 6266 표준 사용
|
550 |
-
headers = {
|
551 |
-
"Content-Type": "application/pdf",
|
552 |
-
"Content-Disposition": f"inline; filename=\"{encoded_filename}\"; filename*=UTF-8''{encoded_filename}"
|
553 |
-
}
|
554 |
-
|
555 |
-
# 파일 콘텐츠 직접 반환 (dict가 아닌 Response 객체)
|
556 |
-
from fastapi.responses import Response
|
557 |
-
return Response(content=content, media_type="application/pdf")
|
558 |
-
except Exception as e:
|
559 |
-
import traceback
|
560 |
-
error_details = traceback.format_exc()
|
561 |
-
print(f"PDF 콘텐츠 로드 오류: {str(e)}\n{error_details}")
|
562 |
-
|
563 |
-
# 오류 응답 반환 (JSON 형식)
|
564 |
-
from fastapi.responses import JSONResponse
|
565 |
-
return JSONResponse(content={"error": str(e)}, status_code=500)
|
566 |
-
|
567 |
-
@app.get("/", response_class=HTMLResponse)
|
568 |
-
async def root():
|
569 |
-
return HTML
|
570 |
-
|
571 |
-
if __name__ == "__main__":
|
572 |
-
uvicorn.run("app:app", host="0.0.0.0", port=int(os.getenv("PORT", 7860)))
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|