This commit is contained in:
2025-05-15 16:36:05 +03:00
parent 16ff522aa2
commit ae9becd905
18 changed files with 476 additions and 194 deletions

27
app.py
View File

@@ -150,12 +150,16 @@ def logout():
@admin_required
def upload_content():
if request.method == 'POST':
target_type = request.form['target_type']
target_id = int(request.form['target_id'])
target_type = request.form.get('target_type')
target_id = request.form.get('target_id')
files = request.files.getlist('files')
duration = int(request.form['duration'])
return_url = request.form['return_url']
media_type = request.form['media_type']
return_url = request.form.get('return_url')
media_type = request.form.get('media_type')
if not target_type or not target_id:
flash('Please select a target type and target ID.', 'danger')
return redirect(url_for('upload_content'))
for file in files:
filename = secure_filename(file.filename)
@@ -202,14 +206,27 @@ def upload_content():
# Remove the original PDF file after processing
os.remove(file_path)
# Handle video files
elif media_type == 'video':
# Add the video file to the playlist
if target_type == 'group':
group = Group.query.get_or_404(target_id)
for player in group.players:
new_content = Content(file_name=filename, duration=duration, player_id=player.id)
db.session.add(new_content)
elif target_type == 'player':
new_content = Content(file_name=filename, duration=duration, player_id=target_id)
db.session.add(new_content)
db.session.commit()
return redirect(return_url)
# Handle GET request
target_type = request.args.get('target_type')
target_id = request.args.get('target_id')
return_url = request.args.get('return_url', url_for('dashboard'))
players = [{'id': player.id, 'username': player.username} for player in Player.query.filter(~Player.groups.any()).all()]
players = [{'id': player.id, 'username': player.username} for player in Player.query.all()]
groups = [{'id': group.id, 'name': group.name} for group in Group.query.all()]
return render_template('upload_content.html', target_type=target_type, target_id=target_id, players=players, groups=groups, return_url=return_url)

Binary file not shown.

Binary file not shown.

Binary file not shown.

Before

Width:  |  Height:  |  Size: 713 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 612 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 414 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 150 KiB

View File

@@ -1,6 +1,8 @@
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Add Player</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
@@ -15,31 +17,54 @@
.dark-mode label, .dark-mode th, .dark-mode td {
color: #ffffff;
}
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
}
</style>
</head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="container py-5">
<h1 class="text-center mb-4">Add Player</h1>
<form method="POST" action="{{ url_for('add_player') }}">
<div class="mb-3">
<label for="username" class="form-label">Player Name</label>
<input type="text" class="form-control" id="username" name="username" required>
<div class="row">
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="username" class="form-label">Player Name</label>
<input type="text" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="username" name="username" required>
</div>
</div>
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="hostname" class="form-label">Hostname</label>
<input type="text" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="hostname" name="hostname" required>
</div>
</div>
</div>
<div class="mb-3">
<label for="hostname" class="form-label">Hostname</label>
<input type="text" class="form-control" id="hostname" name="hostname" required>
<div class="row">
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<input type="password" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="password" name="password" required>
</div>
</div>
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="quickconnect_password" class="form-label">Quick Connect Password</label>
<input type="password" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="quickconnect_password" name="quickconnect_password" required>
</div>
</div>
</div>
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<input type="password" class="form-control" id="password" name="password" required>
<div class="text-center">
<button type="submit" class="btn btn-primary">Add Player</button>
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary mt-3">Back to Dashboard</a>
</div>
<div class="mb-3">
<label for="quickconnect_password" class="form-label">Quick Connect Password</label>
<input type="password" class="form-control" id="quickconnect_password" name="quickconnect_password" required>
</div>
<button type="submit" class="btn btn-primary">Add Player</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>

View File

