ddp/photoassistant
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bootstrap 5 grid "fixups" for viewer

Browse Source
This commit is contained in:
Damien De Paoli
2021-07-20 22:04:52 +10:00
parent f52ba689b7
commit 6b6e7bc901
1 changed files with 18 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
templates/viewer.html
View File

@@ -85,11 +85,12 @@
function Toggle(id) function Toggle(id)
{ {
b=$('#'+id ) b=$('.'+id+'_label')
b.toggleClass('badge-info') b.toggleClass('text-success')
b.toggleClass('badge-outline-info')
b.toggleClass('text-white')
b.toggleClass('text-secondary') b.toggleClass('text-secondary')
b.toggleClass('border-success')
b.toggleClass('border-secondary')
b=$('#'+id )
if( b.attr('faces') == 1 ) if( b.attr('faces') == 1 )
b.attr('faces', 0 ) b.attr('faces', 0 )
else else
@@ -100,21 +101,17 @@
<div id="viewer" class="container-fluid"> <div id="viewer" class="container-fluid">
{% set max=eids.split(',')|length %} {% set max=eids.split(',')|length %}
<div id="bbar" class="form-row offset-lg-1 col">
<span id="faces" class="badge p-2 text-secondary" onClick="Toggle('faces')" style="border: 1px solid #5bc0de" faces=0><i class="fas fa-brain fa-2x"></i></button>
</div>
<center>
<input type="hidden" name="eids" value={{eids}}> <input type="hidden" name="eids" value={{eids}}>
<div class="form-row col-lg-12"> <div class="row">
{% if eids.find(obj.id|string) > 0 %} {% if eids.find(obj.id|string) > 0 %}
<form id="prev" class="form form-inline" action="/viewprev" method="POST"> <form id="prev" class="col col-auto" action="/viewprev" method="POST">
<input type="hidden" name="current" value="{{obj.id}}"> <input type="hidden" name="current" value="{{obj.id}}">
<input type="hidden" name="eids" value="{{eids}}"> <input type="hidden" name="eids" value="{{eids}}">
<button class="btn btn-outline-info h-75" id="la"><i class="fas fa-angle-double-left"></i></button> <button class="btn btn-outline-info h-75" id="la"><i class="fas fa-angle-double-left"></i></button>
</form id="prev"> </form id="prev">
{% endif %} {% endif %}
{% if obj.type.name == "Image" %} {% if obj.type.name == "Image" %}
<figure style="border: 1px solid #5bc0de; border-radius: 3px;"> <figure class="col col-auto border border-info rounded m-0 p-1" id="figure">
<canvas id="canvas"></canvas> <canvas id="canvas"></canvas>
<script> <script>
var im=new Image(); var im=new Image();
@@ -150,16 +147,20 @@
{% for eid in eids.split(',') %} {% for eid in eids.split(',') %}
{% if loop.index == max-1 %} {% if loop.index == max-1 %}
{% if eid|int != obj.id %} {% if eid|int != obj.id %}
<form id="next" class="form form-inline" action="/viewnext" method="POST"> <form id="next" class="col col-auto" action="/viewnext" method="POST">
<input type="hidden" name="current" value="{{obj.id}}"> <input type="hidden" name="current" value="{{obj.id}}">
<input type="hidden" name="eids" value="{{eids}}"> <input type="hidden" name="eids" value="{{eids}}">
<button class="btn btn-outline-info h-75" id="ra"><i class="fas fa-angle-double-right"></i></button> <button class="col col-auto btn btn-outline-info h-75" id="ra"><i class="fas fa-angle-double-right"></i></button>
</form id="next"> </form id="next">
{% endif %} {% endif %}
{% endif %} {% endif %}
{% endfor %} {% endfor %}
</div id="/form-row"> </div id="/form-row">
</center> <div id="bbar" class="row">
<div id="faces" faces=0 class="faces_label col col-auto border border-secondary rounded p-1 ms-5 mt-1" onClick="Toggle('faces')">
<span class="faces_label text-secondary"><i class="fas fa-brain"></i><label class="sm-txt faces_label text-secondary">&nbsp;faces</label></span>
</div>
</div>
</div class="container"> </div class="container">
{% endblock main_content %} {% endblock main_content %}
{% block script_content %} {% block script_content %}
@@ -175,6 +176,9 @@ $( document ).keydown(function(event) {
case "ArrowRight": case "ArrowRight":
$('#ra').click() $('#ra').click()
break; break;
case "f":
Toggle('faces')
break;
default: default:
return; // Quit when this doesn't handle the key event. return; // Quit when this doesn't handle the key event.
} }