c5faa8808c
- 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>
56 lines
2.0 KiB
JavaScript
56 lines
2.0 KiB
JavaScript
(function () {
|
|
var overlay = document.getElementById('playerOverlay')
|
|
if (!overlay) return
|
|
var closeBtn = document.getElementById('playerClose')
|
|
var video = document.getElementById('playerVideo')
|
|
var titleEl = document.getElementById('playerTitle')
|
|
|
|
function openPlayer(videoId, title, shareUrl) {
|
|
// 사이트 내 재생도 share URL 을 주소창에 보이도록 pushState.
|
|
// share URL 이 없으면 단순한 /file/video/:id 로 폴백.
|
|
var url = shareUrl || ('/file/video/' + encodeURIComponent(videoId))
|
|
history.pushState({ player: true, videoId: videoId }, '', url)
|
|
titleEl.textContent = title || ''
|
|
video.src = '/api/video/' + encodeURIComponent(videoId) + '/file'
|
|
overlay.hidden = false
|
|
video.play().catch(function () { /* 자동재생 막힘 무시 */ })
|
|
}
|
|
|
|
function closePlayer() {
|
|
overlay.hidden = true
|
|
video.pause()
|
|
video.removeAttribute('src')
|
|
video.load()
|
|
if (history.state && history.state.player) {
|
|
history.back()
|
|
}
|
|
}
|
|
|
|
document.querySelectorAll('.videoCard').forEach(function (card) {
|
|
// <a> 태그면 클릭 시 share URL 로 풀 페이지 이동하도록 두고, 모달은 띄우지 않는다.
|
|
if (card.tagName && card.tagName.toLowerCase() === 'a') return
|
|
card.addEventListener('click', function () {
|
|
var id = card.getAttribute('data-video-id')
|
|
var titleNode = card.querySelector('.videoTitle')
|
|
var shareUrl = card.getAttribute('data-share-url')
|
|
openPlayer(id, titleNode ? titleNode.textContent : '', shareUrl)
|
|
})
|
|
})
|
|
|
|
if (closeBtn) closeBtn.addEventListener('click', closePlayer)
|
|
if (overlay) overlay.addEventListener('click', function (e) {
|
|
if (e.target === overlay) closePlayer()
|
|
})
|
|
window.addEventListener('popstate', function () {
|
|
if (!overlay.hidden) {
|
|
overlay.hidden = true
|
|
video.pause()
|
|
video.removeAttribute('src')
|
|
video.load()
|
|
}
|
|
})
|
|
document.addEventListener('keydown', function (e) {
|
|
if (e.key === 'Escape' && !overlay.hidden) closePlayer()
|
|
})
|
|
})()
|