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 @admin_required
def upload_content(): def upload_content():
if request.method == 'POST': if request.method == 'POST':
target_type = request.form['target_type'] target_type = request.form.get('target_type')
target_id = int(request.form['target_id']) target_id = request.form.get('target_id')
files = request.files.getlist('files') files = request.files.getlist('files')
duration = int(request.form['duration']) duration = int(request.form['duration'])
return_url = request.form['return_url'] return_url = request.form.get('return_url')
media_type = request.form['media_type'] 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: for file in files:
filename = secure_filename(file.filename) filename = secure_filename(file.filename)
@@ -202,14 +206,27 @@ def upload_content():
# Remove the original PDF file after processing # Remove the original PDF file after processing
os.remove(file_path) 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() db.session.commit()
return redirect(return_url) return redirect(return_url)
# Handle GET request
target_type = request.args.get('target_type') target_type = request.args.get('target_type')
target_id = request.args.get('target_id') target_id = request.args.get('target_id')
return_url = request.args.get('return_url', url_for('dashboard')) 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()] 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) 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> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Add Player</title> <title>Add Player</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style> <style>
@@ -15,31 +17,54 @@
.dark-mode label, .dark-mode th, .dark-mode td { .dark-mode label, .dark-mode th, .dark-mode td {
color: #ffffff; color: #ffffff;
} }
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
}
</style> </style>
</head> </head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}"> <body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="container py-5"> <div class="container py-5">
<h1 class="text-center mb-4">Add Player</h1> <h1 class="text-center mb-4">Add Player</h1>
<form method="POST" action="{{ url_for('add_player') }}"> <form method="POST" action="{{ url_for('add_player') }}">
<div class="mb-3"> <div class="row">
<label for="username" class="form-label">Player Name</label> <div class="col-md-6 col-12">
<input type="text" class="form-control" id="username" name="username" required> <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>
<div class="mb-3"> <div class="row">
<label for="hostname" class="form-label">Hostname</label> <div class="col-md-6 col-12">
<input type="text" class="form-control" id="hostname" name="hostname" required> <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>
<div class="mb-3"> <div class="text-center">
<label for="password" class="form-label">Password</label> <button type="submit" class="btn btn-primary">Add Player</button>
<input type="password" class="form-control" id="password" name="password" required> <a href="{{ url_for('dashboard') }}" class="btn btn-secondary mt-3">Back to Dashboard</a>
</div> </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> </form>
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary mt-3">Back to Dashboard</a>
</div> </div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js"></script>
</body> </body>

View File

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

View File

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

View File

