74 lines
2.8 KiB
Plaintext
74 lines
2.8 KiB
Plaintext
{% extends "base.html" %}
|
|
|
|
{% block title %}Media Viewer{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container mt-4">
|
|
<h1 class="text-center">Viewing Media: {{ filename }}</h1>
|
|
<p class="text-muted text-center">MIME Type: {{ mime_type }}</p>
|
|
|
|
<div class="media-container text-center">
|
|
{% if mime_type.startswith("image/") %}
|
|
<img src="{{ url_for('get_file', filename=filename) }}" alt="Image" class="img-fluid" />
|
|
{% elif mime_type.startswith("video/") %}
|
|
<video controls class="w-100">
|
|
<source src="{{ url_for('get_file', filename=filename) }}" type="{{ mime_type }}">
|
|
Your browser does not support the video tag.
|
|
</video>
|
|
{% elif mime_type.startswith("audio/") %}
|
|
<audio controls class="w-100">
|
|
<source src="{{ url_for('get_file', filename=filename) }}" type="{{ mime_type }}">
|
|
Your browser does not support the audio element.
|
|
</audio>
|
|
{% elif mime_type == "application/pdf" %}
|
|
<embed src="{{ url_for('get_file', filename=filename) }}" type="{{ mime_type }}" width="100%" height="600px">
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-center mt-4">
|
|
<button class="btn btn-primary me-2" onclick="toggleMetadata()">Toggle Metadata</button>
|
|
<a href="{{ url_for('download_paste', id=paste_id) }}" class="btn btn-success">📥 Download</a>
|
|
</div>
|
|
|
|
<div class="metadata mt-4">
|
|
<div id="metadata-content" class="metadata-content" style="display: none;">
|
|
<table class="table table-bordered table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th>Property</th>
|
|
<th>Value</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% if metadata %}
|
|
{% for track in metadata %}
|
|
{% for key, value in track.items() %}
|
|
<tr>
|
|
<td>{{ key }}</td>
|
|
<td>{{ value }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
{% endfor %}
|
|
{% else %}
|
|
<tr>
|
|
<td colspan="2">No metadata available for this file.</td>
|
|
</tr>
|
|
{% endif %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
function toggleMetadata() {
|
|
const content = document.getElementById("metadata-content");
|
|
if (content.style.display === "none") {
|
|
content.style.display = "block";
|
|
} else {
|
|
content.style.display = "none";
|
|
}
|
|
}
|
|
</script>
|
|
{% endblock %}
|
|
|