Skip to content
Commits on Source (2)
Hide whitespace changes
Inline Side-by-side
views/images/__init__.py
View file @ 582fd0b6
......@@ -315,6 +315,9 @@ def do_image_tenprint_segmentation( tenprint_id ):
data = ( tenprint_id, )
zones = config.db.query_fetchall( sql, data )
sql = "DELETE FROM files_segments WHERE tenprint = %s"
config.db.query( sql, ( tenprint_id, ) )
for z in zones:
current_app.logger.debug( "Segmenting fpc '{}'".format( z[ "fpc" ] ) )
......@@ -329,22 +332,11 @@ def do_image_tenprint_segmentation( tenprint_id ):
file_data = base64.b64encode( file_data )
file_data = do_encrypt_dek( file_data, submission_id )
sql = "SELECT id FROM files_segments WHERE tenprint = %s AND pc = %s"
q = config.db.query_fetchone( sql, ( tenprint_id, z[ "fpc" ], ) )
if q == None:
current_app.logger.debug( "Inserting to the database" )
sql = utils.sql.sql_insert_generate( "files_segments", [ "tenprint", "uuid", "pc", "data" ] )
data = ( tenprint_id, str( uuid4() ), z[ "fpc" ], file_data )
config.db.query( sql, data )
current_app.logger.debug( "Inserting to the database" )
sql = utils.sql.sql_insert_generate( "files_segments", [ "tenprint", "uuid", "pc", "data" ] )
data = ( tenprint_id, str( uuid4() ), z[ "fpc" ], file_data )
config.db.query( sql, data )
else:
current_app.logger.debug( "Updating the database" )
sql = "UPDATE files_segments SET data = %s WHERE tenprint = %s AND pc = %s"
data = ( file_data, tenprint_id, z[ "fpc" ] )
config.db.query( sql, data )
config.db.commit()
return True
views/submission/__init__.py
View file @ 582fd0b6
......@@ -1506,12 +1506,11 @@ def admin_tenprint( submission_id, tenprint_id ):
files.uuid,
files.format, files.resolution, files.width, files.height, files.size,
files.creation_time, files.type,
file_template.template, files.quality,
files.quality,
users.username
FROM files
LEFT JOIN submissions ON files.folder = submissions.id
LEFT JOIN users ON submissions.donor_id = users.id
LEFT JOIN file_template ON files.uuid = file_template.file
WHERE
submissions.uuid = %s AND
files.uuid = %s
......@@ -1564,8 +1563,26 @@ def admin_tenprint( submission_id, tenprint_id ):
############################################################################
zones = get_tenprint_template_zones( tenprint_file[ "template" ], side )
datacolumns = [ "tl_x", "tl_y", "br_x", "br_y", "angle" ]
sql = "SELECT width, height, resolution FROM files WHERE uuid = %s LIMIT 1"
img_info = config.db.query_fetchone( sql, ( tenprint_id, ) )
svg_hw_factor = float( img_info[ "width" ] ) / float( img_info[ "height" ] )
############################################################################
sql = "SELECT * FROM segments_locations WHERE tenprint_id = %s ORDER BY fpc ASC"
zones_raw = config.db.query_fetchall( sql, ( tenprint_id, ) )
zones = []
for z in zones_raw:
tmp = {}
tmp[ "fpc" ] = z[ "fpc" ]
for k in [ "x", "width" ]:
tmp[ k ] = z[ k ] / img_info[ "width" ]
for k in [ "y", "height" ]:
tmp[ k ] = z[ k ] / img_info[ "height" ]
zones.append( tmp )
############################################################################
......@@ -1581,7 +1598,6 @@ def admin_tenprint( submission_id, tenprint_id ):
img_info = img_info,
svg_hw_factor = svg_hw_factor,
zones = zones,
datacolumns = datacolumns,
tenprint_templates = tenprint_templates,
quality_type = quality_type
)
......
views/submission/templates/admin/tenprint.html
View file @ 582fd0b6
......@@ -28,43 +28,20 @@
var zones_array = new Array();
{% for zone in zones %}
zones_array.push( {{ zone[ 'pc' ] }} );
{% endfor %}
var data_columns = new Array();
{% for d in datacolumns %}
data_columns.push( "{{ d }}" );
zones_array.push( {{ zone[ 'fpc' ] }} );
{% endfor %}
var zonesData = {};
{% for zone in zones %}
zonesData[ "{{ zone[ 'pc' ] }}" ] = {
"tl_x": {{ zone[ 'tl_x' ] }},
"tl_y": {{ zone[ 'tl_y' ] }},
"br_x": {{ zone[ 'br_x' ] }},
"br_y": {{ zone[ 'br_y' ] }},
"angle": {{ zone[ 'angle' ] }}
zonesData[ "{{ zone[ 'fpc' ] }}" ] = {
"fpc": {{ zone[ 'fpc' ] }},
"x": {{ zone[ 'x' ] }},
"y": {{ zone[ 'y' ] }},
"width": {{ zone[ 'width' ] }},
"height": {{ zone[ 'height' ] }}
};
{% endfor %}
var update_template_db = function()
{
var template = $( "#file_{{ file[ 'uuid' ] }}_template > select > option:checked" ).val();
$.ajax( {
url: "{{ url_for( 'submission.submission_tenprint_set_template', submission_id = submission_id, tenprint_id = file[ 'uuid' ] ) }}",
dataType: "json",
method: "POST",
data: {
template: template
},
success: function( data )
{
location.reload();
}
} );
}
var update_quality_db = function()
{
var quality = $( "#file_{{ file[ 'uuid' ] }}_quality > select > option:checked" ).val();
......@@ -88,6 +65,7 @@
} );
}
var update_coordinates_informations = function()
{
svg_height = $( window ).height() - 100;
......@@ -139,14 +117,6 @@
.css( "width", svg_width * 2 )
.css( "height", svg_height );
$( "#line_right_border" ).attr( "x1", card_img_info[ "right" ] );
$( "#line_right_border" ).attr( "x2", card_img_info[ "right" ] );
$( "#line_right_border" ).attr( "y2", svg_height );
$( "#line_bottom_border" ).attr( "x2", svg_width );
$( "#line_bottom_border" ).attr( "y1", card_img_info[ "bottom" ] );
$( "#line_bottom_border" ).attr( "y2", card_img_info[ "bottom" ] );
$( "#zoomed_image" ).attr( "width", svg_width );
$( "#zoomed_image" ).attr( "height", svg_height );
......@@ -154,78 +124,16 @@
for( var i = 0; i < zones_array.length; i++ )
{
var pc = zones_array[ i ];
var fpc = zones_array[ i ];
var zone = zonesData[ fpc ];
var $svg = $( "#tp_polygones" );
var x = zone[ "x" ] * svg_width;
var y = zone[ "y" ] * svg_height;
var height = zone[ "height" ] * svg_height;
var width = zone[ "width" ] * svg_width;
var a = zonesData[ pc ][ "tl_x" ] * dpc + "," + zonesData[ pc ][ "tl_y" ] * dpc;
var b = zonesData[ pc ][ "br_x" ] * dpc + "," + zonesData[ pc ][ "tl_y" ] * dpc;
var c = zonesData[ pc ][ "br_x" ] * dpc + "," + zonesData[ pc ][ "br_y" ] * dpc;
var d = zonesData[ pc ][ "tl_x" ] * dpc + "," + zonesData[ pc ][ "br_y" ] * dpc;
var p = a + " " + b + " " + c + " " + d;
if( ! p.includes( "NaN" ) )
{
$( SVG( "polygon" ) )
.attr( "id", "pc_" + pc )
.attr( "points", p )
.attr( "fill", "rgb( 255, 0, 0 )" )
.attr( "fill-opacity", "0.1" )
.attr( "stroke", "red" )
.attr( "stroke-width", "1" )
.appendTo( $svg );
}
if( zonesData[ pc ][ "angle" ] == 0 )
{
$( SVG( "line" ) )
.attr( "id", "pc_" + pc + "_angle" )
.attr( "x1", zonesData[ pc ][ "tl_x" ] * dpc )
.attr( "y1", zonesData[ pc ][ "tl_y" ] * dpc + 20 )
.attr( "x2", zonesData[ pc ][ "br_x" ] * dpc )
.attr( "y2", zonesData[ pc ][ "tl_y" ] * dpc + 20 )
.attr( "stroke", "red" )
.attr( "stroke-width", "2" )
.attr( "stroke-opacity", "0.3" )
.appendTo( $svg );
} else if ( zonesData[ pc ][ "angle" ] == 90 ) {
$( SVG( "line" ) )
.attr( "id", "pc_" + pc + "_angle" )
.attr( "x1", zonesData[ pc ][ "br_x" ] * dpc - 20 )
.attr( "y1", zonesData[ pc ][ "tl_y" ] * dpc )
.attr( "x2", zonesData[ pc ][ "br_x" ] * dpc - 20 )
.attr( "y2", zonesData[ pc ][ "br_y" ] * dpc )
.attr( "stroke", "red" )
.attr( "stroke-width", "2" )
.attr( "stroke-opacity", "0.3" )
.appendTo( $svg );
} else if ( zonesData[ pc ][ "angle" ] == 180 ) {
$( SVG( "line" ) )
.attr( "id", "pc_" + pc + "_angle" )
.attr( "x1", zonesData[ pc ][ "br_x" ] * dpc )
.attr( "y1", zonesData[ pc ][ "br_y" ] * dpc - 20 )
.attr( "x2", zonesData[ pc ][ "tl_x" ] * dpc )
.attr( "y2", zonesData[ pc ][ "br_y" ] * dpc - 20 )
.attr( "stroke", "red" )
.attr( "stroke-width", "2" )
.attr( "stroke-opacity", "0.3" )
.appendTo( $svg );
} else if ( zonesData[ pc ][ "angle" ] == 270 ) {
$( SVG( "line" ) )
.attr( "id", "pc_" + pc + "_angle" )
.attr( "x1", zonesData[ pc ][ "tl_x" ] * dpc + 20 )
.attr( "y1", zonesData[ pc ][ "tl_y" ] * dpc )
.attr( "x2", zonesData[ pc ][ "tl_x" ] * dpc + 20 )
.attr( "y2", zonesData[ pc ][ "br_y" ] * dpc )
.attr( "stroke", "red" )
.attr( "stroke-width", "2" )
.attr( "stroke-opacity", "0.3" )
.appendTo( $svg );
}
$( "#tp_polygones" )
.append( segment_svg( fpc, x, y, height, width ) );
}
}
......@@ -265,6 +173,400 @@
}
} );
}
var update_zone_db = function( fpc, x, y, height, width )
{
var img = $( "#template_svg > image" );
$.ajax( {
url: "{{ url_for( 'submission.submission_segment_setcoordinates', submission_id = submission_id, tenprint_id = file[ 'uuid' ] ) }}",
dataType: "json",
method: "POST",
data: {
fpc: fpc,
x: x,
y: y,
w: width,
h: height,
img_height: img.height(),
img_width: img.width()
},
success: function( data )
{
},
error: function( data )
{
toastr.error( "Segment data not saved", "Network error" );
}
} );
}
var delete_zone_db = function()
{
$.ajax( {
url: "{{ url_for( 'submission.submission_segment_deletecoordinates', submission_id = submission_id, tenprint_id = file[ 'uuid' ] ) }}",
dataType: "json",
success: function( data )
{
current_fpc = 1;
$( "#tp_polygones > g" ).remove();
},
error: function( data )
{
toastr.error( "Segment data not deleted", "Network error" );
}
} );
}
var start_click_pos = null;
var current_action = null;
var tmp_rect = null;
var move_text = null;
var svg_mouse_on = false;
var current_fpc = zones_array.length + 1;
var svg_mouseenter = function( event )
{
svg_mouse_on = true;
}
var svg_mouseleave = function( event )
{
svg_mouse_on = false;
move_text = null;
$( "#move_text" )
.attr( "x", 0 )
.attr( "y", 0 )
.text( "" )
}
var start_action = function( event )
{
event.preventDefault();
start_click_pos = {
x: event.offsetX,
y: event.offsetY
}
switch( event.target.nodeName )
{
case "image":
start_add_segment( event );
break;
case "polygon":
case "rect":
if( event.button == 0 )
{
if( dist_to_br_corner( event ) < 30 )
start_resize_segment( event );
else
start_move_segment( event );
} else {
$( event.target ).parent().remove();
}
break;
default:
console.log( "no action" );
break;
}
return false;
}
var end_action = function( event )
{
event.preventDefault();
start_click_pos = null;
switch( current_action )
{
case "add_segment":
end_add_segment( event );
break;
case "move_segment":
end_move_segment( event );
break;
case "resize_segment":
end_resize_segment( event );
break;
default:
console.log( "no action" );
break;
}
return false;
}
var move_action = function( event )
{
switch( current_action )
{
case "move_segment":
move_move_segment( event );
break;
case "add_segment":
move_add_segment( event );
break;
case "resize_segment":
move_resize_segment( event );
break;
case null:
move_hover_rect( event );
break;
default:
break;
}
}
var click_and_drag_value = {
startx: 0,
starty: 0,
endx: 0,
endy: 0
};
var start_add_segment = function( event )
{
current_action = "add_segment";
click_and_drag_value = {
startx: 0,
starty: 0,
endx: 0,
endy: 0
};
click_and_drag_value.startx = event.offsetX;
click_and_drag_value.starty = event.offsetY;
$( SVG( "rect" ) )
.attr( "id", "tmp_rect" )
.attr( "x", click_and_drag_value.startx )
.attr( "y", click_and_drag_value.starty )
.attr( "height", 0 )
.attr( "width", 0 )
.attr( "fill", "rgb( 255, 0, 0 )" )
.attr( "fill-opacity", "0.1" )
.attr( "stroke", "red" )
.attr( "stroke-width", "1" )
.appendTo( $( "#tp_polygones" ) );
}
var move_add_segment = function( evnet )
{
diff_x = event.offsetX - start_click_pos.x;
diff_y = event.offsetY - start_click_pos.y;
var a = Math.min( event.offsetX, start_click_pos.x );
var b = Math.min( event.offsetY, start_click_pos.y );
$( "#tmp_rect" )
.attr( "x", a )
.attr( "y", b )
.attr( "width", Math.abs( diff_x ) )
.attr( "height", Math.abs( diff_y ) )
}
var end_add_segment = function( event )
{
click_and_drag_value.endx = event.offsetX;
click_and_drag_value.endy = event.offsetY;
var x = Math.min( click_and_drag_value.startx, click_and_drag_value.endx );
var y = Math.min( click_and_drag_value.starty, click_and_drag_value.endy );
var width = click_and_drag_value.endx - click_and_drag_value.startx;
var height = click_and_drag_value.endy - click_and_drag_value.starty;
height = Math.abs( height );
width = Math.abs( width );
$( "#tmp_rect" ).remove();
if( height > 10 && width > 10 )
{
$( "#tp_polygones" )
.append( segment_svg( current_fpc, x, y, height, width ) );
update_zone_db( current_fpc, x, y, height, width );
current_fpc += 1;
}
click_and_drag_value = {
startx: 0,
starty: 0,
endx: 0,
endy: 0
};
current_action = null;
}
var move_target = null;
var move_target_initial_pos = {};
var start_move_segment = function( event )
{
current_action = "move_segment";
move_target = event.target;
move_target_initial_pos = {
x: parseFloat( $( move_target ).attr( "x" ) ),
y: parseFloat( $( move_target ).attr( "y" ) )
}
click_and_drag_value.startx = event.offsetX;
click_and_drag_value.starty = event.offsetY;
}
var move_move_segment = function( event )
{
diff_x = event.offsetX - start_click_pos.x;
diff_y = event.offsetY - start_click_pos.y;
$( move_target ).attr( "x", move_target_initial_pos.x + diff_x );
$( move_target ).attr( "y", move_target_initial_pos.y + diff_y );
$( move_target ).parent().children( "text" ).attr( "x", move_target_initial_pos.x + diff_x );
$( move_target ).parent().children( "text" ).attr( "y", move_target_initial_pos.y + diff_y );
}
var end_move_segment = function( event )
{
var x = $( move_target ).attr( "x" );
var y = $( move_target ).attr( "y" );
var w = $( move_target ).attr( "width" );
var h = $( move_target ).attr( "height" );
x = parseFloat( x );
y = parseFloat( y );
w = parseFloat( w );
h = parseFloat( h );
var target_id = $( move_target ).attr( "id" );
target_id = target_id.replace( "segment_fpc_", "" );
update_zone_db( target_id, x, y, h, w );
click_and_drag_value = {
startx: 0,
starty: 0,
endx: 0,
endy: 0
};
move_target = null;
move_target_initial_pos = {};
current_action = null;
}
var move_hover_rect = function( event )
{
if( event.target.nodeName === "rect" )
{
if( ( dist_to_br_corner( event ) ) <= 30 )
{
$( event.target ).css( "cursor", "nwse-resize" );
} else {
$( event.target ).css( "cursor", "move" );
}
}
}
var resize_target = null;
var resize_target_initial_size = {};
var start_resize_segment = function( event )
{
current_action = "resize_segment";
resize_target = event.target;
resize_target_initial_size = {
width: parseFloat( $( resize_target ).attr( "width" ) ),
height: parseFloat( $( resize_target ).attr( "height" ) )
}
}
var move_resize_segment = function( event )
{
diff_x = event.offsetX - start_click_pos.x;
diff_y = event.offsetY - start_click_pos.y;
$( resize_target ).attr( "width", resize_target_initial_size.width + diff_x );
$( resize_target ).attr( "height", resize_target_initial_size.height + diff_y );
}
var end_resize_segment = function( event )
{
var x = $( resize_target ).attr( "x" );
var y = $( resize_target ).attr( "y" );
var w = $( resize_target ).attr( "width" );
var h = $( resize_target ).attr( "height" );
x = parseFloat( x );
y = parseFloat( y );
w = parseFloat( w );
h = parseFloat( h );
var target_id = $( resize_target ).attr( "id" );
target_id = target_id.replace( "segment_fpc_", "" );
update_zone_db( target_id, x, y, h, w );
click_and_drag_value = {
startx: 0,
starty: 0,
endx: 0,
endy: 0
};
resize_target = null;
resize_target_initial_size = null;
current_action = null;
}
var dist_to_br_corner = function( event )
{
var targetx = $( event.target ).attr( "x" );
var targety = $( event.target ).attr( "y" );
var targetwidth = $( event.target ).attr( "width" );
var targetheight = $( event.target ).attr( "height" );
targetx = parseFloat( targetx );
targety = parseFloat( targety );
targetwidth = parseFloat( targetwidth );
targetheight = parseFloat( targetheight );
var dx = ( targetx + targetwidth ) - event.offsetX;
var dy = ( targety + targetheight ) - event.offsetY;
return Math.sqrt( dx * dx + dy * dy );
}
var segment_svg = function( fpc, x, y, height, width )
{
var svggroup = SVG( "g" );
$( SVG( "rect" ) )
.attr( "id", "segment_fpc_" + fpc )
.attr( "x", x )
.attr( "y", y )
.attr( "height", height )
.attr( "width", width )
.attr( "fill", "rgb( 255, 0, 0 )" )
.attr( "fill-opacity", "0.1" )
.attr( "stroke", "red" )
.attr( "stroke-width", "1" )
.appendTo( svggroup );
$( SVG( "text" ) )
.attr( "x", x )
.attr( "y", y - 5 )
.attr( "fill", "rgb( 255, 0, 0 )" )
.text( "finger " + fpc )
.appendTo( svggroup );
return svggroup;
}
</script>
</head>
<body class="icnml_main_layout">
......@@ -280,11 +582,8 @@
<div id="template_svg_div">
<svg id="template_svg" width="100%" height="100%">
<image x="0" y="0" width="100%" height="100%" xlink:href="{{ url_for( 'image.image_file_serve', file_id = file[ 'uuid' ] ) }}"></image>
<g id="tp_polygones"></g>
<line id="line_right_border" x1="0" y1="0" x2="0" y2="0" style="stroke:rgb(0,0,255); stroke-width: 2" />
<line id="line_bottom_border" x1="0" y1="0" x2="0" y2="0" style="stroke:rgb(0,0,255); stroke-width: 2" />
<text id="move_text"></text>
</svg>
</div>
......@@ -308,19 +607,6 @@
<div>Upload time</div>
<div id="file_{{ file[ 'uuid' ] }}_uploadtime">-</div>
<div>Template</div>
<div id="file_{{ file[ 'uuid' ] }}_template">
<select name="tenprint_template_select">
<option value="0" id="tenprint_template_none_option" selected>None</option>
{% for tenprint_template in tenprint_templates %}
<option value="{{ tenprint_template[ 'id' ] }}" id="{{ tenprint_template[ 'id' ] }}_option">
{{ tenprint_template[ 'name' ] }}
</option>
{% endfor %}
</select>
</div>
<div>Quality</div>
<div id="file_{{ file[ 'uuid' ] }}_quality">
<select name="tenprint_quality_select">
......@@ -334,6 +620,11 @@
</div>
</div>
<div class="icnml_button">
<div id="delete_segments_information_button_div">
<a class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" id="delete_segments_information_button" role="button" aria-disabled="false">
<span class="ui-button-text" id="delete_segments_information_button_text">Delete segments informations</span>
</a>
</div>
<div id="segmentation_button_div">
<a class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" id="segmentation_button" role="button" aria-disabled="false">
<span class="ui-button-text" id="segmentation_button_span_text">Update segmentation</span>
......@@ -367,36 +658,29 @@
update_coordinates_informations();
updateSVG();
{% for zone in zones %}
$( "#pc_{{ zone[ 'pc' ] }}" ).on( "click", function()
{
window.location = "{{ url_for( 'submission.submission_segment', submission_id = submission_id, tenprint_id = file[ 'uuid' ], pc = zone[ 'pc' ] ) }}";
} );
{% endfor %}
$( "#delete_button" ).on( "click", delete_tenprint );
$( "#delete_segments_information_button" ).on( "click", delete_zone_db );
$( "#file_{{ file[ 'uuid' ] }}_template > select" ).on( "change", update_template_db );
$( "#file_{{ file[ 'uuid' ] }}_quality > select" ).on( "change", update_quality_db );
$( "#{{ file[ 'template' ] }}_option" ).prop( "selected", true );
$( "#tenprint_quality_{{ file[ 'quality' ] }}_option" ).prop( "selected", true );
{% if file[ "template" ] == None or file[ "template" ] == 0 %}
$( "#segmentation_button" )
.removeClass( "ui-state-default" )
.addClass( "ui-state-disabled" );
$( "#go_to_segmentation_button" )
.removeClass( "ui-state-default" )
.addClass( "ui-state-disabled" );
{% endif %}
$( "#file_{{ file[ 'uuid' ] }}_uploadtime" )
.text( moment.utc( "{{ file[ 'creation_time' ] }}" ).local().format( "MMMM Do YYYY, HH:mm:ss" ) );
$( "#segmentation_button" ).on( "click", start_segmentation );
$( "#template_svg" ).on( "mousedown", start_action );
$( "#template_svg" ).on( "mousemove", move_action );
$( "#template_svg" ).on( "mouseup", end_action );
$( "#template_svg" ).on( "contextmenu", function( event )
{
event.preventDefault();
return false;
} );
$( "#template_svg" ).on( "mouseenter", svg_mouseenter );
$( "#template_svg" ).on( "mouseleave", svg_mouseleave );
$( "#icnml_navigation_updatedonor" )
.addClass( "activated" );
......@@ -411,7 +695,7 @@
.append(
$( "<a />" )
.attr( "href", "{{ url_for( 'submission.admin_tenprint_list', submission_id = submission_id ) }}" )
.text( "{{ file[ 'username' ] }}" )
.text( "Tenprints" )
)
.append(
$( "<span />" ).text( ">" )
......