updated the upload page

This commit is contained in:
2025-01-22 10:11:47 +02:00
parent ef69b4fe65
commit 0f17a68035
6 changed files with 100 additions and 30 deletions

View File

@@ -80,6 +80,7 @@
</div>
<div>
<a href="{{ url_for('manage_group', group_id=group.id) }}" class="btn btn-sm btn-secondary">Manage Group</a>
<a href="{{ url_for('group_fullscreen', group_id=group.id) }}" class="btn btn-sm btn-primary">Full Screen</a>
</div>
</li>
{% endfor %}

View File

@@ -0,0 +1,49 @@
<!DOCTYPE html>
<html>
<head>
<title>Group Fullscreen Schedule</title>
<style>
body, html {
height: 100%;
margin: 0;
display: flex;
justify-content: center;
align-items: center;
background-color: black;
}
img {
max-width: 100%;
max-height: 100%;
display: none;
}
img.active {
display: block;
}
</style>
</head>
<body>
<div id="content">
{% for item in content %}
<img src="{{ url_for('static', filename='uploads/' ~ item.file_name) }}" alt="Content Image" data-duration="{{ item.duration }}">
{% endfor %}
</div>
<script>
const images = document.querySelectorAll('#content img');
let index = 0;
function showNextImage() {
images.forEach((img, i) => {
img.classList.toggle('active', i === index);
});
const duration = images[index].getAttribute('data-duration') * 1000;
index = (index + 1) % images.length;
setTimeout(showNextImage, duration);
}
if (images.length > 0) {
images[0].classList.add('active');
showNextImage();
}
</script>
</body>
</html>

View File

@@ -91,6 +91,7 @@
</li>
{% endfor %}
</ul>
<a href="{{ url_for('group_fullscreen', group_id=group.id) }}" class="btn btn-primary mt-3">Full Screen</a>
</div>
</div>

View File

@@ -2,36 +2,46 @@
<html>
<head>
<title>Upload Content</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<h1>Upload Content</h1>
<form method="POST" enctype="multipart/form-data">
<label>Target Type:</label>
<select name="target_type" required>
<option value="player">Player</option>
<option value="group">Group</option>
</select><br>
<label>Target ID:</label>
<select name="target_id" required>
<optgroup label="Players">
{% for player in players %}
<option value="{{ player.id }}">{{ player.username }}</option>
{% endfor %}
</optgroup>
<optgroup label="Groups">
{% for group in groups %}
<option value="{{ group.id }}">{{ group.name }}</option>
{% endfor %}
</optgroup>
</select><br>
<label>Files:</label>
<input type="file" name="files" multiple required><br>
<label>Duration (seconds):</label>
<input type="number" name="duration" required><br>
<button type="submit">Upload</button>
</form>
<a href="{{ url_for('dashboard') }}">Back to Dashboard</a>
<div class="container py-5">
<h1 class="text-center mb-4">Upload Content</h1>
<form method="POST" enctype="multipart/form-data">
<div class="mb-3">
<label for="target_type" class="form-label">Target Type:</label>
<select name="target_type" id="target_type" class="form-select" required>
<option value="player">Player</option>
<option value="group">Group</option>
</select>
</div>
<div class="mb-3">
<label for="target_id" class="form-label">Target ID:</label>
<select name="target_id" id="target_id" class="form-select" required>
<optgroup label="Players">
{% for player in players %}
<option value="{{ player.id }}">{{ player.username }}</option>
{% endfor %}
</optgroup>
<optgroup label="Groups">
{% for group in groups %}
<option value="{{ group.id }}">{{ group.name }}</option>
{% endfor %}
</optgroup>
</select>
</div>
<div class="mb-3">
<label for="files" class="form-label">Files:</label>
<input type="file" name="files" id="files" class="form-control" multiple required>
</div>
<div class="mb-3">
<label for="duration" class="form-label">Duration (seconds):</label>
<input type="number" name="duration" id="duration" class="form-control" required>
</div>
<button type="submit" class="btn btn-primary">Upload</button>
</form>
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary mt-3">Back to Dashboard</a>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>