Daniel Legt
f9755fa98f
All checks were successful
Build and Publish Docker Image / deploy (push) Successful in 1m52s
- Register a new route `GET /d/{boxID}/scene/{fileID}` to serve video scene previews.
- Implement the `VideoScenesPreview` handler to serve existing previews or generate them on-demand.
- Add helper functions to analyze video frames (e.g., luma calculation to filter out dark frames) and render the final scene thumbnail.
- Update the `fileView` struct to include scene URL and status fields.
80 lines
4.9 KiB
HTML
80 lines
4.9 KiB
HTML
{{define "preview.html"}}{{template "base" .}}{{end}}
|
|
|
|
{{define "content"}}
|
|
<section class="download-view preview-view" aria-labelledby="preview-title">
|
|
<div class="card download-card preview-card">
|
|
<div class="card-content">
|
|
{{if .Data.Locked}}
|
|
<div class="file-emblem" aria-hidden="true">
|
|
<svg viewBox="0 0 24 24" role="img" focusable="false"><path d="M12 17a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z" /><path d="M19 11V8A7 7 0 0 0 5 8v3" /><path d="M5 11h14v10H5z" /></svg>
|
|
</div>
|
|
<h1 id="preview-title">Protected file</h1>
|
|
<p class="download-subtitle">Unlock the box before viewing this file.</p>
|
|
<a class="button button-primary button-wide" href="/d/{{.Data.Box.ID}}">Unlock box</a>
|
|
{{else}}
|
|
<header class="preview-header">
|
|
<div class="preview-title-group">
|
|
<h1 id="preview-title" class="file-name" title="{{.Data.File.Name}}">{{.Data.File.Name}}</h1>
|
|
<p class="download-subtitle">{{.Data.File.Size}} · {{.Data.File.ContentType}}</p>
|
|
</div>
|
|
<a class="button button-primary" href="{{.Data.DownloadURL}}">
|
|
<svg viewBox="0 0 24 24" role="img" focusable="false" aria-hidden="true"><path d="M12 3v12m0 0 4-4m-4 4-4-4M5 21h14" /></svg>
|
|
Download
|
|
</a>
|
|
</header>
|
|
|
|
<div class="preview-window" data-preview-kind="{{.Data.File.PreviewKind}}" data-file-name="{{.Data.File.Name}}" data-content-type="{{.Data.File.ContentType}}" data-size-bytes="{{.Data.File.SizeBytes}}" data-source-url="{{.Data.DownloadURL}}?inline=1" data-download-url="{{.Data.DownloadURL}}" data-icon-url="{{.Data.File.IconURL}}" data-file-size="{{.Data.File.Size}}" data-scene-url="{{.Data.File.SceneURL}}">
|
|
<div class="preview-window-titlebar">
|
|
<div>
|
|
<strong data-preview-mode-label>Preview</strong>
|
|
<span>{{.Data.File.ContentType}}</span>
|
|
</div>
|
|
<div class="preview-window-tools">
|
|
<button class="preview-fullscreen-button" type="button" data-render-fullscreen hidden>Full Screen</button>
|
|
<div class="preview-window-actions" aria-hidden="true"><span></span><span></span><span></span></div>
|
|
</div>
|
|
</div>
|
|
<div class="preview-tabs" data-preview-tabs></div>
|
|
<div class="preview-stage">
|
|
<div class="default-preview" data-default-preview hidden>
|
|
<img src="{{.Data.File.IconURL}}" alt="" loading="lazy">
|
|
<div>
|
|
<strong title="{{.Data.File.Name}}">{{.Data.File.Name}}</strong>
|
|
<span>{{.Data.File.Size}} · {{.Data.File.ContentType}}</span>
|
|
</div>
|
|
<a class="button button-primary" href="{{.Data.DownloadURL}}">
|
|
<svg viewBox="0 0 24 24" role="img" focusable="false" aria-hidden="true"><path d="M12 3v12m0 0 4-4m-4 4-4-4M5 21h14" /></svg>
|
|
Download
|
|
</a>
|
|
</div>
|
|
<img class="native-preview native-image-preview" data-image-preview src="{{.Data.DownloadURL}}?inline=1" alt="{{.Data.File.Name}}" hidden>
|
|
<video class="native-preview native-video-preview" data-video-preview src="{{.Data.DownloadURL}}?inline=1" poster="{{.Data.File.ThumbnailURL}}" controls preload="metadata" hidden></video>
|
|
{{if .Data.File.HasScene}}<img class="native-preview video-scenes-preview" data-video-scenes-preview data-scene-src="{{.Data.File.SceneURL}}" alt="Scenes preview for {{.Data.File.Name}}" hidden>{{end}}
|
|
<audio class="native-preview native-audio-preview" data-browser-audio-preview src="{{.Data.DownloadURL}}?inline=1" controls preload="metadata" hidden></audio>
|
|
<div class="code-preview raw-code-preview" data-raw-preview hidden>
|
|
<pre><code data-raw-output></code></pre>
|
|
</div>
|
|
<div class="code-preview prism-code-preview" data-code-preview hidden>
|
|
<pre class="line-numbers"><code data-code-output></code></pre>
|
|
</div>
|
|
<iframe class="render-preview" data-render-preview title="Rendered preview of {{.Data.File.Name}}" sandbox hidden></iframe>
|
|
<div class="large-preview-gate" data-large-preview-gate hidden>
|
|
<strong>Large preview</strong>
|
|
<p>This file is larger than 500 KB. Loading this preview may be slow on some devices.</p>
|
|
<div>
|
|
<button class="button button-primary" type="button" data-large-preview-confirm>Load anyway</button>
|
|
<button class="button button-outline" type="button" data-large-preview-cancel>Cancel</button>
|
|
</div>
|
|
</div>
|
|
<div class="preview-placeholder" data-preview-placeholder hidden>
|
|
<img src="{{.Data.File.IconURL}}" alt="">
|
|
<p>Preparing preview...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{{end}}
|