feat(folders): nested folder tree (max depth 2) + id-based mutations

- new storeDb.ts: DB+FS layer (folders w/ parent_id, videos w/ global id)
- depth cap: sub-folder cannot have children (enforced in createFolder)
- video id: editable anytime (changeVideoId), uniqueness via PK
- routes:
  - public /folder/:topName[/:subName], /video/:topName[/:subName]/:videoId
  - admin /op/folder/:topName[/:subName], id-based /op/folders/:id/*
    and /op/videos/:id/* (rename/changeId/delete/save + idAvailable check)
- views: breadcrumb + subFolder grid; 플레이리스트 추가 button shows at 2단계
- client JS: id-based mutation endpoints, share URL data attribute,
  in-site player pushes share URL to address bar
- store.ts slimmed to Account + readAccounts (FS layer moved to storeDb)
- pickIntId accepts numeric JSON bodies

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Claude
2026-05-31 23:36:02 +09:00
parent 3560dcb802
commit c5faa8808c
17 changed files with 1207 additions and 577 deletions

View File

@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title><%= folder %> · 비디오 사이트</title>
<title><%= folder.name %> · 비디오 사이트</title>
<link rel="stylesheet" href="/static/styles.css" />
</head>
<body class="siteBody">
@@ -15,41 +15,51 @@
<a class="secondaryButton" href="/op">관리자</a>
</header>
<%
// 현재 폴더까지의 경로 prefix (영상/하위폴더 URL 조립용)
var folderPathEnc = breadcrumb.map(function (s) { return encodeURIComponent(s) }).join('/')
var parentHref = isSubFolder ? '/folder/' + encodeURIComponent(breadcrumb[0]) : '/'
var parentLabel = isSubFolder ? '← ' + breadcrumb[0] : '← 폴더 목록'
%>
<main class="pageWrap">
<section class="hero">
<a class="muted" href="/">← 폴더 목록</a>
<h1>📁 <%= folder %></h1>
<a class="muted" href="<%= parentHref %>"><%= parentLabel %></a>
<h1>📁 <%= breadcrumb.join(' / ') %></h1>
</section>
<% if (subFolders && subFolders.length > 0) { %>
<section class="folderGrid">
<% subFolders.forEach(function (sf) { %>
<a class="folderCard" href="/folder/<%= folderPathEnc %>/<%= encodeURIComponent(sf.name) %>">
<span class="folderIcon">📁</span>
<span class="folderName"><%= sf.name %></span>
</a>
<% }) %>
</section>
<% } %>
<section class="videoGrid">
<% if (videos.length === 0) { %>
<% if (videos.length === 0 && (!subFolders || subFolders.length === 0)) { %>
<p class="muted">이 폴더에 영상이 없습니다.</p>
<% } %>
<% videos.forEach(function (v) { %>
<button type="button" class="videoCard" data-video-id="<%= v.id %>">
<%
var shareUrl = '/video/' + folderPathEnc + '/' + encodeURIComponent(v.id)
%>
<a class="videoCard" href="<%= shareUrl %>"
data-video-id="<%= v.id %>" data-share-url="<%= shareUrl %>">
<div class="videoThumb">▶</div>
<div class="videoTitle"><%= v.title %></div>
</button>
</a>
<% }) %>
</section>
</main>
<div class="playerOverlay" id="playerOverlay" hidden>
<div class="playerModal" role="dialog" aria-modal="true">
<button type="button" class="playerClose" id="playerClose" aria-label="닫기">✕</button>
<div class="playerTitle" id="playerTitle"></div>
<video id="playerVideo" controls preload="metadata"></video>
</div>
</div>
<div class="ctxMenu" id="ctxMenu" hidden>
<button type="button" data-action="copyUrl">영상 주소 복사</button>
</div>
<script>
window.__SITE__ = { folder: <%- jsonForScript(folder) %> }
</script>
<script src="/static/player.js"></script>
<script src="/static/public-folder.js"></script>
</body>
</html>