cato447/tutor-tool
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

finished backend upgrades to allow multiple courses

Browse Source
This commit is contained in:
cato447
2025-10-19 13:50:46 +02:00
parent 02fc60151f
commit 01f5e8ab08
8 changed files with 218 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
app/templates/index.html
View File

@@ -32,6 +32,8 @@
<!-- in base.html, in <head> or just before </body> -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.7.1/socket.io.min.js"></script>
<script src="https://unpkg.com/htmx.org@1.9.10"></script>
</head>
@@ -41,66 +43,35 @@
<!-- Header -->
<header class="bg-surface border-b border-border shadow-sm">
<div
class="w-full px-6 py-4
flex items-center justify-between"
>
<div class="relative z-20">
<button id="menu-toggle" class="text-white hover:text-gray-300 focus:outline-none p-2 rounded-md">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
</svg>
</button>
<div class="w-full px-6 py-4 flex items-center justify-between" >
<div class="hamburger-menu">
<button class="menu-toggle" aria-controls="course-selector">Menu</button>
<div class="flex items-center space-x-3">
<span class="text-gray-700 dark:text-gray-200 text-base font-medium whitespace-nowrap">
User: {{ user_name }}
</span>
<select id="course-selector" name="course_selection" onchange="this.form.submit()">
<option value="" disabled selected>Select a Course</option>
{% for course in courses %}
<option value="{{ course.id }}">
{{ course.display_name }}
</option>
{% endfor %}
</select>
</div>
<div class="flex items-center space-x-1 relative z-10">
<span class="text-white text-base font-medium whitespace-nowrap py-1">
User: {{ user_name }}
</span>
<form method="POST" action="/logout">
<button
type="submit"
class="text-sm text-white bg-red-600 px-3 py-1 rounded-md hover:bg-red-700 transition"
>
Logout
</button>
</form>
<form method="POST" action="/logout">
<button
type="submit"
class="text-sm text-white bg-red-600 px-3 py-1 rounded-md hover:bg-red-700 transition"
>
Logout
</button>
</form>
<a href="/admin" class="ml-4">
<button class="bg-primary hover:bg-blue-700 text-white px-3 py-1 rounded-md transition">
Admin
</button>
</a>
</div>
<div class="relative z-10">
<a href="/admin">
<button class="bg-primary hover:bg-blue-700 text-white px-3 py-1 rounded-md transition">
Admin
</button>
</a>
</div>
</div>
</header>
<script>
document.getElementById('menu-toggle').addEventListener('click', function() {
document.getElementById('course-menu').classList.toggle('hidden');
});
</script> <!-- Main Content -->
</header> <!-- Main Content -->
<main class="max-w-5xl mx-auto px-6 py-10 space-y-12">
<h3 class="text-3xl font-bold text-center mb-8">{{course_display_name}}</h3>
{% if active_banner %}
<section class="flex justify-center">
<div class="p-4 text-sm text-yellow-800 rounded-lg bg-yellow-50 dark:bg-gray-800 dark:text-yellow-300" role="alert">
@@ -109,6 +80,33 @@
</section>
{% endif %}
<div class="flex justify-center">
<div class="relative group">
<button class="flex items-center text-gray-900 dark:text-white hover:text-blue-700 dark:hover:text-blue-500 font-medium py-1 px-3 rounded-lg bg-transparent text-2xl">
{% for course in courses %}
{% if course.id == active_course.id %}
{{ course.name }}
{% endif %}
{% endfor %}
<svg class="w-2.5 h-2.5 ms-2.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 10 6">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
</svg>
</button>
<div class="absolute hidden group-hover:block bg-white divide-y divide-gray-100 rounded-lg shadow dark:bg-gray-700 z-50">
<ul class="py-2 px-4 text-sm text-gray-700 dark:text-gray-200">
{% for course in courses %}
<li>
<form method="POST" action="/switch_course/{{ course.id }}">
<button type="submit"> {{ course.name }}</button>
</form>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
<!-- Password Form -->
<section class="flex justify-center">
<div class="w-full max-w-md">
@@ -130,9 +128,21 @@
Unlock
</button>
</form>
{% if error %}
<p class="text-red-500 text-center mt-3">{{ error }}</p>
{% endif %}
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
<div class="flashed-messages">
{% for category, message in messages %}
{% if category == 'error' %}
<p class="text-red-500 text-center mt-3">{{ message }}</p>
{% elif category == 'expired' %}
<p class="text-orange-500 text-center mt-3">{{ message }}</p>
{% else %}
<p class="text-gray-500 text-center mt-3">{{ message }}</p>
{% endif %}
{% endfor %}
</div>
{% endif %}
{% endwith %}
</div>
</div>
</section>
@@ -142,7 +152,7 @@
<section>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
{% for deck in decks %}
<a href="/slides/{{ deck.deck }}/" class="block bg-surface border border-border rounded-xl p-5 shadow-sm hover:border-primary hover:bg-background transition">
<a href="/slides/{{deck.course.folder}}/{{ deck.deck }}/{{ deck.index_file}}" class="block bg-surface border border-border rounded-xl p-5 shadow-sm hover:border-primary hover:bg-background transition">
<h3 class="text-lg font-semibold mb-1">{{ deck.name }}</h3>
<p class="text-muted text-sm">{{ deck.description }}</p>
</a>