Hugging Face's logo

Spaces:
ginipick
/
AI-BOOK
Running on CPU Upgrade

App Files Community
1
ginipick commited on
Commit
fd3060e
Β·
verified Β·
1 Parent(s): aa28e16

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +66 -19
app.py CHANGED
@@ -1,4 +1,7 @@
1
  # app.py
 
 
 
2
  from fastapi import FastAPI
3
  from fastapi.responses import HTMLResponse
4
  from fastapi.staticfiles import StaticFiles
@@ -8,70 +11,114 @@ BASE = pathlib.Path(__file__).parent
8
 
9
  app = FastAPI()
10
 
11
- # ── 정적 파일 (JS / CSS / 이미지 / MP3) μ„œλΉ™ ──
 
 
12
  app.mount("/static", StaticFiles(directory=BASE), name="static")
13
 
14
- # ── index.html 원문 ──
 
 
15
  INDEX_HTML = """
16
  <!DOCTYPE html>
17
  <html lang="ko">
18
  <head>
19
  <meta charset="UTF-8">
20
  <title>FlipBook – μ—…λ‘œλ“œ + μ‚¬μš΄λ“œ</title>
 
21
  <link rel="stylesheet" href="/static/flipbook.css">
 
 
22
  <script src="/static/three.js"></script>
23
  <script src="/static/iscroll.js"></script>
24
  <script src="/static/mark.js"></script>
25
  <script src="/static/mod3d.js"></script>
 
26
  <script src="/static/flipbook.js"></script>
27
  <script src="/static/flipbook.book3.js"></script>
28
  <script src="/static/flipbook.scroll.js"></script>
29
  <script src="/static/flipbook.swipe.js"></script>
30
  <script src="/static/flipbook.webgl.js"></script>
 
31
  <style>
32
  body{margin:0;font-family:sans-serif;background:#f4f4f4}
33
- #viewer{width:900px;height:600px;margin:40px auto;background:#fff;border:1px solid #ccc}
 
34
  .upload-wrapper{display:flex;justify-content:center}
35
- #uploadBtn{all:unset;width:44px;height:44px;line-height:44px;text-align:center;
36
- font-size:26px;border-radius:50%;cursor:pointer;background:#ffb84d;color:#fff}
 
 
 
37
  #fileInput{display:none}
38
  </style>
39
  </head>
40
  <body>
41
- <h2 style="text-align:center">Real3D FlipBook – μ—…λ‘œλ“œ βœ¨πŸ“–</h2>
 
 
42
  <div id="viewer"></div>
 
43
  <div class="upload-wrapper">
44
  <button id="uploadBtn" title="이미지 μ—…λ‘œλ“œ">πŸ“·</button>
45
  <input id="fileInput" type="file" accept="image/*" multiple>
46
  </div>
 
47
  <script>
48
- let book=null, holder=document.getElementById('viewer');
 
 
49
  document.getElementById('uploadBtn').onclick=()=>document.getElementById('fileInput').click();
 
50
  document.getElementById('fileInput').onchange=e=>{
51
  if(!e.target.files.length) return;
52
- const files=[...e.target.files], pages=[], tot=files.length; let cnt=0;
53
- files.forEach((f,i)=>{const r=new FileReader();r.onload=x=>{
54
- pages[i]={src:x.target.result,thumb:x.target.result};
55
- if(++cnt===tot) makeBook(pages);
56
- };r.readAsDataURL(f);});
 
 
 
 
 
57
  };
58
- function makeBook(p){
59
- if(book){book.destroy();holder.innerHTML='';}
60
- book=new FlipBook(holder,{
61
- pages:p,viewMode:'webgl',autoSize:true,flipDuration:800,backgroundColor:'#fff',
62
- sound:true,assets:{flipMp3:'/static/turnPage2.mp3',hardFlipMp3:'/static/turnPage2.mp3'},
 
 
 
 
 
 
 
 
 
 
 
 
 
63
  controlsProps:{enableFullscreen:true,thumbnails:true}
64
  });
65
  }
66
  </script>
67
- </body></html>
 
68
  """
69
 
 
 
 
70
  @app.get("/", response_class=HTMLResponse)
71
  async def root():
72
  return INDEX_HTML
73
 
74
- # ── Hugging Faceκ°€ β€˜python app.py’ 둜 μ‹€ν–‰ν•  λ•Œ 직접 uvicorn을 띄움 ──
 
 
75
  if __name__ == "__main__":
76
  port = int(os.environ.get("PORT", 7860))
77
  uvicorn.run("app:app", host="0.0.0.0", port=port, reload=False)
 
1
  # app.py
2
+ # FastAPI μ„œλ²„ + Real3D FlipBook 정적 μ‚¬μ΄νŠΈ
3
+ # λͺ¨λ“  정적 파일(JS / CSS / MP3 / 이미지 λ“±)κ³Ό 이 νŒŒμΌμ„ 같은 폴더에 λ‘‘λ‹ˆλ‹€.
4
+
5
  from fastapi import FastAPI
6
  from fastapi.responses import HTMLResponse
7
  from fastapi.staticfiles import StaticFiles
 
11
 
12
  app = FastAPI()
