1movmedia/yt-dlp-proxy
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance video metadata extraction and update player template to display additional information

Browse Source
This commit is contained in:
Mikhail Yevchenko
2026-04-01 18:25:35 +00:00
parent 9bbbbc5a65
commit 3ec080dbd3
3 changed files with 250 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/player.html
+182 -3
View File
@@ -7,17 +7,18 @@
<link rel="stylesheet" href="https://unpkg.com/mvp.css">
<style>
body {
max-width: 900px;
max-width: 1100px;
margin: 0 auto;
padding: 1rem;
}
h1 {
margin-bottom: 1rem;
margin-bottom: 0.5rem;
}
.video-container {
width: 100%;
background: #000;
aspect-ratio: 16 / 9;
margin-bottom: 1.5rem;
}
video {
width: 100%;
@@ -27,16 +28,194 @@
display: inline-block;
margin-bottom: 1rem;
}
.metadata {
background: #f5f5f5;
padding: 1rem;
border-radius: 8px;
margin-bottom: 1rem;
}
.metadata h2 {
margin-top: 0;
font-size: 1.2rem;
}
.metadata-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 0.75rem;
}
.metadata-item {
word-break: break-word;
}
.metadata-label {
font-weight: bold;
color: #666;
font-size: 0.85rem;
}
.metadata-value {
color: #333;
}
.thumbnail {
max-width: 100%;
max-height: 200px;
margin: 1rem 0;
border-radius: 4px;
}
.description {
background: #f9f9f9;
padding: 1rem;
border-radius: 8px;
margin-bottom: 1rem;
white-space: pre-wrap;
max-height: 200px;
overflow-y: auto;
}
</style>
</head>
<body>
<a href="/" class="back-link">← Back</a>
{% if thumbnail %}
<img src="{{ thumbnail }}" alt="{{ title }}" class="thumbnail">
{% endif %}
<h1>{{ title }}</h1>
<div class="video-container">
<video controls id="video">
Your browser does not support video playback.
</video>
</div>
{% if description %}
<div class="description">
<h3>Description</h3>
{{ description }}
</div>
{% endif %}
<div class="metadata">
<h2>Video Information</h2>
<div class="metadata-grid">
{% if uploader %}
<div class="metadata-item">
<div class="metadata-label">Uploader</div>
<div class="metadata-value">{{ uploader }}</div>
</div>
{% endif %}
{% if channel %}
<div class="metadata-item">
<div class="metadata-label">Channel</div>
<div class="metadata-value">{{ channel }}</div>
</div>
{% endif %}
{% if duration_string %}
<div class="metadata-item">
<div class="metadata-label">Duration</div>
<div class="metadata-value">{{ duration_string }}</div>
</div>
{% endif %}
{% if upload_date %}
<div class="metadata-item">
<div class="metadata-label">Upload Date</div>
<div class="metadata-value">{{ upload_date }}</div>
</div>
{% endif %}
{% if view_count %}
<div class="metadata-item">
<div class="metadata-label">Views</div>
<div class="metadata-value">{{ "{:,}".format(view_count) }}</div>
</div>
{% endif %}
{% if like_count %}
<div class="metadata-item">
<div class="metadata-label">Likes</div>
<div class="metadata-value">{{ "{:,}".format(like_count) }}</div>
</div>
{% endif %}
{% if comment_count %}
<div class="metadata-item">
<div class="metadata-label">Comments</div>
<div class="metadata-value">{{ "{:,}".format(comment_count) }}</div>
</div>
{% endif %}
{% if categories %}
<div class="metadata-item">
<div class="metadata-label">Categories</div>
<div class="metadata-value">{% for cat in categories %}{{ cat }}{% if not loop.last %}, {% endif %}{% endfor %}</div>
</div>
{% endif %}
{% if language %}
<div class="metadata-item">
<div class="metadata-label">Language</div>
<div class="metadata-value">{{ language }}</div>
</div>
{% endif %}
{% if extractor %}
<div class="metadata-item">
<div class="metadata-label">Source</div>
<div class="metadata-value">{{ extractor }}</div>
</div>
{% endif %}
{% if resolution %}
<div class="metadata-item">
<div class="metadata-label">Resolution</div>
<div class="metadata-value">{{ resolution }}</div>
</div>
{% endif %}
{% if format %}
<div class="metadata-item">
<div class="metadata-label">Format</div>
<div class="metadata-value">{{ format }}{% if format_note %} ({{ format_note }}){% endif %}</div>
</div>
{% endif %}
{% if filesize_approx %}
<div class="metadata-item">
<div class="metadata-label">Size (approx)</div>
<div class="metadata-value">{{ filesize_approx }}</div>
</div>
{% endif %}
</div>
</div>
{% if tags %}
<div class="metadata">
<h2>Tags</h2>
<div class="metadata-value">
{% for tag in tags %}
<span style="display: inline-block; background: #e0e0e0; padding: 2px 8px; border-radius: 4px; margin: 2px;">{{ tag }}</span>
{% endfor %}
</div>
</div>
{% endif %}
{% if hls_url %}
<div class="metadata">
<h2>Stream URLs</h2>
<div class="metadata-item">
<div class="metadata-label">HLS URL</div>
<div class="metadata-value" style="word-break: break-all; font-size: 0.85rem;">{{ hls_url[:200] }}{% if hls_url|length > 200 %}...{% endif %}</div>
</div>
{% if direct_url %}
<div class="metadata-item">
<div class="metadata-label">Direct URL</div>
<div class="metadata-value" style="word-break: break-all; font-size: 0.85rem;">{{ direct_url[:200] }}{% if direct_url|length > 200 %}...{% endif %}</div>
</div>
{% endif %}
</div>
{% endif %}
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
<script>
const video = document.getElementById('video');
@@ -64,4 +243,4 @@
}
</script>
</body>
</html>
</html>