@@ -1,6 +1,8 @@
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Admin Panel</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
@@ -35,6 +37,22 @@
max-height: 100px;
margin-right: 20px;
}
@media (max-width: 768px) {
.logo {
max-height: 50px;
margin-right: 10px;
}
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
.card {
margin-bottom: 1rem;
}
}
</style>
</head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
@@ -46,6 +64,7 @@
<h1 class="mb-0">Admin Panel</h1>
</div>
<!-- Manage Users Card -->
<div class="card mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header">
<h2>Manage Users</h2>
@@ -112,33 +131,26 @@
</div>
</div>
<!-- Upload Personalization Photos Card -->
<div class="card mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header">
<h2>Upload Personalization Photos for the App</h2>
<h2>Upload Personalization Photos</h2>
</div>
<div class="card-body">
<form action="{{ url_for('upload_personalization_pictures') }}" method="post" enctype="multipart/form-data">
<div class="row mb-3">
<div class="col-md-4">
<div class="col-md-6">
<label for="logo" class="form-label">Current Logo</label>
{% if logo_exists %}
<img src="{{ url_for('static', filename='resurse/logo.png') }}" alt="Current Logo" class="img-thumbnail img-preview mb-3">
{% endif %}
</div>
<div class="col-md-8">
<label for="logo" class="form-label">Select New Logo</label>
<input type="file" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="logo" name="logo">
</div>
</div>
<div class="row mb-3">
<div class="col-md-4">
<div class="col-md-6">
<label for="login_picture" class="form-label">Current Login Page Picture</label>
{% if login_picture_exists %}
<img src="{{ url_for('static', filename='resurse/login_picture.png') }}" alt="Current Login Picture" class="img-thumbnail img-preview mb-3">
{% endif %}
</div>
<div class="col-md-8">
<label for="login_picture" class="form-label">Select New Login Page Picture</label>
<input type="file" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="login_picture" name="login_picture">
</div>
</div>
@@ -166,7 +178,7 @@
</div>
</div>
<!-- Clean Script Card -->
<!-- Clean Unused Files Card -->
<div class="card mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header">
<h2>Clean Unused Files</h2>
@@ -193,7 +205,7 @@
popup.style.display = 'block';
setTimeout(() => {
popup.style.display = 'none';
}, 5000); // Increased time to 5 seconds
}, 5000);
}
</script>
</body>

View File

@@ -1,6 +1,8 @@
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Create Group</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
@@ -15,27 +17,44 @@
.dark-mode label, .dark-mode th, .dark-mode td {
color: #ffffff;
}
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
}
</style>
</head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="container py-5">
<h1 class="text-center mb-4">Create Group</h1>
<form method="POST" action="{{ url_for('create_group') }}">
<div class="mb-3">
<label for="name" class="form-label">Group Name</label>
<input type="text" class="form-control" id="name" name="name" required>
<div class="row">
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="name" class="form-label">Group Name</label>
<input type="text" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="name" name="name" required>
</div>
</div>
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="players" class="form-label">Select Players</label>
<select multiple class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="players" name="players">
{% for player in players %}
<option value="{{ player.id }}">{{ player.username }}</option>
{% endfor %}
</select>
</div>
</div>
</div>
<div class="mb-3">
<label for="players" class="form-label">Select Players</label>
<select multiple class="form-control" id="players" name="players">
{% for player in players %}
<option value="{{ player.id }}">{{ player.username }}</option>
{% endfor %}
</select>
<div class="text-center">
<button type="submit" class="btn btn-primary">Create Group</button>
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary mt-3">Back to Dashboard</a>
</div>
<button type="submit" class="btn btn-primary">Create Group</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>

View File

@@ -18,6 +18,22 @@
max-height: 100px;
margin-right: 20px;
}
@media (max-width: 768px) {
.logo {
max-height: 50px;
margin-right: 10px;
}
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
.card {
margin-bottom: 1rem;
}
}
</style>
</head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
@@ -35,8 +51,8 @@
</div>
<div class="row">
<div class="col-md-8">
<!-- Players Section -->
<!-- Players Section -->
<div class="col-md-8 col-12">
<div class="card mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header bg-primary text-white">
<h2>Players</h2>
@@ -68,8 +84,10 @@
{% endif %}
</div>
</div>
</div>
<!-- Group of Players Section -->
<!-- Group of Players Section -->
<div class="col-md-8 col-12">
<div class="card mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header bg-secondary text-white">
<h2>Group of Players</h2>
@@ -97,8 +115,10 @@
</div>
</div>
</div>
</div>
<!-- Content Upload Section -->
<!-- Content Upload Section -->
<div class="col-md-8 col-12">
<div class="card mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header bg-warning text-dark">
<h2>Content Upload</h2>
@@ -111,7 +131,7 @@
<!-- App Settings Section -->
{% if current_user.role == 'admin' %}
<div class="col-md-4">
<div class="col-md-4 col-12">
<div class="card mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header bg-info text-white">
<h2>App Settings</h2>

