aryma/artemis
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

HUGE WebUI overhaul

Browse Source 
- Removed ugly styles in header
- Properly implemented Bootstrap's NavBar
- Added username to session
This commit is contained in:
Dniel97
2023-09-09 00:36:22 +02:00
parent 08927db100
commit c51103aaf5
11 changed files with 380 additions and 257 deletions
Download Patch File Download Diff File Expand all files Collapse all files

153
core/frontend/user/index.jinja
View File

@@ -1,41 +1,126 @@
{% extends "core/frontend/index.jinja" %}
{% block content %}
<h1>Management for {{ username }}</h1>
<h2>Cards <button class="btn btn-success" data-bs-toggle="modal" data-bs-target="#card_add">Add</button></h2>
<ul style="font-size: 20px;">
{% for c in cards %}
<li>{{ c.access_code }}: {{ c.status }}&nbsp;{% if c.status == 'Active'%}<button class="btn-warning btn">Lock</button>{% elif c.status == 'Locked' %}<button class="btn-warning btn">Unlock</button>{% endif %}&nbsp;<button class="btn-danger btn">Delete</button></li>
{% endfor %}
</ul>
<h1>{{ sesh["username"] }}'s Account</h1>
{% if arcades is defined %}
<h2>Arcades</h2>
<ul style="font-size: 20px;">
{% for a in arcades %}
<li><a href=/arcade/{{ a.id }}>{{ a.name }}</a></li>
{% endfor %}
</ul>
{% endif %}
<div class="modal fade" id="card_add" tabindex="-1" aria-labelledby="card_add_label" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="card_add_label">Add Card</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
HOW TO:<br>
Scan your card on any networked game and press the "View Access Code" button (varies by game) and enter the 20 digit code below.<br>
!!FOR AMUSEIC CARDS: DO NOT ENTER THE CODE SHOWN ON THE BACK OF THE CARD ITSELF OR IT WILL NOT WORK!!
<p /><label for="card_add_frm_access_code">Access Code:&nbsp;</label><input id="card_add_frm_access_code" maxlength="20" type="text" required>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary">Add</button>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
<div class="card mb-3">
<div class="card-body">
<h3 class="card-title">Cards</h3>
<!--<h4 class="card-subtitle mb-2 text-body-secondary">Card subtitle</h4>-->
<p class="card-text">All aime cards are listed here for the given user.</p>
<a href="#" data-bs-toggle="modal" data-bs-target="#card-add" class="btn btn-primary mb-3">Add Card</a>
{% if cards is defined and cards|length > 0 %}
<div class="container">
<div class="row">
<div class="col-12">
<table class="table table-hover">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Access Code</th>
<th scope="col">Status</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
{% for c in cards %}
<tr class="align-middle">
<th scope="row">{{ c.index }}</th>
<td>{{ c.access_code }}</td>
<td>
{% if c.status == 'Active'%}
<span class="badge rounded-pill text-bg-success">Active</span>
{% elif c.status == 'Locked' %}
<span class="badge rounded-pill text-bg-warning">Locked</span>
{% endif %}
</td>
<td>
{% if c.status == 'Active'%}
<button type="button" class="btn btn-warning btn-sm">Lock</i></button>
{% elif c.status == 'Locked' %}
<button type="button" class="btn btn-success btn-sm">Unlock</i></button>
{% endif %}
<button type="button" class="btn btn-danger btn-sm">Delete</i></button>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
{% else %}
<div class="alert alert-warning" role="alert">
You have no cards registered to your account. Please add one.
</div>
{% endif %}
<!--<a href="#" data-bs-toggle="modal" data-bs-target="#card-add" class="card-link">Add Card</a>-->
</div>
</div>
<div class="card">
<div class="card-body">
<h3 class="card-title">Arcades</h3>
<!--<h4 class="card-subtitle mb-2 text-body-secondary">Card subtitle</h4>-->
<p class="card-text">All arcades connected to the given account are listed here.</p>
{% if arcades is defined and arcades|length > 0 %}
<div class="container">
<div class="row">
<div class="col-12">
<table class="table table-hover">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Name</th>
</tr>
</thead>
<tbody>
{% for a in arcades %}
<tr class="align-middle clickable-row" data-href=/arcade/{{ a.id }}>
<th scope="row">{{ a.index }}</th>
<td>{{ a.name }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
{% else %}
<div class="alert alert-info" role="alert">
You have no arcades connected to your account.
</div>
{% endif %}
</div>
</div>
<div class="modal fade" id="card-add" tabindex="-1" aria-labelledby="card-add-label" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="card-add-label">Add Card</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<h3 class="fs-5">How to:</h3>
Scan your card on any networked game and press the "View Access Code" button (varies by game) and enter
the 20
digit code below.
<hr>
FOR AMUSE IC CARDS: DO NOT ENTER THE CODE SHOWN ON THE BACK OF THE CARD ITSELF OR IT WILL NOT WORK!
<form>
<div class="form-floating mt-3">
<label for="access-code" class="col-form-label">Access Code</label>
<input maxlength="20" type="text" required pattern="[0-9]{20}" class="form-control"
id="access-code">
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Add</button>
</div>
</div>
</div>
</div>
</div>
{% endblock content %}