tkrmagid/make_video_site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: implement video site per README spec

Browse Source 
- Express + EJS + express-session stack (auth/navbar ported from minecraft_launcher)
- Public: main folder list, folder video grid, internal popup player (/player/:videoId)
- Admin (/op): login, folder CRUD with right-click context menu + add-folder modal
- Admin folder: video grid with right-click edit/rename/delete, "영상 추가" -> editor
- Video editor: drag-drop upload, file picker, YouTube URL probe (ETA + 5분 경고),
  background yt-dlp download with progress polling, navbar title edit, trim controls,
  save runs ffmpeg trim (original preserved)
- Filesystem storage under data/folders/<name>/<videoId>/{meta.json, original.<ext>, edited.<ext>}

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
claude-bot
2026-05-15 16:42:00 +09:00
parent 8d13d155de
commit 0db04cf5cd
30 changed files with 3300 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
views/op/editor.ejs Normal file
View File

@@ -0,0 +1,64 @@
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>영상 편집 · <%= folder %></title>
<link rel="stylesheet" href="/static/styles.css" />
</head>
<body class="siteBody">
<header class="editorNav">
<div class="editorNavLeft">
<a class="muted" href="/op/folder/<%= encodeURIComponent(folder) %>">← <%= folder %></a>
<input type="text" id="titleInput" class="titleInput" placeholder="영상 제목" value="<%= video ? video.title : '' %>" />
</div>
<div class="editorNavRight">
<button type="button" class="primaryButton" id="saveBtn">저장</button>
</div>
</header>
<main class="editorMain">
<section class="editorStage">
<div id="dropZone" class="dropZone" <% if (video) { %>hidden<% } %>>
<p class="dropTitle">영상 추가</p>
<p class="muted">파일을 드래그&드롭하거나, 아래에서 직접 선택하거나, YouTube 주소를 붙여넣으세요.</p>
<input type="file" id="fileInput" accept="video/*" />
<div class="ytRow">
<input type="text" id="ytUrl" placeholder="https://www.youtube.com/watch?v=..." />
<button type="button" class="secondaryButton" id="ytProbeBtn">확인</button>
<button type="button" class="primaryButton" id="ytStartBtn" disabled>가져오기</button>
</div>
<p id="probeInfo" class="muted"></p>
<progress id="downloadProgress" value="0" max="100" hidden></progress>
<p id="uploadStatus" class="muted"></p>
</div>
<div id="videoPanel" class="videoPanel" <% if (!video) { %>hidden<% } %>>
<video id="editVideo" controls preload="metadata"
<% if (video) { %>src="/api/video/<%= video.id %>/file"<% } %>></video>
<div class="trimControls">
<label>
<span>시작(초)</span>
<input type="number" id="startSec" step="0.1" min="0" value="<%= video && video.trim ? video.trim.startSec : 0 %>" />
<button type="button" class="secondaryButton" data-set-current="start">현재 시점</button>
</label>
<label>
<span>종료(초, 비우면 끝까지)</span>
<input type="number" id="endSec" step="0.1" min="0" value="<%= video && video.trim && video.trim.endSec != null ? video.trim.endSec : '' %>" />
<button type="button" class="secondaryButton" data-set-current="end">현재 시점</button>
</label>
<p class="muted">저장하면 ffmpeg 가 원본을 보존한 채 편집본을 만듭니다.</p>
</div>
</div>
</section>
</main>
<script>
window.__EDITOR__ = {
folder: <%- JSON.stringify(folder) %>,
video: <%- JSON.stringify(video) %>
}
</script>
<script src="/static/editor.js"></script>
</body>
</html>