mirror of
https://github.com/wizarrrr/wizarr.git
synced 2026-07-31 07:17:10 -04:00
187b8758c1
- Updated title block in frame.html for clarity. - Improved localization for the "Next" button in steps.html. - Refactored the WizardController JavaScript for better readability and organization. - Added detailed comments to the wizard architecture for future reference. - Enhanced button visibility and state management based on interaction requirements. - Implemented swipe gesture handling for mobile navigation. - Updated subproject commit to indicate a dirty state.
81 lines
3.1 KiB
HTML
81 lines
3.1 KiB
HTML
<section class="py-8 animate__animated animate__fadeIn animate__faster">
|
|
<div class="container px-4 mx-auto">
|
|
<!-- Header with New Invite button -->
|
|
<div class="flex justify-between items-center mb-6">
|
|
<h1 class="text-3xl font-bold text-gray-900 dark:text-white">{{ _("Invitations") }}</h1>
|
|
<button id="newInviteBtn"
|
|
class="bg-primary hover:bg-primary_hover text-white font-medium px-6 py-3 rounded-lg shadow-lg transition-all duration-200 flex items-center gap-2"
|
|
onclick="openInviteModal()">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path>
|
|
</svg>
|
|
{{ _("New Invite") }}
|
|
</button>
|
|
</div>
|
|
<div class="flex gap-4 mb-4">
|
|
<select id="invite_server_filter"
|
|
name="server"
|
|
class="w-full sm:w-56 bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary focus:border-primary p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:text-white"
|
|
hx-post="/invite/table"
|
|
hx-target="#invite_table"
|
|
hx-swap="outerHTML"
|
|
hx-include="#invite_server_filter">
|
|
<option value="">All Servers</option>
|
|
{% for s in servers %}<option value="{{ s.id }}">{{ s.name }} ({{ s.server_type }})</option>{% endfor %}
|
|
</select>
|
|
</div>
|
|
<div hx-post="/invite/table"
|
|
hx-trigger="load"
|
|
hx-target="#invite_table"
|
|
hx-swap="outerHTML settle:0ms"
|
|
hx-include="#invite_server_filter"
|
|
class="p-4 mb-6 overflow-x-auto">
|
|
<div id="invite_table"></div>
|
|
</div>
|
|
</div>
|
|
<!-- Invite Modal -->
|
|
<div id="invite-modal"></div>
|
|
</section>
|
|
<script>
|
|
// Modal functions
|
|
function openInviteModal() {
|
|
// Load invite form into the modal container
|
|
htmx.ajax('GET', '/invite', {
|
|
target: '#invite-modal',
|
|
swap: 'innerHTML'
|
|
});
|
|
}
|
|
|
|
function closeInviteModal() {
|
|
document.getElementById('invite-modal').innerHTML = '';
|
|
}
|
|
|
|
// Close modal on escape key
|
|
document.addEventListener('keydown', function(e) {
|
|
if (e.key === 'Escape') {
|
|
closeInviteModal();
|
|
}
|
|
});
|
|
|
|
function tableCopyLink(invite_code) {
|
|
var url = window.location.origin;
|
|
var icon = document.getElementById("icon_" + invite_code);
|
|
|
|
// Copy the invite link using the fallback-enabled function
|
|
copyToClipboard(url + "/j/" + invite_code, (success) => {
|
|
if (success) {
|
|
// Add class="text-green-500" to icon
|
|
icon.classList.add("text-green-500");
|
|
// wait for 1 second
|
|
setTimeout(function() {
|
|
// remove class="text-green-500" from icon
|
|
icon.classList.remove("text-green-500");
|
|
}, 1000);
|
|
} else {
|
|
// Fallback already shows alert, but we can add additional feedback here if needed
|
|
console.error("Copy failed for invite:", invite_code);
|
|
}
|
|
});
|
|
}
|
|
</script>
|