192 lines
9.6 KiB
Plaintext
Executable File
192 lines
9.6 KiB
Plaintext
Executable File
extends includes/layout
|
|
|
|
include includes/video-list-item
|
|
include includes/comment
|
|
include includes/subscribe-button
|
|
include includes/toasts
|
|
include includes/video-player-controls
|
|
|
|
block head
|
|
unless error
|
|
title= `${video.title} - EirTube`
|
|
else
|
|
title Error - EirTube
|
|
+toast_js()
|
|
script(type="module" src=getStaticURL("html", "/static/js/player-new.js"))
|
|
script(type="module" src=getStaticURL("html", "/static/js/chapter-highlight.js"))
|
|
//- script const data = !{JSON.stringify({...video, continuous})};
|
|
script const data = !{JSON.stringify({sbData: video.sbData, videoId: video.videoId, lengthSeconds: video.lengthSeconds, comments: video.comments, continuous})};
|
|
| const videoPath = !{`"${videoPath}${mediaFragment}"`}; const startingFormat = !{JSON.stringify(startingFormat)};
|
|
| const targetFormat = !{JSON.stringify(targetFormat)}; let awaitingNewFormat = !{awaitingNewFormat}; const dlStatus = !{dlStatus}; awaitingThumb = !{awaitingThumb};
|
|
//- Sponsorblock settings
|
|
- let sbSettings = {}
|
|
- for (const k of Object.keys(settings))
|
|
- if (k.startsWith("sponsorblock"))
|
|
- sbSettings[k] = settings[k]
|
|
script const sbSettings = !{JSON.stringify(sbSettings)}
|
|
- if (video.sbData && video.sbData.length > 0)
|
|
script(type="module" src=getStaticURL("html", "/static/js/sb.js"))
|
|
- if (settings.dearrow > 0 && settings.dearrow_preload == 0)
|
|
script const dearrow_thumbnail_instance = "!{settings.dearrow_thumbnail_instance}"
|
|
script(video-class="related-video" src=getStaticURL("html", "/static/js/dearrow-load.js"))
|
|
|
|
mixin noscript-quality-select(format, disabled, preloading)
|
|
a(disabled=disabled href=`/watch?v=${video.videoId}&quality=${format.qualityLabel}`).border-look.quality-select-noscript= `${format.cloudtube__label}${preloading ? " (preloading)" : ""}`
|
|
|
|
mixin recommended-videos()
|
|
.related-cols
|
|
h2.related-header Related videos
|
|
if video.recommendedVideos.length
|
|
.continuous-start
|
|
a(href=`/watch?v=${video.videoId}&continuous=1` nofollow) Continuous mode
|
|
each r in video.recommendedVideos
|
|
+video_list_item("related-video", r, { settings: settings })
|
|
|
|
block content
|
|
unless error
|
|
if continuous
|
|
- const first = video.recommendedVideos[0]
|
|
if first
|
|
script(type="module" src=getStaticURL("html", "/static/js/continuous.js"))
|
|
noscript
|
|
meta(http-equiv="refresh" content=`${video.lengthSeconds+5};url=/watch?v=${first.videoId}&continuous=1&session-watched=${sessionWatchedNext}`)
|
|
.video-page(class={
|
|
"video-page--recommended-side": settings.recommended_mode === 0,
|
|
"video-page--recommended-below": settings.recommended_mode === 1,
|
|
"video-page--recommended-hidden": settings.recommended_mode === 2
|
|
})
|
|
main.main-video-section
|
|
.video-container
|
|
if targetFormat
|
|
.video-container-inner
|
|
video(controls playsinline preload="auto" width=targetFormat.second__width height=targetFormat.second__height data-itag=targetFormat.itag autoplay=continuous||autoplay).video
|
|
source(type=targetFormat.type src=(dlStatus < 2 ? startingFormat.url : `${videoPath}${mediaFragment}`))
|
|
//- source(type=targetFormat.type)
|
|
each t in video.captions
|
|
track(label=t.label kind="subtitles" srclang=t.languageCode src=t.url)
|
|
//- fallback: flash player
|
|
- let flashvars = new URLSearchParams({skin: "/static/flash/skin.swf", video: `${videoPath}${mediaFragment}`})
|
|
embed(type="application/x-shockwave-flash" src="/static/flash/player.swf" id="f4Player" width=1280 height=720 flashvars=flashvars.toString() allowscriptaccess="always" allowfullscreen="true" bgcolor="#000000")
|
|
|
|
//- I hate noscript. its so ugly. but this works somehow
|
|
noscript
|
|
link(rel="stylesheet" type="text/css" href="/static/css/noscript-video-controls-hider.css")
|
|
+video-player-controls(video, formats, startingFormat, awaitingThumb)
|
|
//- SponsorBlock popup
|
|
#sb-skip-prompt.hidden
|
|
.row
|
|
img(src=`/static/images/sponsorblock-logo.png`).sponsorblock-logo-video
|
|
#reason Skipped sponsor
|
|
.row
|
|
#timer 9 seconds
|
|
#btn= `Unskip (${settings.sponsorblock_keybind} or click)`
|
|
else
|
|
video(src="").video
|
|
.stream-notice The server provided no playback streams.
|
|
|
|
.info
|
|
header.info-main
|
|
.video-title-area
|
|
if settings.dearrow > 0 && video.dearrowData && video.dearrowData.title
|
|
input(type="checkbox" checked=(settings.dearrow != 1) class={ "dearrow-button-video": true })
|
|
hi.title.alt= video.dearrowData.title
|
|
h1.title= video.title
|
|
.author
|
|
a(href=`/channel/${video.authorId}`).author-link= `Uploaded by ${video.author}`
|
|
.info-secondary
|
|
- const date = new Date(video.published*1000)
|
|
- const month = new Intl.DateTimeFormat("en-US", {month: "short"}).format(date.getTime())
|
|
div= `Uploaded ${date.getUTCDate()} ${month} ${date.getUTCFullYear()}`
|
|
div= video.second__viewCountText
|
|
div= video.second__likeCountText
|
|
|
|
if continuous
|
|
div#continuous-controls.continuous
|
|
.continuous__description
|
|
.continuous__title Continuous mode: next video autoplays
|
|
noscript
|
|
.continuous__script-warning Without JavaScript, it will trigger on a timer, not on video completion.
|
|
.continuous__buttons
|
|
a(href=`/watch?v=${video.videoId}`)#continuous-stop.border-look Turn off
|
|
|
|
.button-container
|
|
.button-container-left
|
|
+subscribe_button(video.authorId, subscribed, `/watch?v=${video.videoId}`).border-look
|
|
a(href=req.url).border-look Share
|
|
a(href=`https://www.youtube.com/watch?v=${video.videoId}`).border-look YouTube
|
|
//- a(href=`https://redirect.invidious.io/watch?v=${video.videoId}`).border-look Invidious
|
|
|
|
.button-container-right
|
|
.button-container-right-top
|
|
#quality-select-noscript-parent
|
|
each f in formats
|
|
+noscript-quality-select(f, f.itag == startingFormat.itag, awaitingNewFormat && targetFormat.itag == f.itag)
|
|
.button-container-right-bottom
|
|
form(method="get" action="/redownloadVideo")
|
|
input(type="hidden" name="videoID" value=video.videoId)
|
|
input(type="hidden" id="data-quality" name="quality" value=quality)
|
|
button.border-look.redownloadBtn Redownload
|
|
a(href=`${videoPath}&dl=1` id="download-btn").border-look= `Download ${startingFormat.cloudtube__label.replace(" *", "")} (${startingFormat.eirtube__size})`
|
|
a(href=`/getOgg?videoID=${video.videoId}-${startingFormat.qualityLabel}` id="download-ogg-btn").border-look= `Download audio`
|
|
|
|
noscript
|
|
if awaitingNewFormat
|
|
.stream-notice
|
|
p
|
|
| Since you are not using JavaScript, your browser will cache the video.
|
|
br
|
|
| Press CTRL+F5 if the video errors or skips to the end suddenly.
|
|
|
|
.description#description!= video.descriptionHtml
|
|
|
|
#below-video-container
|
|
if !continuous && settings.recommended_mode == 1
|
|
input(type="radio" name="below" checked=true)#radio-comments
|
|
input(type="radio" name="below")#radio-recommended
|
|
.below-video-radio-container
|
|
label(for="radio-comments").below-video-radio-label Comments
|
|
label(for="radio-recommended").below-video-radio-label Recommended
|
|
//- aside#standard-related-videos.related-videos
|
|
aside#recommended-videos
|
|
+recommended-videos()
|
|
aside#comments
|
|
- const commentCount = (video.comments && video.comments.commentCount) ? video.comments.commentCount : 0
|
|
h1= `${commentCount.toLocaleString("en-US")} comment${commentCount != 1 ? "s" : ""}`
|
|
//- TODO: comment sorting buttons
|
|
if video.comments && video.comments.comments
|
|
each comment in video.comments.comments
|
|
+comment("video-comment", comment, `https://www.youtube.com/watch?v=${video.videoId}&lc={}`, video.videoId)
|
|
//- TODO: comment continuation button
|
|
|
|
//- Standard view
|
|
if !continuous && settings.recommended_mode == 0
|
|
aside#standard-related-videos.related-videos
|
|
+recommended-videos()
|
|
|
|
//- Continuous view
|
|
if continuous
|
|
aside.related-videos#continuous-related-videos
|
|
- let column = video.recommendedVideos.filter(v => !sessionWatched.includes(v.videoId))
|
|
if column.length
|
|
.related-cols
|
|
h2.related-header Autoplay next
|
|
#continuous-first
|
|
+video_list_item("related-video", column.shift(), { continuous: true, settings: settings })
|
|
if column.length
|
|
.related-cols
|
|
h2.related-header Related videos
|
|
each r in column
|
|
+video_list_item("related-video", r, { continuous: true, settings: settings }) //- keep on continuous mode for all recommendations
|
|
#toast-container
|
|
each toast in toasts
|
|
+toast(toast.color, toast.icon, toast.text, toast.noFade)
|
|
noscript
|
|
+toast(undefined, "loading", `Loading ${startingFormat.qualityLabel}...`)
|
|
|
|
else
|
|
//- error
|
|
main.video-error-page
|
|
h2 Error
|
|
!= message
|
|
p: a(href=`https://www.youtube.com/watch?v=${video.videoId}`) Watch on YouTube →
|