@@ -18,6 +18,22 @@
max-height: 100px; max-height: 100px;
margin-right: 20px; 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> </style>
</head> </head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}"> <body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
@@ -35,8 +51,8 @@
</div> </div>
<div class="row"> <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 mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header bg-primary text-white"> <div class="card-header bg-primary text-white">
<h2>Players</h2> <h2>Players</h2>
@@ -68,8 +84,10 @@
{% endif %} {% endif %}
</div> </div>
</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 mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header bg-secondary text-white"> <div class="card-header bg-secondary text-white">
<h2>Group of Players</h2> <h2>Group of Players</h2>
@@ -97,8 +115,10 @@
</div> </div>
</div> </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 mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header bg-warning text-dark"> <div class="card-header bg-warning text-dark">
<h2>Content Upload</h2> <h2>Content Upload</h2>
@@ -111,7 +131,7 @@
<!-- App Settings Section --> <!-- App Settings Section -->
{% if current_user.role == 'admin' %} {% 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 mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header bg-info text-white"> <div class="card-header bg-info text-white">
<h2>App Settings</h2> <h2>App Settings</h2>

View File

@@ -1,15 +1,61 @@
<form method="POST"> <!DOCTYPE html>
<div class="mb-3"> <html lang="en">
<label for="name" class="form-label">Group Name</label> <head>
<input type="text" class="form-control" id="name" name="name" value="{{ group.name }}" required> <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>
<div class="mb-3"> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js"></script>
<label for="players" class="form-label">Select Players</label> </body>
<select multiple class="form-control" id="players" name="players"> </html>
{% 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>

View File

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

View File

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

View File

@@ -5,6 +5,31 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Manage Group</title> <title>Manage Group</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet"> <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> </head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}"> <body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="container py-5"> <div class="container py-5">

View File

@@ -1,6 +1,8 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Player Schedule</title> <title>Player Schedule</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style> <style>
@@ -15,6 +17,18 @@
.dark-mode label, .dark-mode th, .dark-mode td { .dark-mode label, .dark-mode th, .dark-mode td {
color: #ffffff; 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> </style>
</head> </head>
<body class="{% if theme == 'dark' %}dark-mode{% endif %}"> <body class="{% if theme == 'dark' %}dark-mode{% endif %}">
@@ -62,20 +76,27 @@
{% if content %} {% if content %}
<ul class="list-group"> <ul class="list-group">
{% for media in content %} {% for media in content %}
<li class="list-group-item d-flex align-items-center {% if theme == 'dark' %}dark-mode{% endif %}"> <li class="list-group-item {% if theme == 'dark' %}dark-mode{% endif %}">
<div class="flex-grow-1"> <div class="d-flex flex-column flex-md-row align-items-md-center">
<p class="mb-0"><strong>Media Name:</strong> {{ media.file_name }}</p> <!-- Media Name -->
</div> <div class="flex-grow-1 mb-2 mb-md-0">
<form action="{{ url_for('edit_content', content_id=media.id) }}" method="post" class="d-flex align-items-center"> <p class="mb-0"><strong>Media Name:</strong> {{ media.file_name }}</p>
<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>
</div> </div>
<button type="submit" class="btn btn-warning me-2" {% if player.groups %}disabled{% endif %}>Edit</button>
</form> <!-- Actions -->
<form action="{{ url_for('delete_content', content_id=media.id) }}" method="post" style="display:inline;"> <div class="d-flex flex-wrap justify-content-start">
<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 action="{{ url_for('edit_content', content_id=media.id) }}" method="post" class="d-flex align-items-center me-2 mb-2">
</form> <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> </li>
{% endfor %} {% endfor %}
</ul> </ul>

View File

@@ -1,6 +1,8 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Register</title> <title>Register</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style> <style>
@@ -15,21 +17,39 @@
.dark-mode label, .dark-mode th, .dark-mode td { .dark-mode label, .dark-mode th, .dark-mode td {
color: #ffffff; color: #ffffff;
} }
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
.btn {
font-size: 0.9rem;
padding: 0.5rem 1rem;
}
}
</style> </style>
</head> </head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}"> <body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="container py-5"> <div class="container py-5">
<h1 class="text-center mb-4">Register</h1> <h1 class="text-center mb-4">Register</h1>
<form action="{{ url_for('register') }}" method="post"> <form action="{{ url_for('register') }}" method="post">
<div class="mb-3"> <div class="row">
<label for="username" class="form-label">Username</label> <div class="col-md-6 col-12">
<input type="text" class="form-control" id="username" name="username" required> <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>
<div class="mb-3"> <div class="text-center">
<label for="password" class="form-label">Password</label> <button type="submit" class="btn btn-primary">Register</button>
<input type="password" class="form-control" id="password" name="password" required> <a href="{{ url_for('login') }}" class="btn btn-secondary mt-3">Back to Login</a>
</div> </div>
<button type="submit" class="btn btn-primary">Register</button>
</form> </form>
</div> </div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js"></script> <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> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Upload Content</title> <title>Upload Content</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
<style> <style>
@@ -33,6 +35,18 @@
.progress-bar { .progress-bar {
background-color: #007bff; 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> </style>
</head> </head>
<body class="{{ 'dark-mode' if theme == 'dark' else '' }}"> <body class="{{ 'dark-mode' if theme == 'dark' else '' }}">
@@ -45,75 +59,90 @@
</div> </div>
<form id="upload-form" action="{{ url_for('upload_content') }}" method="post" enctype="multipart/form-data" onsubmit="showStatusModal()"> <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 }}"> <input type="hidden" name="return_url" value="{{ return_url }}">
<div class="mb-3"> <div class="row">
<label for="target_type" class="form-label">Target Type:</label> <div class="col-md-6 col-12">
<select name="target_type" id="target_type" class="form-select" required {% if target_type %}disabled{% endif %} onchange="updateTargetIdOptions()"> <div class="mb-3">
<option value="player" {% if target_type == 'player' %}selected{% endif %}>Player</option> <label for="target_type" class="form-label">Target Type:</label>
<option value="group" {% if target_type == 'group' %}selected{% endif %}>Group</option> <select name="target_type" id="target_type" class="form-select" required onchange="updateTargetIdOptions()">
</select> <option value="" disabled selected>Select Target Type</option>
{% if target_type %} <option value="player" {% if target_type == 'player' %}selected{% endif %}>Player</option>
<input type="hidden" name="target_type" value="{{ target_type }}"> <option value="group" {% if target_type == 'group' %}selected{% endif %}>Group</option>
{% endif %} </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 {% 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> </div>
</div> </div>
<div class="modal-footer {{ 'dark-mode' if theme == 'dark' else '' }}"> <div class="col-md-6 col-12">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" disabled>Close</button> <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> </div>
</div> </div>
@@ -151,21 +180,25 @@
} }
} }
document.getElementById('files').addEventListener('change', function(event) { function handleFileChange() {
const files = event.target.files;
const mediaType = document.getElementById('media_type').value; const mediaType = document.getElementById('media_type').value;
if (mediaType === 'video' && files.length > 0) { const filesInput = document.getElementById('files');
const videoFile = files[0]; const durationInput = document.getElementById('duration');
const videoElement = document.createElement('video');
videoElement.preload = 'metadata'; if (mediaType === 'video' && filesInput.files.length > 0) {
videoElement.onloadedmetadata = function() { const file = filesInput.files[0];
window.URL.revokeObjectURL(videoElement.src); const video = document.createElement('video');
const duration = videoElement.duration;
document.getElementById('duration').value = Math.round(duration); video.preload = 'metadata';
} video.onloadedmetadata = function () {
videoElement.src = URL.createObjectURL(videoFile); 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() { function showStatusModal() {
const statusModal = new bootstrap.Modal(document.getElementById('statusModal')); const statusModal = new bootstrap.Modal(document.getElementById('statusModal'));