View File

@@ -1,15 +1,61 @@
<form method="POST">
<div class="mb-3">
<label for="name" class="form-label">Group Name</label>
<input type="text" class="form-control" id="name" name="name" value="{{ group.name }}" required>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Edit Group</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
body.dark-mode {
background-color: #121212;
color: #ffffff;
}
.card.dark-mode {
background-color: #1e1e1e;
color: #ffffff;
}
.dark-mode label, .dark-mode th, .dark-mode td {
color: #ffffff;
}
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
}
</style>
</head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="container py-5">
<h1 class="text-center mb-4">Edit Group</h1>
<form method="POST">
<div class="row">
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="name" class="form-label">Group Name</label>
<input type="text" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="name" name="name" value="{{ group.name }}" required>
</div>
</div>
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="players" class="form-label">Select Players</label>
<select multiple class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="players" name="players">
{% for player in players %}
<option value="{{ player.id }}" {% if player in group.players %}selected{% endif %}>{{ player.username }}</option>
{% endfor %}
</select>
</div>
</div>
</div>
<div class="text-center">
<button type="submit" class="btn btn-primary">Save Changes</button>
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary mt-3">Back to Dashboard</a>
</div>
</form>
</div>
<div class="mb-3">
<label for="players" class="form-label">Select Players</label>
<select multiple class="form-control" id="players" name="players">
{% for player in players %}
<option value="{{ player.id }}" {% if player in group.players %}selected{% endif %}>{{ player.username }}</option>
{% endfor %}
</select>
</div>
<button type="submit" class="btn btn-primary">Save Changes</button>
</form>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

View File

@@ -1,6 +1,8 @@
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Edit Player</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
@@ -15,32 +17,55 @@
.dark-mode label, .dark-mode th, .dark-mode td {
color: #ffffff;
}
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
}
</style>
</head>
<body class="{% if theme == 'dark' %}dark-mode{% endif %}">
<div class="container py-5">
<h1 class="text-center mb-4">Edit Player</h1>
<form action="{{ url_for('edit_player', player_id=player.id) }}" method="post">
<div class="mb-3">
<label for="username" class="form-label">Player Name</label>
<input type="text" class="form-control {% if theme == 'dark' %}dark-mode{% endif %}" id="username" name="username" value="{{ player.username }}" required>
<div class="row">
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="username" class="form-label">Player Name</label>
<input type="text" class="form-control {% if theme == 'dark' %}dark-mode{% endif %}" id="username" name="username" value="{{ player.username }}" required>
</div>
</div>
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="hostname" class="form-label">Hostname</label>
<input type="text" class="form-control {% if theme == 'dark' %}dark-mode{% endif %}" id="hostname" name="hostname" value="{{ player.hostname }}" required>
</div>
</div>
</div>
<div class="mb-3">
<label for="hostname" class="form-label">Hostname</label>
<input type="text" class="form-control {% if theme == 'dark' %}dark-mode{% endif %}" id="hostname" name="hostname" value="{{ player.hostname }}" required>
<div class="row">
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="password" class="form-label">Password (leave blank to keep current password)</label>
<input type="password" class="form-control {% if theme == 'dark' %}dark-mode{% endif %}" id="password" name="password">
</div>
</div>
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="quickconnect_password" class="form-label">Quick Connect Password (leave blank to keep current password)</label>
<input type="password" class="form-control {% if theme == 'dark' %}dark-mode{% endif %}" id="quickconnect_password" name="quickconnect_password">
</div>
</div>
</div>
<div class="mb-3">
<label for="password" class="form-label">Password (leave blank to keep current password)</label>
<input type="password" class="form-control {% if theme == 'dark' %}dark-mode{% endif %}" id="password" name="password">
<div class="text-center">
<button type="submit" class="btn btn-primary">Update Player</button>
<a href="{{ return_url }}" class="btn btn-secondary mt-3">Back to Player Page</a>
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary mt-3">Back to Dashboard</a>
</div>
<div class="mb-3">
<label for="quickconnect_password" class="form-label">Quick Connect Password (leave blank to keep current password)</label>
<input type="password" class="form-control {% if theme == 'dark' %}dark-mode{% endif %}" id="quickconnect_password" name="quickconnect_password">
</div>
<button type="submit" class="btn btn-primary">Update Player</button>
</form>
<a href="{{ return_url }}" class="btn btn-secondary mt-3">Back to Player Page</a>
<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>