13
 
14
+ # ─────────────────────────────────────────────────────────────
15
+ # 1) /static β†’ ν˜„μž¬ 폴더(라이브러리·MP3·이미지) μ„œλΉ™
16
+ # ─────────────────────────────────────────────────────────────
17
  app.mount("/static", StaticFiles(directory=BASE), name="static")
18
 
19
+ # ─────────────────────────────────────────────────────────────
20
+ # 2) index.html 원문 (μ˜€λ””μ˜€ 경둜 /static/turnPage2.mp3 둜 μˆ˜μ •)
21
+ # ─────────────────────────────────────────────────────────────
22
  INDEX_HTML = """
23
  <!DOCTYPE html>
24
  <html lang="ko">
25
  <head>
26
  <meta charset="UTF-8">
27
  <title>FlipBook – μ—…λ‘œλ“œ + μ‚¬μš΄λ“œ</title>
28
+
29
  <link rel="stylesheet" href="/static/flipbook.css">
30
+
31
+ <!-- ν•„μˆ˜ JS μˆœμ„œ -->
32
  <script src="/static/three.js"></script>
33
  <script src="/static/iscroll.js"></script>
34
  <script src="/static/mark.js"></script>
35
  <script src="/static/mod3d.js"></script>
36
+
37
  <script src="/static/flipbook.js"></script>
38
  <script src="/static/flipbook.book3.js"></script>
39
  <script src="/static/flipbook.scroll.js"></script>
40
  <script src="/static/flipbook.swipe.js"></script>
41
  <script src="/static/flipbook.webgl.js"></script>
42
+
43
  <style>
44
  body{margin:0;font-family:sans-serif;background:#f4f4f4}
45
+ h2{text-align:center;margin:24px 0}
46
+ #viewer{width:900px;height:600px;margin:0 auto 40px;background:#fff;border:1px solid #ccc}
47
  .upload-wrapper{display:flex;justify-content:center}
48
+ #uploadBtn{
49
+ all:unset;width:44px;height:44px;line-height:44px;text-align:center;
50
+ font-size:26px;border-radius:50%;cursor:pointer;
51
+ background:#ffb84d;color:#fff;box-shadow:0 2px 4px rgba(0,0,0,.2);
52
+ }
53
  #fileInput{display:none}
54
  </style>
55
  </head>
56
  <body>
57
+
58
+ <h2>Real3D FlipBook – 이미지 μ—…λ‘œλ“œ πŸ“·βœ¨</h2>
59
+
60
  <div id="viewer"></div>
61
+
62
  <div class="upload-wrapper">
63
  <button id="uploadBtn" title="이미지 μ—…λ‘œλ“œ">πŸ“·</button>
64
  <input id="fileInput" type="file" accept="image/*" multiple>
65
  </div>
66
+
67
  <script>
68
+ let book=null;
69
+ const viewer=document.getElementById('viewer');
70
+
71
  document.getElementById('uploadBtn').onclick=()=>document.getElementById('fileInput').click();
72
+
73
  document.getElementById('fileInput').onchange=e=>{
74
  if(!e.target.files.length) return;
75
+ const files=[...e.target.files];
76
+ const pages=[], tot=files.length; let read=0;
77
+ files.forEach((f,i)=>{
78
+ const r=new FileReader();
79
+ r.onload=ev=>{
80
+ pages[i]={src:ev.target.result,thumb:ev.target.result};
81
+ if(++read===tot) createBook(pages);
82
+ };
83
+ r.readAsDataURL(f);
84
+ });
85
  };
86
+
87
+ function createBook(pages){
88
+ if(book){ book.destroy(); viewer.innerHTML=''; }
89
+
90
+ book=new FlipBook(viewer,{
91
+ pages,
92
+ viewMode:'webgl',
93
+ autoSize:true,
94
+ flipDuration:800,
95
+ backgroundColor:'#ffffff',
96
+
97
+ /* πŸ”Š μ‚¬μš΄λ“œ – 정적 경둜 지정 */
98
+ sound:true,
99
+ assets:{
100
+ flipMp3 : '/static/turnPage2.mp3',
101
+ hardFlipMp3 : '/static/turnPage2.mp3'
102
+ },
103
+
104
  controlsProps:{enableFullscreen:true,thumbnails:true}
105
  });
106
  }
107
  </script>
108
+ </body>
109
+ </html>
110
  """
111
 
112
+ # ─────────────────────────────────────────────────────────────
113
+ # 3) 루트 경둜 β†’ index.html λ°˜ν™˜
114
+ # ─────────────────────────────────────────────────────────────
115
  @app.get("/", response_class=HTMLResponse)
116
  async def root():
117
  return INDEX_HTML
118
 
119
+ # ─────────────────────────────────────────────────────────────
120
+ # 4) Hugging Face Spacesκ°€ python app.py 둜 μ‹€ν–‰ μ‹œ μ„œλ²„ 기동
121
+ # ─────────────────────────────────────────────────────────────
122
  if __name__ == "__main__":
123
  port = int(os.environ.get("PORT", 7860))
124
  uvicorn.run("app:app", host="0.0.0.0", port=port, reload=False)