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

now have functional add/remove manual override to existing person

Browse Source
This commit is contained in:
Damien De Paoli
2022-06-11 22:41:31 +10:00
parent 8c78d9e633
commit a53d4896b0
6 changed files with 175 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

137
internal/js/view_support.js
View File

@@ -26,6 +26,32 @@ function NewHeight()
return im.height*gap / (im.width/window.innerWidth)
}
function DrawLabelOnFace(str)
{
// finish face box, need to clear out new settings for // transparent backed-name tag
context.stroke();
context.beginPath()
context.lineWidth = 0.1
context.font = "30px Arial"
context.globalAlpha = 0.6
bbox = context.measureText(str);
f_h=bbox.fontBoundingBoxAscent
if( bbox.fontBoundingBoxDescent )
f_h += bbox.fontBoundingBoxDescent
f_h -= 8
context.rect( x+w/2-bbox.width/2, y-f_h, bbox.width, f_h )
context.fillStyle="white"
context.fill()
context.stroke();
context.beginPath()
context.globalAlpha = 1.0
context.font = "30px Arial"
context.textAlign = "center"
context.fillStyle = context.strokeStyle
context.fillText(str, x+w/2, y-2)
}
// This draws the image, it can be called on resize events, img.src finishing
// loading or explicitly on page load. Will also deal with all state/toggles
// for items like name, grayscale, etc.
@@ -87,46 +113,23 @@ function DrawImg()
context.beginPath()
context.rect( x, y, w, h )
context.lineWidth = 2
context.strokeStyle = 'green'
// this face has an override so diff colour
if( objs[current].faces[i].override )
context.strokeStyle = 'blue'
else
context.strokeStyle = 'green'
if( objs[current].faces[i].no_match_override)
DrawLabelOnFace( objs[current].faces[i].no_match_override.type )
if( objs[current].faces[i].who )
{
// finish face box, need to clear out new settings for
// transparent backed-name tag
context.stroke();
context.beginPath()
context.lineWidth = 0.1
context.font = "30px Arial"
context.globalAlpha = 0.6
str=objs[current].faces[i].who
{
str=objs[current].faces[i].who
if( $('#distance').prop('checked') )
str += "("+objs[current].faces[i].distance+")"
bbox = context.measureText(str);
f_h=bbox.fontBoundingBoxAscent
if( bbox.fontBoundingBoxDescent )
f_h += bbox.fontBoundingBoxDescent
f_h -= 8
context.rect( x+w/2-bbox.width/2, y-f_h, bbox.width, f_h )
context.fillStyle="white"
context.fill()
context.stroke();
context.beginPath()
context.globalAlpha = 1.0
context.font = "30px Arial"
context.textAlign = "center"
context.fillStyle = "green"
context.fillText(str, x+w/2, y-2)
}
/* can use to show lower left coords of a face for debugging
else
{
context.font = "14px Arial"
context.textAlign = "center"
context.fillStyle = "black"
context.fillText( 'x=' + objs[current].faces[i].x + ', y=' + objs[current].faces[i].y, x+w/2, y-2)
context.fillText( 'x=' + objs[current].faces[i].x + ', y=' + objs[current].faces[i].y, x+w/2, y-2)
}
*/
DrawLabelOnFace( str )
}
context.stroke();
}
}
@@ -225,7 +228,11 @@ $(document).ready( function()
if( x >= fx && x <= fx+fw && y >= fy && y <= fy+fh )
{
if( objs[current].faces[i].who )
if( objs[current].faces[i].override )
{
item_list['remove_override']={ 'name': 'Remove override for this face', 'which_face': i, 'id': objs[current].faces[i].id }
}
else if( objs[current].faces[i].who )
{
item_list['match']={ 'name': objs[current].faces[i].who, 'which_face': i, 'id': objs[current].faces[i].id }
item_list['wrong_person']={ 'name': 'wrong person', 'which_face': i, 'id': objs[current].faces[i].id }
@@ -238,7 +245,6 @@ $(document).ready( function()
item_list['no_match_no_face']={ 'name': 'Mark as not a face', 'which_face': i, 'id': objs[current].faces[i].id }
item_list['no_match_too_young']={ 'name': 'Mark as face too young', 'which_face': i, 'id': objs[current].faces[i].id }
item_list['no_match_ignore']={ 'name': 'Ignore this face', 'which_face': i, 'id': objs[current].faces[i].id }
item_list['remove_override']={ 'name': 'Remove override for this face', 'which_face': i, 'id': objs[current].faces[i].id }
}
delete item_list['not_a_face']
$('#canvas').prop('menu_item', item_list )
@@ -258,14 +264,19 @@ $(document).ready( function()
} );
// quick wrapper function to make calling this ajax code simpler in SearchForPerson
function OverrideForceMatch( person, face )
function OverrideForceMatch( person_id, face_id, face_pos )
{
ofm='&person_id='+person+'&face_id='+face
ofm='&person_id='+person_id+'&face_id='+face_id
// on success, close the dbox, force face drawing on and redraw the face with the new override
$.ajax({ type: 'POST', data: ofm, url: '/override_force_match', success: function(data) {
$('#dbox').modal('hide');
$('#faces').prop('checked',true);
DrawImg();
if( objs[current].faces[face_pos].who )
objs[current].faces[face_pos].old_who=objs[current].faces[face_pos].who
objs[current].faces[face_pos].who=data.person_tag
objs[current].faces[face_pos].override=1
$('#dbox').modal('hide')
$('#faces').prop('checked',true)
DrawImg()
}
} )
}
@@ -273,7 +284,7 @@ function OverrideForceMatch( person, face )
// function to facilitate adding a face match override to this "found" person
// uses Ajax to the f/e to get any person matching #stext's content (via any name/tag)
// and displays results in #search_person_results
function SearchForPerson(face_id)
function SearchForPerson(face_id, face_pos)
{
// make URI safe
who = encodeURIComponent( $('#stext').val() )
@@ -283,7 +294,8 @@ function SearchForPerson(face_id)
content='Click one of the link(s) below to manually connect this face as once-off connection to the person:<br><br>'
for( var key in data ) {
var person = data[key];
content+= '<a onClick="OverrideForceMatch('+person.id+','+face_id+')">'+person.firstname+' '+person.surname+'('+person.tag+')</a><br>'
content+= '<a class="link-primary" onClick="OverrideForceMatch('+person.id+','
+face_id+','+face_pos+')">'+person.firstname+' '+person.surname+' ('+person.tag+')</a><br>'
}
$('#search_person_results').html( content )
}
@@ -291,14 +303,34 @@ function SearchForPerson(face_id)
return false
}
function RemoveOverride()
{
d='&face_id='+objs[current].faces[face_pos].id+'&person_tag='+objs[current].faces[face_pos].who+
'&file_eid='+current
$.ajax({ type: 'POST', data: d, url: '/remove_override',
success: function(data) {
if( objs[current].faces[face_pos].old_who )
objs[current].faces[face_pos].who=objs[current].faces[face_pos].old_who
else
delete objs[current].faces[face_pos].who
delete objs[current].faces[face_pos].override
$('#dbox').modal('hide')
DrawImg()
return false
}
} )
return false
}
// function that is called when we click on a face in the viewer and we want to
// potentially override the non-match / match... it shows the face, and then
// based on which menu item got us here, shows appropriate text to do next action
function FaceDBox(key, item)
{
face_pos=item[key]['which_face']
div ='<p>'
div+='Face position #' + item[key]['which_face']
div+='Face position #' + face_pos
div+='<div id="face_img"></div>'
$.ajax({ type: 'POST', data: null, url: '/get_face_from_image/'+item[key]['id'],
success: function(img_data) {
@@ -306,6 +338,15 @@ function FaceDBox(key, item)
}
} )
div+='</p>'
if ( key == 'remove_override' )
{
div+='<div class="row col-12">remove this override (force match to: ' + objs[current].faces[face_pos].who + ')'
div+='<div class="row">'
div+='<button class="btn btn-outline-info col-6" type="button" onClick="$(\'#dbox\').modal(\'hide\'); return false">Cancel</button>'
div+='<button class="btn btn-outline-danger col-6" type="button" '+
'onClick="RemoveOverride(' +face_pos+ ')">Remove</button>'
div+='</div>'
}
if ( key == 'no_match_new_person' )
{
div+='<br>create new person'
@@ -317,7 +358,7 @@ function FaceDBox(key, item)
`
<div class="input-group mb-3"><input type="text" class="form-control" id="stext" placeholder="tag/name">
<button class="btn btn-outline-success" type="button" onClick="SearchForPerson(`
div+= item[key]['id']
div+= item[key]['id'] + ',' + face_pos
div+=`)">Search</button>
</div>
<div id="search_person_results">