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

allowed view prev/next to remember settings (fname, faces, distance) and use new CreateSelect() for AI menu, also make fname toggle actually do that

Browse Source
This commit is contained in:
Damien De Paoli
2021-07-29 21:44:54 +10:00
parent 7926ab3455
commit c0a8ab8f79
1 changed files with 47 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
templates/viewer.html
View File

@@ -1,6 +1,7 @@
{% extends "base.html" %} {% block main_content %} {% extends "base.html" %} {% block main_content %}
{# make the form-switch / toggle info color set, give or take #} {# make the form-switch / toggle info color set, give or take #}
<style> <style>
.norm-txt { font-size: 1.0rem }
.form-check-input:checked { .form-check-input:checked {
background-color: #39C0ED; background-color: #39C0ED;
border-color: #CFF4FC; border-color: #CFF4FC;
@@ -126,7 +127,15 @@
<form id="prev" class="col col-auto" 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"> <input id="prev_fname" type="hidden" name="fname" value="">
<input id="prev_faces" type="hidden" name="faces" value="">
<input id="prev_distance" type="hidden" name="distance" value="">
<button class="btn btn-outline-info h-75" id="la"
onClick="
$('#prev_fname').val($('#fname').prop('checked'))
$('#prev_faces').val($('#faces').prop('checked'))
$('#prev_distance').val($('#distance').prop('checked'))
">
<svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('static', filename='upstream/icons.svg')}}#prev"/></svg> <svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('static', filename='upstream/icons.svg')}}#prev"/></svg>
</button> </button>
</form id="prev"> </form id="prev">
@@ -147,13 +156,19 @@
{% if face.refimg %} {% if face.refimg %}
data['who']='{{face.refimg.person.tag}}' data['who']='{{face.refimg.person.tag}}'
data['distance']="{{face.refimg_lnk.face_distance|round(2)}}" data['distance']="{{face.refimg_lnk.face_distance|round(2)}}"
data['model']="{{face.facefile_lnk.model_used}}"
{% endif %} {% endif %}
faces.push( data ) faces.push( data )
{% endfor %} {% endfor %}
var context = canvas.getContext('2d') var context = canvas.getContext('2d')
window.addEventListener('resize', DrawImg, false); window.addEventListener('resize', DrawImg, false);
</script> </script>
<figcaption class="figure-caption text-center text-wrap text-break">{{obj.name}}</figcaption> <figcaption class="figure-caption text-center text-wrap text-break"
{% if sels['fname']=='false' %}
style="display:none"
{% endif %}
>{{obj.name}}
</figcaption>
</figure> </figure>
{% elif obj.type.name == "Video" %} {% elif obj.type.name == "Video" %}
<video id="_v" controls> <video id="_v" controls>
@@ -172,7 +187,15 @@
<form id="next" class="col col-auto" 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="col col-auto btn btn-outline-info h-75" id="ra"> <input id="next_fname" type="hidden" name="fname" value="">
<input id="next_faces" type="hidden" name="faces" value="">
<input id="next_distance" type="hidden" name="distance" value="">
<button class="col col-auto btn btn-outline-info h-75" id="ra"
onClick="
$('#next_fname').val($('#fname').prop('checked'))
$('#next_faces').val($('#faces').prop('checked'))
$('#next_distance').val($('#distance').prop('checked'))
">
<svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('static', filename='upstream/icons.svg')}}#next"/></svg> <svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('static', filename='upstream/icons.svg')}}#next"/></svg>
</button> </button>
</form id="next"> </form id="next">
@@ -184,23 +207,31 @@
<div class="row"> <div class="row">
<span class="d-flex col-1 justify-content-end my-auto">Show:</span> <span class="d-flex col-1 justify-content-end my-auto">Show:</span>
<div class="d-flex form-check form-switch border border-info rounded col-1 my-auto py-1 justify-content-center"> <div class="d-flex form-check form-switch border border-info rounded col-1 my-auto py-1 justify-content-center">
<input class="form-check-input" type="checkbox" checked id="fname" onChange="$('.figure-caption').toggle()"> <input class="form-check-input" type="checkbox" id="fname" onChange="$('.figure-caption').toggle()"
{% if sels['fname']=='true' %} checked {% endif %} >
<label class="form-check-label" for="fname">Filename</label> <label class="form-check-label" for="fname">Filename</label>
</div> </div>
<div class="d-flex form-check form-switch border border-info rounded col-1 my-auto py-1 justify-content-center"> <div class="d-flex form-check form-switch border border-info rounded col-1 my-auto py-1 justify-content-center">
<input class="form-check-input" type="checkbox" onChange="FaceToggle()" id="faces"> <input class="form-check-input" type="checkbox" onChange="FaceToggle()" id="faces"
{% if not obj.file_details.faces %} disabled {% endif %}
{% if sels['faces']=='true' %} checked {% endif %}
>
<label class="form-check-label" for="faces">Faces</label> <label class="form-check-label" for="faces">Faces</label>
</div> </div>
<div class="d-flex form-check form-switch border border-info rounded col-1 my-auto py-1 justify-content-center"> <div class="d-flex form-check form-switch border border-info rounded col-1 my-auto py-1 justify-content-center">
<input class="form-check-input" type="checkbox" disabled onChange="DrawImg()" id="distance"> <input class="form-check-input" type="checkbox" onChange="DrawImg()" id="distance"
{% if not obj.file_details.faces or sels['faces']=='false' %} disabled {% endif %}
{% if sels['distance']=='true' %} checked {% endif %}
>
<label class="form-check-label" for="distance">Distance</label> <label class="form-check-label" for="distance">Distance</label>
</div> </div>
<span class="col col-auto my-auto py-1">AI Model:</span> <span class="col col-auto my-auto py-1">AI Model:</span>
<div class="col col-auto"> <div class="col col-auto">
<select id="model" class="form-select"> {% if not obj.file_details.faces %}
<option>hog</option> {{CreateSelect( "model", 0, ["N/A", "normal", "slow/accurate"], "", "rounded-end h-100 norm-txt", [0,1,2])|safe }}
<option>cnn</option> {% else %}
</select> {{CreateSelect( "model", obj.file_details.faces[0].facefile_lnk.model_used, ["normal", "slow/accurate"], "", "rounded-end h-100 norm-txt", [1,2])|safe }}
{% endif %}
</div> </div>
</div class="row"> </div class="row">
{% endblock main_content %} {% endblock main_content %}
@@ -217,9 +248,15 @@ $( document ).keydown(function(event) {
case "ArrowRight": case "ArrowRight":
$('#ra').click() $('#ra').click()
break; break;
case "d":
$('#distance').click()
break;
case "f": case "f":
$('#faces').click() $('#faces').click()
break; break;
case "n":
$('#fname').click()
break;
default: default:
return; // Quit when this doesn't handle the key event. return; // Quit when this doesn't handle the key event.
} }