Newer
Older
<!DOCTYPE html>
<html>
<head>
{% for src in js %}
<script type="text/javascript" src="{{ src }}"></script>
{% endfor %}
{% for src in css %}
<link type="text/css" rel="stylesheet" href="{{ src }}">
{% endfor %}
<script type="text/javascript" src="{{ url_for( 'send_app_files', subpath = 'functions.js' ) }}"></script>
<link type="text/css" rel="stylesheet" href="{{ url_for( 'send_app_files', subpath = 'app.css' ) }}">
<style type="text/css">
#img_preview > img {
max-height:500px;
max-width:500px;
height:auto;
width:auto;
}
.icnml_button {
margin-top: 50px;
}
.icnml_button > div > a {
width: 60%;
margin-bottom: 10px;
}
#location_img {
background-image: url( '{{ url_for( 'send_static_files', subpath = 'location/main.png' ) }}' );
background-repeat: no-repeat;
background-size: 100%;
}
#location_img > img {
height: 500px;
width: auto;
}
.icnml_lp_cardbox {
display: grid;
grid-template-columns: auto auto;
grid-gap: 30px;
}
</style>
<script type="text/javascript">
baseurl = "{{ baseurl }}";
current_pfsp = "{{ current_pfsp }}";
var password_local = decrypt( sessionStorage.getItem( "session_key" ), "{{ session_security_key }}" );
var nickname = decrypt( "{{ nickname }}", password_local );
var filename = decrypt( "{{ file[ 'filename' ] }}", password_local );
var note = decrypt( "{{ file[ 'note' ] }}", password_local );
var updateMapCoordinates = function( data, fac )
{
data.children( "area" ).each( function( i )
{
$( this )[ 0 ].coords = $( this )[ 0 ].coords
} );
}
var updateSelection = function( data )
{
var location_base_url = "{{ url_for( 'send_static_files', subpath = 'location' ) }}";
.concat( data )
.filter( x => x != "None" )
.filter( x => x != "" )
.map( x => "url( " + location_base_url + "/" + x + ".png )" )
$( "#location_img" )
.css( "background-image", d );
var update_pfsp_db = function( data )
{
$.ajax( {
url: "{{ url_for( 'submission_latent_pfsp_set', id = submission_id, lid = file[ 'uuid' ] ) }}",
dataType: "json",
method: "POST",
data: {
pfsp: data
},
error: function()
{
toastr.error( "Error while saving the location data" );
}
} );
</script>
</head>
<body class="icnml_main_layout">
{% include "header.html" %}
{% include "navigations/submitter.html" %}
<div class="icnml_content">
<div class="icnml_lp_oneperpage">
<form id="icnml_file_update_{{ file[ 'uuid' ] }}">
<div class="ui-widget-header ui-corner-top icnml_box_top">File '<span id="header_filename">-</span>'</div>
<div class="ui-widget-content ui-corner-bottom icnml_box_content">
<div class="icnml_lp_cardbox">
<div id="img_preview" class="icnml_img">
<img src="{{ url_for( 'image_file_serve', id = file[ 'uuid' ] ) }}">
</div>
<div>
<div id="pfsp">
<div id="location_img">
<img src="{{ url_for( 'send_static_files', subpath = 'location/empty.png' ) }}" usemap="#location_map" />
</div>
<map id="Map" name="location_map" class="location_map">
{% for zone in pfsp_zones %}
<area
shape="polygon"
id="area_{{ zone[ 'sel' ] | join( '_' ) }}"
coords="{{ zone[ 'coords' ] }}"
data-selection="{{ zone[ 'sel' ] | join( ',' ) }}"
data-desc="{{ zone[ 'desc' ] }}"
data-zone="{{ zone[ 'zone' ] }}"
data-lat="{{ zone[ 'lat' ] }}"
/>
{% endfor %}
</map>
</div>
<div class="icnml_button">
<div id="next_button_div">
<a class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" id="clear_pfsp_button">
<span class="ui-button-text" id="clear_pfsp_button_span_text">Unset the location</span>
</a>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</body>
<script type="text/javascript">
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
$( "#box_filename" ).text( filename );
$( "#clear_pfsp_button" ).on( "click", function()
{
update_pfsp_db( null );
current_pfsp = [];
updateSelection( current_pfsp );
} );
// Action for the PFSP zones
updateMapCoordinates( $( "#Map" ), 500 / 656 );
var current_pfsp = "{{ current_pfsp }}".split( "," );
var areas = new Array();
{% for zone in pfsp_zones %}
areas.push( "#area_{{ zone[ 'sel' ] | join( '_' ) }}" );
{% endfor %}
for( var i = 0; i < areas.length; i++ )
{
$( areas[ i ] )
.mouseover( function()
{
var s = $( this )[ 0 ].dataset.selection.split( "," );
} )
.mouseout( function()
{
updateSelection( current_pfsp );
} )
.on( "click", function()
{
var d = $( this )[ 0 ].dataset.desc;
var s = $( this )[ 0 ].dataset.selection.split( "," );
update_pfsp_db( d );
current_pfsp = s;
updateSelection( current_pfsp );
} );
}
updateSelection( current_pfsp );
//
$( "#icnml_navigation_updatedonor" )
.addClass( "activated" );
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
$( "<a />" )
.attr( "href", "{{ url_for( 'submission_list' ) }}" )
.text( "Submissions" )
)
.append(
$( "<span />" ).text( ">" )
)
.append(
$( "<a />" )
.attr( "href", "{{ url_for( 'submission_upload_tplp', id = submission_id ) }}" )
.text( nickname )
)
.append(
$( "<span />" ).text( ">" )
)
.append(
$( "<a />" )
.attr( "href", "{{ url_for( 'submission_latent_list', id = submission_id ) }}" )
.text( "Latents" )
)
.append(
$( "<span />" ).text( ">" )
)
.append(
$( "<span />" ).text( filename )
);