View File

@@ -1,34 +1,53 @@
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
body.dark-mode {
background-color: #121212;
color: #ffffff;
}
.card.dark-mode {
background-color: #1e1e1e;
color: #ffffff;
}
.login-picture {
max-width: 100%;
height: auto;
margin-bottom: 20px;
}
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
}
</style>
</head>
<body>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="container py-5">
<div class="row">
<div class="col-md-6 text-center">
<div class="row justify-content-center">
<div class="col-md-6 col-12 text-center">
{% if login_picture_exists %}
<img src="{{ url_for('static', filename='resurse/login_picture.png') }}" alt="Login Picture" class="login-picture">
{% endif %}
</div>
<div class="col-md-6">
<div class="col-md-6 col-12">
<h1 class="text-center mb-4">Login</h1>
<form action="{{ url_for('login') }}" method="post">
<div class="mb-3">
<label for="username" class="form-label">Username</label>
<input type="text" class="form-control" id="username" name="username" required>
<input type="text" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="username" name="username" required>
</div>
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<input type="password" class="form-control" id="password" name="password" required>
<input type="password" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="password" name="password" required>
</div>
<button type="submit" class="btn btn-primary w-100">Login</button>
</form>

View File

@@ -5,6 +5,31 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Manage Group</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
body.dark-mode {
background-color: #121212;
color: #ffffff;
}
.card.dark-mode {
background-color: #1e1e1e;
color: #ffffff;
}
.dark-mode label, .dark-mode th, .dark-mode td {
color: #ffffff;
}
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
.card {
margin-bottom: 1rem;
}
}
</style>
</head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="container py-5">

View File

@@ -1,6 +1,8 @@
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Player Schedule</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
@@ -15,6 +17,18 @@
.dark-mode label, .dark-mode th, .dark-mode td {
color: #ffffff;
}
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
.card {
margin-bottom: 1rem;
}
}
</style>
</head>
<body class="{% if theme == 'dark' %}dark-mode{% endif %}">
@@ -62,20 +76,27 @@
{% if content %}
<ul class="list-group">
{% for media in content %}
<li class="list-group-item d-flex align-items-center {% if theme == 'dark' %}dark-mode{% endif %}">
<div class="flex-grow-1">
<p class="mb-0"><strong>Media Name:</strong> {{ media.file_name }}</p>
</div>
<form action="{{ url_for('edit_content', content_id=media.id) }}" method="post" class="d-flex align-items-center">
<div class="input-group me-2">
<span class="input-group-text">seconds</span>
<input type="number" class="form-control {% if theme == 'dark' %}dark-mode{% endif %}" name="duration" value="{{ media.duration }}" {% if player.groups %}disabled{% endif %} required>
<li class="list-group-item {% if theme == 'dark' %}dark-mode{% endif %}">
<div class="d-flex flex-column flex-md-row align-items-md-center">
<!-- Media Name -->
<div class="flex-grow-1 mb-2 mb-md-0">
<p class="mb-0"><strong>Media Name:</strong> {{ media.file_name }}</p>
</div>
<button type="submit" class="btn btn-warning me-2" {% if player.groups %}disabled{% endif %}>Edit</button>
</form>
<form action="{{ url_for('delete_content', content_id=media.id) }}" method="post" style="display:inline;">
<button type="submit" class="btn btn-danger" {% if player.groups %}disabled{% endif %} onclick="return confirm('Are you sure you want to delete this media?');">Delete</button>
</form>
<!-- Actions -->
<div class="d-flex flex-wrap justify-content-start">
<form action="{{ url_for('edit_content', content_id=media.id) }}" method="post" class="d-flex align-items-center me-2 mb-2">
<div class="input-group">
<span class="input-group-text">seconds</span>
<input type="number" class="form-control {% if theme == 'dark' %}dark-mode{% endif %}" name="duration" value="{{ media.duration }}" {% if player.groups %}disabled{% endif %} required>
</div>
<button type="submit" class="btn btn-warning ms-2" {% if player.groups %}disabled{% endif %}>Edit</button>
</form>
<form action="{{ url_for('delete_content', content_id=media.id) }}" method="post" class="mb-2">
<button type="submit" class="btn btn-danger" {% if player.groups %}disabled{% endif %} onclick="return confirm('Are you sure you want to delete this media?');">Delete</button>
</form>
</div>
</div>
</li>
{% endfor %}
</ul>

