Spaces:
Running
on
CPU Upgrade
Running
on
CPU Upgrade
# app.py | |
from fastapi import FastAPI | |
from fastapi.responses import HTMLResponse | |
from fastapi.staticfiles import StaticFiles | |
import pathlib, os, uvicorn | |
BASE = pathlib.Path(__file__).parent | |
app = FastAPI() | |
# ββ μ μ νμΌ (JS / CSS / μ΄λ―Έμ§ / MP3) μλΉ ββ | |
app.mount("/static", StaticFiles(directory=BASE), name="static") | |
# ββ index.html μλ¬Έ ββ | |
INDEX_HTML = """ | |
<!DOCTYPE html> | |
<html lang="ko"> | |
<head> | |
<meta charset="UTF-8"> | |
<title>FlipBook β μ λ‘λ + μ¬μ΄λ</title> | |
<link rel="stylesheet" href="/static/flipbook.css"> | |
<script src="/static/three.js"></script> | |
<script src="/static/iscroll.js"></script> | |
<script src="/static/mark.js"></script> | |
<script src="/static/mod3d.js"></script> | |
<script src="/static/flipbook.js"></script> | |
<script src="/static/flipbook.book3.js"></script> | |
<script src="/static/flipbook.scroll.js"></script> | |
<script src="/static/flipbook.swipe.js"></script> | |
<script src="/static/flipbook.webgl.js"></script> | |
<style> | |
body{margin:0;font-family:sans-serif;background:#f4f4f4} | |
#viewer{width:900px;height:600px;margin:40px auto;background:#fff;border:1px solid #ccc} | |
.upload-wrapper{display:flex;justify-content:center} | |
#uploadBtn{all:unset;width:44px;height:44px;line-height:44px;text-align:center; | |
font-size:26px;border-radius:50%;cursor:pointer;background:#ffb84d;color:#fff} | |
#fileInput{display:none} | |
</style> | |
</head> | |
<body> | |
<h2 style="text-align:center">Real3D FlipBook β μ λ‘λ β¨π</h2> | |
<div id="viewer"></div> | |
<div class="upload-wrapper"> | |
<button id="uploadBtn" title="μ΄λ―Έμ§ μ λ‘λ">π·</button> | |
<input id="fileInput" type="file" accept="image/*" multiple> | |
</div> | |
<script> | |
let book=null, holder=document.getElementById('viewer'); | |
document.getElementById('uploadBtn').onclick=()=>document.getElementById('fileInput').click(); | |
document.getElementById('fileInput').onchange=e=>{ | |
if(!e.target.files.length) return; | |
const files=[...e.target.files], pages=[], tot=files.length; let cnt=0; | |
files.forEach((f,i)=>{const r=new FileReader();r.onload=x=>{ | |
pages[i]={src:x.target.result,thumb:x.target.result}; | |
if(++cnt===tot) makeBook(pages); | |
};r.readAsDataURL(f);}); | |
}; | |
function makeBook(p){ | |
if(book){book.destroy();holder.innerHTML='';} | |
book=new FlipBook(holder,{ | |
pages:p,viewMode:'webgl',autoSize:true,flipDuration:800,backgroundColor:'#fff', | |
sound:true,assets:{flipMp3:'/static/turnPage2.mp3',hardFlipMp3:'/static/turnPage2.mp3'}, | |
controlsProps:{enableFullscreen:true,thumbnails:true} | |
}); | |
} | |
</script> | |
</body></html> | |
""" | |
async def root(): | |
return INDEX_HTML | |
# ββ Hugging Faceκ° βpython app.pyβ λ‘ μ€νν λ μ§μ uvicornμ λμ ββ | |
if __name__ == "__main__": | |
port = int(os.environ.get("PORT", 7860)) | |
uvicorn.run("app:app", host="0.0.0.0", port=port, reload=False) | |