technicie/MarietjeDjango
1
0
Fork 0
mirror of https://gitlab.science.ru.nl/technicie/MarietjeDjango.git synced 2025-12-10 12:42:21 +01:00
Code Issues Packages Projects Releases Wiki Activity

Updated interface

Browse Source 
- added a bar on the top which shows some info
- moved mod buttons to the bar
- added some information about your queue to the bar
- merged the table for current song and full queue
- some more small fixes
This commit is contained in:
Olaf Slomp
2019-03-28 18:54:46 +01:00
committed by Gerdriaan Mulder
parent 568f7c6a50
commit d0c82f33df
5 changed files with 190 additions and 146 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
marietje/queues/templates/queues/queue.html
View File

@ -4,9 +4,47 @@
{% block title %}Queue{% endblock %}
{% block content %}
<h1 class="h1">Request</h1>
<button id="request-button" class="btn btn-primary">Request</button>
<nav class="navbar navbar-default navbar-fixed-top" style="top: 50px; border-top: 1px solid #bbbbbb; max-height: 50px; box-shadow: 2px 2px 4px #BBBBBB;">
<div class="container-fluid">
<ul class="navbar-nav" style="max-height: 50px; margin: 0;">
<li class="btn-toolbar nav navbar-nav" style="margin: 0;">
<button id="request-button" class="btn navbar-btn btn-primary">
Request
</button>
<div id="infobar-buttons" class="btn-group">
{% if perms.queues.can_control_volume %}
<button type="button" id="mute" class="btn navbar-btn btn-sm block-button">
<span id="mute-button-span" class="glyphicon glyphicon-volume-off"></span>
</button>
<button type="button" id="volume_down" class="btn navbar-btn btn-sm block-button">
<span id="voldown-button-span" class="glyphicon glyphicon-volume-down"></span>
</button>
<button type="button" id="volume_up" class="btn navbar-btn btn-sm block-button">
<span id="volup-button-span" class="glyphicon glyphicon-volume-up"></span>
</button>
{% endif %}
<button type="button" id="skip" class="btn navbar-btn btn-sm block-button">
<span id="skip-button-span" class="glyphicon glyphicon-fast-forward"></span>
</button>
</div>
</li>
</ul>
<ul class="nav navbar-nav navbar-right hidden-xs">
<li>
<div class="infobar">
<p class="navbar-text start-queue"></p>
<p class="navbar-text end-queue"></p>
<p class="navbar-text duration-queue"></p>
</div>
</li>
</ul>
</div>
</nav>
<br><br>
<div class="alert-location">
</div>
<div id="request-container" class="hidden">
<table id="request-table" class="table table-striped">
<thead>
@ -19,7 +57,7 @@
</tr>
<tr>
<th colspan="2"><input id="search-all" class="search-input" type="text"></th>
<th><input id="search-uploader" class="search-input" type="text"></th>
<th colspan="3"><input id="search-uploader" class="search-input" type="text"></th>
</tr>
</thead>
<tfoot>
@ -39,49 +77,28 @@
</select>
<select class="pagenum input-mini" title="Select page number"></select>
</th>
<th colspan="2"></th>
</tr>
</tfoot>
<tbody>
</tbody>
</table>
</div>
<div id="queue-container">
<h1 class="h1">
Now Playing{% if perms.queues.can_control_volume %}
<a id="mute" class="glyphicon glyphicon-volume-off" href="#"></a>{% endif %}
</h1>
<table class="table table-striped">
<thead>
<tr>
<th class="col-md-4">Artist</th>
<th class="col-md-4">Title</th>
<th class="col-md-2 hidden-xs">Requested By</th>
<th class="col-md-1 hidden-xs" style="text-align: right;">Time Left</th>
<th class="col-md-1 control-icons">Control</th>
<tr class="table-header-style">
<td class="col-md-4">Artist</td>
<td class="col-md-4">Title</td>
<td class="col-md-2 hidden-xs">Requested By</td>
<td id="timeswitch" class="col-md-1 hidden-xs text-info" >Plays In</td>
<td class="col-md-1 control-icons">Control</td>
</tr>
</thead>
<tbody>
<tr class="currentsong">
<tr class="currentsong" style="font-weight: bold">
<td class="artist"></td>
<td class="title"></td>
<td class="requested-by hidden-xs"></td>
<td class="time-left hidden-xs" style="text-align: right;"></td>
<td>
<a id="skip" href="#"></a>{% if perms.queues.can_control_volume %}&nbsp;&nbsp;&nbsp;&nbsp;<a id="volume-down" class="glyphicon glyphicon-volume-down" href="#"></a>&nbsp;&nbsp;&nbsp;&nbsp;<a id="volume-up" class="glyphicon glyphicon-volume-up" href="#"></a>{% endif %}
</td>
</tr>
</tbody>
</table>
<h1 class="h1">Queue</h1>
<table class="table table-striped">
<thead>
<tr>
<th class="col-md-4">Artist</th>
<th class="col-md-4">Title</th>
<th class="col-md-2 hidden-xs">Requested By</th>
<th id="queue-time-header" class="col-md-1 hidden-xs" style="text-align: right;">Plays At</th>
<th class="col-md-1 control-icons">Control</th>
<td colspan="2"></td>
</tr>
</thead>
<tbody class="queuebody">