View File

@@ -1,6 +1,8 @@
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Register</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
@@ -15,21 +17,39 @@
.dark-mode label, .dark-mode th, .dark-mode td {
color: #ffffff;
}
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
}
</style>
</head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="container py-5">
<h1 class="text-center mb-4">Register</h1>
<form action="{{ url_for('register') }}" method="post">
<div class="mb-3">
<label for="username" class="form-label">Username</label>
<input type="text" class="form-control" id="username" name="username" required>
<div class="row">
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="username" class="form-label">Username</label>
<input type="text" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="username" name="username" required>
</div>
</div>
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<input type="password" class="form-control {{ 'dark-mode' if theme == 'dark' else '' }}" id="password" name="password" required>
</div>
</div>
</div>
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<input type="password" class="form-control" id="password" name="password" required>
<div class="text-center">
<button type="submit" class="btn btn-primary">Register</button>
<a href="{{ url_for('login') }}" class="btn btn-secondary mt-3">Back to Login</a>
</div>
<button type="submit" class="btn btn-primary">Register</button>
</form>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js"></script>

View File

@@ -1,6 +1,8 @@
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Upload Content</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
@@ -33,6 +35,18 @@
.progress-bar {
background-color: #007bff;
}
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
.card {
margin-bottom: 1rem;
}
}
</style>
</head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
@@ -45,75 +59,90 @@
</div>
<form id="upload-form" action="{{ url_for('upload_content') }}" method="post" enctype="multipart/form-data" onsubmit="showStatusModal()">
<input type="hidden" name="return_url" value="{{ return_url }}">
<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 {% if target_type %}disabled{% endif %} onchange="updateTargetIdOptions()">
<option value="player" {% if target_type == 'player' %}selected{% endif %}>Player</option>
<option value="group" {% if target_type == 'group' %}selected{% endif %}>Group</option>
</select>
{% if target_type %}
<input type="hidden" name="target_type" value="{{ target_type }}">
{% endif %}
</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 {% if target_id %}disabled{% endif %}>
{% if target_type == 'player' %}
<optgroup label="Players">
{% for player in players %}
<option value="{{ player.id }}" {% if target_id == player.id %}selected{% endif %}>{{ player.username }}</option>
{% endfor %}
</optgroup>
{% elif target_type == 'group' %}
<optgroup label="Groups">
{% for group in groups %}
<option value="{{ group.id }}" {% if target_id == group.id %}selected{% endif %}>{{ group.name }}</option>
{% endfor %}
</optgroup>
{% endif %}
</select>
{% if target_id %}
<input type="hidden" name="target_id" value="{{ target_id }}">
{% endif %}
</div>
<div class="mb-3">
<label for="media_type" class="form-label">Media Type:</label>
<select name="media_type" id="media_type" class="form-select" required>
<option value="image">Image</option>
<option value="video">Video</option>
<option value="pdf">PDF</option>
<option value="ppt">PPT/PPTX</option>
</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" id="submit-button" class="btn btn-primary">Upload</button>
</form>
<a href="{{ return_url }}" class="btn btn-secondary mt-3">Back</a>
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary mt-3">Back to Dashboard</a>
</div>
<!-- Modal for Status Updates -->
<div class="modal fade" id="statusModal" tabindex="-1" aria-labelledby="statusModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="modal-header {{ 'dark-mode' if theme == 'dark' else '' }}">
<h5 class="modal-title" id="statusModalLabel">Processing Files</h5>
</div>
<div class="modal-body">
<p id="status-message">Uploading and processing your files. Please wait...</p>
<div class="progress">
<div id="progress-bar" class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
<div class="row">
<div class="col-md-6 col-12">
<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 onchange="updateTargetIdOptions()">
<option value="" disabled selected>Select Target Type</option>
<option value="player" {% if target_type == 'player' %}selected{% endif %}>Player</option>
<option value="group" {% if target_type == 'group' %}selected{% endif %}>Group</option>
</select>
</div>
</div>
<div class="modal-footer {{ 'dark-mode' if theme == 'dark' else '' }}">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" disabled>Close</button>
<div class="col-md-6 col-12">
<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>
{% if target_type == 'player' %}
<optgroup label="Players">
{% for player in players %}
<option value="{{ player.id }}" {% if target_id == player.id %}selected{% endif %}>{{ player.username }}</option>
{% endfor %}
</optgroup>
{% elif target_type == 'group' %}
<optgroup label="Groups">
{% for group in groups %}
<option value="{{ group.id }}" {% if target_id == group.id %}selected{% endif %}>{{ group.name }}</option>
{% endfor %}
</optgroup>
{% else %}
<option value="" disabled selected>Select a Target ID</option>
{% endif %}
</select>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="media_type" class="form-label">Media Type:</label>
<select name="media_type" id="media_type" class="form-select" required>
<option value="image">Image</option>
<option value="video">Video</option>
<option value="pdf">PDF</option>
<option value="ppt">PPT/PPTX</option>
</select>
</div>
</div>
<div class="col-md-6 col-12">
<div class="mb-3">
<label for="files" class="form-label">Files:</label>
<input type="file" name="files" id="files" class="form-control" multiple required onchange="handleFileChange()">
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 col-12">
<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>
</div>
</div>
<div class="text-center">
<button type="submit" id="submit-button" class="btn btn-primary">Upload</button>
<a href="{{ return_url }}" class="btn btn-secondary mt-3">Back</a>
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary mt-3">Back to Dashboard</a>
</div>
</form>
<!-- Modal for Status Updates -->
<div class="modal fade" id="statusModal" tabindex="-1" aria-labelledby="statusModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="modal-header {{ 'dark-mode' if theme == 'dark' else '' }}">
<h5 class="modal-title" id="statusModalLabel">Processing Files</h5>
</div>
<div class="modal-body">
<p id="status-message">Uploading and processing your files. Please wait...</p>
<div class="progress">
<div id="progress-bar" class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="modal-footer {{ 'dark-mode' if theme == 'dark' else '' }}">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" disabled>Close</button>
</div>
</div>
</div>
</div>
@@ -151,21 +180,25 @@
}
}
document.getElementById('files').addEventListener('change', function(event) {
const files = event.target.files;
function handleFileChange() {
const mediaType = document.getElementById('media_type').value;
if (mediaType === 'video' && files.length > 0) {
const videoFile = files[0];
const videoElement = document.createElement('video');
videoElement.preload = 'metadata';
videoElement.onloadedmetadata = function() {
window.URL.revokeObjectURL(videoElement.src);
const duration = videoElement.duration;
document.getElementById('duration').value = Math.round(duration);
}
videoElement.src = URL.createObjectURL(videoFile);
const filesInput = document.getElementById('files');
const durationInput = document.getElementById('duration');
if (mediaType === 'video' && filesInput.files.length > 0) {
const file = filesInput.files[0];
const video = document.createElement('video');
video.preload = 'metadata';
video.onloadedmetadata = function () {
window.URL.revokeObjectURL(video.src);
const duration = Math.round(video.duration);
durationInput.value = duration; // Set the duration in the input field
};
video.src = URL.createObjectURL(file);
}
});
}
function showStatusModal() {
const statusModal = new bootstrap.Modal(document.getElementById('statusModal'));