mason/breeders_toolbox/manage_drone_imagery.mas

   1
   2 <%args>
   3 </%args>
   4
   5 <& /util/import_javascript.mas, classes => [ 'jquery.iframe-post-form', 'CXGN.BreederSearch', 'd3.d3v4Min.js', "opencv.opencv" ] &>
   6
   7 <style>
   8 .ui-autocomplete { z-index:2147483647; }
   9
  10 .straightLine, .hrLine{
  11   position: absolute;
  12   background-color: red;
  13   transition: transform .05s ease-in-out;
  14 }
  15 </style>
  16
  17 <div id="manage_drone_imagery_top_div">
  18
  19     <& /page/page_title.mas, title=>"Manage Drone Imagery" &>
  20
  21 <%perl>
  22 #my $buttons_html = "<button class='btn btn-primary' style='margin:3px' id='upload_drone_imagery_link'>Upload Drone Imagery</button><button class='btn btn-primary' style='margin:3px' id='keras_cnn_drone_imagery_link'>Train Keras CNN Model</button><button class='btn btn-success' style='margin:3px' id='download_phenotypes_drone_imagery_link'>Download Drone Phenotypes</button>";
  23 my $buttons_html = "<button class='btn btn-primary' style='margin:3px' id='upload_drone_imagery_link'>Upload Imagery</button><button class='btn btn-success' style='margin:3px' id='download_phenotypes_drone_imagery_link'>Download Image-Phenotypes</button><button class='btn btn-success' style='margin:3px' id='drone_imagery_calculate_statistics_link'>Calculate Statistics</button>";
  24 </%perl>
  25
  26     <& /page/detail_page_2_col_section.mas, info_section_collapsed => 0, info_section_title => "<h4 style='display:inline'>Drone Imagery</h4>", info_section_subtitle => 'Upload and view field drone imagery', buttons_html => $buttons_html, icon_class => undef, col1_width_class => "col-sm-0", col2_width_class => "col-sm-12", info_section_id => "manage_drone_imagery_main" &>
  27
  28 </div>
  29
  30 <div id="manage_drone_imagery_standard_process_div" style="display:none">
  31
  32     <& /page/page_title.mas, title=>"Manage Drone Imagery: Run A Standard Process" &>
  33
  34     <&| /util/workflow.mas, id=> "manage_drone_imagery_standard_process_workflow" &>
  35         <&| /util/workflow.mas:step, title=> "Intro" &>
  36             <& /page/page_title.mas, title=>"This workflow will guide you through applying a standard process to your aerial imaging bands" &>
  37             <p>Here you can take one of the drone run bands you uploaded all the way through the process to plot image saving. This will require manual steps such as image rotation, cropping, and plot polygon templating. After you have completed this process for one drone run band, you can apply it to all other drone run bands and other calculated vegetative indices.</p>
  38             <br/><br/>
  39             <center>
  40             <button class="btn btn-primary" onclick="Workflow.complete(this); return false;">Go to Next Step</button>
  41             </center>
  42         </&>
  43         <&| /util/workflow.mas:step, title=> "Drone Run Band" &>
  44             <& /page/page_title.mas, title=>"Select a drone run band" &>
  45
  46             <div class="well well-sm">
  47                 <p>Please select one drone run band to take through the process. It is recommended to select a band that has high contrast, such as a NIR band.</p>
  48             </div>
  49
  50             <div class="well well-sm">
  51                 <div class="panel panel-default">
  52                     <div class="panel-body">
  53                         <table class="table table-bordered table-hover" id="manage_drone_imagery_standard_process_drone_run_bands_table">
  54                             <thead>
  55                                 <tr>
  56                                     <th>Select</th>
  57                                     <th>Drone Run Band Name</th>
  58                                     <th>Drone Run Band Description</th>
  59                                     <th>Drone Run Band Type</th>
  60                                     <th>Drone Run Name</th>
  61                                     <th>Drone Run Description</th>
  62                                     <th>Drone Run Date</th>
  63                                     <th>Field Trial Name</th>
  64                                     <th>Field Trial Description</th>
  65                                 </tr>
  66                             </thead>
  67                         </table>
  68
  69                         <br/>
  70
  71                         <center>
  72                         <button class="btn btn-primary" id="manage_drone_imagery_standard_process_drone_run_band_step">Go to Next Step</button>
  73                         </center>
  74                     </div>
  75                 </div>
  76             </div>
  77
  78         </&>
  79         <&| /util/workflow.mas:step, title=> "Rotate" &>
  80             <& /page/page_title.mas, title=>"Rotate your selected drone run band" &>
  81
  82             <div class="well well-sm">
  83                 <ul>
  84                     <li>Here you can do a rotation of your drone run image.</li>
  85                     <li>Your image should have precise row-to-row parallel alignment.</li>
  86                 </ul>
  87             </div>
  88
  89             <div class="well well-sm">
  90
  91                 <form class="form-horizontal">
  92                     <div class="form-group form-group-sm">
  93                         <label class="col-sm-6 control-label">Rotate Counter-Clockwise Degrees: </label>
  94                         <div class="col-sm-6">
  95                             <input class="form-control" id="drone_imagery_standard_process_rotate_degrees_input" name="drone_imagery_standard_process_rotate_degrees_input" type="text" placeholder="Number of degrees to rotate" value="0.00"/>
  96                         </div>
  97                     </div>
  98                 </form>
  99
 100                 <button class="btn btn-primary" id="drone_imagery_standard_process_rotate_stitched_view">Rotate Image (Does Not Save)</button>
 101                 <button class="btn btn-default" id="drone_imagery_standard_process_rotate_stitched_crosshairs">Draw Crosshairs Assist</button>
 102                 <button class="btn btn-default" id="drone_imagery_standard_process_rotate_stitched_restart">Restart</button>
 103                 <button class="btn btn-primary" id="manage_drone_imagery_standard_process_rotate_step">Save Rotated Image And Go To Next Step</button>
 104             </div>
 105
 106             <div id="manage_drone_imagery_standard_process_rotate_load_div">
 107                 <img src="/img/wheel.gif" />
 108             </div>
 109
 110             <canvas id="drone_imagery_standard_process_rotate_original_stitched_div">
 111             </canvas>
 112
 113         </&>
 114         <&| /util/workflow.mas:step, title=> "Cropping" &>
 115             <& /page/page_title.mas, title=>"Crop your drone run band to specific area" &>
 116
 117             <div class="well well-sm">
 118                 <ul>
 119                     <li>Here you can do a rough cropping of the stitched ortho image to focus only on the actual field experiment.</li>
 120                     <li>Click on four points in the image to make a four-sided polygon.</li>
 121                     <li>Only the last polygon that you draw will be used for the cropping.</li>
 122                 </ul>
 123                 <br/>
 124                 <button class="btn btn-primary" id="manage_drone_imagery_standard_process_cropping_step">Save and Go to Next Step</button>
 125             </div>
 126
 127             <!--
 128             <div class="well well-sm">
 129                 <form class="form-horizontal">
 130                     <div class="row">
 131                         <div class="col-sm-12">
 132                             <div class="form-group form-group-sm">
 133                                 <label class="col-sm-6 control-label">Previously Used Image Cropping For This Field Trial: </label>
 134                                 <div class="col-sm-6">
 135                                     <div id="plot_polygons_standard_process_previously_saved_image_cropping_templates">
 136                                     </div>
 137                                 </div>
 138                             </div>
 139                         </div>
 140                     </div>
 141                 </form>
 142                 <button class="btn btn-primary" id="drone_imagery_standard_process_cropping_use_previous_cropping">Use Image Cropping</button>
 143             </div>
 144             -->
 145
 146             <div id="manage_drone_imagery_standard_process_crop_load_div">
 147                 <img src="/img/wheel.gif" />
 148             </div>
 149
 150             <canvas id="drone_imagery_standard_process_crop_original_stitched_div"></canvas>
 151
 152         </&>
 153         <&| /util/workflow.mas:step, title=> "Thresholding" &>
 154             <& /page/page_title.mas, title=>"Threshold your drone run band to remove background" &>
 155
 156             <div class="well">
 157                 <&| /page/info_section.mas, title => 'Remove Background Using Percentage Threshold', collapsible=>1, collapsed => 0, subtitle=> 'Remove the background by specifying percentage threshold value' &>
 158                     <div class="panel panel-default">
 159                         <div class="panel-body">
 160                             <div class="row">
 161                                 <div class="col-sm-6">
 162                                     <div class="form-group form-group-sm">
 163                                         <label class="col-sm-6 control-label">Discard Lowest Percent of Pixel Values: </label>
 164                                         <div class="col-sm-6">
 165                                             <input class="form-control" id="drone_imagery_standard_process_remove_background_lower_threshold_percentage" name="drone_imagery_standard_process_remove_background_lower_threshold_percentage" type="number" max="99" min="0" placeholder="e.g. 10% of lowest pixel values (Min 0, Max 100)" value=25 disabled/>
 166                                         </div>
 167                                     </div>
 168                                 </div>
 169                                 <div class="col-sm-6">
 170                                     <div class="form-group form-group-sm">
 171                                         <label class="col-sm-6 control-label">Discard Highest Percent of Pixel Values: </label>
 172                                         <div class="col-sm-6">
 173                                             <input class="form-control" id="drone_imagery_standard_process_remove_background_upper_threshold_percentage" name="drone_imagery_standard_process_remove_background_upper_threshold_percentage" type="number" max="99" min="0" placeholder="e.g. 10% of highest pixel values (Min 0, Max 100)" value=25 disabled/>
 174                                         </div>
 175                                     </div>
 176                                 </div>
 177                             </div>
 178                         </div>
 179                     </div>
 180                 </&>
 181             </div>
 182
 183             <center>
 184                 <button id="drone_imagery_standard_process_remove_background_defined_percentage_submit" class="btn btn-primary">Apply Threshold</button>
 185             </center>
 186
 187             <hr>
 188
 189             <div id="manage_drone_imagery_standard_process_remove_background_load_div">
 190                 <img src="/img/wheel.gif" />
 191             </div>
 192
 193             <div class="well well-sm">
 194                 <&| /page/info_section.mas, title => 'Histogram of pixel values', collapsible=>1, collapsed => 0, subtitle=> 'Histogram of Pixel Values' &>
 195                     <center>
 196                         <canvas id="drone_imagery_standard_process_remove_background_histogram_div"></canvas>
 197                     </center>
 198                 </&>
 199             </div>
 200
 201             <div class="well well-sm">
 202                 <&| /page/info_section.mas, title => 'Denoised Original Image', collapsible=>1, collapsed => 0, subtitle=> 'Denoised Original Image' &>
 203                     <center>
 204                         <canvas id="drone_imagery_standard_process_remove_background_original"></canvas>
 205                     </center>
 206                 </&>
 207             </div>
 208
 209         </&>
 210         <&| /util/workflow.mas:step, title=> "Plot Polygons" &>
 211             <& /page/page_title.mas, title=>"Define plot polygons relative to the field layout" &>
 212
 213             <& /page/detail_page_2_col_section.mas, info_section_collapsible=>1, info_section_collapsed=>0, info_section_title => "<h4 style='display:inline'>Generate Polygon Template Tool</h4>", info_section_subtitle => 'Overlay a uniform grid over the image.', icon_class => "glyphicon glyphicon-th-large", info_section_id => "manage_drone_imagery_standard_process_generate_plot_polygons_section" &>
 214
 215             <div class="well well-sm">
 216                 <div id="drone_imagery_standard_process_plot_polygons_top_section"></div>
 217
 218                 <button id="drone_imagery_standard_process_plot_polygons_clear" class="btn btn-danger">Clear All Polygons</button>
 219                 <button id="drone_imagery_standard_process_plot_polygons_clear_one" class="btn btn-danger">Clear One Polygon</button>
 220                 <button id="drone_imagery_standard_process_plot_polygons_get_distance" class="btn btn-default">Find Distance Between Points</button>
 221             </div>
 222
 223             <div id="manage_drone_imagery_standard_process_plot_polygons_load_div">
 224                 <img src="/img/wheel.gif" />
 225             </div>
 226
 227             <canvas id="drone_imagery_standard_process_plot_polygons_original_stitched_div"></canvas>
 228
 229             <div id="drone_imagery_standard_process_generated_polygons_div"></div>
 230
 231             <hr>
 232             <div class="well well-sm">
 233                 <div id="drone_imagery_standard_process_trial_layout_div"></div>
 234             </div>
 235
 236         </&>
 237         <&| /util/workflow.mas:step, title=> "Apply" &>
 238             <& /page/page_title.mas, title=>"Apply these same steps to other drone run bands in the current drone run" &>
 239
 240             <div class="well well-sm">
 241                 <ul>
 242                     <li>Here you can apply the same actions you did for the previous steps 1 to 6, to additional drone run bands in this drone run.</li>
 243                     <li>Thresholding will be done dynamically, by removing the top and bottom 20% of pixel values.</li>
 244                 </ul>
 245             </div>
 246
 247             <div class="well well-sm">
 248                 <div class="panel panel-default">
 249                     <div class="panel-body">
 250                         <table class="table table-bordered table-hover" id="manage_drone_imagery_standard_process_drone_run_bands_apply_table">
 251                             <thead>
 252                                 <tr>
 253                                     <th>Select</th>
 254                                     <th>Drone Run Band Name</th>
 255                                     <th>Drone Run Band Description</th>
 256                                     <th>Drone Run Band Type</th>
 257                                     <th>Drone Run Name</th>
 258                                     <th>Drone Run Description</th>
 259                                     <th>Drone Run Date</th>
 260                                     <th>Field Trial Name</th>
 261                                     <th>Field Trial Description</th>
 262                                 </tr>
 263                             </thead>
 264                         </table>
 265
 266                         <br/>
 267
 268                         <center>
 269                         <button class="btn btn-primary" id="manage_drone_imagery_standard_process_drone_run_band_apply_step">Go to Next Step</button>
 270                         </center>
 271                     </div>
 272                 </div>
 273             </div>
 274         </&>
 275         <&| /util/workflow.mas:step, title=> "Indices" &>
 276             <& /page/page_title.mas, title=>"Create and apply these same steps to vegetative indices" &>
 277
 278             <form class="form-horizontal">
 279                 <div class="form-group form-group-sm">
 280                     <label class="col-sm-6 control-label">Vegetative Indices To Apply: </label>
 281                     <div class="col-sm-6">
 282                         <input name="drone_imagery_standard_process_apply_indices_select" value="TGI" type="checkbox" checked> Triangular Greenness Index (TGI) <br/>
 283                         <input name="drone_imagery_standard_process_apply_indices_select" value="VARI" type="checkbox" checked> Visible Atmospheric Resistant Index (VARI) <br/>
 284                         <input name="drone_imagery_standard_process_apply_indices_select" value="NDVI" type="checkbox" checked> Normalized Difference Vegetative Index (NDVI) <br/>
 285                         <input name="drone_imagery_standard_process_apply_indices_select" value="NDRE" type="checkbox" checked> Normalized Difference Red Edge Vegetative Index (NDRE) <br/>
 286                     </div>
 287                 </div>
 288             </form>
 289
 290             <br/>
 291
 292             <center>
 293             <button type="button" class="btn btn-primary" id="manage_drone_imagery_standard_process_indices_step">Go to Next Step</button>
 294             </center>
 295         </&>
 296         <&| /util/workflow.mas:step, title=> "Phenotypes" &>
 297             <& /page/page_title.mas, title=>"Calculate phenotypes for all plot polygon images" &>
 298
 299             <form class="form-horizontal">
 300                 <div class="form-group form-group-sm">
 301                     <label class="col-sm-6 control-label">Zonal Statistics to Calculate and Save in Database: </label>
 302                     <div class="col-sm-6">
 303                         <input name="drone_imagery_standard_process_phenotypes_select" value="zonal" type="checkbox" checked disabled> Zonal Statistics: nonzero_pixel_count, total_pixel_sum, mean_pixel_value, harmonic_mean_value, median_pixel_value, variance_pixel_value, stdev_pixel_value, pstdev_pixel_value, min_pixel_value, max_pixel_value, minority_pixel_value, minority_pixel_count, majority_pixel_value, majority_pixel_count, pixel_variety_count <br/>
 304                     </div>
 305                 </div>
 306                 <div class="form-group">
 307                     <label class="col-sm-5 control-label">Select Time Point In Drone Run Series:</label>
 308                     <div class="col-sm-7">
 309                         <div id="drone_imagery_standard_process_calculate_phenotypes_zonal_stats_time_select_div">
 310                         </div>
 311                     </div>
 312                 </div>
 313             </form>
 314             <br/>
 315
 316             <div id="drone_imagery_standard_process_week_term_div"></div>
 317
 318             <center>
 319             <button type="button" class="btn btn-info" id="manage_drone_imagery_standard_process_phenotypes_step">Finish</button>
 320             </center>
 321         </&>
 322     </&>
 323
 324 </div>
 325
 326 <div id="manage_drone_imagery_rotate_div" style="display:none">
 327
 328     <& /page/page_title.mas, title=>"Manage Drone Imagery: Rotate Stitched Image" &>
 329
 330     <div class="well well-sm">
 331         <ul>
 332             <li>Here you can rotate the stitched image so that the rows and columns align exactly vertically and horizontally.</li>
 333             <li>The rotation can be done on decimals of degrees.</li>
 334             <li>Negative values mean clock-wise and positive values mean counter-clockwise.</li>
 335             <li>Crosshairs are only for assisting in alignment and they will not be saved.</li>
 336         </ul>
 337     </div>
 338     <div class="well well-sm">
 339
 340         <form class="form-horizontal">
 341             <div class="form-group form-group-sm">
 342                 <label class="col-sm-6 control-label">Rotate Counter-Clockwise Degrees: </label>
 343                 <div class="col-sm-6">
 344                     <input class="form-control" id="drone_imagery_rotate_degrees_input" name="drone_imagery_rotate_degrees_input" type="text" placeholder="Number of degrees to rotate" value="0.00"/>
 345                 </div>
 346             </div>
 347         </form>
 348
 349         <button class="btn btn-primary" id="drone_imagery_rotate_stitched_view">Rotate Image (Does Not Save)</button>
 350         <button class="btn btn-default" id="drone_imagery_rotate_stitched_crosshairs">Draw Crosshairs Assist</button>
 351         <button class="btn btn-default" id="drone_imagery_rotate_stitched_restart">Restart</button>
 352         <button class="btn btn-primary" id="drone_imagery_rotate_stitched_submit">Save Rotated Image</button>
 353     </div>
 354
 355     <div id="manage_drone_imagery_rotate_load_div">
 356         <img src="/img/wheel.gif" />
 357     </div>
 358
 359     <canvas id="drone_imagery_rotate_original_stitched_div">
 360     </canvas>
 361 </div>
 362
 363 <div id="manage_drone_imagery_crop_div" style="display:none">
 364
 365     <& /page/page_title.mas, title=>"Manage Drone Imagery: Crop Stitched Image To Field Experiment" &>
 366
 367     <div class="well well-sm">
 368         <ul>
 369             <li>Here you can do a rough cropping of the stitched ortho image to focus only on the actual field experiment.</li>
 370             <li>Click on four points in the image to make a four-sided polygon.</li>
 371             <li>Only the last polygon that you draw will be used for the cropping.</li>
 372         </ul>
 373         <br/>
 374         <button class="btn btn-primary" id="drone_imagery_crop_stitched_submit">Crop Image To Selected Polygon</button>
 375     </div>
 376
 377     <div class="well well-sm">
 378         <form class="form-horizontal">
 379             <div class="row">
 380                 <div class="col-sm-12">
 381                     <div class="form-group form-group-sm">
 382                         <label class="col-sm-6 control-label">Previously Used Image Cropping For This Field Trial: </label>
 383                         <div class="col-sm-6">
 384                             <div id="plot_polygons_previously_saved_image_cropping_templates">
 385                             </div>
 386                         </div>
 387                     </div>
 388                 </div>
 389             </div>
 390         </form>
 391         <button class="btn btn-primary" id="drone_imagery_cropping_use_previous_cropping">Use Image Cropping</button>
 392     </div>
 393
 394     <div id="manage_drone_imagery_crop_load_div">
 395         <img src="/img/wheel.gif" />
 396     </div>
 397
 398     <canvas id="drone_imagery_crop_original_stitched_div"></canvas>
 399 </div>
 400
 401 <div id="manage_drone_imagery_vegetative_index_div" style="display:none">
 402
 403     <& /page/page_title.mas, title=>"Manage Drone Imagery: Convert to Vegetative Index" &>
 404
 405     <div class="well well-sm">
 406         <ul>
 407             <li>Here you can convert to a vegetative index.</li>
 408             <li>If you have a NIR band, you can calculate "Normalized difference vegetative index", NDVI.</li>
 409             <li>If you have an RGB image, you can calculate "Visible atmospheric resistant index", VARI, or "Triangular greenness index", TGI.</li>
 410             <li>If you have red or blue or green, or images from any spectral band, you can calculate ratios to use as your vegetative index.</li>
 411         </ul>
 412     </div>
 413
 414     <hr>
 415     <div id="manage_drone_imagery_vegetative_index_tgi_bgr_div" style="display:none">
 416         <button class="btn btn-primary" id="drone_imagery_vegetative_index_TGI_bgr">Calculate "Triangular Greenness Index" TGI. TGI = {Green band2} - 0.39*{Red band3} - 0.61*{Blue band1}</button>
 417         <hr>
 418     </div>
 419     <div id="manage_drone_imagery_vegetative_index_vari_bgr_div" style="display:none">
 420         <button class="btn btn-primary" id="drone_imagery_vegetative_index_VARI_bgr">Calculate "Visible Atmospheric Resistant Index" VARI. VARI = ({Green band2} - {Red band3}) / ({Green band2} + {Red band3} - {Blue band1})</button>
 421         <hr>
 422     </div>
 423     <div id="manage_drone_imagery_vegetative_index_tgi_rgb_div" style="display:none">
 424         <button class="btn btn-primary" id="drone_imagery_vegetative_index_TGI_rgb">Calculate "Triangular Greenness Index" TGI. TGI = {Green band2} - 0.39*{Red band1} - 0.61*{Blue band3}</button>
 425         <hr>
 426     </div>
 427     <div id="manage_drone_imagery_vegetative_index_vari_rgb_div" style="display:none">
 428         <button class="btn btn-primary" id="drone_imagery_vegetative_index_VARI_rgb">Calculate "Visible Atmospheric Resistant Index" VARI. VARI = ({Green band2} - {Red band1}) / ({Green band2} + {Red band1} - {Blue band3})</button>
 429         <hr>
 430     </div>
 431     <div id="manage_drone_imagery_vegetative_index_ndvi_div" style="display:none">
 432         <button class="btn btn-primary" id="drone_imagery_vegetative_index_NDVI">Calculate "Normalized Difference Vegetative Index" NDVI. NDVI = ({NIR band1} - {Red band2}) / ({NIR band1} + {Red band2})</button>
 433         <hr>
 434     </div>
 435     <div id="manage_drone_imagery_vegetative_index_ndre_div" style="display:none">
 436         <button class="btn btn-primary" id="drone_imagery_vegetative_index_NDRE">Calculate "Normalized Difference Red Edge" NDRE. NDRE = ({NIR band1} - {Red Edge band2}) / ({NIR band1} + {Red Edge band2})</button>
 437         <hr>
 438     </div>
 439
 440     <button class="btn btn-success" id="drone_imagery_rgb_vegetative_index_submit">Finish and Save Vegetative Index</button>
 441     <hr>
 442
 443     <canvas id="drone_imagery_vegetative_index_original_stitched_div"></canvas>
 444 </div>
 445
 446 <div id="manage_drone_imagery_remove_background_div" style="display:none">
 447
 448     <& /page/page_title.mas, title=>"Manage Drone Imagery: Remove Background" &>
 449
 450     <div class="well">
 451         <&| /page/info_section.mas, title => 'Remove Background Using Graphical Threshold', collapsible=>1, collapsed => 1, subtitle=> 'Remove the background using a simple threshold value' &>
 452
 453             <div class="panel panel-default">
 454                 <div class="panel-body">
 455                     <div class="well well-sm">
 456                         <h5>The background can be removed by placing a threshold on pixel values</h5>
 457                         <ul>
 458                             <li><b>1.</b> Click on the two right-most, highest peaks in the histogram. The right most peak represents the pixels we are interested in, while the peak immediately to the left of that peak represents the soil background.</li>
 459                             <li><b>2.</b> Click on the "Find Minimum" button.</li>
 460                             <li><b>3.</b> If the image looks good with the applied threshold, click Save. Otherwise, you can start over.</li>
 461                         </ul>
 462                     </div>
 463
 464                     <div class="well well-sm">
 465                         <div name="drone_imagery_remove_background_threshold_current"></div>
 466                         <div name="drone_imagery_remove_background_threshold"></div>
 467                     </div>
 468
 469                     <canvas id="drone_imagery_remove_background_histogram_div"></canvas>
 470                     <hr>
 471                     <button class="btn btn-primary" id="drone_imagery_remove_background_find_minimum">Find Minimum (Does Not Save)</button>
 472                     <button class="btn btn-default" id="drone_imagery_remove_background_start_over">Start Over</button>
 473                     <button class="btn btn-primary" id="drone_imagery_remove_background_submit">Save</button>
 474                     <hr>
 475                 </div>
 476             </div>
 477         </&>
 478     </div>
 479     <div class="well">
 480         <&| /page/info_section.mas, title => 'Remove Background Using User Defined Threshold', collapsible=>1, collapsed => 1, subtitle=> 'Remove the background using a simple threshold value' &>
 481             <div class="panel panel-default">
 482                 <div class="panel-body">
 483                     <div class="row">
 484                         <div class="col-sm-6">
 485                             <div class="form-group form-group-sm">
 486                                 <label class="col-sm-6 control-label">Discard Pixels with Value Lower Than: </label>
 487                                 <div class="col-sm-6">
 488                                     <input class="form-control" id="drone_imagery_remove_background_lower_threshold" name="drone_imagery_remove_background_lower_threshold" type="number" max="255" min="0" placeholder="e.g. 10 (Min 0)" />
 489                                 </div>
 490                             </div>
 491                         </div>
 492                         <div class="col-sm-6">
 493                             <div class="form-group form-group-sm">
 494                                 <label class="col-sm-6 control-label">Discard Pixels with Value Higher Than: </label>
 495                                 <div class="col-sm-6">
 496                                     <input class="form-control" id="drone_imagery_remove_background_upper_threshold" name="drone_imagery_remove_background_upper_threshold" type="number" max="255" min="0" placeholder="e.g. 200 (Max 255)"/>
 497                                 </div>
 498                             </div>
 499                         </div>
 500                     </div>
 501                     <button id="drone_imagery_remove_background_defined_submit" class="btn btn-primary">Apply Threshold</button>
 502                 </div>
 503             </div>
 504         </&>
 505     </div>
 506     <div class="well">
 507         <&| /page/info_section.mas, title => 'Remove Background Using Percentage Threshold', collapsible=>1, collapsed => 1, subtitle=> 'Remove the background by specifying percentage threshold value' &>
 508             <div class="panel panel-default">
 509                 <div class="panel-body">
 510                     <div class="row">
 511                         <div class="col-sm-6">
 512                             <div class="form-group form-group-sm">
 513                                 <label class="col-sm-6 control-label">Discard Lowest Percent of Pixel Values: </label>
 514                                 <div class="col-sm-6">
 515                                     <input class="form-control" id="drone_imagery_remove_background_lower_threshold_percentage" name="drone_imagery_remove_background_lower_threshold_percentage" type="number" max="99" min="0" placeholder="e.g. 10% of lowest pixel values (Min 0, Max 100)" />
 516                                 </div>
 517                             </div>
 518                         </div>
 519                         <div class="col-sm-6">
 520                             <div class="form-group form-group-sm">
 521                                 <label class="col-sm-6 control-label">Discard Highest Percent of Pixel Values: </label>
 522                                 <div class="col-sm-6">
 523                                     <input class="form-control" id="drone_imagery_remove_background_upper_threshold_percentage" name="drone_imagery_remove_background_upper_threshold_percentage" type="number" max="99" min="0" placeholder="e.g. 10% of highest pixel values (Min 0, Max 100)"/>
 524                                 </div>
 525                             </div>
 526                         </div>
 527                     </div>
 528                     <button id="drone_imagery_remove_background_defined_percentage_submit" class="btn btn-primary">Apply Threshold</button>
 529                 </div>
 530             </div>
 531         </&>
 532     </div>
 533
 534     <hr>
 535
 536     <div id="manage_drone_imagery_remove_background_load_div">
 537         <img src="/img/wheel.gif" />
 538     </div>
 539
 540     <canvas id="drone_imagery_remove_background_original"></canvas>
 541 </div>
 542
 543 <div id="manage_drone_imagery_plot_polygons_div" style="display:none">
 544
 545     <& /page/page_title.mas, title=>"Manage Drone Imagery: Define Plot Polygons" &>
 546
 547     <& /page/detail_page_2_col_section.mas, info_section_collapsible=>1, info_section_collapsed=>0, info_section_title => "<h4 style='display:inline'>Generate Polygon Template Tool</h4>", info_section_subtitle => 'Overlay a uniform grid over the image.', icon_class => "glyphicon glyphicon-th-large", info_section_id => "manage_drone_imagery_generate_plot_polygons_section" &>
 548
 549     <div class="well well-sm">
 550         <div id="drone_imagery_plot_polygons_top_section"></div>
 551
 552         <button id="drone_imagery_plot_polygons_clear" class="btn btn-danger">Clear All Polygons</button>
 553         <button id="drone_imagery_plot_polygons_clear_one" class="btn btn-danger">Remove One Polygon</button>
 554         <button id="drone_imagery_plot_polygons_get_distance" class="btn btn-default">Find Distance Between Points</button>
 555     </div>
 556
 557     <div id="manage_drone_imagery_plot_polygons_load_div">
 558         <img src="/img/wheel.gif" />
 559     </div>
 560
 561     <canvas id="drone_imagery_plot_polygons_original_stitched_div"></canvas>
 562
 563     <div id="drone_imagery_generated_polygons_div"></div>
 564
 565     <hr>
 566     <div class="well well-sm">
 567         <div id="drone_imagery_trial_layout_div"></div>
 568     </div>
 569 </div>
 570
 571 <div id="manage_drone_imagery_calculate_phenotypes_div" style="display:none">
 572
 573     <& /page/page_title.mas, title=>"Manage Drone Imagery: Calculate Phenotypes" &>
 574
 575     <div class="well well-sm">
 576         <ul>
 577             <li>Here you can calculate phenotypes for all plot polygons at once.</li>
 578         </ul>
 579     </div>
 580
 581     <hr>
 582     <button class="btn btn-primary" id="drone_imagery_calculate_phenotypes_zonal_stats">Zonal Statistics</button>
 583     <button class="btn btn-primary" id="drone_imagery_calculate_phenotypes_sift">Calculate SIFT Features</button>
 584     <button class="btn btn-primary" id="drone_imagery_calculate_phenotypes_surf">Calculate SURF Features</button>
 585     <button class="btn btn-primary" id="drone_imagery_calculate_phenotypes_orb">Calculate ORB Features</button>
 586     <hr>
 587
 588     <div id="manage_drone_imagery_calculate_phenotypes_show_zonal_stats" style="overflow:scroll"></div>
 589     <div id="manage_drone_imagery_calculate_phenotypes_show_fourier_transform" style="overflow:scroll"></div>
 590     <div id="manage_drone_imagery_calculate_phenotypes_show_sift"></div>
 591     <div id="manage_drone_imagery_calculate_phenotypes_show_surf"></div>
 592     <div id="manage_drone_imagery_calculate_phenotypes_show_orb"></div>
 593
 594 </div>
 595
 596 <div id="manage_drone_imagery_loading_div" style="display:none">
 597     <& /page/page_title.mas, title=>"Loading..." &>
 598     <div class="well well-sm">
 599         <center>
 600         <h3>Please wait...</h3>
 601         <hr>
 602         <img src="/img/wheel.gif" />
 603         </center>
 604     </div>
 605 </div>
 606
 607 <div class="modal fade" id="drone_imagery_assign_plot_dialog" name="drone_imagery_assign_plot_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryAssignPlotDialog" data-backdrop="static">
 608   <div class="modal-dialog modal-sm" role="document">
 609     <div class="modal-content">
 610       <div class="modal-header">
 611         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 612         <h4 class="modal-title" id="droneImageryAssignPlotDialog">Assign Plot</h4>
 613       </div>
 614       <div class="modal-body">
 615         <div class="container-fluid">
 616             <form class="form-horizontal" id="drone_imagery_assign_plot_form">
 617                 <div class="form-group">
 618                     <label class="col-sm-5 control-label">Plot Name:</label>
 619                     <div class="col-sm-7">
 620                         <input class="form-control" id="drone_imagery_plot_polygon_assign_plot_name" name="drone_imagery_plot_polygons_autocomplete" type="text" placeholder="Auto-completes plot name..." />
 621                     </div>
 622                 </div>
 623             </form>
 624         </div>
 625       </div>
 626       <div class="modal-footer">
 627         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 628         <button type="button" class="btn btn-primary" id="drone_imagery_plot_polygon_assign_add">Assign Plot</button>
 629       </div>
 630     </div>
 631   </div>
 632 </div>
 633
 634 <div class="modal fade" id="drone_imagery_plot_polygon_remove_polygon" name="drone_imagery_plot_polygon_remove_polygon" tabindex="-1" role="dialog" aria-labelledby="droneImageryRemovePlotPolygonDialog" data-backdrop="static">
 635   <div class="modal-dialog modal-sm" role="document">
 636     <div class="modal-content">
 637       <div class="modal-header">
 638         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 639         <h4 class="modal-title" id="droneImageryRemovePlotPolygonDialog">Remove Plot Polygon</h4>
 640       </div>
 641       <div class="modal-body">
 642         <div class="container-fluid">
 643             <form class="form-horizontal">
 644                 <div class="form-group">
 645                     <label class="col-sm-5 control-label">Polygon Identifier:</label>
 646                     <div class="col-sm-7">
 647                         <input class="form-control" id="drone_imagery_plot_polygon_remove_polygon_number" name="drone_imagery_plot_polygon_remove_polygon_number" type="number" placeholder="e.g. 3" />
 648                     </div>
 649                 </div>
 650             </form>
 651         </div>
 652       </div>
 653       <div class="modal-footer">
 654         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 655         <button type="button" class="btn btn-primary" id="drone_imagery_plot_polygon_remove_polygon_submit">Remove Plot Polygon</button>
 656       </div>
 657     </div>
 658   </div>
 659 </div>
 660
 661 <div class="modal fade" id="drone_imagery_merge_channels_dialog" name="drone_imagery_merge_channels_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryMergeChannelsDialog" data-backdrop="static">
 662   <div class="modal-dialog modal-xl" role="document">
 663     <div class="modal-content">
 664       <div class="modal-header">
 665         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 666         <h4 class="modal-title" id="droneImageryMergeChannelsDialog">Merge Drone Run Bands Into Single 3-channel image</h4>
 667       </div>
 668       <div class="modal-body">
 669         <div class="container-fluid">
 670             <form class="form-horizontal" id="drone_imagery_merge_bands_form">
 671                 <div class="form-group">
 672                     <label class="col-sm-5 control-label">First Band:</label>
 673                     <div class="col-sm-7">
 674                         <div id="drone_imagery_merge_bands_band1_select"></div>
 675                     </div>
 676                 </div>
 677                 <div class="form-group">
 678                     <label class="col-sm-5 control-label">Second Band:</label>
 679                     <div class="col-sm-7">
 680                         <div id="drone_imagery_merge_bands_band2_select"></div>
 681                     </div>
 682                 </div>
 683                 <div class="form-group">
 684                     <label class="col-sm-5 control-label">Third Band:</label>
 685                     <div class="col-sm-7">
 686                         <div id="drone_imagery_merge_bands_band3_select"></div>
 687                     </div>
 688                 </div>
 689                 <div class="form-group">
 690                     <label class="col-sm-5 control-label">Merge Image Type:</label>
 691                     <div class="col-sm-7">
 692                         <select class="form-control" id="drone_run_merge_image_type" name="drone_run_merge_image_type">
 693                             <option value="">Select One</option>
 694                             <option value="BGR">BGR (Band 1 = Blue, Band 2 = Green, Band 3 = Red)</option>
 695                             <option value="NRN">NRN (Band 1 = NIR, Band 2 = Red, Band 3 = NIR)</option>
 696                             <option value="NReN">NReN (Band 1 = NIR, Band 2 = Red Edge, Band 3 = NIR)</option>
 697                         </select>
 698                     </div>
 699                 </div>
 700             </form>
 701         </div>
 702
 703         <ul>
 704             <li>TGI = {GREEN band2} - 0.39*{RED band3} - 0.61*{BLUE band1}</li>
 705             <li>VARI = ( {GREEN band2} - {RED band3} ) / ( {GREEN band2} + {RED band3} - {BLUE band1} )</li>
 706             <li>NDVI = ( {NIR band1} - {RED band 2} ) / ( {NIR band1} + {RED band2} )</li>
 707             <li>NDRE = ( {NIR band1} - {RED EDGE band 2} ) / ( {NIR band1} + {RED EDGE band2} )</li>
 708         </ul>
 709
 710       </div>
 711       <div class="modal-footer">
 712         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 713         <button type="button" class="btn btn-primary" id="drone_imagery_merge_bands_submit">Merge Bands</button>
 714       </div>
 715     </div>
 716   </div>
 717 </div>
 718
 719 <div class="modal fade" id="drone_imagery_calc_phenotypes_zonal_channel_dialog" name="drone_imagery_calc_phenotypes_zonal_channel_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryCalcPhenotypesZonalChannelDialog" data-backdrop="static">
 720   <div class="modal-dialog modal-xl" role="document">
 721     <div class="modal-content">
 722       <div class="modal-header">
 723         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 724         <h4 class="modal-title" id="droneImageryCalcPhenotypesZonalChannelDialog">Select the Channel to Calculate Zonal Statistics On</h4>
 725       </div>
 726       <div class="modal-body">
 727           <div class="container-fluid">
 728
 729               <form class="form-horizontal">
 730                   <div class="form-group">
 731                       <label class="col-sm-5 control-label">Select Time Point In Drone Run Series:</label>
 732                       <div class="col-sm-7">
 733                           <div id="drone_imagery_calculate_phenotypes_zonal_stats_time_select_div">
 734                           </div>
 735                       </div>
 736                   </div>
 737               </form>
 738               <br/>
 739
 740               <div id="drone_imagery_calculate_phenotypes_zonal_stats_week_term_div"></div>
 741           </div>
 742
 743       </div>
 744       <div class="modal-footer">
 745         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 746         <button type="button" class="btn btn-primary" id="drone_imagery_calculate_phenotypes_zonal_stats_channel_select">Calculate Zonal Statistics</button>
 747       </div>
 748     </div>
 749   </div>
 750 </div>
 751
 752 <div class="modal fade" id="drone_imagery_delete_drone_run_dialog" name="drone_imagery_delete_drone_run_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryDeleteDroneRunDialog" data-backdrop="static">
 753   <div class="modal-dialog modal-xl" role="document">
 754     <div class="modal-content">
 755       <div class="modal-header">
 756         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 757         <h4 class="modal-title" id="droneImageryDeleteDroneRunDialog">Delete a Drone Run</h4>
 758       </div>
 759       <div class="modal-body">
 760         <div class="container-fluid">
 761             <div class="well">
 762                 <ul>
 763                     <li>Deleting a drone run will remove the drone run and all drone run bands permanently.</li>
 764                     <li>All images in the drone run will be deleted (obsoleted).</li>
 765                     <li>Phenotypes that were generated for plots in this drone run will be deleted permanently.</li>
 766                 </ul>
 767             </div>
 768         </div>
 769       </div>
 770       <div class="modal-footer">
 771         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 772         <button type="button" class="btn btn-primary" id="drone_imagery_delete_drone_run_confirm">Delete Drone Run</button>
 773       </div>
 774     </div>
 775   </div>
 776 </div>
 777
 778 <div class="modal fade" id="drone_imagery_calc_phenotypes_trial_dialog" name="drone_imagery_calc_phenotypes_trial_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryCalcPhenotypesZonalChannelTrialDialog" data-backdrop="static">
 779   <div class="modal-dialog modal-xl" role="document">
 780     <div class="modal-content">
 781       <div class="modal-header">
 782         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 783         <h4 class="modal-title" id="droneImageryCalcPhenotypesZonalChannelTrialDialog">Calculate Zonal Statistics</h4>
 784       </div>
 785       <div class="modal-body">
 786         <div class="container-fluid">
 787
 788             <form class="form-horizontal">
 789                 <div class="form-group">
 790                     <label class="col-sm-5 control-label">Select Time Point In Drone Run Series:</label>
 791                     <div class="col-sm-7">
 792                         <div id="drone_imagery_calculate_phenotypes_zonal_stats_trial_time_select_div">
 793                         </div>
 794                     </div>
 795                 </div>
 796             </form>
 797             <br/>
 798
 799             <div id="drone_imagery_week_term_div"></div>
 800         </div>
 801
 802       </div>
 803       <div class="modal-footer">
 804         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 805         <button type="button" class="btn btn-primary" id="drone_imagery_calculate_phenotypes_zonal_stats_trial_select">Calculate Zonal Statistics</button>
 806       </div>
 807     </div>
 808   </div>
 809 </div>
 810
 811 <div class="modal fade" id="drone_imagery_minimal_vi_standard_process_dialog" name="drone_imagery_minimal_vi_standard_process_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryMinimalVIStandardProcessDialog" data-backdrop="static">
 812   <div class="modal-dialog modal-xl" role="document">
 813     <div class="modal-content">
 814       <div class="modal-header">
 815         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 816         <h4 class="modal-title" id="droneImageryMinimalVIStandardProcessDialog">Run Minimal Vegetative Index Standard Process</h4>
 817       </div>
 818       <div class="modal-body">
 819         <div class="container-fluid">
 820
 821             <form class="form-horizontal">
 822                 <div class="form-group">
 823                     <label class="col-sm-5 control-label">Select Time Point In Drone Run Series:</label>
 824                     <div class="col-sm-7">
 825                         <div id="drone_imagery_calculate_phenotypes_minimal_vi_standard_process_time_select_div">
 826                         </div>
 827                     </div>
 828                 </div>
 829             </form>
 830             <br/>
 831
 832             <div id="drone_imagery_minimal_vi_standard_process_week_term_div"></div>
 833         </div>
 834
 835       </div>
 836       <div class="modal-footer">
 837         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 838         <button type="button" class="btn btn-primary" id="drone_imagery_minimal_vi_standard_process_select">Run Minimal Vegetative Index Standard Process</button>
 839       </div>
 840     </div>
 841   </div>
 842 </div>
 843
 844 <div class="modal fade" id="drone_imagery_extended_standard_process_dialog" name="drone_imagery_extended_standard_process_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryExtenededStandardProcessDialog" data-backdrop="static">
 845   <div class="modal-dialog modal-xl" role="document">
 846     <div class="modal-content">
 847       <div class="modal-header">
 848         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 849         <h4 class="modal-title" id="droneImageryExtenededStandardProcessDialog">Run Extended Standard Process</h4>
 850       </div>
 851       <div class="modal-body">
 852         <div class="container-fluid">
 853
 854             <form class="form-horizontal">
 855                 <div class="form-group">
 856                     <label class="col-sm-5 control-label">Select Time Point In Drone Run Series:</label>
 857                     <div class="col-sm-7">
 858                         <div id="drone_imagery_calculate_phenotypes_extended_standard_process_time_select_div">
 859                         </div>
 860                     </div>
 861                 </div>
 862             </form>
 863             <br/>
 864
 865             <div id="drone_imagery_extended_standard_process_week_term_div"></div>
 866         </div>
 867
 868       </div>
 869       <div class="modal-footer">
 870         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 871         <button type="button" class="btn btn-primary" id="drone_imagery_extended_standard_process_select">Run Extended Standard Process</button>
 872       </div>
 873     </div>
 874   </div>
 875 </div>
 876
 877 <div class="modal fade" id="drone_imagery_download_phenotypes_dialog" name="drone_imagery_download_phenotypes_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryDownloadPhenotypesDialog" data-backdrop="static">
 878   <div class="modal-dialog modal-xl" role="document">
 879     <div class="modal-content">
 880       <div class="modal-header">
 881         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 882         <h4 class="modal-title" id="droneImageryDownloadPhenotypesDialog">Download drone image phenotypes and plot images</h4>
 883       </div>
 884       <div class="modal-body">
 885         <div class="container-fluid">
 886
 887             <&| /util/workflow.mas, id=> "drone_imagery_download_phenotypes_workflow" &>
 888                 <&| /util/workflow.mas:step, title=> "Field Trial" &>
 889                     <& /page/page_title.mas, title=>"Select the field trial you are interested in" &>
 890                     <br/><br/>
 891                     <form class="form-horizontal">
 892                         <div class="form-group">
 893                             <label class="col-sm-3 control-label">Field Trial: </label>
 894                             <div class="col-sm-9" >
 895                                 <div id="drone_imagery_download_phenotypes_trial_select_div"></div>
 896                             </div>
 897                         </div>
 898                     </form>
 899                     <center>
 900                     <button class="btn btn-primary" id="drone_imagery_download_phenotypes_field_trial_select_step">Go to Next Step</button>
 901                     </center>
 902                 </&>
 903                 <&| /util/workflow.mas:step, title=> "Trait Selection" &>
 904                     <& /page/page_title.mas, title=>"Select the observation variable(s) you are interested in downloading" &>
 905                     <br/><br/>
 906                     <form class="form-horizontal">
 907                         <div class="form-group">
 908                             <label class="col-sm-3 control-label">Observation Variables Phenotyped in the Selected Field Trial: </label>
 909                             <div class="col-sm-9" >
 910                                 <div id="drone_imagery_download_phenotypes_trait_select_div"></div>
 911                             </div>
 912                         </div>
 913                     </form>
 914                     <center>
 915                     <button class="btn btn-primary" id="drone_imagery_download_phenotypes_trait_select_step">Go to Next Step</button>
 916                     </center>
 917                 </&>
 918                 <&| /util/workflow.mas:step, title=> "Download" &>
 919                     <& /page/page_title.mas, title=>"Download!" &>
 920
 921                     <div id ="drone_imagery_download_phenotypes_file_div">
 922                     </div>
 923
 924                     <br/><br/>
 925                     <center>
 926                     <button class="btn btn-primary" id="drone_imagery_download_phenotypes_confirm_step">Submit</button>
 927                     </center>
 928                 </&>
 929             </&>
 930
 931         </div>
 932
 933       </div>
 934       <div class="modal-footer">
 935         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 936       </div>
 937     </div>
 938   </div>
 939 </div>
 940
 941 <div class="modal fade" id="drone_imagery_calculate_statistics_dialog" name="drone_imagery_calculate_statistics_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryCalculateStatisticsDialog" data-backdrop="static">
 942   <div class="modal-dialog modal-xl" role="document">
 943     <div class="modal-content">
 944       <div class="modal-header">
 945         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 946         <h4 class="modal-title" id="droneImageryCalculateStatisticsDialog">Calculate statistics on drone phenotypes</h4>
 947       </div>
 948       <div class="modal-body">
 949         <div class="container-fluid">
 950
 951             <&| /util/workflow.mas, id=> "drone_imagery_calculate_statistics_workflow" &>
 952                 <&| /util/workflow.mas:step, title=> "Field Trial" &>
 953                     <& /page/page_title.mas, title=>"Select the field trial you are interested in" &>
 954                     <br/><br/>
 955                     <form class="form-horizontal">
 956                         <div class="form-group">
 957                             <label class="col-sm-3 control-label">Field Trial: </label>
 958                             <div class="col-sm-9" >
 959                                 <div id="drone_imagery_calculate_statistics_trial_select_div"></div>
 960                             </div>
 961                         </div>
 962                     </form>
 963                     <center>
 964                     <button class="btn btn-primary" id="drone_imagery_calculate_statistics_field_trial_select_step">Go to Next Step</button>
 965                     </center>
 966                 </&>
 967                 <&| /util/workflow.mas:step, title=> "Trait Selection" &>
 968                     <& /page/page_title.mas, title=>"Select the observation variable(s) you are interested in downloading" &>
 969                     <br/><br/>
 970                     <form class="form-horizontal">
 971                         <div class="form-group">
 972                             <label class="col-sm-3 control-label">Observation Variables Phenotyped in the Selected Field Trial: </label>
 973                             <div class="col-sm-9" >
 974                                 <div id="drone_imagery_calculate_statistics_trait_select_div"></div>
 975                             </div>
 976                         </div>
 977                     </form>
 978                     <center>
 979                     <button class="btn btn-primary" id="drone_imagery_calculate_statistics_trait_select_step">Go to Next Step</button>
 980                     </center>
 981                 </&>
 982                 <&| /util/workflow.mas:step, title=> "Statistics" &>
 983                     <& /page/page_title.mas, title=>"Select statistics to calculate" &>
 984
 985                     <div id ="drone_imagery_calculate_statistics_select_div">
 986                     </div>
 987                     <select class="form-control" id="drone_imagery_calculate_statistics_select_input">
 988                         <option value="lmer_germplasmname">LMER y~replicate+1|GermplasmName. Percent Variance Explained by GermplasmName</option>
 989                     </select>
 990
 991                     <br/><br/>
 992                     <center>
 993                     <button class="btn btn-primary" id="drone_imagery_calculate_statistics_select_step">Submit</button>
 994                     </center>
 995                 </&>
 996                 <&| /util/workflow.mas:step, title=> "Results" &>
 997                     <& /page/page_title.mas, title=>"Statistics results" &>
 998
 999                     <div id ="drone_imagery_calculate_statistics_result_div">
1000                     </div>
1001                 </&>
1002             </&>
1003
1004         </div>
1005
1006       </div>
1007       <div class="modal-footer">
1008         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
1009       </div>
1010     </div>
1011   </div>
1012 </div>
1013
1014 <div class="modal fade" id="drone_imagery_train_keras_cnn_dialog" name="drone_imagery_train_keras_cnn_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryTrainKerasCNNDialog" data-backdrop="static">
1015   <div class="modal-dialog modal-xl" role="document">
1016     <div class="modal-content">
1017       <div class="modal-header">
1018         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
1019         <h4 class="modal-title" id="droneImageryTrainKerasCNNDialog">Select a dataset to train Keras CNN</h4>
1020       </div>
1021       <div class="modal-body">
1022         <div class="container-fluid">
1023
1024             <&| /util/workflow.mas, id=> "drone_imagery_train_keras_model_workflow" &>
1025                 <&| /util/workflow.mas:step, title=> "Intro" &>
1026                     <& /page/page_title.mas, title=>"This workflow will guide you through training a keras model using images and phenotypes in the database" &>
1027                     <br/><br/>
1028                     <center>
1029                     <button class="btn btn-primary" onclick="Workflow.complete(this); return false;">Go to Next Step</button>
1030                     </center>
1031                 </&>
1032                 <&| /util/workflow.mas:step, title=> "Field Trial" &>
1033                     <& /page/page_title.mas, title=>"Select the field trial you are interested in" &>
1034                     <br/><br/>
1035                     <form class="form-horizontal">
1036                         <div class="form-group">
1037                             <label class="col-sm-3 control-label">Field Trial: </label>
1038                             <div class="col-sm-9" >
1039                                 <div id="drone_imagery_train_keras_cnn_trial_select_div"></div>
1040                             </div>
1041                         </div>
1042                     </form>
1043                     <br/><br/>
1044                     <center>
1045                     <button class="btn btn-primary" id="drone_imagery_train_keras_model_field_trial_select_step">Go to Next Step</button>
1046                     </center>
1047                 </&>
1048                 <&| /util/workflow.mas:step, title=> "Trait Selection" &>
1049                     <& /page/page_title.mas, title=>"Select the trait you are interested in predicting" &>
1050                     <br/><br/>
1051                     <form class="form-horizontal">
1052                         <div class="form-group">
1053                             <label class="col-sm-5 control-label">Traits Phenotyped in the Selected Field Trial: </label>
1054                             <div class="col-sm-7" >
1055                                 <div id="drone_imagery_train_keras_cnn_trait_select_div"></div>
1056                             </div>
1057                         </div>
1058                     </form>
1059                     <br/><br/><br/>
1060                     <center>
1061                     <button class="btn btn-primary" id="drone_imagery_train_keras_model_trait_select_step">Go to Next Step</button>
1062                     </center>
1063                 </&>
1064                 <&| /util/workflow.mas:step, title=> "Drone Run Selection" &>
1065                     <& /page/page_title.mas, title=>"Select the drone runs you are interested in using in the model" &>
1066
1067                     <table class="table table-bordered table-hover" id="drone_image_train_keras_drone_runs_table">
1068                         <thead>
1069                             <tr>
1070                                 <th>Select</th>
1071                                 <th>Drone Run Name</th>
1072                                 <th>Drone Run Type</th>
1073                                 <th>Drone Run Description</th>
1074                                 <th>Drone Run Date</th>
1075                                 <th>Field Trial Name</th>
1076                                 <th>Field Trial Description</th>
1077                             </tr>
1078                         </thead>
1079                     </table>
1080
1081                     <br/><br/>
1082                     <center>
1083                     <button class="btn btn-primary" id="drone_imagery_train_keras_model_drone_run_select_step">Go to Next Step</button>
1084                     </center>
1085                 </&>
1086                 <&| /util/workflow.mas:step, title=> "Images Selection" &>
1087                     <& /page/page_title.mas, title=>"Select the types of images you are interested in using in the model" &>
1088
1089                     <table class="table table-bordered table-hover" id="drone_image_train_keras_plot_polygon_image_type_table">
1090                         <thead>
1091                             <tr>
1092                                 <th>Select</th>
1093                                 <th>Field Trial</th>
1094                                 <th>Drone Run Name</th>
1095                                 <th>Drone Run Band Name</th>
1096                                 <th>Drone Run Band Type</th>
1097                                 <th>Plot Polygon Type</th>
1098                                 <th>Number of Images</th>
1099                             </tr>
1100                         </thead>
1101                     </table>
1102
1103                     <br/><br/>
1104                     <center>
1105                     <button class="btn btn-primary" id="drone_imagery_train_keras_model_plot_polygon_type_select_step">Go to Next Step</button>
1106                     </center>
1107                 </&>
1108                 <&| /util/workflow.mas:step, title=> "Confirm" &>
1109                     <& /page/page_title.mas, title=>"Train the model!" &>
1110
1111                     <br/><br/>
1112                     <center>
1113                     <button class="btn btn-primary" id="drone_imagery_train_keras_model_confirm_step">Submit</button>
1114                     </center>
1115                 </&>
1116             </&>
1117
1118         </div>
1119
1120       </div>
1121       <div class="modal-footer">
1122         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
1123       </div>
1124     </div>
1125   </div>
1126 </div>
1127
1128 <div class="modal fade" id="drone_imagery_standard_process_complete_dialog" name="drone_imagery_standard_process_complete_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryStandardProcessCompleteDialog" data-backdrop="static">
1129   <div class="modal-dialog modal-xl" role="document">
1130     <div class="modal-content">
1131       <div class="modal-header">
1132         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
1133         <h4 class="modal-title" id="droneImageryStandardProcessCompleteDialog">Standard Process Complete</h4>
1134       </div>
1135       <div class="modal-body">
1136         <div class="container-fluid">
1137             <p>
1138                 <span class="ui-icon ui-icon-circle-check" style="float: left; margin: 0 7px 50px 0;"></span>
1139                 It will take time to finish processing your drone run and calculating phenotypes for all plot polygon images, vegetative indices, and processing combinations. Once it is complete, the "Processing Icon" on the Manage->Drone Imagery page will disappear from the drone run.
1140             </p>
1141         </div>
1142       </div>
1143       <div class="modal-footer">
1144         <button type="button" class="btn btn-primary" data-dismiss="modal">Finish</button>
1145       </div>
1146     </div>
1147   </div>
1148 </div>
1149
1150 <div class="modal fade" id="drone_imagery_plot_polygon_template_options_dialog" name="drone_imagery_plot_polygon_template_options_dialog" tabindex="-1" role="dialog" aria-labelledby="droneImageryPlotPolygonTemplateDialog" data-backdrop="static">
1151   <div class="modal-dialog modal-xl" role="document">
1152     <div class="modal-content">
1153       <div class="modal-header">
1154         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
1155         <h4 class="modal-title" id="droneImageryPlotPolygonTemplateDialog">Plot Template Options</h4>
1156       </div>
1157       <div class="modal-body">
1158         <div class="container-fluid">
1159             <&| /page/info_section.mas, title => 'Copy/Paste Template', collapsible=>1, collapsed => 0, subtitle=> 'Copy/Paste this template onto the image.' &>
1160                 <button class="btn btn-primary" id="drone_imagery_plot_polygon_template_options_paste_click">Click To Paste</button>
1161             </&>
1162         </div>
1163       </div>
1164       <div class="modal-footer">
1165         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
1166       </div>
1167     </div>
1168   </div>
1169 </div>
1170
1171 <& /breeders_toolbox/drone_imagery/upload_drone_imagery_dialogs.mas &>
1172
1173 <script>
1174
1175 jQuery(document).ready(function() {
1176
1177     //
1178     // Standard Process for Drone Runs
1179     //
1180
1181     var manage_drone_imagery_standard_process_field_trial_id;
1182     var manage_drone_imagery_standard_process_drone_run_project_id;
1183     var manage_drone_imagery_standard_process_drone_run_band_project_id;
1184     var manage_drone_imagery_standard_process_rotate_stitched_image_id;
1185     var manage_drone_imagery_standard_process_rotate_drone_run_band_project_id;
1186     var manage_drone_imagery_standard_process_rotate_stitched_image_degrees;
1187     var manage_drone_imagery_standard_process_rotated_stitched_image_id;
1188     var manage_drone_imagery_standard_process_cropped_image_id;
1189     var manage_drone_imagery_standard_process_denoised_image_id;
1190     var manage_drone_imagery_standard_process_removed_background_image_id;
1191     var manage_drone_imagery_standard_process_current_threshold_background_removed_type;
1192     var manage_drone_imagery_standard_process_apply_drone_run_band_project_ids = [];
1193     var manage_drone_imagery_standard_process_apply_drone_run_band_vegetative_indices = [];
1194     var manage_drone_imagery_standard_process_phenotype_time = '';
1195
1196     jQuery(document).on('click', 'button[name="project_drone_imagery_standard_process"]', function(){
1197         showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1198
1199         manage_drone_imagery_standard_process_drone_run_project_id = jQuery(this).data('drone_run_project_id');
1200         manage_drone_imagery_standard_process_field_trial_id = jQuery(this).data('field_trial_id');
1201
1202         jQuery('#manage_drone_imagery_standard_process_drone_run_bands_table').DataTable({
1203             destroy : true,
1204             ajax : '/api/drone_imagery/drone_run_bands?select_checkbox_name=drone_run_standard_process_band_select&drone_run_project_id='+manage_drone_imagery_standard_process_drone_run_project_id
1205         });
1206     });
1207
1208     jQuery('#manage_drone_imagery_standard_process_drone_run_band_step').click(function(){
1209         var selected = [];
1210         jQuery('input[name="drone_run_standard_process_band_select"]:checked').each(function() {
1211             selected.push([jQuery(this).val(), jQuery(this).data('background_removed_threshold_type')]);
1212         });
1213         if (selected.length < 1){
1214             alert('Please select at least one drone run band! Preferably one with high contrast such as NIR.');
1215             return false;
1216         } else if (selected.length > 1){
1217             alert('Please select only one drone run band! Preferably one with high contrast such as NIR.');
1218             return false;
1219         } else {
1220             manage_drone_imagery_standard_process_drone_run_band_project_id = selected[0][0];
1221             manage_drone_imagery_standard_process_current_threshold_background_removed_type = selected[0][1];
1222             jQuery.ajax({
1223                 url : '/api/drone_imagery/get_project_md_image?drone_run_band_project_id='+manage_drone_imagery_standard_process_drone_run_band_project_id+'&project_image_type_name=stitched_drone_imagery',
1224                 beforeSend: function(){
1225                     showManageDroneImagerySection('manage_drone_imagery_loading_div');
1226                 },
1227                 success: function(response){
1228                     console.log(response);
1229                     manage_drone_imagery_standard_process_rotate_stitched_image_id = response.data[0]['image_id'];
1230                     manage_drone_imagery_standard_process_rotate_stitched_image_degrees = 0.00;
1231
1232                     showRotateImage(manage_drone_imagery_standard_process_rotate_stitched_image_id, 'drone_imagery_standard_process_rotate_original_stitched_div', 'manage_drone_imagery_standard_process_rotate_load_div');
1233
1234                     showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1235                 },
1236                 error: function(response){
1237                     alert('Error getting standard process image rotation step!');
1238                     showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1239                 }
1240             });
1241
1242             Workflow.complete("#manage_drone_imagery_standard_process_drone_run_band_step");
1243             Workflow.focus('#manage_drone_imagery_standard_process_workflow', 2);
1244         }
1245     });
1246
1247     jQuery('#drone_imagery_standard_process_rotate_stitched_view').click(function(){
1248         manage_drone_imagery_standard_process_rotate_stitched_image_degrees = parseFloat(jQuery('#drone_imagery_standard_process_rotate_degrees_input').val());
1249         applyShowRotateImage(manage_drone_imagery_standard_process_rotate_stitched_image_id, manage_drone_imagery_standard_process_drone_run_band_project_id, manage_drone_imagery_standard_process_rotate_stitched_image_degrees, 'drone_imagery_standard_process_rotate_original_stitched_div');
1250     });
1251
1252     jQuery('#drone_imagery_standard_process_rotate_stitched_crosshairs').click(function(){
1253         drawRotateCrosshairs(getRandomColor(), 'drone_imagery_standard_process_rotate_original_stitched_div');
1254     });
1255
1256     jQuery('#drone_imagery_standard_process_rotate_stitched_restart').click(function(){
1257         showRotateImage(manage_drone_imagery_standard_process_rotate_stitched_image_id, 'drone_imagery_standard_process_rotate_original_stitched_div', 'manage_drone_imagery_standard_process_rotate_load_div');
1258         manage_drone_imagery_standard_process_rotate_stitched_image_degrees = 0.00;
1259     });
1260
1261     jQuery('#manage_drone_imagery_standard_process_rotate_step').click(function() {
1262         var rotate_stitched_image_degrees_text = jQuery('#drone_imagery_standard_process_rotate_degrees_input').val();
1263         if (rotate_stitched_image_degrees_text == '') {
1264             alert('Please give a number of degrees first! Can be a decimal amount.');
1265             return;
1266         }
1267         if (isNaN(rotate_stitched_image_degrees_text)) {
1268             alert('Please give a number of degrees first! Can be a decimal amount.');
1269             return;
1270         }
1271         manage_drone_imagery_standard_process_rotate_stitched_image_degrees = parseFloat(rotate_stitched_image_degrees_text);
1272         jQuery.ajax({
1273             url : '/api/drone_imagery/rotate_image?image_id='+manage_drone_imagery_standard_process_rotate_stitched_image_id+'&drone_run_band_project_id='+manage_drone_imagery_standard_process_drone_run_band_project_id+'&angle='+manage_drone_imagery_standard_process_rotate_stitched_image_degrees,
1274             beforeSend: function() {
1275                 showManageDroneImagerySection('manage_drone_imagery_loading_div');
1276             },
1277             success: function(response){
1278                 console.log(response);
1279                 manage_drone_imagery_standard_process_rotated_stitched_image_id = response.rotated_image_id;
1280                 showCropImageStart(manage_drone_imagery_standard_process_rotated_stitched_image_id, 'drone_imagery_standard_process_crop_original_stitched_div', 'manage_drone_imagery_standard_process_crop_load_div');
1281
1282                 get_select_box('drone_imagery_parameter_select','plot_polygons_standard_process_previously_saved_image_cropping_templates', {'name':'drone_imagery_standard_process_previously_saved_image_cropping_select', 'id':'drone_imagery_standard_process_previously_saved_image_cropping_select', 'empty':1, 'field_trial_id':manage_drone_imagery_standard_process_field_trial_id, 'parameter':'image_cropping' });
1283
1284                 Workflow.complete("#manage_drone_imagery_standard_process_rotate_step");
1285                 Workflow.focus('#manage_drone_imagery_standard_process_workflow', 3);
1286
1287                 showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1288             },
1289             error: function(response){
1290                 //alert('Error saving standard process rotated image image!');
1291                 showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1292             }
1293         });
1294     });
1295
1296     jQuery(document).on('click', '#manage_drone_imagery_standard_process_cropping_step', function(){
1297         console.log(crop_points);
1298         if (crop_points.length != 4) {
1299             alert('Please click 4 points on the image to draw a rectangle first!');
1300             return false;
1301         }
1302         jQuery.ajax({
1303             url : '/api/drone_imagery/crop_image?image_id='+manage_drone_imagery_standard_process_rotated_stitched_image_id+'&polygon='+JSON.stringify(crop_points)+'&drone_run_band_project_id='+manage_drone_imagery_standard_process_drone_run_band_project_id,
1304             beforeSend: function() {
1305                 showManageDroneImagerySection('manage_drone_imagery_loading_div');
1306             },
1307             success: function(response){
1308                 console.log(response);
1309                 manage_drone_imagery_standard_process_cropped_image_id = response.cropped_image_id;
1310                 if (response.error) {
1311                     alert(response.error);
1312                     return false;
1313                 } else {
1314                     jQuery.ajax({
1315                         url : '/api/drone_imagery/denoise?image_id='+manage_drone_imagery_standard_process_cropped_image_id+'&drone_run_band_project_id='+manage_drone_imagery_standard_process_drone_run_band_project_id,
1316                         success: function(response){
1317                             console.log(response);
1318                             manage_drone_imagery_standard_process_denoised_image_id = response.denoised_image_id;
1319                             remove_background_current_image_id = manage_drone_imagery_standard_process_denoised_image_id;
1320                             remove_background_drone_run_band_project_id = manage_drone_imagery_standard_process_drone_run_band_project_id;
1321
1322                             showRemoveBackgroundHistogramStart(manage_drone_imagery_standard_process_denoised_image_id, 'drone_imagery_standard_process_remove_background_original', 'drone_imagery_standard_process_remove_background_histogram_div', 'manage_drone_imagery_standard_process_remove_background_load_div');
1323
1324                             Workflow.complete("#manage_drone_imagery_standard_process_cropping_step");
1325                             Workflow.focus('#manage_drone_imagery_standard_process_workflow', 4);
1326
1327                             showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1328                         },
1329                         error: function(response){
1330                             alert('Error standard process denoising image!');
1331                             showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1332                         }
1333                     });
1334                 }
1335             },
1336             error: function(response){
1337                 alert('Error standard process cropping image!');
1338                 showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1339             }
1340         });
1341     });
1342
1343     jQuery(document).on('click', '#drone_imagery_standard_process_cropping_use_previous_cropping', function() {
1344         var plot_polygons_use_previously_saved_cropping = jQuery('#drone_imagery_standard_process_previously_saved_image_cropping_select').val();
1345         jQuery.ajax({
1346             url : '/api/drone_imagery/retrieve_parameter_template?plot_polygons_template_projectprop_id='+plot_polygons_use_previously_saved_cropping,
1347             success: function(response){
1348                 console.log(response);
1349                 jQuery.ajax({
1350                     url : '/api/drone_imagery/crop_image?image_id='+manage_drone_imagery_standard_process_rotated_stitched_image_id+'&polygon='+JSON.stringify(response.parameter[0])+'&drone_run_band_project_id='+manage_drone_imagery_standard_process_drone_run_band_project_id,
1351                     beforeSend: function() {
1352                         showManageDroneImagerySection('manage_drone_imagery_loading_div');
1353                     },
1354                     success: function(response){
1355                         console.log(response);
1356                         manage_drone_imagery_standard_process_cropped_image_id = response.cropped_image_id;
1357                         if (response.error) {
1358                             alert(response.error);
1359                             return false;
1360                         } else {
1361                             jQuery.ajax({
1362                                 url : '/api/drone_imagery/denoise?image_id='+manage_drone_imagery_standard_process_cropped_image_id+'&drone_run_band_project_id='+manage_drone_imagery_standard_process_drone_run_band_project_id,
1363                                 success: function(response){
1364                                     console.log(response);
1365                                     manage_drone_imagery_standard_process_denoised_image_id = response.denoised_image_id;
1366                                     remove_background_current_image_id = manage_drone_imagery_standard_process_denoised_image_id;
1367                                     remove_background_drone_run_band_project_id = manage_drone_imagery_standard_process_drone_run_band_project_id;
1368
1369                                     showRemoveBackgroundHistogramStart(manage_drone_imagery_standard_process_denoised_image_id, 'drone_imagery_standard_process_remove_background_original', 'drone_imagery_standard_process_remove_background_histogram_div', 'manage_drone_imagery_standard_process_remove_background_load_div');
1370
1371                                     Workflow.complete("#manage_drone_imagery_standard_process_cropping_step");
1372                                     Workflow.focus('#manage_drone_imagery_standard_process_workflow', 4);
1373
1374                                     showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1375                                 },
1376                                 error: function(response){
1377                                     alert('Error standard process denoising image!');
1378                                     showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1379                                 }
1380                             });
1381                         }
1382                     },
1383                     error: function(response){
1384                         showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1385                         alert('Error cropping image!');
1386                     }
1387                 });
1388             },
1389             error: function(response){
1390                 alert('Error retrieving saved cropping template in standard process!');
1391                 showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1392             }
1393         });
1394         return;
1395     });
1396
1397     jQuery('#drone_imagery_standard_process_remove_background_defined_percentage_submit').click(function(){
1398         var drone_imagery_remove_background_lower_percentage = Number(jQuery('#drone_imagery_standard_process_remove_background_lower_threshold_percentage').val());
1399         var drone_imagery_remove_background_upper_percentage = Number(jQuery('#drone_imagery_standard_process_remove_background_upper_threshold_percentage').val());
1400
1401         //var threshold_value_return = calculateThresholdPercentageValues('drone_imagery_remove_background_original', drone_imagery_remove_background_lower_percentage, drone_imagery_remove_background_upper_percentage);
1402
1403         manage_drone_imagery_standard_process_remove_background_threshold_percentage_save(manage_drone_imagery_standard_process_denoised_image_id, manage_drone_imagery_standard_process_current_threshold_background_removed_type, manage_drone_imagery_standard_process_drone_run_band_project_id, drone_imagery_remove_background_lower_percentage, drone_imagery_remove_background_upper_percentage);
1404     });
1405
1406     function manage_drone_imagery_standard_process_remove_background_threshold_percentage_save(image_id, image_type, drone_run_band_project_id, lower_threshold_percentage, upper_threshold_percentage){
1407         jQuery.ajax({
1408             type: 'POST',
1409             url: '/api/drone_imagery/remove_background_percentage_save',
1410             dataType: "json",
1411             beforeSend: function() {
1412                 showManageDroneImagerySection('manage_drone_imagery_loading_div');
1413             },
1414             data: {
1415                 'image_id': image_id,
1416                 'image_type_list': image_type,
1417                 'drone_run_band_project_id': drone_run_band_project_id,
1418                 'lower_threshold_percentage': lower_threshold_percentage,
1419                 'upper_threshold_percentage': upper_threshold_percentage
1420             },
1421             success: function(response){
1422                 console.log(response);
1423                 if(response.error) {
1424                     alert(response.error);
1425                 }
1426                 manage_drone_imagery_standard_process_removed_background_image_id = response[0]['removed_background_image_id'];
1427
1428                 showPlotPolygonStart(manage_drone_imagery_standard_process_removed_background_image_id, drone_run_band_project_id, 'drone_imagery_standard_process_plot_polygons_original_stitched_div', 'drone_imagery_standard_process_plot_polygons_top_section', 'manage_drone_imagery_standard_process_plot_polygons_load_div');
1429
1430                 showPlotPolygonTableStart(manage_drone_imagery_standard_process_field_trial_id, 'drone_imagery_standard_process_trial_layout_div', 'drone_imagery_standard_process_layout_table')
1431
1432                 get_select_box('drone_imagery_parameter_select','plot_polygons_standard_process_previously_saved_plot_polygon_templates', {'name': 'plot_polygons_standard_process_template_select', 'id': 'plot_polygons_standard_process_template_select', 'empty':1, 'field_trial_id':manage_drone_imagery_standard_process_field_trial_id, 'parameter':'plot_polygons' });
1433
1434                 Workflow.complete("#drone_imagery_standard_process_remove_background_defined_percentage_submit");
1435                 Workflow.focus('#manage_drone_imagery_standard_process_workflow', 5);
1436
1437                 showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1438             },
1439             error: function(response){
1440                 //alert('Error saving standard process removed background image!');
1441                 showManageDroneImagerySection('manage_drone_imagery_standard_process_div');
1442             }
1443         });
1444     }
1445
1446     jQuery('#plot_polygons_standard_process_use_previously_saved_template').click(function() {
1447         var plot_polygons_use_previously_saved_template = jQuery('#plot_polygons_standard_process_template_select').val();
1448         if (plot_polygons_use_previously_saved_template == '') {
1449             alert('Please select a previously saved template before trying to apply it. If there is not a template listed, then you can create one using the templating tool above.');
1450             return;
1451         }
1452
1453         jQuery.ajax({
1454             url : '/api/drone_imagery/retrieve_parameter_template?plot_polygons_template_projectprop_id='+plot_polygons_use_previously_saved_template,
1455             success: function(response){
1456                 console.log(response);
1457
1458                 drone_imagery_plot_polygons_display = response.parameter;
1459                 drone_imagery_plot_polygons = response.parameter;
1460
1461                 draw_canvas_image(background_image_url, 0);
1462                 droneImageryDrawLayoutTable(field_trial_layout_response, drone_imagery_plot_polygons, 'drone_imagery_standard_process_trial_layout_div', 'drone_imagery_standard_process_layout_table');
1463                 droneImageryRectangleLayoutTable(drone_imagery_plot_polygons, 'drone_imagery_standard_process_generated_polygons_div', 'drone_imagery_standard_process_generated_polygons_table', 'drone_imagery_standard_process_plot_polygons_generated_assign', 'drone_imagery_standard_process_plot_polygons_submit_bottom');
1464             },
1465             error: function(response){
1466                 alert('Error retrieving plot polygons template in standard process!');
1467             }
1468         });
1469         return;
1470     });
1471
1472     jQuery('#drone_imagery_standard_process_plot_polygons_rectangles_apply').click(function() {
1473         plot_polygons_display_points = [];
1474         plot_polygons_ind_points = [];
1475         plot_polygons_ind_4_points = [];
1476
1477         var num_rows_val = jQuery('#drone_imagery_standard_process_plot_polygons_num_rows').val();
1478         var num_cols_val = jQuery('#drone_imagery_standard_process_plot_polygons_num_cols').val();
1479         var section_top_row_left_offset_val = jQuery('#drone_imagery_standard_process_plot_polygons_top_row_left_offset').val();
1480         var section_top_row_right_offset_val = jQuery('#drone_imagery_standard_process_plot_polygons_top_row_right_offset').val();
1481         var section_bottom_row_left_offset_val = jQuery('#drone_imagery_standard_process_plot_polygons_bottom_row_left_offset').val();
1482         var section_left_column_top_offset_val = jQuery('#drone_imagery_standard_process_plot_polygons_left_column_top_offset').val();
1483         var section_left_column_bottom_offset_val = jQuery('#drone_imagery_standard_process_plot_polygons_left_column_bottom_offset').val();
1484         var section_right_column_bottom_offset_val = jQuery('#drone_imagery_standard_process_plot_polygons_right_col_bottom_offset').val();
1485
1486         plotPolygonsRectanglesApply(num_rows_val, num_cols_val, section_top_row_left_offset_val, section_bottom_row_left_offset_val, section_left_column_top_offset_val, section_left_column_bottom_offset_val, section_top_row_right_offset_val, section_right_column_bottom_offset_val, 'drone_imagery_standard_process_generated_polygons_div', 'drone_imagery_standard_process_generated_polygons_table', 'drone_imagery_standard_process_plot_polygons_generated_assign', 'drone_imagery_standard_process_plot_polygons_submit_bottom', 'drone_imagery_standard_process_plot_polygons_active_templates');
1487     });
1488
1489     var drone_imagery_standard_process_plot_polygon_click_type = '';
1490     jQuery('#drone_imagery_standard_process_plot_polygons_top_left_click').click(function(){
1491         alert('Now click the top left corner of your field on the image below.');
1492         drone_imagery_standard_process_plot_polygon_click_type = 'top_left';
1493     });
1494     jQuery('#drone_imagery_standard_process_plot_polygons_top_right_click').click(function(){
1495         alert('Now click the top right corner of your field on the image below.');
1496         drone_imagery_standard_process_plot_polygon_click_type = 'top_right';
1497     });
1498     jQuery('#drone_imagery_standard_process_plot_polygons_bottom_left_click').click(function(){
1499         alert('Now click the bottom left corner of your field on the image below.');
1500         drone_imagery_standard_process_plot_polygon_click_type = 'bottom_left';
1501     });
1502     jQuery('#drone_imagery_standard_process_plot_polygons_bottom_right_click').click(function(){
1503         alert('Now click the bottom right corner of your field on the image below.');
1504         drone_imagery_standard_process_plot_polygon_click_type = 'bottom_right';
1505     });
1506     jQuery(document).on('click', '#drone_imagery_standard_process_plot_polygons_get_distance', function(){
1507         alert('Click on two points in image. The distance will be returned.');
1508         drone_imagery_standard_process_plot_polygon_click_type = 'get_distance';
1509         return false;
1510     });
1511
1512     jQuery(document).on('click', '#drone_imagery_standard_process_plot_polygons_clear', function(){
1513         plot_polygons_display_points = [];
1514         plot_polygons_ind_points = [];
1515         plot_polygons_ind_4_points = [];
1516         drone_imagery_plot_polygons = {};
1517         drone_imagery_plot_generated_polygons = {};
1518         drone_imagery_plot_polygons_display = {};
1519         plot_polygons_generated_polygons = [];
1520         drone_imagery_plot_polygons_removed_numbers = [];
1521         plot_polygons_template_dimensions = [];
1522         ctx.clearRect(0, 0, canvas.width, canvas.height);
1523         draw_canvas_image(background_image_url, 0);
1524         jQuery('#drone_imagery_standard_process_generated_polygons_div').html('');
1525         droneImageryDrawLayoutTable(field_trial_layout_response, drone_imagery_plot_polygons, 'drone_imagery_standard_process_trial_layout_div', 'drone_imagery_standard_process_layout_table');
1526         droneImageryDrawPlotPolygonActiveTemplatesTable("drone_imagery_standard_process_plot_polygons_active_templates", plot_polygons_template_dimensions);
1527     });
1528
1529     jQuery(document).on('click', '#drone_imagery_standard_process_plot_polygons_clear_one', function(){
1530         jQuery('#drone_imagery_plot_polygon_remove_polygon').modal('show');
1531         return false;
1532     });
1533
1534     jQuery(document).on('click', '#drone_imagery_standard_process_plot_polygons_generated_assign', function() {
1535         generatePlotPolygonAssignments('drone_imagery_standard_process_trial_layout_div', 'drone_imagery_standard_process_layout_table');
1536
1537         jQuery('input[name="drone_imagery_plot_polygons_autocomplete"]').each(function() {
1538             var stock_name = this.value;
1539             if (stock_name != '') {
1540                 var polygon = drone_imagery_plot_generated_polygons[jQuery(this).data('generated_polygon_key')];
1541                 drone_imagery_plot_polygons[stock_name] = polygon;
1542             }
1543         });
1544     });
1545
1546     jQuery(document).on('click', 'button[name=drone_imagery_standard_process_plot_polygons_submit_bottom]', function(){
1547         jQuery.ajax({
1548             type: 'POST',
1549             url: '/api/drone_imagery/save_plot_polygons_template',
1550             dataType: "json",
1551             data: {
1552                 'drone_run_band_project_id': manage_drone_imagery_standard_process_drone_run_band_project_id,
1553                 'stock_polygons': JSON.stringify(drone_imagery_plot_polygons)
1554             },
1555             success: function(response){
1556                 console.log(response);
1557                 if(response.error) {
1558                     alert(response.error);
1559                 } else {
1560                     Workflow.complete("#drone_imagery_standard_process_generated_polygons_div");
1561                     Workflow.focus('#manage_drone_imagery_standard_process_workflow', 6);
1562                 }
1563             },
1564             error: function(response){
1565                 //alert('Error saving standard process assigned plot polygons!')
1566             }
1567         });
1568
1569         jQuery('#manage_drone_imagery_standard_process_drone_run_bands_apply_table').DataTable({
1570             destroy : true,
1571             ajax : '/api/drone_imagery/drone_run_bands?select_checkbox_name=drone_run_standard_process_band_apply_select&drone_run_project_id='+manage_drone_imagery_standard_process_drone_run_project_id+'&select_all=1&disable=1'
1572         });
1573     });
1574
1575     jQuery('#manage_drone_imagery_standard_process_drone_run_band_apply_step').click(function(){
1576         manage_drone_imagery_standard_process_apply_drone_run_band_project_ids = [];
1577         jQuery('input[name="drone_run_standard_process_band_apply_select"]:checked').each(function() {
1578             manage_drone_imagery_standard_process_apply_drone_run_band_project_ids.push(jQuery(this).val());
1579         });
1580         if (manage_drone_imagery_standard_process_apply_drone_run_band_project_ids.length < 1){
1581             alert('Please select at least one other drone run band!');
1582             return false;
1583         } else {
1584             Workflow.complete("#manage_drone_imagery_standard_process_drone_run_band_apply_step");
1585             Workflow.focus('#manage_drone_imagery_standard_process_workflow', 7);
1586         }
1587     });
1588
1589     jQuery('#manage_drone_imagery_standard_process_indices_step').click(function(){
1590         manage_drone_imagery_standard_process_apply_drone_run_band_vegetative_indices = [];
1591         jQuery('input[name="drone_imagery_standard_process_apply_indices_select"]:checked').each(function() {
1592             manage_drone_imagery_standard_process_apply_drone_run_band_vegetative_indices.push(jQuery(this).val());
1593         });
1594         if (manage_drone_imagery_standard_process_apply_drone_run_band_vegetative_indices.length < 1){
1595             alert('Please select at least one vegetative index!');
1596             return false;
1597         } else {
1598             jQuery.ajax({
1599                 type: 'GET',
1600                 url: '/api/drone_imagery/get_weeks_after_planting_date?drone_run_project_id='+manage_drone_imagery_standard_process_drone_run_project_id,
1601                 dataType: "json",
1602                 beforeSend: function (){
1603                     jQuery('#working_modal').modal('show');
1604                 },
1605                 success: function(response){
1606                     jQuery('#working_modal').modal('hide');
1607                     console.log(response);
1608                     if (response.error) {
1609                         alert(response.error);
1610                     }
1611                     get_select_box('ontology_children','drone_imagery_standard_process_calculate_phenotypes_zonal_stats_time_select_div', {'selectbox_id':'drone_imagery_standard_process_calculate_phenotypes_zonal_stats_time_select', 'selectbox_name':'drone_imagery_standard_process_calculate_phenotypes_zonal_stats_time_select', 'empty':1, 'rel_cvterm':'is_a', 'rel_cv':'relationship', 'parent_node_cvterm':'time of year|TIME:0000005', 'selected':response.time_ontology_cvterm_id });
1612
1613                     var html = "<center><b>Field Trial Planting Date</b>: "+response.planting_date+"<br/><b>Drone Run Date</b>: "+response.drone_run_date+"<br/><b>Number of Weeks Ontology Term Difference</b>: "+response.rounded_time_difference_weeks+"<br/><b>Number of Weeks Ontology Term</b>: "+response.time_ontology_term+"<br/></center>";
1614                     jQuery('#drone_imagery_standard_process_week_term_div').html(html);
1615                     if (response.time_ontology_cvterm_id) {
1616                         manage_drone_imagery_standard_process_phenotype_time = response.time_ontology_cvterm_id;
1617                     }
1618                 },
1619                 error: function(response){
1620                     alert('Error getting time terms!');
1621                     jQuery('#working_modal').modal('hide');
1622                 }
1623             });
1624
1625             Workflow.complete("#manage_drone_imagery_standard_process_indices_step");
1626             Workflow.focus('#manage_drone_imagery_standard_process_workflow', 8);
1627         }
1628     });
1629
1630     jQuery('#manage_drone_imagery_standard_process_phenotypes_step').click(function(){
1631         var selected = [];
1632         if (manage_drone_imagery_standard_process_phenotype_time == '') {
1633             manage_drone_imagery_standard_process_phenotype_time = jQuery('#drone_imagery_standard_process_calculate_phenotypes_zonal_stats_time_select').val();
1634         }
1635
1636         jQuery('input[name="drone_imagery_standard_process_phenotypes_select"]:checked').each(function() {
1637             selected.push(jQuery(this).val());
1638         });
1639         if (selected.length < 1){
1640             alert('Please select at least one phenotype!');
1641             return false;
1642         } else {
1643             jQuery.ajax({
1644                 type: 'POST',
1645                 url: '/api/drone_imagery/standard_process_apply',
1646                 dataType: "json",
1647                 data: {
1648                     'drone_run_project_id': manage_drone_imagery_standard_process_drone_run_project_id,
1649                     'drone_run_band_project_id': manage_drone_imagery_standard_process_drone_run_band_project_id,
1650                     'apply_drone_run_band_project_ids': JSON.stringify(manage_drone_imagery_standard_process_apply_drone_run_band_project_ids),
1651                     'vegetative_indices': JSON.stringify(manage_drone_imagery_standard_process_apply_drone_run_band_vegetative_indices),
1652                     'phenotype_types': JSON.stringify(selected),
1653                     'time_cvterm_id': manage_drone_imagery_standard_process_phenotype_time,
1654                     'standard_process_type': 'minimal'
1655                 },
1656                 success: function(response){
1657                     console.log(response);
1658                     if(response.error) {
1659                         alert(response.error);
1660                     }
1661                 },
1662                 error: function(response){
1663                     //alert('Error saving standard process assigned plot polygons!')
1664                 }
1665             });
1666
1667             Workflow.complete("#manage_drone_imagery_standard_process_phenotypes_step");
1668             jQuery('#drone_imagery_standard_process_complete_dialog').modal('show');
1669         }
1670     });
1671
1672     jQuery('#drone_imagery_standard_process_complete_dialog').on('hidden.bs.modal', function () {
1673         location.reload();
1674     })
1675
1676     jQuery(document).on('click', 'button[name="project_drone_imagery_phenotype_run"]', function(){
1677         manage_drone_imagery_standard_process_drone_run_project_id = jQuery(this).data('drone_run_project_id');
1678
1679         jQuery.ajax({
1680             type: 'GET',
1681             url: '/api/drone_imagery/get_weeks_after_planting_date?drone_run_project_id='+manage_drone_imagery_standard_process_drone_run_project_id,
1682             dataType: "json",
1683             beforeSend: function (){
1684                 jQuery('#working_modal').modal('show');
1685             },
1686             success: function(response){
1687                 jQuery('#working_modal').modal('hide');
1688                 console.log(response);
1689                 if (response.error) {
1690                     alert(response.error);
1691                 }
1692                 get_select_box('ontology_children','drone_imagery_calculate_phenotypes_zonal_stats_trial_time_select_div', {'selectbox_id':'drone_imagery_calculate_phenotypes_zonal_stats_trial_time_select', 'selectbox_name':'drone_imagery_calculate_phenotypes_zonal_stats_trial_time_select', 'empty':1, 'rel_cvterm':'is_a', 'rel_cv':'relationship', 'parent_node_cvterm':'time of year|TIME:0000005', 'selected':response.time_ontology_cvterm_id });
1693
1694                 var html = "<center><b>Field Trial Planting Date</b>: "+response.planting_date+"<br/><b>Drone Run Date</b>: "+response.drone_run_date+"<br/><b>Number of Weeks Difference</b>: "+response.rounded_time_difference_weeks+"<br/><b>Number of Weeks Ontology Term</b>: "+response.time_ontology_term+"<br/></center>";
1695                 jQuery('#drone_imagery_week_term_div').html(html);
1696                 if (response.time_ontology_cvterm_id) {
1697                     manage_drone_imagery_standard_process_phenotype_time = response.time_ontology_cvterm_id;
1698                 }
1699             },
1700             error: function(response){
1701                 alert('Error getting time terms!');
1702                 jQuery('#working_modal').modal('hide');
1703             }
1704         });
1705
1706         jQuery('#drone_imagery_calc_phenotypes_trial_dialog').modal('show');
1707     });
1708
1709     jQuery('#drone_imagery_calculate_phenotypes_zonal_stats_trial_select').click(function(){
1710         if (manage_drone_imagery_standard_process_phenotype_time == '') {
1711             manage_drone_imagery_standard_process_phenotype_time = jQuery('#drone_imagery_calculate_phenotypes_zonal_stats_trial_time_select').val();
1712         }
1713         if (manage_drone_imagery_standard_process_phenotype_time == '') {
1714             alert('Please select a time term!');
1715             return false;
1716         }
1717
1718         alert("Phenotype generation will occur in the background. You can check the indicator on this page by refreshing the page.");
1719
1720         jQuery.ajax({
1721             type: 'GET',
1722             url: '/api/drone_imagery/generate_phenotypes?drone_run_project_id='+manage_drone_imagery_standard_process_drone_run_project_id+'&time_cvterm_id='+manage_drone_imagery_standard_process_phenotype_time+'&standard_process_type=extended',
1723             dataType: "json",
1724             success: function(response){
1725                 console.log(response);
1726                 if (response.error) {
1727                     alert(response.error);
1728                 }
1729                 if (response.success) {
1730                     alert('Drone image phenotypes stored!');
1731                 }
1732             },
1733             error: function(response){
1734                 alert('Error generating drone image phenotypes!');
1735             }
1736         });
1737
1738         location.reload();
1739     });
1740
1741     //
1742     // Minimal VI Standard Process ()
1743     //
1744
1745     var manage_drone_imagery_standard_process_minimal_vi_drone_run_project_id;
1746     var manage_drone_imagery_standard_process_minimal_vi_phenotype_time = '';
1747
1748     jQuery(document).on('click', 'button[name=project_drone_imagery_standard_process_minimal_vi]', function(){
1749         manage_drone_imagery_standard_process_minimal_vi_drone_run_project_id = jQuery(this).data('drone_run_project_id');
1750
1751         jQuery.ajax({
1752             type: 'GET',
1753             url: '/api/drone_imagery/get_weeks_after_planting_date?drone_run_project_id='+manage_drone_imagery_standard_process_minimal_vi_drone_run_project_id,
1754             dataType: "json",
1755             beforeSend: function (){
1756                 jQuery('#working_modal').modal('show');
1757             },
1758             success: function(response){
1759                 jQuery('#working_modal').modal('hide');
1760                 console.log(response);
1761                 if (response.error) {
1762                     alert(response.error);
1763                 }
1764                 get_select_box('ontology_children','drone_imagery_calculate_phenotypes_minimal_vi_standard_process_time_select_div', {'selectbox_id':'drone_imagery_calculate_phenotypes_minimal_vi_standard_process_time_select', 'selectbox_name':'drone_imagery_calculate_phenotypes_minimal_vi_standard_process_time_select', 'empty':1, 'rel_cvterm':'is_a', 'rel_cv':'relationship', 'parent_node_cvterm':'time of year|TIME:0000005', 'selected':response.time_ontology_cvterm_id });
1765
1766                 var html = "<center><b>Field Trial Planting Date</b>: "+response.planting_date+"<br/><b>Drone Run Date</b>: "+response.drone_run_date+"<br/><b>Number of Weeks Difference</b>: "+response.rounded_time_difference_weeks+"<br/><b>Number of Weeks Ontology Term</b>: "+response.time_ontology_term+"<br/></center>";
1767                 jQuery('#drone_imagery_minimal_vi_standard_process_week_term_div').html(html);
1768                 if (response.time_ontology_cvterm_id) {
1769                     manage_drone_imagery_standard_process_minimal_vi_phenotype_time = response.time_ontology_cvterm_id;
1770                 }
1771             },
1772             error: function(response){
1773                 alert('Error getting time terms!');
1774                 jQuery('#working_modal').modal('hide');
1775             }
1776         });
1777
1778         jQuery('#drone_imagery_minimal_vi_standard_process_dialog').modal('show');
1779     });
1780
1781     jQuery('#drone_imagery_minimal_vi_standard_process_select').click(function() {
1782         if (manage_drone_imagery_standard_process_minimal_vi_phenotype_time == '') {
1783             manage_drone_imagery_standard_process_minimal_vi_phenotype_time = jQuery('#drone_imagery_calculate_phenotypes_minimal_vi_standard_process_time_select').val();
1784         }
1785         if (manage_drone_imagery_standard_process_minimal_vi_phenotype_time == '') {
1786             alert('Please select a time term!');
1787             return false;
1788         }
1789
1790         alert("Minimal vegetative index standard process will occur in the background. You can check the indicator on this page by refreshing the page.");
1791
1792         jQuery.ajax({
1793             type: 'POST',
1794             url: '/api/drone_imagery/standard_process_minimal_vi_apply?drone_run_project_id='+manage_drone_imagery_standard_process_minimal_vi_drone_run_project_id,
1795             dataType: "json",
1796             success: function(response){
1797                 console.log(response);
1798                 if (response.error) {
1799                     alert(response.error);
1800                 } else {
1801                     alert('Minimal vegetative index standard process complete! Phenotype generation may still be occurring.');
1802                     location.reload();
1803                 }
1804             },
1805             error: function(response){
1806                 alert('Error running minimal vegetative index standard process!');
1807             }
1808         });
1809
1810         jQuery.ajax({
1811             type: 'GET',
1812             url: '/api/drone_imagery/generate_phenotypes?drone_run_project_id='+manage_drone_imagery_standard_process_minimal_vi_drone_run_project_id+'&time_cvterm_id='+manage_drone_imagery_standard_process_minimal_vi_phenotype_time+'&standard_process_type=minimal_vi',
1813             dataType: "json",
1814             success: function(response){
1815                 console.log(response);
1816                 if (response.error) {
1817                     alert(response.error);
1818                 }
1819                 if (response.success) {
1820                     alert('Drone image phenotypes stored for minimal vegetative index standard process!');
1821                 }
1822             },
1823             error: function(response){
1824                 alert('Error generating drone image phenotypes for minial vegetative index standard process!');
1825             }
1826         });
1827
1828         location.reload();
1829     });
1830
1831     //
1832     // Extended Standard Process
1833     //
1834
1835     var manage_drone_imagery_standard_process_extended_drone_run_project_id;
1836     var manage_drone_imagery_standard_process_extended_phenotype_time = '';
1837
1838     jQuery(document).on('click', 'button[name="project_drone_imagery_standard_process_extended"]', function() {
1839         manage_drone_imagery_standard_process_extended_drone_run_project_id = jQuery(this).data('drone_run_project_id');
1840         jQuery.ajax({
1841             type: 'GET',
1842             url: '/api/drone_imagery/get_weeks_after_planting_date?drone_run_project_id='+manage_drone_imagery_standard_process_extended_drone_run_project_id,
1843             dataType: "json",
1844             beforeSend: function (){
1845                 jQuery('#working_modal').modal('show');
1846             },
1847             success: function(response){
1848                 jQuery('#working_modal').modal('hide');
1849                 console.log(response);
1850                 if (response.error) {
1851                     alert(response.error);
1852                 }
1853                 get_select_box('ontology_children','drone_imagery_calculate_phenotypes_extended_standard_process_time_select_div', {'selectbox_id':'drone_imagery_calculate_phenotypes_extended_standard_process_time_select', 'selectbox_name':'drone_imagery_calculate_phenotypes_extended_standard_process_time_select', 'empty':1, 'rel_cvterm':'is_a', 'rel_cv':'relationship', 'parent_node_cvterm':'time of year|TIME:0000005', 'selected':response.time_ontology_cvterm_id });
1854
1855                 var html = "<center><b>Field Trial Planting Date</b>: "+response.planting_date+"<br/><b>Drone Run Date</b>: "+response.drone_run_date+"<br/><b>Number of Weeks Difference</b>: "+response.rounded_time_difference_weeks+"<br/><b>Number of Weeks Ontology Term</b>: "+response.time_ontology_term+"<br/></center>";
1856                 jQuery('#drone_imagery_extended_standard_process_week_term_div').html(html);
1857                 if (response.time_ontology_cvterm_id) {
1858                     manage_drone_imagery_standard_process_extended_phenotype_time = response.time_ontology_cvterm_id;
1859                 }
1860             },
1861             error: function(response){
1862                 alert('Error getting time terms!');
1863                 jQuery('#working_modal').modal('hide');
1864             }
1865         });
1866         jQuery('#drone_imagery_extended_standard_process_dialog').modal('show');
1867     });
1868
1869     jQuery('#drone_imagery_extended_standard_process_select').click(function(){
1870         if (manage_drone_imagery_standard_process_extended_phenotype_time == '') {
1871             manage_drone_imagery_standard_process_extended_phenotype_time = jQuery('#drone_imagery_calculate_phenotypes_extended_standard_process_time_select').val();
1872         }
1873         if (manage_drone_imagery_standard_process_extended_phenotype_time == '') {
1874             alert('Please select a time term!');
1875             return false;
1876         }
1877
1878         alert("Extended standard process will occur in the background. You can check the indicator on this page by refreshing the page.");
1879
1880         jQuery.ajax({
1881             type: 'GET',
1882             url: '/api/drone_imagery/standard_process_extended_apply?drone_run_project_id='+manage_drone_imagery_standard_process_extended_drone_run_project_id+'&time_cvterm_id='+manage_drone_imagery_standard_process_extended_phenotype_time+'&standard_process_type=extended',
1883             dataType: "json",
1884             success: function(response){
1885                 console.log(response);
1886                 if (response.error) {
1887                     alert(response.error);
1888                 }
1889             },
1890             error: function(response){
1891                 alert('Error running extended standard process!');
1892             }
1893         });
1894
1895         location.reload();
1896     });
1897
1898     //
1899     // Download Phenotypes
1900     //
1901
1902     var manage_drone_imagery_download_phenotypes_field_trial_id = undefined;
1903     var manage_drone_imagery_download_phenotypes_trait_ids = [];
1904
1905     jQuery('#download_phenotypes_drone_imagery_link').click(function(){
1906         jQuery('#drone_imagery_download_phenotypes_dialog').modal('show');
1907         get_select_box('trials', 'drone_imagery_download_phenotypes_trial_select_div', { 'name' : 'drone_imagery_download_phenotypes_field_trial_id', 'id' : 'drone_imagery_download_phenotypes_field_trial_id', 'empty':1, 'multiple':0 });
1908
1909         manage_drone_imagery_download_phenotypes_field_trial_id = undefined;
1910         manage_drone_imagery_download_phenotypes_trait_ids = [];
1911     });
1912
1913     jQuery('#drone_imagery_download_phenotypes_field_trial_select_step').click(function(){
1914         manage_drone_imagery_download_phenotypes_field_trial_id = jQuery('#drone_imagery_download_phenotypes_field_trial_id').val();
1915         if (manage_drone_imagery_download_phenotypes_field_trial_id == '') {
1916             alert('Please select a field trial first!');
1917         } else {
1918             get_select_box('traits', 'drone_imagery_download_phenotypes_trait_select_div', { 'name' : 'drone_imagery_download_phenotypes_trait_id_select', 'id' : 'drone_imagery_download_phenotypes_trait_id_select', 'empty':1, 'multiple':1, 'size': 20, 'trial_ids':manage_drone_imagery_download_phenotypes_field_trial_id, 'stock_type':'plot' });
1919
1920             Workflow.complete("#drone_imagery_download_phenotypes_field_trial_select_step");
1921             Workflow.focus('#drone_imagery_download_phenotypes_workflow', 1);
1922         }
1923         return false;
1924     });
1925
1926     jQuery('#drone_imagery_download_phenotypes_trait_select_step').click(function(){
1927         manage_drone_imagery_download_phenotypes_trait_ids = jQuery('#drone_imagery_download_phenotypes_trait_id_select').val();
1928         if (manage_drone_imagery_download_phenotypes_trait_ids == null || manage_drone_imagery_download_phenotypes_trait_ids == undefined) {
1929             alert('Please select at least one observation variable!');
1930             return false;
1931         }
1932         if (manage_drone_imagery_download_phenotypes_trait_ids.length < 1){
1933             alert('Please select at least one observation variable!');
1934         } else {
1935             Workflow.complete("#drone_imagery_download_phenotypes_trait_select_step");
1936             Workflow.focus('#drone_imagery_download_phenotypes_workflow', 2);
1937         }
1938         return false;
1939     });
1940
1941     jQuery('#drone_imagery_download_phenotypes_confirm_step').click(function() {
1942         jQuery.ajax({
1943             type: 'POST',
1944             url: '/api/drone_imagery/analysis_query',
1945             dataType: "json",
1946             data: {
1947                 'observation_variable_id_list':JSON.stringify(manage_drone_imagery_download_phenotypes_trait_ids),
1948                 'field_trial_id_list':JSON.stringify([manage_drone_imagery_download_phenotypes_field_trial_id]),
1949                 'format':'csv'
1950             },
1951             beforeSend: function (){
1952                 jQuery('#working_modal').modal('show');
1953             },
1954             success: function(response){
1955                 jQuery('#working_modal').modal('hide');
1956                 console.log(response);
1957                 if(response.error) {
1958                     alert(response.error);
1959                 }
1960                 jQuery('#drone_imagery_download_phenotypes_file_div').html('Download File: <a href="'+response.file+'">'+response.file+'</a>');
1961             },
1962             error: function(response){
1963                 alert('Error downloading drone image phenotypes!');
1964                 jQuery('#working_modal').modal('hide');
1965             }
1966         });
1967     });
1968
1969     //
1970     // Calculate statistics
1971     //
1972
1973     var manage_drone_imagery_calculate_statistics_field_trial_id = undefined;
1974     var manage_drone_imagery_calculate_statistics_trait_ids = [];
1975     var manage_drone_imagery_calculate_statistics_select = '';
1976
1977     jQuery('#drone_imagery_calculate_statistics_link').click(function(){
1978         jQuery('#drone_imagery_calculate_statistics_dialog').modal('show');
1979         get_select_box('trials', 'drone_imagery_calculate_statistics_trial_select_div', { 'name' : 'drone_imagery_calculate_statistics_field_trial_id', 'id' : 'drone_imagery_calculate_statistics_field_trial_id', 'empty':1, 'multiple':0 });
1980
1981         manage_drone_imagery_calculate_statistics_field_trial_id = undefined;
1982         manage_drone_imagery_calculate_statistics_trait_ids = [];
1983     });
1984
1985     jQuery('#drone_imagery_calculate_statistics_field_trial_select_step').click(function(){
1986         manage_drone_imagery_calculate_statistics_field_trial_id = jQuery('#drone_imagery_calculate_statistics_field_trial_id').val();
1987         if (manage_drone_imagery_calculate_statistics_field_trial_id == '') {
1988             alert('Please select a field trial first!');
1989         } else {
1990             get_select_box('traits', 'drone_imagery_calculate_statistics_trait_select_div', { 'name' : 'drone_imagery_calculate_statistics_trait_id_select', 'id' : 'drone_imagery_calculate_statistics_trait_id_select', 'empty':1, 'multiple':1, 'size': 20, 'trial_ids':manage_drone_imagery_calculate_statistics_field_trial_id, 'stock_type':'plot' });
1991
1992             Workflow.complete("#drone_imagery_calculate_statistics_field_trial_select_step");
1993             Workflow.focus('#drone_imagery_calculate_statistics_workflow', 1);
1994         }
1995         return false;
1996     });
1997
1998     jQuery('#drone_imagery_calculate_statistics_trait_select_step').click(function(){
1999         manage_drone_imagery_calculate_statistics_trait_ids = jQuery('#drone_imagery_calculate_statistics_trait_id_select').val();
2000         if (manage_drone_imagery_calculate_statistics_trait_ids == null || manage_drone_imagery_calculate_statistics_trait_ids == undefined) {
2001             alert('Please select at least one observation variable!');
2002             return false;
2003         }
2004         if (manage_drone_imagery_calculate_statistics_trait_ids.length < 1){
2005             alert('Please select at least one observation variable!');
2006         } else {
2007             Workflow.complete("#drone_imagery_calculate_statistics_trait_select_step");
2008             Workflow.focus('#drone_imagery_calculate_statistics_workflow', 2);
2009         }
2010         return false;
2011     });
2012
2013     jQuery('#drone_imagery_calculate_statistics_select_step').click(function(){
2014         manage_drone_imagery_calculate_statistics_select = jQuery('#drone_imagery_calculate_statistics_select_input').val();
2015
2016         jQuery.ajax({
2017             url : '/api/drone_imagery/calculate_statistics',
2018             type : 'POST',
2019             data : {
2020                 'observation_variable_id_list':JSON.stringify(manage_drone_imagery_calculate_statistics_trait_ids),
2021                 'field_trial_id_list':JSON.stringify([manage_drone_imagery_calculate_statistics_field_trial_id]),
2022                 'statistics_select':manage_drone_imagery_calculate_statistics_select
2023             },
2024             beforeSend: function() {
2025                 jQuery("#working_modal").modal("show");
2026             },
2027             success: function(response){
2028                 console.log(response);
2029                 jQuery("#working_modal").modal("hide");
2030
2031                 var html = '<table class="table table-bordered table-hover"><thead><tr><th>Observation Variable</th><th>Statistics</th></tr></thead><tbody>';
2032                 for (var i=0; i<response.length; i++) {
2033                     html = html + '<tr><td>'+response[i][0]+'</td><td>'+response[i][1]+'</td></tr>';
2034                 }
2035                 html = html + '</tbody></table>';
2036                 jQuery('#drone_imagery_calculate_statistics_result_div').html(html);
2037
2038                 Workflow.complete("#drone_imagery_calculate_statistics_select_step");
2039                 Workflow.focus('#drone_imagery_calculate_statistics_workflow', 3);
2040             },
2041             error: function(response){
2042                 jQuery("#working_modal").modal("hide");
2043                 alert('Error calculating statistics!')
2044             }
2045         });
2046     });
2047
2048     //
2049     // Keras CNN Training JS
2050     //
2051
2052     var manage_drone_imagery_train_keras_drone_run_ids = [];
2053     var manage_drone_imagery_train_keras_field_trial_id;
2054     var manage_drone_imagery_train_keras_trait_id;
2055     var manage_drone_imagery_train_keras_plot_polygon_type_ids = [];
2056
2057     jQuery('#keras_cnn_drone_imagery_link').click(function(){
2058         get_select_box('trials', 'drone_imagery_train_keras_cnn_trial_select_div', { 'name' : 'drone_imagery_train_keras_cnn_field_trial_id', 'id' : 'drone_imagery_train_keras_cnn_field_trial_id', 'empty':1, 'multiple':0 });
2059         jQuery('#drone_imagery_train_keras_cnn_dialog').modal('show');
2060
2061         manage_drone_imagery_train_keras_drone_run_ids = [];
2062         manage_drone_imagery_train_keras_field_trial_id = undefined;
2063         manage_drone_imagery_train_keras_trait_id = undefined;
2064         manage_drone_imagery_train_keras_plot_polygon_type_ids = [];
2065     });
2066
2067     jQuery('#drone_imagery_train_keras_model_field_trial_select_step').click(function(){
2068         manage_drone_imagery_train_keras_field_trial_id = jQuery('#drone_imagery_train_keras_cnn_field_trial_id').val();
2069         if (manage_drone_imagery_train_keras_field_trial_id == '') {
2070             alert('Please select a field trial first!');
2071         } else {
2072             get_select_box('traits', 'drone_imagery_train_keras_cnn_trait_select_div', { 'name' : 'drone_imagery_train_keras_cnn_trait_id', 'id' : 'drone_imagery_train_keras_cnn_trait_id', 'empty':1, 'multiple':0, 'trial_ids':manage_drone_imagery_train_keras_field_trial_id, 'stock_type':'plot' });
2073
2074             jQuery('#drone_image_train_keras_drone_runs_table').DataTable({
2075                 destroy : true,
2076                 ajax : '/api/drone_imagery/drone_runs?select_checkbox_name=train_keras_drone_imagery_drone_run_select&field_trial_id='+manage_drone_imagery_train_keras_field_trial_id
2077             });
2078
2079             Workflow.complete("#drone_imagery_train_keras_model_field_trial_select_step");
2080             Workflow.focus('#drone_imagery_train_keras_model_workflow', 2);
2081         }
2082         return false;
2083     });
2084
2085     jQuery('#drone_imagery_train_keras_model_trait_select_step').click(function(){
2086         manage_drone_imagery_train_keras_trait_id = jQuery('#drone_imagery_train_keras_cnn_trait_id').val();
2087         if (manage_drone_imagery_train_keras_trait_id == undefined || manage_drone_imagery_train_keras_trait_id == 'null' || manage_drone_imagery_train_keras_trait_id == '') {
2088             alert('Please select a phenotyped trait first!');
2089         } else {
2090             Workflow.complete("#drone_imagery_train_keras_model_trait_select_step");
2091             Workflow.focus('#drone_imagery_train_keras_model_workflow', 3);
2092         }
2093         return false;
2094     });
2095
2096     jQuery('#drone_imagery_train_keras_model_drone_run_select_step').click(function(){
2097         jQuery('input[name="train_keras_drone_imagery_drone_run_select"]:checked').each(function() {
2098             manage_drone_imagery_train_keras_drone_run_ids.push(jQuery(this).val());
2099         });
2100         if (manage_drone_imagery_train_keras_drone_run_ids.length < 1){
2101             alert('Please select at least one drone run!');
2102         } else {
2103
2104             jQuery('#drone_image_train_keras_plot_polygon_image_type_table').DataTable({
2105                 destroy : true,
2106                 paging : false,
2107                 ajax : '/api/drone_imagery/plot_polygon_types?select_checkbox_name=train_keras_drone_imagery_plot_polygon_type_select&field_trial_id='+manage_drone_imagery_train_keras_field_trial_id+'&drone_run_ids='+JSON.stringify(manage_drone_imagery_train_keras_drone_run_ids)
2108             });
2109
2110             Workflow.complete("#drone_imagery_train_keras_model_drone_run_select_step");
2111             Workflow.focus('#drone_imagery_train_keras_model_workflow', 4);
2112         }
2113         return false;
2114     });
2115
2116     jQuery('#drone_imagery_train_keras_model_plot_polygon_type_select_step').click(function(){
2117         jQuery('input[name="train_keras_drone_imagery_plot_polygon_type_select"]:checked').each(function() {
2118             manage_drone_imagery_train_keras_plot_polygon_type_ids.push(jQuery(this).val());
2119         });
2120         if (manage_drone_imagery_train_keras_plot_polygon_type_ids.length < 1){
2121             alert('Please select at least one plot polygon type!');
2122         } else {
2123             Workflow.complete("#drone_imagery_train_keras_model_plot_polygon_type_select_step");
2124             Workflow.focus('#drone_imagery_train_keras_model_workflow', 5);
2125         }
2126         return false;
2127     });
2128
2129     jQuery('#drone_imagery_train_keras_model_confirm_step').click(function(){
2130         jQuery.ajax({
2131             url : '/api/drone_imagery/train_keras_model?field_trial_id='+manage_drone_imagery_train_keras_field_trial_id+'&trait_id='+manage_drone_imagery_train_keras_trait_id+'&drone_run_ids='+JSON.stringify(manage_drone_imagery_train_keras_drone_run_ids)+'&plot_polygon_type_ids='+JSON.stringify(manage_drone_imagery_train_keras_plot_polygon_type_ids),
2132             beforeSend: function() {
2133                 jQuery("#working_modal").modal("show");
2134             },
2135             success: function(response){
2136                 console.log(response);
2137                 jQuery("#working_modal").modal("hide");
2138             },
2139             error: function(response){
2140                 jQuery("#working_modal").modal("hide");
2141                 alert('Error training keras model!')
2142             }
2143         });
2144     });
2145
2146     //
2147     // Image Rotating JS
2148     //
2149
2150     var rotate_stitched_image_id;
2151     var rotate_drone_run_band_project_id;
2152     var rotate_stitched_image_degrees;
2153
2154     jQuery(document).on('click', 'button[name="project_drone_imagery_rotate_image"]', function() {
2155         showManageDroneImagerySection('manage_drone_imagery_rotate_div');
2156
2157         rotate_stitched_image_id = jQuery(this).data('stitched_image_id');
2158         rotate_drone_run_band_project_id = jQuery(this).data('drone_run_band_project_id');
2159         rotate_stitched_image_degrees = 0.00;
2160
2161         showRotateImage(rotate_stitched_image_id, 'drone_imagery_rotate_original_stitched_div', 'manage_drone_imagery_rotate_load_div');
2162     });
2163
2164     jQuery('#drone_imagery_rotate_stitched_view').click(function(){
2165         rotate_stitched_image_degrees = parseFloat(jQuery('#drone_imagery_rotate_degrees_input').val());
2166         applyShowRotateImage(rotate_stitched_image_id, rotate_drone_run_band_project_id, rotate_stitched_image_degrees, 'drone_imagery_rotate_original_stitched_div');
2167     });
2168
2169     jQuery('#drone_imagery_rotate_stitched_restart').click(function(){
2170         showRotateImage(rotate_stitched_image_id, 'drone_imagery_rotate_original_stitched_div', 'manage_drone_imagery_rotate_load_div');
2171         rotate_stitched_image_degrees = 0.00;
2172     });
2173
2174     function applyShowRotateImage(rotate_stitched_image_id, rotate_drone_run_band_project_id, rotate_stitched_image_degrees, canvas_div_id) {
2175         jQuery.ajax({
2176             url : '/api/drone_imagery/rotate_image?image_id='+rotate_stitched_image_id+'&drone_run_band_project_id='+rotate_drone_run_band_project_id+'&angle='+rotate_stitched_image_degrees+'&view_only=1',
2177             beforeSend: function() {
2178                 jQuery("#working_modal").modal("show");
2179             },
2180             success: function(response){
2181                 console.log(response);
2182                 jQuery("#working_modal").modal("hide");
2183
2184                 var canvas = document.getElementById(canvas_div_id);
2185                 ctx = canvas.getContext('2d');
2186                 var image = new Image();
2187                 image.onload = function () {
2188                     canvas.width = this.naturalWidth;
2189                     canvas.height = this.naturalHeight;
2190                     ctx.drawImage(this, 0, 0);
2191                 };
2192                 image.src = response.rotated_image_url;
2193             },
2194             error: function(response){
2195                 jQuery("#working_modal").modal("hide");
2196                 alert('Error getting rotated image!')
2197             }
2198         });
2199     }
2200
2201     function showRotateImage(rotate_stitched_image_id, canvas_div_id, load_div_id) {
2202         jQuery.ajax({
2203             url : '/api/drone_imagery/get_image?image_id='+rotate_stitched_image_id,
2204             beforeSend: function() {
2205                 jQuery("#working_modal").modal("show");
2206             },
2207             success: function(response){
2208                 console.log(response);
2209                 jQuery("#working_modal").modal("hide");
2210
2211                 var canvas = document.getElementById(canvas_div_id);
2212                 ctx = canvas.getContext('2d');
2213                 var image = new Image();
2214                 image.onload = function () {
2215                     canvas.width = this.naturalWidth;
2216                     canvas.height = this.naturalHeight;
2217                     ctx.drawImage(this, 0, 0);
2218                     jQuery('#'+load_div_id).hide();
2219                 };
2220                 image.src = response.image_url;
2221
2222             },
2223             error: function(response){
2224                 jQuery("#working_modal").modal("hide");
2225                 alert('Error retrieving image!')
2226             }
2227         });
2228     }
2229
2230     function getRandomColor() {
2231         var letters = '0123456789ABCDEF';
2232         var color = '#';
2233         for (var i = 0; i < 6; i++) {
2234             color += letters[Math.floor(Math.random() * 16)];
2235         }
2236         return color;
2237     }
2238
2239     jQuery('#drone_imagery_rotate_stitched_crosshairs').click(function(){
2240         drawRotateCrosshairs(getRandomColor(), 'drone_imagery_rotate_original_stitched_div');
2241     });
2242
2243     function drawRotateCrosshairs(color, canvas_div_id) {
2244         var canvas = document.getElementById(canvas_div_id);
2245         var rotate_image_width = canvas.width;
2246         var rotate_image_height = canvas.height;
2247         var ctx = canvas.getContext("2d");
2248
2249         ctx.beginPath();
2250         ctx.moveTo(rotate_image_width/2,0);
2251         ctx.lineTo(rotate_image_width/2, rotate_image_height);
2252         ctx.strokeStyle = color;
2253         ctx.lineWidth=5;
2254         ctx.stroke();
2255
2256         ctx.beginPath();
2257         ctx.moveTo(rotate_image_width*1/4,0);
2258         ctx.lineTo(rotate_image_width*1/4, rotate_image_height);
2259         ctx.strokeStyle = color;
2260         ctx.lineWidth=5;
2261         ctx.stroke();
2262
2263         ctx.beginPath();
2264         ctx.moveTo(rotate_image_width*3/4,0);
2265         ctx.lineTo(rotate_image_width*3/4, rotate_image_height);
2266         ctx.strokeStyle = color;
2267         ctx.lineWidth=5;
2268         ctx.stroke();
2269
2270         ctx.beginPath();
2271         ctx.moveTo(0,rotate_image_height/2);
2272         ctx.lineTo(rotate_image_width, rotate_image_height/2);
2273         ctx.strokeStyle = color;
2274         ctx.lineWidth=5;
2275         ctx.stroke();
2276
2277         ctx.beginPath();
2278         ctx.moveTo(0,rotate_image_height*1/4);
2279         ctx.lineTo(rotate_image_width, rotate_image_height*1/4);
2280         ctx.strokeStyle = color;
2281         ctx.lineWidth=5;
2282         ctx.stroke();
2283
2284         ctx.beginPath();
2285         ctx.moveTo(0,rotate_image_height*3/4);
2286         ctx.lineTo(rotate_image_width, rotate_image_height*3/4);
2287         ctx.strokeStyle = color;
2288         ctx.lineWidth=5;
2289         ctx.stroke();
2290     }
2291
2292     jQuery('#drone_imagery_rotate_stitched_submit').click(function() {
2293         var rotate_stitched_image_degrees_text = jQuery('#drone_imagery_rotate_degrees_input').val();
2294         if (rotate_stitched_image_degrees_text == '') {
2295             alert('Please give a number of degrees first! Can be a decimal amount.');
2296             return;
2297         }
2298         if (isNaN(rotate_stitched_image_degrees_text)) {
2299             alert('Please give a number of degrees first! Can be a decimal amount.');
2300             return;
2301         }
2302         rotate_stitched_image_degrees = parseFloat(rotate_stitched_image_degrees_text);
2303         jQuery.ajax({
2304             url : '/api/drone_imagery/rotate_image?image_id='+rotate_stitched_image_id+'&drone_run_band_project_id='+rotate_drone_run_band_project_id+'&angle='+rotate_stitched_image_degrees,
2305             beforeSend: function() {
2306                 jQuery("#working_modal").modal("show");
2307             },
2308             success: function(response){
2309                 console.log(response);
2310                 jQuery("#working_modal").modal("hide");
2311                 location.reload();
2312             },
2313             error: function(response){
2314                 jQuery("#working_modal").modal("hide");
2315                 alert('Error saving rotated image image!')
2316             }
2317         });
2318     });
2319
2320     //
2321     // Image Cropping JS
2322     //
2323
2324     var ctx;
2325     var trial_id;
2326     var stitched_image_id;
2327     var rotated_stitched_image_id;
2328     var stitched_image;
2329     var drone_run_project_id;
2330     var drone_run_band_project_id;
2331     var crop_points = [];
2332     var crop_display_points = [];
2333     var dronecroppingImg;
2334
2335     jQuery(document).on('click', 'button[name="project_drone_imagery_crop_image"]', function() {
2336         trial_id = jQuery(this).data('field_trial_id');
2337         stitched_image_id = jQuery(this).data('stitched_image_id');
2338         stitched_image = jQuery(this).data('stitched_image');
2339         drone_run_project_id = jQuery(this).data('drone_run_project_id');
2340         drone_run_band_project_id = jQuery(this).data('drone_run_band_project_id');
2341         rotated_stitched_image_id = jQuery(this).data('rotated_stitched_image_id');
2342
2343         get_select_box('drone_imagery_parameter_select','plot_polygons_previously_saved_image_cropping_templates', {'name':'drone_imagery_previously_saved_image_cropping_select', 'id':'drone_imagery_previously_saved_image_cropping_select', 'empty':1, 'field_trial_id':trial_id, 'parameter':'image_cropping' });
2344
2345         showManageDroneImagerySection('manage_drone_imagery_crop_div');
2346
2347         showCropImageStart(rotated_stitched_image_id, 'drone_imagery_crop_original_stitched_div', 'manage_drone_imagery_crop_load_div');
2348     });
2349
2350     function showCropImageStart(rotated_stitched_image_id, canvas_div_id, load_div_id) {
2351         crop_points = [];
2352         crop_display_points = [];
2353         jQuery.ajax({
2354             url : '/api/drone_imagery/get_image?image_id='+rotated_stitched_image_id,
2355             beforeSend: function() {
2356                 jQuery("#working_modal").modal("show");
2357             },
2358             success: function(response){
2359                 console.log(response);
2360                 jQuery("#working_modal").modal("hide");
2361
2362                 var canvas = document.getElementById(canvas_div_id);
2363                 ctx = canvas.getContext('2d');
2364                 var image = new Image();
2365                 image.onload = function () {
2366                     canvas.width = this.naturalWidth;
2367                     canvas.height = this.naturalHeight;
2368                     ctx.drawImage(this, 0, 0);
2369                     jQuery('#'+load_div_id).hide();
2370                 };
2371                 image.src = response.image_url;
2372                 dronecroppingImg = canvas;
2373                 dronecroppingImg.onmousedown = GetCoordinatesCroppedImage;
2374             },
2375             error: function(response){
2376                 jQuery("#working_modal").modal("hide");
2377                 alert('Error retrieving image!')
2378             }
2379         });
2380     }
2381
2382     function FindPosition(oElement) {
2383         if(typeof( oElement.offsetParent ) != "undefined") {
2384             for(var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent) {
2385                 posX += oElement.offsetLeft;
2386                 posY += oElement.offsetTop;
2387             }
2388             return [ posX, posY ];
2389         } else {
2390             return [ oElement.x, oElement.y ];
2391         }
2392     }
2393
2394     function GetCoordinatesCroppedImage(e) {
2395         var PosX = 0;
2396         var PosY = 0;
2397         var ImgPos;
2398         ImgPos = FindPosition(dronecroppingImg);
2399         if (!e) var e = window.event;
2400         if (e.pageX || e.pageY) {
2401             PosX = e.pageX;
2402             PosY = e.pageY;
2403         }
2404         else if (e.clientX || e.clientY) {
2405             PosX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
2406             PosY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
2407         }
2408         PosX = PosX - ImgPos[0];
2409         PosY = PosY - ImgPos[1];
2410         if (crop_points.length < 4){
2411             crop_points.push({x:PosX, y:PosY});
2412             crop_display_points.push({x:PosX, y:PosY});
2413         } else {
2414             crop_display_points.push({x:PosX, y:PosY});
2415         }
2416         if (crop_display_points.length > 5){
2417             crop_points = [];
2418             crop_display_points = [];
2419         }
2420         drawPolyline(crop_display_points);
2421         drawWaypoints(crop_display_points, undefined, 0);
2422     }
2423
2424     function drawPolyline(points){
2425         if (points.length == 4) {
2426             points.push(points[0]);
2427         }
2428         for(var i=0;i<points.length;i++){
2429             ctx.beginPath();
2430             ctx.moveTo(points[0].x,points[0].y);
2431             for(var i=1;i<points.length;i++){
2432                 ctx.lineTo(points[i].x,points[i].y);
2433             }
2434             ctx.strokeStyle='blue';
2435             ctx.lineWidth=5;
2436             ctx.stroke();
2437         }
2438     }
2439
2440     function drawWaypoints(points, label, random_factor){
2441         var plot_polygon_random_number = Math.random() * random_factor;
2442         if (points.length > 0 && label != undefined) {
2443             if (drone_imagery_plot_polygons_removed_numbers.includes(label)) {
2444                 ctx.font = "bold 18px Arial";
2445                 ctx.fillStyle = 'blue';
2446                 ctx.fillText('NA', points[0].x + 3, points[0].y + 14 + plot_polygon_random_number);
2447             } else {
2448                 ctx.font = "bold 18px Arial";
2449                 ctx.fillStyle = 'red';
2450                 ctx.fillText(label, points[0].x + 3, points[0].y + 14 + plot_polygon_random_number);
2451                 //ctx.fillText(label.toString().substring(label.length - 3), points[0].x + 3, points[0].y + 14 + plot_polygon_random_number);
2452             }
2453         }
2454         for(var i=0;i<points.length;i++){
2455             ctx.beginPath();
2456             ctx.arc(points[i].x,points[i].y,4,0,Math.PI*2);
2457             ctx.closePath();
2458             ctx.strokeStyle='black';
2459             ctx.lineWidth=1;
2460             ctx.stroke();
2461             ctx.fillStyle='white';
2462             ctx.fill();
2463         }
2464     }
2465
2466     jQuery(document).on('click', '#drone_imagery_crop_stitched_submit', function(){
2467         jQuery.ajax({
2468             url : '/api/drone_imagery/crop_image?image_id='+rotated_stitched_image_id+'&polygon='+JSON.stringify(crop_points)+'&drone_run_band_project_id='+drone_run_band_project_id,
2469             beforeSend: function() {
2470                 jQuery("#working_modal").modal("show");
2471             },
2472             success: function(response){
2473                 console.log(response);
2474                 jQuery("#working_modal").modal("hide");
2475                 location.reload();
2476             },
2477             error: function(response){
2478                 jQuery("#working_modal").modal("hide");
2479                 alert('Error cropping image!')
2480             }
2481         });
2482     });
2483
2484     jQuery(document).on('click', '#drone_imagery_cropping_use_previous_cropping', function() {
2485         var plot_polygons_use_previously_saved_cropping = jQuery('#drone_imagery_previously_saved_image_cropping_select').val();
2486         jQuery.ajax({
2487             url : '/api/drone_imagery/retrieve_parameter_template?plot_polygons_template_projectprop_id='+plot_polygons_use_previously_saved_cropping,
2488             success: function(response){
2489                 console.log(response);
2490                 jQuery.ajax({
2491                     url : '/api/drone_imagery/crop_image?image_id='+rotated_stitched_image_id+'&polygon='+JSON.stringify(response.parameter[0])+'&drone_run_band_project_id='+drone_run_band_project_id,
2492                     beforeSend: function() {
2493                         jQuery("#working_modal").modal("show");
2494                     },
2495                     success: function(response){
2496                         console.log(response);
2497                         jQuery("#working_modal").modal("hide");
2498                         location.reload();
2499                     },
2500                     error: function(response){
2501                         jQuery("#working_modal").modal("hide");
2502                         alert('Error cropping image!')
2503                     }
2504                 });
2505             },
2506             error: function(response){
2507                 alert('Error retrieving saved cropping template!');
2508             }
2509         });
2510         return;
2511     });
2512
2513     //
2514     // Denoising JS
2515     //
2516
2517     var gridData = new Array();
2518
2519     jQuery(document).on('click', 'button[name="project_drone_imagery_denoise"]', function() {
2520         var trial_id = jQuery(this).data('field_trial_id');
2521         var drone_run_project_id = jQuery(this).data('drone_run_project_id');
2522         var drone_run_band_project_id = jQuery(this).data('drone_run_band_project_id');
2523         var cropped_stitched_image_id = jQuery(this).data('cropped_stitched_image_id');
2524         var stitched_image = jQuery(this).data('stitched_image');
2525         var cropped_stitched_image = jQuery(this).data('cropped_stitched_image');
2526
2527         jQuery.ajax({
2528             url : '/api/drone_imagery/denoise?image_id='+cropped_stitched_image_id+'&drone_run_band_project_id='+drone_run_band_project_id,
2529             beforeSend: function() {
2530                 jQuery("#working_modal").modal("show");
2531             },
2532             success: function(response){
2533                 console.log(response);
2534                 jQuery("#working_modal").modal("hide");
2535                 location.reload();
2536             },
2537             error: function(response){
2538                 jQuery("#working_modal").modal("hide");
2539                 alert('Error denoising image!')
2540             }
2541         });
2542
2543     });
2544
2545     //
2546     //Define Plot Polygons JS
2547     //
2548
2549     var canvas;
2550     var background_image_url;
2551     var background_image_width;
2552     var background_image_height;
2553     var plot_polygons_display_points = [];
2554     var plot_polygons_ind_points = [];
2555     var plot_polygons_ind_4_points = [];
2556     var drone_imagery_plot_polygons = {};
2557     var drone_imagery_plot_generated_polygons = {};
2558     var drone_imagery_plot_polygons_display = {};
2559     var plot_polygons_generated_polygons = [];
2560     var drone_imagery_plot_polygons_removed_numbers = [];
2561     var field_trial_layout_response = {};
2562     var plot_polygon_name;
2563     var plotpolygonsImg;
2564     var drone_imagery_plot_polygons_available_stock_names = [];
2565     var trial_id;
2566     var cropped_stitched_image_id;
2567     var denoised_stitched_image_id;
2568     var background_removed_stitched_image_id;
2569     var drone_run_project_id;
2570     var drone_run_band_project_id;
2571     var assign_plot_polygons_type;
2572
2573     jQuery(document).on('click', 'button[name="project_drone_imagery_plot_polygons"]', function(){
2574         trial_id = jQuery(this).data('field_trial_id');
2575         cropped_stitched_image_id = jQuery(this).data('cropped_stitched_image_id');
2576         denoised_stitched_image_id = jQuery(this).data('denoised_stitched_image_id');
2577         background_removed_stitched_image_id = jQuery(this).data('background_removed_stitched_image_id');
2578         drone_run_project_id = jQuery(this).data('drone_run_project_id');
2579         drone_run_band_project_id = jQuery(this).data('drone_run_band_project_id');
2580         assign_plot_polygons_type = jQuery(this).data('assign_plot_polygons_type');
2581
2582         get_select_box('drone_imagery_parameter_select','plot_polygons_previously_saved_plot_polygon_templates', {'empty':1, 'field_trial_id':trial_id, 'parameter':'plot_polygons' });
2583
2584         plot_polygons_display_points = [];
2585         plot_polygons_ind_points = [];
2586         plot_polygons_ind_4_points = [];
2587         drone_imagery_plot_polygons = {};
2588         drone_imagery_plot_generated_polygons = {};
2589         drone_imagery_plot_polygons_display = {};
2590         field_trial_layout_response = {};
2591
2592         showManageDroneImagerySection('manage_drone_imagery_plot_polygons_div');
2593
2594         showPlotPolygonStart(background_removed_stitched_image_id, drone_run_band_project_id, 'drone_imagery_plot_polygons_original_stitched_div', 'drone_imagery_plot_polygons_top_section', 'manage_drone_imagery_plot_polygons_load_div');
2595
2596         showPlotPolygonTableStart(trial_id, 'drone_imagery_trial_layout_div', 'drone_imagery_layout_table');
2597     });
2598
2599     function showPlotPolygonTableStart(trial_id, layout_div, layout_table){
2600         jQuery.ajax({
2601             url : '/ajax/breeders/trial/'+trial_id+'/layout_table',
2602             beforeSend: function() {
2603                 jQuery("#working_modal").modal("show");
2604             },
2605             success: function(response){
2606                 console.log(response);
2607                 field_trial_layout_response = response;
2608                 var layout = field_trial_layout_response.output;
2609                 for (var i=1; i<layout.length; i++) {
2610                     drone_imagery_plot_polygons_available_stock_names.push(layout[i][0]);
2611                 }
2612                 droneImageryDrawLayoutTable(response, {}, layout_div, layout_table);
2613                 jQuery("#working_modal").modal("hide");
2614             },
2615             error: function(response){
2616                 jQuery("#working_modal").modal("hide");
2617                 alert('Error retrieving trial layout and design!')
2618             }
2619         });
2620     }
2621
2622     function showPlotPolygonStart(background_removed_stitched_image_id, drone_run_band_project_id, canvas_div_id, info_div_id, load_div_id){
2623         //jQuery.ajax({
2624         //    url : '/api/drone_imagery/get_contours?image_id='+background_removed_stitched_image_id+'&drone_run_band_project_id='+drone_run_band_project_id,
2625         //    beforeSend: function() {
2626         //        jQuery("#working_modal").modal("show");
2627         //    },
2628         //    success: function(response){
2629         //        console.log(response);
2630         //        jQuery("#working_modal").modal("hide");
2631         //        background_image_url = response.image_url;
2632
2633         //        background_image_width = response.image_width;
2634         //        background_image_height = response.image_height;
2635
2636         //        var top_section_html = '<h4>Total Image Width: '+response.image_width+'px. Total Image Height: '+response.image_height+'px.</h4>';
2637         //        top_section_html = top_section_html + '<button class="btn btn-default btn-sm" id="drone_imagery_plot_polygons_switch" data-image_url="'+response.image_url+'" data-image_fullpath="'+response.image_fullpath+'" data-contours_image_url="'+response.contours_image_url+'" data-contours_image_fullpath="'+response.contours_image_fullpath+'">Switch Image View</button><br/><br/>';
2638         //        jQuery('#'+info_div_id).html(top_section_html);
2639
2640         //        canvas = document.getElementById(canvas_div_id);
2641         //        ctx = canvas.getContext('2d');
2642         //        draw_canvas_image(background_image_url, 0);
2643
2644         //        plotpolygonsImg = document.getElementById(canvas_div_id);
2645                 //plotpolygonsImg.onmousedown = GetCoordinatesPlotPolygons;
2646         //        plotpolygonsImg.onmousedown = GetCoordinatesPlotPolygonsPoint;
2647
2648         //        jQuery('#'+load_div_id).hide();
2649
2650         //    },
2651         //    error: function(response){
2652         //        jQuery("#working_modal").modal("hide");
2653         //        alert('Error retrieving contours for image!')
2654         //    }
2655         //});
2656
2657         jQuery.ajax({
2658             url : '/api/drone_imagery/get_image?image_id='+background_removed_stitched_image_id,
2659             beforeSend: function() {
2660                 jQuery("#working_modal").modal("show");
2661             },
2662             success: function(response){
2663                 console.log(response);
2664                 background_image_url = response.image_url;
2665
2666                 background_image_width = response.image_width;
2667                 background_image_height = response.image_height;
2668
2669                 var top_section_html = '<h4>Total Image Width: '+response.image_width+'px. Total Image Height: '+response.image_height+'px.</h4>';
2670
2671                 jQuery('#'+info_div_id).html(top_section_html);
2672
2673                 canvas = document.getElementById(canvas_div_id);
2674                 ctx = canvas.getContext('2d');
2675                 draw_canvas_image(background_image_url, 0);
2676
2677                 plotpolygonsImg = document.getElementById(canvas_div_id);
2678                 //plotpolygonsImg.onmousedown = GetCoordinatesPlotPolygons;
2679                 plotpolygonsImg.onmousedown = GetCoordinatesPlotPolygonsPoint;
2680
2681                 jQuery('#'+load_div_id).hide();
2682             },
2683             error: function(response){
2684                 jQuery("#working_modal").modal("hide");
2685                 alert('Error retrieving plot polygon image!')
2686             }
2687         });
2688     }
2689
2690     var drone_imagery_plot_polygon_click_type = '';
2691     jQuery('#drone_imagery_plot_polygons_top_left_click').click(function(){
2692         alert('Now click the top left corner of your field on the image below.');
2693         drone_imagery_plot_polygon_click_type = 'top_left';
2694     });
2695     jQuery('#drone_imagery_plot_polygons_top_right_click').click(function(){
2696         alert('Now click the top right corner of your field on the image below.');
2697         drone_imagery_plot_polygon_click_type = 'top_right';
2698     });
2699     jQuery('#drone_imagery_plot_polygons_bottom_left_click').click(function(){
2700         alert('Now click the bottom left corner of your field on the image below.');
2701         drone_imagery_plot_polygon_click_type = 'bottom_left';
2702     });
2703     jQuery('#drone_imagery_plot_polygons_bottom_right_click').click(function(){
2704         alert('Now click the bottom right corner of your field on the image below.');
2705         drone_imagery_plot_polygon_click_type = 'bottom_right';
2706     });
2707     jQuery(document).on('click', '#drone_imagery_plot_polygons_get_distance', function(){
2708         alert('Click on two points in image. The distance will be returned.');
2709         drone_imagery_plot_polygon_click_type = 'get_distance';
2710         return false;
2711     });
2712
2713     var drone_imagery_plot_polygon_current_background_toggle = 1;
2714     jQuery(document).on('click', '#drone_imagery_plot_polygons_switch', function(){
2715         var image_url;
2716         if (drone_imagery_plot_polygon_current_background_toggle == 0) {
2717             drone_imagery_plot_polygon_current_background_toggle = 1;
2718             image_url = jQuery(this).data('contours_image_url');
2719         } else if (drone_imagery_plot_polygon_current_background_toggle == 1) {
2720             drone_imagery_plot_polygon_current_background_toggle = 0;
2721             image_url = jQuery(this).data('image_url');
2722         }
2723         draw_canvas_image(image_url, plot_polygons_total_height_generated/plot_polygons_num_rows_generated);
2724
2725         return;
2726     });
2727
2728     jQuery('#plot_polygons_use_previously_saved_template').click(function() {
2729         var plot_polygons_use_previously_saved_template = jQuery('#drone_imagery_plot_polygon_select').val();
2730         if (plot_polygons_use_previously_saved_template == '') {
2731             alert('Please select a previously saved template before trying to apply it. If there is not a template listed, then you can create one using the templating tool above.');
2732             return;
2733         }
2734
2735         jQuery.ajax({
2736             url : '/api/drone_imagery/retrieve_parameter_template?plot_polygons_template_projectprop_id='+plot_polygons_use_previously_saved_template,
2737             success: function(response){
2738                 console.log(response);
2739
2740                 drone_imagery_plot_polygons_display = response.parameter;
2741                 drone_imagery_plot_polygons = response.parameter;
2742
2743                 draw_canvas_image(background_image_url, 0);
2744                 droneImageryDrawLayoutTable(field_trial_layout_response, drone_imagery_plot_polygons, 'drone_imagery_trial_layout_div', 'drone_imagery_layout_table');
2745                 droneImageryRectangleLayoutTable(drone_imagery_plot_polygons, 'drone_imagery_generated_polygons_div', 'drone_imagery_generated_polygons_table', 'drone_imagery_plot_polygons_generated_assign', 'drone_imagery_plot_polygons_submit_bottom');
2746             },
2747             error: function(response){
2748                 alert('Error retrieving plot polygons template!');
2749             }
2750         });
2751         return;
2752     });
2753
2754     var plot_polygons_num_rows_generated;
2755     var plot_polygons_num_cols_generated;
2756     var plot_polygons_number_generated;
2757     var plot_polygons_total_height_generated;
2758     var plot_polygons_template_dimensions = [];
2759
2760     jQuery('#drone_imagery_plot_polygons_rectangles_apply').click(function() {
2761         plot_polygons_display_points = [];
2762         plot_polygons_ind_points = [];
2763         plot_polygons_ind_4_points = [];
2764
2765         var num_rows_val = jQuery('#drone_imagery_plot_polygons_num_rows').val();
2766         var num_cols_val = jQuery('#drone_imagery_plot_polygons_num_cols').val();
2767         var section_top_row_left_offset_val = jQuery('#drone_imagery_plot_polygons_top_row_left_offset').val();
2768         var section_bottom_row_left_offset_val = jQuery('#drone_imagery_plot_polygons_bottom_row_left_offset').val();
2769         var section_left_column_top_offset_val = jQuery('#drone_imagery_plot_polygons_left_column_top_offset').val();
2770         var section_left_column_bottom_offset_val = jQuery('#drone_imagery_plot_polygons_left_column_bottom_offset').val();
2771         var section_top_row_right_offset_val = jQuery('#drone_imagery_plot_polygons_top_row_right_offset').val();
2772         var section_right_column_bottom_offset_val = jQuery('#drone_imagery_plot_polygons_right_col_bottom_offset').val();
2773
2774         plotPolygonsRectanglesApply(num_rows_val, num_cols_val, section_top_row_left_offset_val, section_bottom_row_left_offset_val, section_left_column_top_offset_val, section_left_column_bottom_offset_val, section_top_row_right_offset_val, section_right_column_bottom_offset_val, 'drone_imagery_generated_polygons_div', 'drone_imagery_generated_polygons_table', 'drone_imagery_plot_polygons_generated_assign', 'drone_imagery_plot_polygons_submit_bottom', 'drone_imagery_plot_polygons_active_templates');
2775     });
2776
2777     function plotPolygonsRectanglesApply(num_rows_val, num_cols_val, section_top_row_left_offset_val, section_bottom_row_left_offset_val, section_left_column_top_offset_val, section_left_column_bottom_offset_val, section_top_row_right_offset_val, section_right_column_bottom_offset_val, plot_polygons_assignment_info, plot_polygons_assignment_table, plot_polygons_generate_assignment_button, plot_polygon_assignment_submit_button, drone_imagery_plot_polygons_active_templates) {
2778         if (num_rows_val == ''){
2779             alert('Please give the number of rows!');
2780             return;
2781         }
2782         if (num_cols_val == ''){
2783             alert('Please give the number of columns!');
2784             return;
2785         }
2786         if (section_top_row_left_offset_val == ''){
2787             alert('Please give the top-most rows left margin! This can be 0 if there is no offset.');
2788             return;
2789         }
2790         if (section_bottom_row_left_offset_val == ''){
2791             alert('Please give the bottom-most rows left margin! This can be 0 if there is no offset.');
2792             return;
2793         }
2794         if (section_left_column_top_offset_val == ''){
2795             alert('Please give the left-most columns top margin! This can be 0 if there is no offset.');
2796             return;
2797         }
2798         if (section_left_column_bottom_offset_val == ''){
2799             alert('Please give the left-most columns bottom margin! This can be 0 if there is no offset.');
2800             return;
2801         }
2802         if (section_top_row_right_offset_val == ''){
2803             alert('Please give the top-most rows right margin! This can be 0 if there is no offset.');
2804             return;
2805         }
2806         if (section_right_column_bottom_offset_val == ''){
2807             alert('Please give the right-most columns bottom margin! This can be 0 if there is no offset.');
2808             return;
2809         }
2810
2811         plot_polygons_num_rows_generated = parseInt(num_rows_val);
2812         plot_polygons_num_cols_generated = parseInt(num_cols_val);
2813
2814         var section_width = background_image_width;
2815         var section_height = background_image_height;
2816         var section_top_row_left_offset = parseInt(section_top_row_left_offset_val);
2817         var section_bottom_row_left_offset = parseInt(section_bottom_row_left_offset_val);
2818         var section_left_column_top_offset = parseInt(section_left_column_top_offset_val);
2819         var section_left_column_bottom_offset = parseInt(section_left_column_bottom_offset_val);
2820         var section_top_row_right_offset = parseInt(section_top_row_right_offset_val);
2821         var section_right_column_bottom_offset = parseInt(section_right_column_bottom_offset_val);
2822
2823         var total_gradual_left_shift = section_bottom_row_left_offset - section_top_row_left_offset;
2824         var col_left_shift_increment = total_gradual_left_shift / plot_polygons_num_rows_generated;
2825
2826         var total_gradual_vertical_shift = section_right_column_bottom_offset - section_left_column_bottom_offset;
2827         var col_vertical_shift_increment = total_gradual_vertical_shift / plot_polygons_num_cols_generated;
2828
2829         var col_width = (section_width - section_top_row_left_offset - section_top_row_right_offset) / plot_polygons_num_cols_generated;
2830         var row_height = (section_height - section_left_column_top_offset - section_left_column_bottom_offset) / plot_polygons_num_rows_generated;
2831
2832         var x_pos = section_top_row_left_offset;
2833         var y_pos = section_left_column_top_offset;
2834
2835         var row_num = 1;
2836         for (var i=0; i<plot_polygons_num_rows_generated; i++) {
2837             for (var j=0; j<plot_polygons_num_cols_generated; j++) {
2838                 var x_pos_val = x_pos;
2839                 var y_pos_val = y_pos;
2840                 plot_polygons_generated_polygons.push([
2841                     {x:x_pos_val, y:y_pos_val},
2842                     {x:x_pos_val + col_width, y:y_pos_val},
2843                     {x:x_pos_val + col_width, y:y_pos_val + row_height},
2844                     {x:x_pos_val, y:y_pos_val + row_height}
2845                 ]);
2846                 x_pos = x_pos + col_width;
2847                 y_pos = y_pos - col_vertical_shift_increment;
2848             }
2849             x_pos = section_top_row_left_offset + (row_num * col_left_shift_increment);
2850             y_pos = y_pos + row_height + total_gradual_vertical_shift;
2851             row_num = row_num + 1;
2852         }
2853         //console.log(plot_polygons_generated_polygons);
2854
2855         plot_polygons_total_height_generated = row_height * plot_polygons_num_rows_generated;
2856         plot_polygons_number_generated = plot_polygons_generated_polygons.length;
2857
2858         var drone_imagery_plot_polygons_new = {};
2859         var drone_imagery_plot_polygons_display_new = {};
2860
2861         for (var i=0; i<plot_polygons_generated_polygons.length; i++) {
2862             plot_polygons_ind_4_points = plot_polygons_generated_polygons[i];
2863             plot_polygons_display_points = plot_polygons_ind_4_points;
2864             if (plot_polygons_display_points.length == 4) {
2865                 plot_polygons_display_points.push(plot_polygons_ind_4_points[0]);
2866             }
2867             drawPolyline(plot_polygons_display_points);
2868             drawWaypoints(plot_polygons_display_points, i, 0);
2869             drone_imagery_plot_generated_polygons[i] = plot_polygons_ind_4_points;
2870             drone_imagery_plot_polygons_new[i] = plot_polygons_ind_4_points;
2871             drone_imagery_plot_polygons_display[i] = plot_polygons_display_points;
2872             drone_imagery_plot_polygons_display_new[i] = plot_polygons_display_points;
2873         }
2874
2875         plot_polygons_template_dimensions.push({
2876             'num_rows':plot_polygons_num_rows_generated,
2877             'num_cols':plot_polygons_num_cols_generated,
2878             'total_plot_polygons':plot_polygons_num_rows_generated*plot_polygons_num_cols_generated,
2879             'plot_polygons':drone_imagery_plot_polygons_new,
2880             'plot_polygons_display':drone_imagery_plot_polygons_display_new
2881         });
2882
2883         droneImageryDrawPlotPolygonActiveTemplatesTable(drone_imagery_plot_polygons_active_templates, plot_polygons_template_dimensions, drone_imagery_plot_generated_polygons, drone_imagery_plot_polygons_display);
2884
2885         droneImageryRectangleLayoutTable(drone_imagery_plot_generated_polygons, plot_polygons_assignment_info, plot_polygons_assignment_table, plot_polygons_generate_assignment_button, plot_polygon_assignment_submit_button);
2886     }
2887
2888     function plotPolygonsTemplatePaste(posx, posy, plot_polygon_template_id, plot_polygons_assignment_info, plot_polygons_assignment_table, plot_polygons_generate_assignment_button, plot_polygon_assignment_submit_button, drone_imagery_plot_polygons_active_templates) {
2889         var plot_polygon_template_to_paste = plot_polygons_template_dimensions[plot_polygon_template_id];
2890
2891         var plot_polygons_previous_plot_polygons = plot_polygon_template_to_paste['plot_polygons'];
2892         plot_polygons_num_rows_generated = plot_polygon_template_to_paste['num_rows'];
2893         plot_polygons_num_cols_generated = plot_polygon_template_to_paste['num_cols'];
2894
2895         var section_width = background_image_width;
2896         var section_height = background_image_height;
2897
2898         var plot_polygon_top_left_position = plot_polygons_previous_plot_polygons[0][0];
2899         var plot_polygon_template_paste_x_diff = plot_polygon_top_left_position['x'] - posx;
2900         var plot_polygon_template_paste_y_diff = plot_polygon_top_left_position['y'] - posy;
2901
2902         for (var i in plot_polygons_previous_plot_polygons) {
2903             plot_polygons_generated_polygons.push([
2904                 {x:plot_polygons_previous_plot_polygons[i][0]['x'] - plot_polygon_template_paste_x_diff, y:plot_polygons_previous_plot_polygons[i][0]['y']- plot_polygon_template_paste_y_diff},
2905                 {x:plot_polygons_previous_plot_polygons[i][1]['x'] - plot_polygon_template_paste_x_diff, y:plot_polygons_previous_plot_polygons[i][1]['y'] - plot_polygon_template_paste_y_diff},
2906                 {x:plot_polygons_previous_plot_polygons[i][2]['x'] - plot_polygon_template_paste_x_diff, y:plot_polygons_previous_plot_polygons[i][2]['y'] - plot_polygon_template_paste_y_diff},
2907                 {x:plot_polygons_previous_plot_polygons[i][3]['x'] - plot_polygon_template_paste_x_diff, y:plot_polygons_previous_plot_polygons[i][3]['y'] - plot_polygon_template_paste_y_diff}
2908             ]);
2909         }
2910
2911         plot_polygons_number_generated = plot_polygons_generated_polygons.length;
2912         console.log(plot_polygons_generated_polygons);
2913
2914         var drone_imagery_plot_polygons_new = {};
2915         var drone_imagery_plot_polygons_display_new = {};
2916
2917         for (var i=0; i<plot_polygons_generated_polygons.length; i++) {
2918             plot_polygons_ind_4_points = plot_polygons_generated_polygons[i];
2919             plot_polygons_display_points = plot_polygons_ind_4_points;
2920             if (plot_polygons_display_points.length == 4) {
2921                 plot_polygons_display_points.push(plot_polygons_ind_4_points[0]);
2922             }
2923             drawPolyline(plot_polygons_display_points);
2924             drawWaypoints(plot_polygons_display_points, i, 0);
2925             drone_imagery_plot_generated_polygons[i] = plot_polygons_ind_4_points;
2926             drone_imagery_plot_polygons_new[i] = plot_polygons_ind_4_points;
2927             drone_imagery_plot_polygons_display[i] = plot_polygons_display_points;
2928             drone_imagery_plot_polygons_display_new[i] = plot_polygons_display_points;
2929         }
2930
2931         plot_polygons_template_dimensions.push({
2932             'num_rows':plot_polygons_num_rows_generated,
2933             'num_cols':plot_polygons_num_cols_generated,
2934             'total_plot_polygons':plot_polygons_num_rows_generated*plot_polygons_num_cols_generated,
2935             'plot_polygons':drone_imagery_plot_polygons_new,
2936             'plot_polygons_display':drone_imagery_plot_polygons_display_new
2937         });
2938
2939         droneImageryDrawPlotPolygonActiveTemplatesTable(drone_imagery_plot_polygons_active_templates, plot_polygons_template_dimensions);
2940
2941         droneImageryRectangleLayoutTable(drone_imagery_plot_generated_polygons, plot_polygons_assignment_info, plot_polygons_assignment_table, plot_polygons_generate_assignment_button, plot_polygon_assignment_submit_button);
2942     }
2943
2944     function droneImageryDrawPlotPolygonActiveTemplatesTable(div_id, plot_polygons_template_dimensions){
2945         var html = '<table class="table table-bordered table-hover"><thead><tr><th>Template Number</th><th>Rows</th><th>Columns</th><th>Total Polygons</th><th>Options</th></tr></thead><tbody>';
2946         for (var i=0; i<plot_polygons_template_dimensions.length; i++) {
2947             html = html + '<tr><td>'+i+'</td><td>'+plot_polygons_template_dimensions[i]['num_rows']+'</td><td>'+plot_polygons_template_dimensions[i]['num_cols']+'</td><td>'+plot_polygons_template_dimensions[i]['total_plot_polygons']+'</td><td><button class="btn btn-sm btn-primary" name="drone_imagery_plot_polygon_template_options" data-plot_polygon_template_id="'+i+'" >Options</button></td></tr>';
2948         }
2949         html = html + '</tbody></table>';
2950         jQuery('#'+div_id).html(html);
2951     }
2952
2953     var drone_imagery_current_plot_polygon_index_options_id = '';
2954     jQuery(document).on('click', 'button[name="drone_imagery_plot_polygon_template_options"]', function(){
2955         jQuery('#drone_imagery_plot_polygon_template_options_dialog').modal('show');
2956         drone_imagery_current_plot_polygon_index_options_id = jQuery(this).data('plot_polygon_template_id');
2957     });
2958
2959     jQuery('#drone_imagery_plot_polygon_template_options_paste_click').click(function(){
2960         jQuery('#drone_imagery_plot_polygon_template_options_dialog').modal('hide');
2961         alert('Click on where the top left corner of the template will be pasted.');
2962         drone_imagery_plot_polygon_click_type = 'plot_polygon_template_paste';
2963     });
2964
2965     jQuery('input[name=drone_imagery_plot_polygons_autocomplete]').autocomplete({
2966         source: drone_imagery_plot_polygons_available_stock_names
2967     });
2968
2969     jQuery(document).on('click', '#drone_imagery_plot_polygons_clear', function(){
2970         plot_polygons_display_points = [];
2971         plot_polygons_ind_points = [];
2972         plot_polygons_ind_4_points = [];
2973         drone_imagery_plot_polygons = {};
2974         drone_imagery_plot_generated_polygons = {};
2975         drone_imagery_plot_polygons_display = {};
2976         plot_polygons_generated_polygons = [];
2977         plot_polygons_template_dimensions = [];
2978         drone_imagery_plot_polygons_removed_numbers = [];
2979         ctx.clearRect(0, 0, canvas.width, canvas.height);
2980         draw_canvas_image(background_image_url, 0);
2981         jQuery('#drone_imagery_generated_polygons_div').html('');
2982         droneImageryDrawLayoutTable(field_trial_layout_response, drone_imagery_plot_polygons, 'drone_imagery_trial_layout_div', 'drone_imagery_layout_table');
2983         droneImageryDrawPlotPolygonActiveTemplatesTable("drone_imagery_plot_polygons_active_templates", plot_polygons_template_dimensions);
2984     });
2985
2986     jQuery(document).on('click', '#drone_imagery_plot_polygons_clear_one', function(){
2987         jQuery('#drone_imagery_plot_polygon_remove_polygon').modal('show');
2988         return false;
2989     });
2990
2991     jQuery('#drone_imagery_plot_polygon_remove_polygon_submit').click(function(){
2992         var polygon_number = jQuery('#drone_imagery_plot_polygon_remove_polygon_number').val();
2993         drone_imagery_plot_polygons_removed_numbers.push(polygon_number);
2994         draw_canvas_image(background_image_url, plot_polygons_total_height_generated/plot_polygons_num_rows_generated);
2995         return false;
2996     });
2997
2998     function draw_canvas_image(image_url, random_scaling) {
2999         var image = new Image();
3000         image.onload = function () {
3001             canvas.width = this.naturalWidth;
3002             canvas.height = this.naturalHeight;
3003             ctx.drawImage(this, 0, 0);
3004
3005             for (key in drone_imagery_plot_polygons_display) {
3006                 var plot_polygons_display_points_again = drone_imagery_plot_polygons_display[key];
3007                 drawPolyline(plot_polygons_display_points_again);
3008                 drawWaypoints(plot_polygons_display_points_again, key, random_scaling);
3009             }
3010         };
3011         image.src = image_url;
3012     }
3013
3014     function GetCoordinatesPlotPolygons(e) {
3015         var PosX = 0;
3016         var PosY = 0;
3017         var ImgPos;
3018         ImgPos = FindPosition(plotpolygonsImg);
3019         if (!e) var e = window.event;
3020         if (e.pageX || e.pageY) {
3021             PosX = e.pageX;
3022             PosY = e.pageY;
3023         }
3024         else if (e.clientX || e.clientY) {
3025             PosX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
3026             PosY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
3027         }
3028         PosX = PosX - ImgPos[0];
3029         PosY = PosY - ImgPos[1];
3030         if (plot_polygons_ind_points.length <= 4){
3031             plot_polygons_ind_points.push({x:PosX, y:PosY});
3032             plot_polygons_display_points.push({x:PosX, y:PosY});
3033
3034             if (plot_polygons_ind_points.length == 4) {
3035                 plot_polygons_ind_4_points = plot_polygons_ind_points;
3036             }
3037         } else if (plot_polygons_ind_points.length > 4) {
3038             if (plot_polygons_display_points.length == 5) {
3039                 jQuery('#drone_imagery_assign_plot_dialog').modal('show');
3040             }
3041             plot_polygons_ind_points = [];
3042         }
3043         drawPolyline(plot_polygons_display_points);
3044         drawWaypoints(plot_polygons_display_points, undefined, 0);
3045     }
3046
3047     var plot_polygons_get_distance_point_1x = '';
3048     var plot_polygons_get_distance_point_1y = '';
3049
3050     function GetCoordinatesPlotPolygonsPoint(e) {
3051         var PosX = 0;
3052         var PosY = 0;
3053         var ImgPos;
3054         ImgPos = FindPosition(plotpolygonsImg);
3055         if (!e) var e = window.event;
3056         if (e.pageX || e.pageY) {
3057             PosX = e.pageX;
3058             PosY = e.pageY;
3059         }
3060         else if (e.clientX || e.clientY) {
3061             PosX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
3062             PosY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
3063         }
3064         PosX = PosX - ImgPos[0];
3065         PosY = PosY - ImgPos[1];
3066
3067         if (drone_imagery_plot_polygon_click_type == '' && drone_imagery_standard_process_plot_polygon_click_type == '') {
3068             alert('X Coordinate: '+PosX+'. Y Coordinate: '+PosY+'.');
3069         }
3070         else if (drone_imagery_plot_polygon_click_type == 'top_left') {
3071             drone_imagery_plot_polygon_click_type = '';
3072             jQuery('#drone_imagery_plot_polygons_left_column_top_offset').val(PosY);
3073             jQuery('#drone_imagery_plot_polygons_top_row_left_offset').val(PosX);
3074         }
3075         else if (drone_imagery_plot_polygon_click_type == 'top_right') {
3076             drone_imagery_plot_polygon_click_type = '';
3077             jQuery('#drone_imagery_plot_polygons_top_row_right_offset').val(background_image_width-PosX);
3078         }
3079         else if (drone_imagery_plot_polygon_click_type == 'bottom_left') {
3080             drone_imagery_plot_polygon_click_type = '';
3081             jQuery('#drone_imagery_plot_polygons_bottom_row_left_offset').val(PosX);
3082             jQuery('#drone_imagery_plot_polygons_left_column_bottom_offset').val(background_image_height-PosY);
3083         }
3084         else if (drone_imagery_plot_polygon_click_type == 'bottom_right') {
3085             drone_imagery_plot_polygon_click_type = '';
3086             jQuery('#drone_imagery_plot_polygons_right_col_bottom_offset').val(background_image_height-PosY);
3087         }
3088         else if (drone_imagery_plot_polygon_click_type == 'get_distance') {
3089             if (plot_polygons_get_distance_point_1x != '') {
3090                 var distance = Math.round(Math.sqrt(Math.pow(plot_polygons_get_distance_point_1x - PosX, 2) + Math.pow(plot_polygons_get_distance_point_1y - PosY, 2)));
3091                 alert('Distance='+distance+'. X1='+plot_polygons_get_distance_point_1x+'. Y1='+plot_polygons_get_distance_point_1y+'. X2='+PosX+'. Y2='+PosY);
3092                 plot_polygons_get_distance_point_1x = '';
3093                 plot_polygons_get_distance_point_1y = '';
3094                 drone_imagery_plot_polygon_click_type = '';
3095             } else {
3096                 plot_polygons_get_distance_point_1x = PosX;
3097                 plot_polygons_get_distance_point_1y = PosY;
3098             }
3099         }
3100         else if (drone_imagery_plot_polygon_click_type == 'plot_polygon_template_paste') {
3101             drone_imagery_plot_polygon_click_type = '';
3102
3103             if (manage_drone_imagery_standard_process_field_trial_id == undefined) {
3104                 plotPolygonsTemplatePaste(PosX, PosY, parseInt(drone_imagery_current_plot_polygon_index_options_id), 'drone_imagery_generated_polygons_div', 'drone_imagery_generated_polygons_table', 'drone_imagery_plot_polygons_generated_assign', 'drone_imagery_plot_polygons_submit_bottom');
3105             }
3106             else {
3107                 plotPolygonsTemplatePaste(PosX, PosY, parseInt(drone_imagery_current_plot_polygon_index_options_id), 'drone_imagery_standard_process_generated_polygons_div', 'drone_imagery_standard_process_generated_polygons_table', 'drone_imagery_standard_process_plot_polygons_generated_assign', 'drone_imagery_standard_process_plot_polygons_submit_bottom');
3108             }
3109         }
3110         else if (drone_imagery_standard_process_plot_polygon_click_type == 'top_left') {
3111             drone_imagery_standard_process_plot_polygon_click_type = '';
3112             jQuery('#drone_imagery_standard_process_plot_polygons_left_column_top_offset').val(PosY);
3113             jQuery('#drone_imagery_standard_process_plot_polygons_top_row_left_offset').val(PosX);
3114         }
3115         else if (drone_imagery_standard_process_plot_polygon_click_type == 'top_right') {
3116             drone_imagery_standard_process_plot_polygon_click_type = '';
3117             jQuery('#drone_imagery_standard_process_plot_polygons_top_row_right_offset').val(background_image_width-PosX);
3118         }
3119         else if (drone_imagery_standard_process_plot_polygon_click_type == 'bottom_left') {
3120             drone_imagery_standard_process_plot_polygon_click_type = '';
3121             jQuery('#drone_imagery_standard_process_plot_polygons_bottom_row_left_offset').val(PosX);
3122             jQuery('#drone_imagery_standard_process_plot_polygons_left_column_bottom_offset').val(background_image_height-PosY);
3123         }
3124         else if (drone_imagery_standard_process_plot_polygon_click_type == 'bottom_right') {
3125             drone_imagery_standard_process_plot_polygon_click_type = '';
3126             jQuery('#drone_imagery_standard_process_plot_polygons_right_col_bottom_offset').val(background_image_height-PosY);
3127         }
3128         else if (drone_imagery_standard_process_plot_polygon_click_type == 'get_distance') {
3129             if (plot_polygons_get_distance_point_1x != '') {
3130                 var distance = Math.round(Math.sqrt(Math.pow(plot_polygons_get_distance_point_1x - PosX, 2) + Math.pow(plot_polygons_get_distance_point_1y - PosY, 2)));
3131                 alert('Distance='+distance+'. X1='+plot_polygons_get_distance_point_1x+'. Y1='+plot_polygons_get_distance_point_1y+'. X2='+PosX+'. Y2='+PosY);
3132                 plot_polygons_get_distance_point_1x = '';
3133                 plot_polygons_get_distance_point_1y = '';
3134                 drone_imagery_plot_polygon_click_type = '';
3135             } else {
3136                 plot_polygons_get_distance_point_1x = PosX;
3137                 plot_polygons_get_distance_point_1y = PosY;
3138             }
3139         }
3140     }
3141
3142     jQuery('#drone_imagery_assign_plot_dialog').on('shown.bs.modal', function (e) {
3143         jQuery("#drone_imagery_plot_polygon_assign_plot_name").focus();
3144     });
3145
3146     jQuery('#drone_imagery_assign_plot_dialog').on('hide.bs.modal', function (e) {
3147         drawPolyline(plot_polygons_display_points);
3148         drawWaypoints(plot_polygons_display_points, plot_polygon_name, 0);
3149         drone_imagery_plot_polygons_display[plot_polygon_name] = plot_polygons_display_points;
3150         plot_polygons_display_points = [];
3151     });
3152
3153     jQuery('#drone_imagery_plot_polygon_assign_add').click(function(){
3154         plot_polygon_name = jQuery('#drone_imagery_plot_polygon_assign_plot_name').val();
3155         if (plot_polygon_name == ''){
3156             alert('Please give a name name (plot name, plant name, etc)');
3157         }
3158         drone_imagery_plot_polygons[plot_polygon_name] = plot_polygons_ind_4_points;
3159         jQuery('#drone_imagery_assign_plot_dialog').modal('hide');
3160         console.log(drone_imagery_plot_polygons);
3161         droneImageryDrawLayoutTable(field_trial_layout_response, drone_imagery_plot_polygons, 'drone_imagery_trial_layout_div', 'drone_imagery_layout_table');
3162     });
3163
3164     jQuery('#drone_imagery_assign_plot_form').on('keyup keypress', function(e) {
3165         var keyCode = e.keyCode || e.which;
3166         if (keyCode === 13) {
3167             e.preventDefault();
3168             jQuery("#drone_imagery_plot_polygon_assign_add").trigger( "click" );
3169             return false;
3170         }
3171     });
3172
3173     jQuery(document).on('click', 'button[name=drone_imagery_plot_polygons_submit_bottom]', function(){
3174
3175         jQuery('input[name="drone_imagery_plot_polygons_autocomplete"]').each(function() {
3176             var stock_name = this.value;
3177             if (stock_name != '') {
3178                 var polygon = drone_imagery_plot_generated_polygons[jQuery(this).data('generated_polygon_key')];
3179                 drone_imagery_plot_polygons[stock_name] = polygon;
3180             }
3181         });
3182
3183         submit_assignment_plot_polygons();
3184     });
3185
3186     function submit_assignment_plot_polygons() {
3187         jQuery.ajax({
3188             type: 'POST',
3189             url: '/api/drone_imagery/assign_plot_polygons',
3190             dataType: "json",
3191             data: {
3192                 'image_id': background_removed_stitched_image_id,
3193                 'drone_run_band_project_id': drone_run_band_project_id,
3194                 'stock_polygons': JSON.stringify(drone_imagery_plot_polygons),
3195                 'assign_plot_polygons_type': assign_plot_polygons_type
3196             },
3197             beforeSend: function() {
3198                 jQuery("#working_modal").modal("show");
3199             },
3200             success: function(response){
3201                 console.log(response);
3202                 if(response.error) {
3203                     alert(response.error);
3204                 }
3205
3206                 jQuery("#working_modal").modal("hide");
3207                 location.reload();
3208             },
3209             error: function(response){
3210                 jQuery("#working_modal").modal("hide");
3211                 alert('Error saving assigned plot polygons!')
3212             }
3213         });
3214     }
3215
3216     jQuery(document).on('click', '#drone_imagery_plot_polygons_generated_assign', function() {
3217         generatePlotPolygonAssignments('drone_imagery_trial_layout_div', 'drone_imagery_layout_table');
3218
3219         jQuery('input[name="drone_imagery_plot_polygons_autocomplete"]').each(function() {
3220             var stock_name = this.value;
3221             if (stock_name != '') {
3222                 var polygon = drone_imagery_plot_generated_polygons[jQuery(this).data('generated_polygon_key')];
3223                 drone_imagery_plot_polygons[stock_name] = polygon;
3224             }
3225         });
3226     });
3227
3228     function generatePlotPolygonAssignments(trial_layout_div, trial_layout_table) {
3229         var plot_polygons_first_plot_start = jQuery('#drone_imagery_plot_polygons_first_plot_start').val();
3230         var plot_polygons_second_plot_follows = jQuery('#drone_imagery_plot_polygons_second_plot_follows').val();
3231         var plot_polygons_plot_orientation = jQuery('#drone_imagery_plot_polygons_plot_orientation').val();
3232
3233         var plot_polygons_layout = field_trial_layout_response.output;
3234         var plot_polygons_plot_numbers = [];
3235         var plot_polygons_plot_numbers_plot_names = {};
3236         for (var i=1; i<plot_polygons_layout.length; i++) {
3237             var plot_polygons_plot_number = parseInt(plot_polygons_layout[i][2]);
3238             plot_polygons_plot_numbers.push(plot_polygons_plot_number);
3239             plot_polygons_plot_numbers_plot_names[plot_polygons_plot_number] = plot_polygons_layout[i][0];
3240         }
3241         plot_polygons_plot_numbers = plot_polygons_plot_numbers.sort(function (a, b) {  return a - b;  });
3242         var plot_polygons_current_plot_number_index = 0;
3243
3244         var plot_polygons_template_index = 0;
3245         var plot_polygons_template_current = plot_polygons_template_dimensions[plot_polygons_template_index];
3246         var plot_polygons_template_current_num_cols = plot_polygons_template_current.num_cols;
3247         var plot_polygons_template_current_num_rows = plot_polygons_template_current.num_rows;
3248         var plot_polygons_template_current_total_plot_polygons = plot_polygons_template_current.total_plot_polygons;
3249         var plot_polygons_template_current_plot_polygon_index = 0;
3250
3251         var plot_polygon_new_display = {};
3252         if (plot_polygons_first_plot_start == 'top_left') {
3253             var generated_polygon_key_first_plot_number = 0;
3254             if (plot_polygons_second_plot_follows == 'left' || plot_polygons_second_plot_follows == 'up') {
3255                 alert('Second plot cannot follow left or up from first plot if the first plot starts at the top left, because that is physically impossible.');
3256                 return;
3257             }
3258             if (plot_polygons_second_plot_follows == 'right') {
3259                 if (plot_polygons_plot_orientation == 'zigzag') {
3260                     var plot_polygon_current_polygon_index = generated_polygon_key_first_plot_number;
3261                     for (var j=generated_polygon_key_first_plot_number; j<plot_polygons_plot_numbers.length + drone_imagery_plot_polygons_removed_numbers.length; j++){
3262                         if (drone_imagery_plot_polygons_removed_numbers.includes(plot_polygon_current_polygon_index.toString())) {
3263                             console.log("Skipping "+plot_polygon_current_polygon_index);
3264                             plot_polygon_new_display[plot_polygon_current_polygon_index] = drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3265                         } else {
3266                             plot_polygon_new_display[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] = drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3267                             drone_imagery_plot_polygons[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] = drone_imagery_plot_generated_polygons[plot_polygon_current_polygon_index];
3268                             plot_polygons_current_plot_number_index = plot_polygons_current_plot_number_index + 1;
3269                             plot_polygons_template_current_plot_polygon_index = plot_polygons_template_current_plot_polygon_index + 1;
3270                         }
3271                         plot_polygon_current_polygon_index = plot_polygon_current_polygon_index + 1;
3272
3273                         if (plot_polygons_template_current_plot_polygon_index == plot_polygons_template_current_total_plot_polygons) {
3274                             plot_polygons_template_index = plot_polygons_template_index + 1;
3275                             plot_polygons_template_current = plot_polygons_template_dimensions[plot_polygons_template_index];
3276                             if (plot_polygons_template_current != undefined) {
3277                                 plot_polygons_template_current_num_cols = plot_polygons_template_current.num_cols;
3278                                 plot_polygons_template_current_num_rows = plot_polygons_template_current.num_rows;
3279                                 plot_polygons_template_current_total_plot_polygons = plot_polygons_template_current.total_plot_polygons;
3280                                 plot_polygons_template_current_plot_polygon_index = 0;
3281                             }
3282                         }
3283                     }
3284                 }
3285                 if (plot_polygons_plot_orientation == 'serpentine') {
3286                     var plot_polygon_current_polygon_index = generated_polygon_key_first_plot_number;
3287                     var plot_polygon_column_count = 0;
3288                     var plot_polygon_zigzig_polygon_index = generated_polygon_key_first_plot_number;
3289                     var going_right = 1;
3290                     var plot_polygon_previous_template_plot_count = 0;
3291                     for (var j=generated_polygon_key_first_plot_number; j<plot_polygons_plot_numbers.length + drone_imagery_plot_polygons_removed_numbers.length; j++){
3292
3293                         if (going_right == 1) {
3294                             plot_polygon_current_polygon_index = plot_polygon_zigzig_polygon_index;
3295                         }
3296                         if (going_right == 0) {
3297                             plot_polygon_current_polygon_index = plot_polygon_previous_template_plot_count + plot_polygons_template_current_num_cols - plot_polygon_column_count - 1;
3298                         }
3299
3300                         if (drone_imagery_plot_polygons_removed_numbers.includes(plot_polygon_current_polygon_index.toString())) {
3301                             console.log("Skipping "+plot_polygon_current_polygon_index);
3302                             plot_polygon_new_display[plot_polygon_current_polygon_index] = drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3303                         } else {
3304                             plot_polygon_new_display[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] =  drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3305                             drone_imagery_plot_polygons[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] = drone_imagery_plot_generated_polygons[plot_polygon_current_polygon_index];
3306                             plot_polygons_current_plot_number_index = plot_polygons_current_plot_number_index + 1;
3307                             plot_polygons_template_current_plot_polygon_index = plot_polygons_template_current_plot_polygon_index + 1;
3308                         }
3309
3310                         plot_polygon_zigzig_polygon_index = plot_polygon_zigzig_polygon_index + 1;
3311                         plot_polygon_column_count = plot_polygon_column_count + 1;
3312
3313                         if (plot_polygon_column_count == plot_polygons_template_current_num_cols) {
3314                             plot_polygon_column_count = 0;
3315                             if (going_right == 1) {
3316                                 going_right = 0;
3317                             } else {
3318                                 going_right = 1;
3319                             }
3320                             plot_polygon_previous_template_plot_count = plot_polygon_previous_template_plot_count + plot_polygons_template_current_num_cols;
3321                         }
3322
3323                         if (plot_polygons_template_current_plot_polygon_index == plot_polygons_template_current_total_plot_polygons) {
3324                             plot_polygons_template_index = plot_polygons_template_index + 1;
3325                             plot_polygons_template_current = plot_polygons_template_dimensions[plot_polygons_template_index];
3326                             if (plot_polygons_template_current != undefined) {
3327                                 plot_polygons_template_current_num_cols = plot_polygons_template_current.num_cols;
3328                                 plot_polygons_template_current_num_rows = plot_polygons_template_current.num_rows;
3329                                 plot_polygons_template_current_total_plot_polygons = plot_polygons_template_current.total_plot_polygons;
3330                                 plot_polygons_template_current_plot_polygon_index = 0;
3331                             }
3332                         }
3333                     }
3334                 }
3335             }
3336             if (plot_polygons_second_plot_follows == 'down') {
3337                 alert('Down not implemented if first plot starts in top left. Please contact us or try rotating your image differently before assigning plot polygons (e.g. rotate image 90 degrees clock-wise, then first plot starts in top right and you can go left for plot assignment).');
3338                 return;
3339             }
3340         }
3341         if (plot_polygons_first_plot_start == 'top_right') {
3342             var generated_polygon_key_first_plot_number = plot_polygons_template_current_num_cols - 1;
3343             if (plot_polygons_second_plot_follows == 'right' || plot_polygons_second_plot_follows == 'up') {
3344                 alert('Second plot cannot follow right or up from first plot if the first plot starts at the top right, because that is physically impossible.');
3345                 return;
3346             }
3347             if (plot_polygons_second_plot_follows == 'left') {
3348                 if (plot_polygons_plot_orientation == 'zigzag') {
3349                     console.log(generated_polygon_key_first_plot_number);
3350                     var plot_polygon_current_polygon_index = generated_polygon_key_first_plot_number;
3351                     var plot_polygon_column_count = 0;
3352                     var plot_polygon_previous_template_plot_count = 0;
3353                     for (var j=generated_polygon_key_first_plot_number; j<generated_polygon_key_first_plot_number + plot_polygons_plot_numbers.length + drone_imagery_plot_polygons_removed_numbers.length; j++){
3354
3355                         plot_polygon_current_polygon_index = plot_polygon_previous_template_plot_count + plot_polygons_template_current_num_cols - plot_polygon_column_count - 1;
3356
3357                         if (drone_imagery_plot_polygons_removed_numbers.includes(plot_polygon_current_polygon_index.toString())) {
3358                             console.log("Skipping "+plot_polygon_current_polygon_index);
3359                             plot_polygon_new_display[plot_polygon_current_polygon_index] =  drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3360                         } else {
3361                             plot_polygon_new_display[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] =  drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3362                             drone_imagery_plot_polygons[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] = drone_imagery_plot_generated_polygons[plot_polygon_current_polygon_index];
3363                             plot_polygons_current_plot_number_index = plot_polygons_current_plot_number_index + 1;
3364                             plot_polygons_template_current_plot_polygon_index = plot_polygons_template_current_plot_polygon_index + 1;
3365                         }
3366
3367                         plot_polygon_column_count = plot_polygon_column_count + 1;
3368
3369                         if (plot_polygon_column_count == plot_polygons_template_current_num_cols) {
3370                             plot_polygon_column_count = 0;
3371                             plot_polygon_previous_template_plot_count = plot_polygon_previous_template_plot_count + plot_polygons_template_current_num_cols;
3372                         }
3373
3374                         if (plot_polygons_template_current_plot_polygon_index == plot_polygons_template_current_total_plot_polygons) {
3375                             plot_polygons_template_index = plot_polygons_template_index + 1;
3376                             plot_polygons_template_current = plot_polygons_template_dimensions[plot_polygons_template_index];
3377                             if (plot_polygons_template_current != undefined) {
3378                                 plot_polygons_template_current_num_cols = plot_polygons_template_current.num_cols;
3379                                 plot_polygons_template_current_num_rows = plot_polygons_template_current.num_rows;
3380                                 plot_polygons_template_current_total_plot_polygons = plot_polygons_template_current.total_plot_polygons;
3381                                 plot_polygons_template_current_plot_polygon_index = 0;
3382                             }
3383                         }
3384                     }
3385                 }
3386                 if (plot_polygons_plot_orientation == 'serpentine') {
3387                     var plot_polygon_current_polygon_index = generated_polygon_key_first_plot_number;
3388                     var plot_polygon_column_count = 0;
3389                     var plot_polygon_zigzig_polygon_index = generated_polygon_key_first_plot_number;
3390                     var going_left = 1;
3391                     var plot_polygon_previous_template_plot_count = 0;
3392                     for (var j=generated_polygon_key_first_plot_number; j<generated_polygon_key_first_plot_number + plot_polygons_plot_numbers.length + drone_imagery_plot_polygons_removed_numbers.length; j++){
3393
3394                         if (going_left == 0) {
3395                             plot_polygon_current_polygon_index = plot_polygon_previous_template_plot_count + plot_polygon_column_count;
3396                         }
3397                         if (going_left == 1) {
3398                             plot_polygon_current_polygon_index = plot_polygon_previous_template_plot_count + plot_polygons_template_current_num_cols - plot_polygon_column_count - 1;
3399                         }
3400
3401                         if (drone_imagery_plot_polygons_removed_numbers.includes(plot_polygon_current_polygon_index.toString())) {
3402                             console.log("Skipping "+plot_polygon_current_polygon_index);
3403                             plot_polygon_new_display[plot_polygon_current_polygon_index] = drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3404                         } else {
3405                             plot_polygon_new_display[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] =  drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3406                             drone_imagery_plot_polygons[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] = drone_imagery_plot_generated_polygons[plot_polygon_current_polygon_index];
3407                             plot_polygons_current_plot_number_index = plot_polygons_current_plot_number_index + 1;
3408                             plot_polygons_template_current_plot_polygon_index = plot_polygons_template_current_plot_polygon_index + 1;
3409                         }
3410
3411                         plot_polygon_zigzig_polygon_index = plot_polygon_zigzig_polygon_index + 1;
3412                         plot_polygon_column_count = plot_polygon_column_count + 1;
3413
3414                         if (plot_polygon_column_count == plot_polygons_template_current_num_cols) {
3415                             plot_polygon_column_count = 0;
3416                             if (going_left == 1) {
3417                                 going_left = 0;
3418                             } else {
3419                                 going_left = 1;
3420                             }
3421                             plot_polygon_previous_template_plot_count = plot_polygon_previous_template_plot_count + plot_polygons_template_current_num_cols;
3422                         }
3423
3424                         if (plot_polygons_template_current_plot_polygon_index == plot_polygons_template_current_total_plot_polygons) {
3425                             plot_polygons_template_index = plot_polygons_template_index + 1;
3426                             plot_polygons_template_current = plot_polygons_template_dimensions[plot_polygons_template_index];
3427                             if (plot_polygons_template_current != undefined) {
3428                                 plot_polygons_template_current_num_cols = plot_polygons_template_current.num_cols;
3429                                 plot_polygons_template_current_num_rows = plot_polygons_template_current.num_rows;
3430                                 plot_polygons_template_current_total_plot_polygons = plot_polygons_template_current.total_plot_polygons;
3431                                 plot_polygons_template_current_plot_polygon_index = 0;
3432                             }
3433                         }
3434                     }
3435                 }
3436             }
3437             if (plot_polygons_second_plot_follows == 'down') {
3438                 alert('Down not implemented if your first plot starts in top right. Please contact us or try rotating your image differently before assigning plot polygons (e.g. rotate image 90 degrees clockwise, then first plot starts in bottom right corner and plot assignment can follow going left).');
3439                 return;
3440             }
3441         }
3442         if (plot_polygons_first_plot_start == 'bottom_left') {
3443             var generated_polygon_key_first_plot_number = plot_polygons_number_generated - (plot_polygons_num_border_rows_bottom * plot_polygons_num_cols_generated) - plot_polygons_num_border_rows_right;
3444             if (plot_polygons_second_plot_follows == 'left' || plot_polygons_second_plot_follows == 'down') {
3445                 alert('Second plot cannot follow left or down from the first plot if the first plot starts at the bottom left, because that is physically impossible.');
3446                 return;
3447             }
3448             if (plot_polygons_second_plot_follows == 'right') {
3449                 if (plot_polygons_plot_orientation == 'serpentine') {
3450                     var plot_polygon_current_polygon_index = generated_polygon_key_first_plot_number;
3451                     var plot_polygon_column_count = 0;
3452                     var going_right = 1;
3453                     var plot_polygon_row_count = 0;
3454                     for (var j=0; j<plot_polygons_plot_numbers.length; j++){
3455
3456                         if (going_right == 0) {
3457                             plot_polygon_current_polygon_index = plot_polygons_number_generated - (plot_polygons_num_border_rows_bottom * plot_polygons_num_cols_generated) - (plot_polygon_row_count * plot_polygons_num_cols_generated) - plot_polygons_num_border_rows_right - plot_polygon_column_count - 1;
3458                         }
3459                         if (going_right == 1) {
3460                             plot_polygon_current_polygon_index = plot_polygons_number_generated - (plot_polygons_num_border_rows_bottom * plot_polygons_num_cols_generated) - (plot_polygon_row_count * plot_polygons_num_cols_generated) - plot_polygons_num_cols_generated + plot_polygons_num_border_rows_left + plot_polygon_column_count;
3461                         }
3462
3463                         if (drone_imagery_plot_polygons_removed_numbers.includes(plot_polygon_current_polygon_index.toString())) {
3464                             console.log("Skipping "+plot_polygon_current_polygon_index);
3465                             plot_polygon_new_display[plot_polygon_current_polygon_index] = drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3466                         } else {
3467                             plot_polygon_new_display[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] =  drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3468                             drone_imagery_plot_polygons[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] = drone_imagery_plot_generated_polygons[plot_polygon_current_polygon_index];
3469                             plot_polygons_current_plot_number_index = plot_polygons_current_plot_number_index + 1;
3470                         }
3471
3472                         plot_polygon_column_count = plot_polygon_column_count + 1;
3473
3474                         if (plot_polygon_column_count == (plot_polygons_num_cols_generated - plot_polygons_num_border_rows_left - plot_polygons_num_border_rows_right)) {
3475                             plot_polygon_column_count = 0;
3476                             plot_polygon_row_count = plot_polygon_row_count + 1;
3477                             if (going_right == 1) {
3478                                 going_right = 0;
3479                             } else {
3480                                 going_right = 1;
3481                             }
3482                         }
3483                     }
3484                 }
3485                 if (plot_polygons_plot_orientation == 'zigzag') {
3486                     var plot_polygon_current_polygon_index = generated_polygon_key_first_plot_number;
3487                     var plot_polygon_column_count = 0;
3488                     var plot_polygon_row_count = 0;
3489                     for (var j=0; j<plot_polygons_plot_numbers.length; j++){
3490
3491                         plot_polygon_current_polygon_index = plot_polygons_number_generated - (plot_polygons_num_border_rows_bottom * plot_polygons_num_cols_generated) - (plot_polygon_row_count * plot_polygons_num_cols_generated) - plot_polygons_num_cols_generated + plot_polygons_num_border_rows_left + plot_polygon_column_count;
3492
3493                         if (drone_imagery_plot_polygons_removed_numbers.includes(plot_polygon_current_polygon_index.toString())) {
3494                             console.log("Skipping "+plot_polygon_current_polygon_index);
3495                             plot_polygon_new_display[plot_polygon_current_polygon_index] = drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3496                         } else {
3497                             plot_polygon_new_display[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] =  drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3498                             drone_imagery_plot_polygons[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] = drone_imagery_plot_generated_polygons[plot_polygon_current_polygon_index];
3499                             plot_polygons_current_plot_number_index = plot_polygons_current_plot_number_index + 1;
3500                         }
3501
3502                         plot_polygon_column_count = plot_polygon_column_count + 1;
3503
3504                         if (plot_polygon_column_count == (plot_polygons_num_cols_generated - plot_polygons_num_border_rows_left - plot_polygons_num_border_rows_right)) {
3505                             plot_polygon_column_count = 0;
3506                             plot_polygon_row_count = plot_polygon_row_count + 1;
3507                         }
3508                     }
3509                 }
3510             }
3511             if (plot_polygons_second_plot_follows == 'up') {
3512                 alert('Up not implemented if your first plot starts in bottom left. Please contact us or try rotating your image differently before assigning plot polygons (e.g. rotate image clockwise 90 degrees, then first plot starts in top-left corner and plot assignment can follow going right).');
3513                 return;
3514             }
3515         }
3516         if (plot_polygons_first_plot_start == 'bottom_right') {
3517             var generated_polygon_key_first_plot_number = plot_polygons_number_generated - (plot_polygons_num_border_rows_bottom * plot_polygons_num_cols_generated) - plot_polygons_num_border_rows_right - 1;
3518             if (plot_polygons_second_plot_follows == 'right' || plot_polygons_second_plot_follows == 'down') {
3519                 alert('Second plot cannot follow right or down from the first plot if the first plot starts at the bottom right, because that is physically impossible.');
3520                 return;
3521             }
3522             if (plot_polygons_second_plot_follows == 'left') {
3523                 if (plot_polygons_plot_orientation == 'zigzag') {
3524                     var plot_polygon_current_polygon_index = generated_polygon_key_first_plot_number;
3525                     var plot_polygon_column_count = 0;
3526                     for (var j=0; j<plot_polygons_plot_numbers.length; j++){
3527
3528                         if (drone_imagery_plot_polygons_removed_numbers.includes(plot_polygon_current_polygon_index.toString())) {
3529                             console.log("Skipping "+plot_polygon_current_polygon_index);
3530                             plot_polygon_new_display[plot_polygon_current_polygon_index] = drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3531                         } else {
3532                             plot_polygon_new_display[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] = drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3533                             drone_imagery_plot_polygons[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] = drone_imagery_plot_generated_polygons[plot_polygon_current_polygon_index];
3534                             plot_polygons_current_plot_number_index = plot_polygons_current_plot_number_index + 1;
3535                         }
3536
3537                         plot_polygon_current_polygon_index = plot_polygon_current_polygon_index - 1;
3538                         plot_polygon_column_count = plot_polygon_column_count + 1;
3539
3540                         if (plot_polygon_column_count == (plot_polygons_num_cols_generated - plot_polygons_num_border_rows_left - plot_polygons_num_border_rows_right)) {
3541                             plot_polygon_current_polygon_index = plot_polygon_current_polygon_index - plot_polygons_num_border_rows_left - plot_polygons_num_border_rows_right;
3542                             plot_polygon_column_count = 0;
3543                         }
3544                     }
3545                 }
3546                 if (plot_polygons_plot_orientation == 'serpentine') {
3547                     var plot_polygon_current_polygon_index = generated_polygon_key_first_plot_number;
3548                     var plot_polygon_column_count = 0;
3549                     var plot_polygon_zigzig_polygon_index = generated_polygon_key_first_plot_number;
3550                     var going_left = 1;
3551                     var plot_polygon_row_count = 0;
3552                     for (var j=0; j<plot_polygons_plot_numbers.length; j++){
3553
3554                         if (going_left == 1) {
3555                             plot_polygon_current_polygon_index = plot_polygon_zigzig_polygon_index;
3556                         }
3557                         if (going_left == 0) {
3558                             plot_polygon_current_polygon_index = plot_polygons_number_generated - (plot_polygons_num_border_rows_bottom * plot_polygons_num_cols_generated) - (plot_polygon_row_count * plot_polygons_num_cols_generated) - plot_polygons_num_cols_generated + plot_polygons_num_border_rows_left + plot_polygon_column_count;
3559                         }
3560
3561                         if (drone_imagery_plot_polygons_removed_numbers.includes(plot_polygon_current_polygon_index.toString())) {
3562                             console.log("Skipping "+plot_polygon_current_polygon_index);
3563                             plot_polygon_new_display[plot_polygon_current_polygon_index] = drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3564                         } else {
3565                             plot_polygon_new_display[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] = drone_imagery_plot_polygons_display[plot_polygon_current_polygon_index];
3566                             drone_imagery_plot_polygons[plot_polygons_plot_numbers_plot_names[plot_polygons_plot_numbers[plot_polygons_current_plot_number_index]]] = drone_imagery_plot_generated_polygons[plot_polygon_current_polygon_index];
3567                             plot_polygons_current_plot_number_index = plot_polygons_current_plot_number_index + 1;
3568                         }
3569
3570                         plot_polygon_zigzig_polygon_index = plot_polygon_zigzig_polygon_index - 1;
3571                         plot_polygon_column_count = plot_polygon_column_count + 1;
3572
3573                         if (plot_polygon_column_count == (plot_polygons_num_cols_generated - plot_polygons_num_border_rows_left - plot_polygons_num_border_rows_right)) {
3574                             plot_polygon_zigzig_polygon_index = plot_polygon_zigzig_polygon_index - plot_polygons_num_border_rows_left - plot_polygons_num_border_rows_right;
3575                             plot_polygon_column_count = 0;
3576                             plot_polygon_row_count = plot_polygon_row_count + 1;
3577                             if (going_left == 1) {
3578                                 going_left = 0;
3579                             } else {
3580                                 going_left = 1;
3581                             }
3582                         }
3583                     }
3584                 }
3585             }
3586             if (plot_polygons_second_plot_follows == 'up') {
3587                 alert('Up not implemented if your first plot starts in bottom right. Please contact us or try rotating your image differently before assigning plot polygons (e.g. rotate image 90 degrees clockwise, then first plot starts in bottom left corner and plot assignment can follow going right).');
3588                 return;
3589             }
3590         }
3591
3592         console.log(drone_imagery_plot_polygons);
3593         droneImageryDrawLayoutTable(field_trial_layout_response, drone_imagery_plot_polygons, trial_layout_div, trial_layout_table);
3594
3595         drone_imagery_plot_polygons_display = plot_polygon_new_display;
3596         draw_canvas_image(background_image_url, plot_polygons_total_height_generated/plot_polygons_num_rows_generated);
3597     }
3598
3599     function droneImageryRectangleLayoutTable(generated_polygons, plot_polygons_layout_assignment_info, plot_polygons_layout_assignment_table, plot_polygons_generate_assignment_button, plot_polygon_assignment_submit_button) {
3600         var html = '<hr><div class="well well-sm"><h2>Assign Plot Polygons to Field Trial Entities</h2>';
3601         html = html + '<div class="panel panel-default"><div class="panel-body"><div class="form form-horizontal">';
3602         html = html + '<div class="row"><div class="col-sm-6"><div class="form-group form-group-sm"><label class="col-sm-6 control-label">Location of First Plot (e.g. plot number 1): </label><div class="col-sm-6"><select class="form-control" id="drone_imagery_plot_polygons_first_plot_start" name="drone_imagery_plot_polygons_first_plot_start"><option value="top_left">Top Left</option><option value="top_right">Top Right</option><option value="bottom_left" disabled>Bottom Left</option><option value="bottom_right" disabled>Bottom Right</option></select></div></div></div><div class="col-sm-6"><div class="form-group form-group-sm"><label class="col-sm-6 control-label">Second Plot Follows First Plot Going: </label><div class="col-sm-6"><select class="form-control" id="drone_imagery_plot_polygons_second_plot_follows" name="drone_imagery_plot_polygons_second_plot_follows"><option value="right">Right</option><option value="up">Up</option><option value="down">Down</option><option value="left">Left</option></select></div></div></div></div>';
3603         html = html + '<div class="row"><div class="col-sm-6"><div class="form-group form-group-sm"><label class="col-sm-6 control-label">Plot Number Orientation: </label><div class="col-sm-6"><select class="form-control" id="drone_imagery_plot_polygons_plot_orientation" name="drone_imagery_plot_polygons_plot_orientation"><option value="serpentine">Serpentine</option><option value="zigzag">Zigzag (Not Serpentine)</option></select></div></div></div></div>';
3604         html = html + '</div></div></div></div>';
3605         //html = html + '<table class="table table-borders table-hover" id="'+plot_polygons_layout_assignment_table+'"><thead><tr><th>Generated Number</th><th>Field Trial Observation Unit</th></tr></thead><tbody>';
3606         //for (key in generated_polygons) {
3607         //    html = html + '<tr><td>' + key + '</td><td><input class="form-control" type="text" name="drone_imagery_plot_polygons_autocomplete" data-generated_polygon_key="'+key+'"/></td></tr>';
3608         //}
3609         //html = html + '</tbody></table>';
3610         html = html + '<button class="btn btn-primary" id="'+plot_polygons_generate_assignment_button+'">Generate Assignments (Does Not Save)</button>&nbsp;&nbsp;&nbsp;<button class="btn btn-primary" name="'+plot_polygon_assignment_submit_button+'">Finish and Save Polygons To Plots</button></div>';
3611         jQuery('#'+plot_polygons_layout_assignment_info).html(html);
3612         jQuery('#'+plot_polygons_layout_assignment_table).DataTable({'paging':false});
3613
3614         jQuery('input[name=drone_imagery_plot_polygons_autocomplete]').autocomplete({
3615             source: drone_imagery_plot_polygons_available_stock_names
3616         });
3617     }
3618
3619     function droneImageryDrawLayoutTable(response, plot_polygons, layout_div_id, layout_table_div_id) {
3620         var output = response.output;
3621         var header = output[0];
3622         var html = '<table class="table table-borders table-hover" id="'+layout_table_div_id+'"><thead><tr>';
3623         for (var i=0; i<header.length; i++){
3624             html = html + '<td>'+header[i]+'</td>';
3625         }
3626         html = html + '<td>Polygon Assigned</td>';
3627         html = html + '</tr></thead><tbody>';
3628         for (var i=1; i<output.length; i++){
3629             html = html + '<tr>';
3630             for (var j=0; j<output[i].length; j++){
3631                 html = html + '<td>'+output[i][j]+'</td>';
3632             }
3633             if (output[i][0] in plot_polygons && plot_polygons[output[i][0]] != undefined){
3634                 html = html + '<td>Yes</td>';
3635             } else {
3636                 html = html + '<td></td>';
3637             }
3638             html = html + '</tr>';
3639         }
3640         html = html + '</tbody></table>';
3641         jQuery('#'+layout_div_id).html(html);
3642         jQuery('#'+layout_table_div_id).DataTable();
3643     }
3644
3645     //
3646     //Remove Background Histogram
3647     //
3648
3649     var removeBackgroundHistogramImg;
3650     var removeBackgroundDisplayImg;
3651     var removeBackgroundThresholdPeak1;
3652     var removeBackgroundThresholdPeak1pixels;
3653     var removeBackgroundThresholdPeak2;
3654     var removeBackgroundThresholdPeak2pixels;
3655     var removeBackgroundThresholdValue;
3656     var remove_background_denoised_stitched_image_id;
3657     var remove_background_current_image_id;
3658     var remove_background_current_image_type;
3659     var remove_background_drone_run_band_project_id;
3660
3661     jQuery(document).on('click', 'button[name=project_drone_imagery_remove_background]', function(){
3662         showManageDroneImagerySection('manage_drone_imagery_remove_background_div');
3663
3664         remove_background_denoised_stitched_image_id = jQuery(this).data('denoised_stitched_image_id');
3665         remove_background_drone_run_band_project_id = jQuery(this).data('drone_run_band_project_id');
3666         remove_background_current_image_id = jQuery(this).data('remove_background_current_image_id');
3667         remove_background_current_image_type = jQuery(this).data('remove_background_current_image_type');
3668
3669         showRemoveBackgroundHistogramStart(remove_background_current_image_id, 'drone_imagery_remove_background_original', 'drone_imagery_remove_background_histogram_div', 'manage_drone_imagery_remove_background_load_div');
3670     });
3671
3672     function showRemoveBackgroundHistogramStart(remove_background_current_image_id, canvas_div_id, histogram_canvas_div_id, load_div_id) {
3673         jQuery.ajax({
3674             url : '/api/drone_imagery/get_image?image_id='+remove_background_current_image_id,
3675             beforeSend: function() {
3676                 jQuery("#working_modal").modal("show");
3677             },
3678             success: function(response){
3679                 console.log(response);
3680                 jQuery("#working_modal").modal("hide");
3681
3682                 var canvas = document.getElementById(canvas_div_id);
3683                 removeBackgroundDisplayImg = canvas;
3684                 ctx = canvas.getContext('2d');
3685                 var image = new Image();
3686                 image.onload = function () {
3687                     canvas.width = this.naturalWidth;
3688                     canvas.height = this.naturalHeight;
3689                     ctx.drawImage(this, 0, 0);
3690
3691                     var src = cv.imread(canvas_div_id);
3692                     cv.cvtColor(src, src, cv.COLOR_RGBA2GRAY, 0);
3693                     var srcVec = new cv.MatVector();
3694                     srcVec.push_back(src);
3695                     var accumulate = false;
3696                     var channels = [0];
3697                     var histSize = [256];
3698                     var ranges = [0, 255];
3699                     var hist = new cv.Mat();
3700                     var mask = new cv.Mat();
3701                     var color = new cv.Scalar(255, 255, 255);
3702                     var scale = 3;
3703                     var hist_height = src.rows/2;
3704
3705                     cv.calcHist(srcVec, channels, mask, hist, histSize, ranges, accumulate);
3706                     var result = cv.minMaxLoc(hist, mask);
3707                     var max = result.maxVal;
3708                     var dst = new cv.Mat.zeros(hist_height, histSize[0] * scale, cv.CV_8UC3);
3709                     // draw histogram
3710                     for (let i = 0; i < histSize[0]; i++) {
3711                         var binVal = hist.data32F[i] * hist_height / max;
3712                         var point1 = new cv.Point(i * scale, hist_height - 1);
3713                         var point2 = new cv.Point((i + 1) * scale - 1, hist_height - binVal);
3714                         cv.rectangle(dst, point1, point2, color, cv.FILLED);
3715                     }
3716                     cv.imshow(histogram_canvas_div_id, dst);
3717                     src.delete(); dst.delete(); srcVec.delete(); mask.delete(); hist.delete();
3718
3719                     removeBackgroundHistogramImg = document.getElementById(histogram_canvas_div_id);
3720                     removeBackgroundHistogramImg.onmousemove = GetCoordinatesRemoveBackgrounHistogram;
3721                     removeBackgroundHistogramImg.onmousedown = GetCoordinatesRemoveBackgrounHistogramDrawLine;
3722
3723                     jQuery('#'+load_div_id).hide();
3724
3725                 };
3726                 image.src = response.image_url;
3727
3728             },
3729             error: function(response){
3730                 jQuery("#working_modal").modal("hide");
3731                 alert('Error retrieving image!')
3732             }
3733         });
3734     }
3735
3736     jQuery('#drone_imagery_remove_background_find_minimum').click(function(){
3737         if (!removeBackgroundThresholdPeak1 || !removeBackgroundThresholdPeak2) {
3738             alert('Please click on the two right-most peaks in the histogram first!');
3739         } else {
3740             showRemoveBackgroundHistogramMinimum(remove_background_current_image_id, 'drone_imagery_remove_background_original', 'drone_imagery_remove_background_histogram_div');
3741         }
3742     });
3743
3744     function showRemoveBackgroundHistogramMinimum(remove_background_current_image_id, canvas_div_id, histogram_canvas_div_id) {
3745         jQuery.ajax({
3746             url : '/api/drone_imagery/get_image?image_id='+remove_background_current_image_id,
3747             beforeSend: function() {
3748                 jQuery("#working_modal").modal("show");
3749             },
3750             success: function(response){
3751                 console.log(response);
3752                 jQuery("#working_modal").modal("hide");
3753
3754                 var canvas = document.getElementById(canvas_div_id);
3755                 ctx = canvas.getContext('2d');
3756                 var image = new Image();
3757                 image.onload = function () {
3758                     canvas.width = this.naturalWidth;
3759                     canvas.height = this.naturalHeight;
3760                     ctx.drawImage(this, 0, 0);
3761
3762                     var src = cv.imread(canvas_div_id);
3763                     cv.cvtColor(src, src, cv.COLOR_RGBA2GRAY, 0);
3764                     var srcVec = new cv.MatVector();
3765                     srcVec.push_back(src);
3766                     var accumulate = false;
3767                     var channels = [0];
3768                     var histSize = [256];
3769                     var ranges = [0, 255];
3770                     var hist = new cv.Mat();
3771                     var mask = new cv.Mat();
3772                     var color = new cv.Scalar(255, 255, 255);
3773                     var scale = 3;
3774                     var hist_height = src.rows/2;
3775
3776                     cv.calcHist(srcVec, channels, mask, hist, histSize, ranges, accumulate);
3777                     var result = cv.minMaxLoc(hist, mask);
3778                     var max = result.maxVal;
3779                     var dst = new cv.Mat.zeros(hist_height, histSize[0] * scale, cv.CV_8UC3);
3780                     // draw histogram
3781                     var minimum_x_val = 0;
3782                     var minimum_x_val_pix = 0;
3783                     var minimum_y_val = 1000000000000000000000000000;
3784
3785                     if (removeBackgroundThresholdPeak1pixels > removeBackgroundThresholdPeak2pixels) {
3786                         var removeBackgroundThresholdPeak1pixels_original = removeBackgroundThresholdPeak1pixels;
3787                         removeBackgroundThresholdPeak1pixels = removeBackgroundThresholdPeak2pixels;
3788                         removeBackgroundThresholdPeak2pixels = removeBackgroundThresholdPeak1pixels_original;
3789                     }
3790
3791                     for (let i = 0; i < histSize[0]; i++) {
3792                         var binVal = hist.data32F[i] * hist_height / max;
3793
3794                         var x_start = i * scale;
3795                         if (x_start >= removeBackgroundThresholdPeak1pixels && x_start <= removeBackgroundThresholdPeak2pixels){
3796                             //console.log('x: '+i.toString()+' y: '+binVal.toString());
3797                             if (binVal < minimum_y_val) {
3798                                 minimum_y_val = binVal;
3799                                 minimum_x_val = i;
3800                                 minimum_x_val_pix = x_start;
3801                             }
3802                         }
3803
3804                         var point1 = new cv.Point(x_start, hist_height - 1);
3805                         var point2 = new cv.Point((i + 1) * scale - 1, hist_height - binVal);
3806                         cv.rectangle(dst, point1, point2, color, cv.FILLED);
3807                     }
3808                     cv.imshow('drone_imagery_remove_background_histogram_div', dst);
3809                     src.delete(); dst.delete(); srcVec.delete(); mask.delete(); hist.delete();
3810
3811                     removeBackgroundHistogramImg = document.getElementById(histogram_canvas_div_id);
3812                     removeBackgroundHistogramImg.onmousemove = GetCoordinatesRemoveBackgrounHistogram;
3813                     removeBackgroundHistogramImg.onmousedown = GetCoordinatesRemoveBackgrounHistogramDrawLine;
3814
3815                     jQuery('div[name="drone_imagery_remove_background_threshold"]').html('<h5>Selected Threshold Value: '+ minimum_x_val );
3816
3817                     removeBackgroundHistogramImgDrawLine(removeBackgroundHistogramImg, removeBackgroundThresholdPeak1pixels, removeBackgroundHistogramImg.height, '#ff0000');
3818                     removeBackgroundHistogramImgDrawLine(removeBackgroundHistogramImg, removeBackgroundThresholdPeak2pixels, removeBackgroundHistogramImg.height, '#ff0000');
3819                     removeBackgroundHistogramImgDrawLine(removeBackgroundHistogramImg, minimum_x_val_pix, removeBackgroundHistogramImg.height, '#0000ff');
3820
3821                     removeBackgroundThresholdValue = minimum_x_val;
3822
3823                     removeBackgroundHistogramImgReDraw();
3824                 };
3825                 image.src = response.image_url;
3826             },
3827             error: function(response){
3828                 jQuery("#working_modal").modal("hide");
3829                 alert('Error retrieving image!')
3830             }
3831         });
3832     }
3833
3834     jQuery('#drone_imagery_remove_background_start_over').click(function(){
3835         removeBackgroundThresholdPeak1 = undefined;
3836         removeBackgroundThresholdPeak2 = undefined;
3837         removeBackgroundThresholdPeak1pixels = undefined;
3838         removeBackgroundThresholdPeak2pixels = undefined;
3839
3840         showRemoveBackgroundHistogramStart(remove_background_current_image_id, 'drone_imagery_remove_background_original', 'drone_imagery_remove_background_histogram_div', 'manage_drone_imagery_remove_background_load_div');
3841     });
3842
3843     function removeBackgroundHistogramImgDrawLine(removeBackgroundHistogramImg, position, image_height, color) {
3844         var ctx = removeBackgroundHistogramImg.getContext("2d");
3845         ctx.beginPath();
3846         ctx.moveTo(position,0);
3847         ctx.lineTo(position, image_height);
3848         ctx.strokeStyle = color;
3849         ctx.stroke();
3850     }
3851
3852     function removeBackgroundHistogramImgReDraw() {
3853         jQuery.ajax({
3854             type: 'POST',
3855             url: '/api/drone_imagery/remove_background_display',
3856             dataType: "json",
3857             data: {
3858                 'image_id': remove_background_current_image_id,
3859                 'drone_run_band_project_id': remove_background_drone_run_band_project_id,
3860                 'lower_threshold': removeBackgroundThresholdValue,
3861                 'upper_threshold': '255',
3862             },
3863             success: function(response){
3864                 console.log(response);
3865                 if(response.error) {
3866                     alert(response.error);
3867                 }
3868
3869                 var canvas = removeBackgroundDisplayImg;
3870                 ctx = canvas.getContext('2d');
3871                 var image = new Image();
3872                 image.onload = function () {
3873                     canvas.width = this.naturalWidth;
3874                     canvas.height = this.naturalHeight;
3875                     ctx.drawImage(this, 0, 0);
3876                 };
3877                 image.src = response.removed_background_image_url;
3878             },
3879             error: function(response){
3880                 alert('Error saving removed background display image!')
3881             }
3882         });
3883     }
3884
3885     function GetCoordinatesRemoveBackgrounHistogram(e) {
3886         var PosX = 0;
3887         var PosY = 0;
3888         var ImgPos;
3889         ImgPos = FindPosition(removeBackgroundHistogramImg);
3890         if (!e) var e = window.event;
3891         if (e.pageX || e.pageY) {
3892             PosX = e.pageX;
3893             PosY = e.pageY;
3894         }
3895         else if (e.clientX || e.clientY) {
3896             PosX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
3897             PosY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
3898         }
3899         PosX = PosX - ImgPos[0];
3900         PosY = PosY - ImgPos[1];
3901
3902         jQuery('div[name="drone_imagery_remove_background_threshold_current"]').html('<h5>Current Mouse Value: '+ (((PosX+1)/3)-1) );
3903     }
3904
3905     function GetCoordinatesRemoveBackgrounHistogramDrawLine(e) {
3906         var PosX = 0;
3907         var PosY = 0;
3908         var image_width = removeBackgroundHistogramImg.width;
3909         var image_height = removeBackgroundHistogramImg.height;
3910
3911         var ImgPos;
3912         ImgPos = FindPosition(removeBackgroundHistogramImg);
3913         if (!e) var e = window.event;
3914         if (e.pageX || e.pageY) {
3915             PosX = e.pageX;
3916             PosY = e.pageY;
3917         }
3918         else if (e.clientX || e.clientY) {
3919             PosX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
3920             PosY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
3921         }
3922         PosX = PosX - ImgPos[0];
3923         PosY = PosY - ImgPos[1];
3924
3925         if (!removeBackgroundThresholdPeak1 || !removeBackgroundThresholdPeak2) {
3926             removeBackgroundHistogramImgDrawLine(removeBackgroundHistogramImg, PosX, image_height, '#ff0000');
3927
3928             var threshold_value = Math.round( (((PosX+1)/3)-1) );
3929             if (removeBackgroundThresholdPeak1) {
3930                 removeBackgroundThresholdPeak2 = threshold_value;
3931                 removeBackgroundThresholdPeak2pixels = PosX;
3932             } else {
3933                 removeBackgroundThresholdPeak1 = threshold_value;
3934                 removeBackgroundThresholdPeak1pixels = PosX;
3935             }
3936         }
3937     }
3938
3939     jQuery('#drone_imagery_remove_background_submit').click(function(){
3940         manage_drone_imagery_remove_background_threshold_save(remove_background_current_image_id, remove_background_current_image_type, remove_background_drone_run_band_project_id, removeBackgroundThresholdValue, '255');
3941     });
3942
3943     jQuery('#drone_imagery_remove_background_defined_submit').click(function(){
3944         var remove_background_drone_run_band_lower_threshold = jQuery('#drone_imagery_remove_background_lower_threshold').val();
3945         var remove_background_drone_run_band_upper_threshold = jQuery('#drone_imagery_remove_background_upper_threshold').val();
3946         manage_drone_imagery_remove_background_threshold_save(remove_background_current_image_id, remove_background_current_image_type, remove_background_drone_run_band_project_id, remove_background_drone_run_band_lower_threshold, remove_background_drone_run_band_upper_threshold);
3947     });
3948
3949     function calculateThresholdPercentageValues(canvas_div_id, drone_imagery_remove_background_lower_percentage, drone_imagery_remove_background_upper_percentage) {
3950         var src = cv.imread(canvas_div_id);
3951         cv.cvtColor(src, src, cv.COLOR_RGBA2GRAY, 0);
3952         var srcVec = new cv.MatVector();
3953         srcVec.push_back(src);
3954         var total_pixels = src.cols * src.rows;
3955         var accumulate = false;
3956         var channels = [0];
3957         var histSize = [256];
3958         var ranges = [0, 255];
3959         var hist = new cv.Mat();
3960         var mask = new cv.Mat();
3961
3962         cv.calcHist(srcVec, channels, mask, hist, histSize, ranges, accumulate);
3963         var summing = 0;
3964         var drone_imagery_remove_background_lower_percentage_threshold;
3965         var drone_imagery_remove_background_upper_percentage_threshold;
3966         for (let i = 0; i < histSize[0]; i++) {
3967             var binVal = hist.data32F[i];
3968             summing = summing + binVal;
3969             var percentage = summing / total_pixels;
3970             if (percentage >= drone_imagery_remove_background_lower_percentage) {
3971                 drone_imagery_remove_background_lower_percentage_threshold = i;
3972                 break;
3973             }
3974         }
3975         summing = 0;
3976         for (let i = 0; i < histSize[0]; i++) {
3977             var binVal = hist.data32F[i];
3978             summing = summing + binVal;
3979             var percentage = summing / total_pixels;
3980             if (percentage >= 1-drone_imagery_remove_background_upper_percentage) {
3981                 drone_imagery_remove_background_upper_percentage_threshold = i;
3982                 break;
3983             }
3984         }
3985         return [drone_imagery_remove_background_lower_percentage_threshold*100, drone_imagery_remove_background_upper_percentage_threshold*100];
3986     }
3987
3988     jQuery('#drone_imagery_remove_background_defined_percentage_submit').click(function(){
3989         var drone_imagery_remove_background_lower_percentage = Number(jQuery('#drone_imagery_remove_background_lower_threshold_percentage').val())/100;
3990         var drone_imagery_remove_background_upper_percentage = Number(jQuery('#drone_imagery_remove_background_upper_threshold_percentage').val())/100;
3991
3992         var threshold_value_return = calculateThresholdPercentageValues('drone_imagery_remove_background_original', drone_imagery_remove_background_lower_percentage, drone_imagery_remove_background_upper_percentage);
3993
3994         manage_drone_imagery_remove_background_threshold_save(remove_background_current_image_id, remove_background_current_image_type, remove_background_drone_run_band_project_id, threshold_value_return[0], threshold_value_return[1]);
3995     });
3996
3997     function manage_drone_imagery_remove_background_threshold_save(image_id, image_type, drone_run_band_project_id, lower_threshold, upper_threshold){
3998         jQuery.ajax({
3999             type: 'POST',
4000             url: '/api/drone_imagery/remove_background_save',
4001             dataType: "json",
4002             data: {
4003                 'image_id': image_id,
4004                 'image_type': image_type,
4005                 'drone_run_band_project_id': drone_run_band_project_id,
4006                 'lower_threshold': lower_threshold,
4007                 'upper_threshold': upper_threshold
4008             },
4009             beforeSend: function() {
4010                 jQuery("#working_modal").modal("show");
4011             },
4012             success: function(response){
4013                 console.log(response);
4014                 if(response.error) {
4015                     alert(response.error);
4016                 }
4017
4018                 jQuery("#working_modal").modal("hide");
4019                 location.reload();
4020             },
4021             error: function(response){
4022                 jQuery("#working_modal").modal("hide");
4023                 alert('Error saving removed background image!')
4024             }
4025         });
4026     }
4027
4028     //
4029     //Calculate Phenotypes JS
4030     //
4031
4032     var manage_drone_imagery_calculate_phenotypes_drone_run_id;
4033     var manage_drone_imagery_calculate_phenotypes_drone_run_band_id;
4034     var manage_drone_imagery_calculate_phenotypes_drone_run_band_type;
4035     var manage_drone_imagery_calculate_phenotypes_plot_polygons_type;
4036     var manage_drone_image_calculate_phenotypes_zonal_time_cvterm_id = '';
4037
4038     jQuery(document).on('click', 'button[name=project_drone_imagery_get_phenotypes]', function() {
4039         showManageDroneImagerySection('manage_drone_imagery_calculate_phenotypes_div');
4040
4041         manage_drone_imagery_calculate_phenotypes_drone_run_id = jQuery(this).data('drone_run_project_id');
4042         manage_drone_imagery_calculate_phenotypes_drone_run_band_id = jQuery(this).data('drone_run_band_project_id');
4043         manage_drone_imagery_calculate_phenotypes_drone_run_band_type = jQuery(this).data('drone_run_band_project_type');
4044         manage_drone_imagery_calculate_phenotypes_plot_polygons_type = jQuery(this).data('plot_polygons_type');
4045     });
4046
4047     jQuery('#drone_imagery_calculate_phenotypes_sift').click(function(){
4048
4049         jQuery.ajax({
4050             type: 'POST',
4051             url: '/api/drone_imagery/calculate_phenotypes?method=sift',
4052             dataType: "json",
4053             data: {
4054                 'drone_run_band_project_id': manage_drone_imagery_calculate_phenotypes_drone_run_band_id,
4055                 'drone_run_band_project_type': manage_drone_imagery_calculate_phenotypes_drone_run_band_type,
4056                 'plot_polygons_type': manage_drone_imagery_calculate_phenotypes_plot_polygons_type
4057             },
4058             beforeSend: function() {
4059                 jQuery("#working_modal").modal("show");
4060             },
4061             success: function(response){
4062                 console.log(response);
4063                 if(response.error) {
4064                     alert(response.error);
4065                     return;
4066                 }
4067
4068                 var html = '<table class="table table-bordered table-hover"><thead><tr><th>Observation Unit</th><th>SIFT Features Image</th></tr></thead><tbody>';
4069                 for (var i=0; i<response.results.length; i++) {
4070                     html = html + '<tr><td><a target="_blank" href="/stock/' + response.results[i].stock_id + '/view" >' + response.results[i].stock_uniquename + '</a></td><td>' + response.results[i].image + '</td></tr>';
4071                 }
4072                 jQuery('#manage_drone_imagery_calculate_phenotypes_show_sift').html(html);
4073
4074                 jQuery("#working_modal").modal("hide");
4075             },
4076             error: function(response){
4077                 jQuery("#working_modal").modal("hide");
4078                 alert('Error calculating sift features!')
4079             }
4080         });
4081
4082     });
4083
4084     jQuery('#drone_imagery_calculate_phenotypes_orb').click(function(){
4085
4086         jQuery.ajax({
4087             type: 'POST',
4088             url: '/api/drone_imagery/calculate_phenotypes?method=orb',
4089             dataType: "json",
4090             data: {
4091                 'drone_run_band_project_id': manage_drone_imagery_calculate_phenotypes_drone_run_band_id,
4092                 'drone_run_band_project_type': manage_drone_imagery_calculate_phenotypes_drone_run_band_type,
4093                 'plot_polygons_type': manage_drone_imagery_calculate_phenotypes_plot_polygons_type
4094             },
4095             beforeSend: function() {
4096                 jQuery("#working_modal").modal("show");
4097             },
4098             success: function(response){
4099                 console.log(response);
4100                 if(response.error) {
4101                     alert(response.error);
4102                     return;
4103                 }
4104
4105                 var html = '<table class="table table-bordered table-hover"><thead><tr><th>Observation Unit</th><th>ORB Features Image</th></tr></thead><tbody>';
4106                 for (var i=0; i<response.results.length; i++) {
4107                     html = html + '<tr><td><a target="_blank" href="/stock/' + response.results[i].stock_id + '/view" >' + response.results[i].stock_uniquename + '</a></td><td>' + response.results[i].image + '</td></tr>';
4108                 }
4109                 jQuery('#manage_drone_imagery_calculate_phenotypes_show_orb').html(html);
4110
4111                 jQuery("#working_modal").modal("hide");
4112             },
4113             error: function(response){
4114                 jQuery("#working_modal").modal("hide");
4115                 alert('Error calculating ORB features!')
4116             }
4117         });
4118
4119     });
4120
4121     jQuery('#drone_imagery_calculate_phenotypes_surf').click(function(){
4122
4123         jQuery.ajax({
4124             type: 'POST',
4125             url: '/api/drone_imagery/calculate_phenotypes?method=surf',
4126             dataType: "json",
4127             data: {
4128                 'drone_run_band_project_id': manage_drone_imagery_calculate_phenotypes_drone_run_band_id,
4129                 'drone_run_band_project_type': manage_drone_imagery_calculate_phenotypes_drone_run_band_type,
4130                 'plot_polygons_type': manage_drone_imagery_calculate_phenotypes_plot_polygons_type
4131             },
4132             beforeSend: function() {
4133                 jQuery("#working_modal").modal("show");
4134             },
4135             success: function(response){
4136                 console.log(response);
4137                 if(response.error) {
4138                     alert(response.error);
4139                     return;
4140                 }
4141
4142                 var html = '<table class="table table-bordered table-hover"><thead><tr><th>Observation Unit</th><th>SURF Features Image</th></tr></thead><tbody>';
4143                 for (var i=0; i<response.results.length; i++) {
4144                     html = html + '<tr><td><a target="_blank" href="/stock/' + response.results[i].stock_id + '/view" >' + response.results[i].stock_uniquename + '</a></td><td>' + response.results[i].image + '</td></tr>';
4145                 }
4146                 jQuery('#manage_drone_imagery_calculate_phenotypes_show_surf').html(html);
4147
4148                 jQuery("#working_modal").modal("hide");
4149             },
4150             error: function(response){
4151                 jQuery("#working_modal").modal("hide");
4152                 alert('Error calculating surf features!')
4153             }
4154         });
4155
4156     });
4157
4158     jQuery('#drone_imagery_calculate_phenotypes_zonal_stats').click(function(){
4159
4160         jQuery.ajax({
4161             type: 'GET',
4162             url: '/api/drone_imagery/get_weeks_after_planting_date?drone_run_project_id='+manage_drone_imagery_calculate_phenotypes_drone_run_id,
4163             dataType: "json",
4164             beforeSend: function (){
4165                 jQuery('#working_modal').modal('show');
4166             },
4167             success: function(response){
4168                 jQuery('#working_modal').modal('hide');
4169                 console.log(response);
4170                 if (response.error) {
4171                     alert(response.error);
4172                 }
4173                 get_select_box('ontology_children','drone_imagery_calculate_phenotypes_zonal_stats_time_select_div', {'selectbox_id':'drone_imagery_calculate_phenotypes_zonal_stats_time_select', 'selectbox_name':'drone_imagery_calculate_phenotypes_zonal_stats_time_select', 'empty':1, 'rel_cvterm':'is_a', 'rel_cv':'relationship', 'parent_node_cvterm':'time of year|TIME:0000005', 'selected':response.time_ontology_cvterm_id });
4174
4175                 var html = "<center><b>Field Trial Planting Date</b>: "+response.planting_date+"<br/><b>Drone Run Date</b>: "+response.drone_run_date+"<br/><b>Number of Weeks Difference</b>: "+response.rounded_time_difference_weeks+"<br/><b>Number of Weeks Ontology Term</b>: "+response.time_ontology_term+"<br/></center>";
4176                 jQuery('#drone_imagery_calculate_phenotypes_zonal_stats_week_term_div').html(html);
4177                 if (response.time_ontology_cvterm_id) {
4178                     manage_drone_image_calculate_phenotypes_zonal_time_cvterm_id = response.time_ontology_cvterm_id;
4179                 }
4180             },
4181             error: function(response){
4182                 alert('Error getting time terms!');
4183                 jQuery('#working_modal').modal('hide');
4184             }
4185         });
4186
4187         jQuery('#drone_imagery_calc_phenotypes_zonal_channel_dialog').modal('show');
4188     });
4189
4190     jQuery('#drone_imagery_calculate_phenotypes_zonal_stats_channel_select').click(function(){
4191         if (manage_drone_image_calculate_phenotypes_zonal_time_cvterm_id == '') {
4192             manage_drone_image_calculate_phenotypes_zonal_time_cvterm_id = jQuery('#drone_imagery_calculate_phenotypes_zonal_stats_time_select').val();
4193         }
4194
4195         jQuery.ajax({
4196             type: 'POST',
4197             url: '/api/drone_imagery/calculate_phenotypes?method=zonal',
4198             dataType: "json",
4199             data: {
4200                 'drone_run_band_project_id': manage_drone_imagery_calculate_phenotypes_drone_run_band_id,
4201                 'drone_run_band_project_type': manage_drone_imagery_calculate_phenotypes_drone_run_band_type,
4202                 'time_cvterm_id': manage_drone_image_calculate_phenotypes_zonal_time_cvterm_id,
4203                 'plot_polygons_type': manage_drone_imagery_calculate_phenotypes_plot_polygons_type,
4204             },
4205             beforeSend: function() {
4206                 jQuery("#working_modal").modal("show");
4207             },
4208             success: function(response){
4209                 console.log(response);
4210                 jQuery("#working_modal").modal("hide");
4211
4212                 if(response.error) {
4213                     alert(response.error);
4214                     return false;
4215                 }
4216
4217                 var html = '<table class="table table-bordered table-hover" id="manage_drone_imagery_zonal_stats_table"><thead><tr><th>Observation Unit</th><th>Image</th>';
4218                 for (var i=0; i<response.result_header.length; i++) {
4219                     html = html + '<th>'+response.result_header[i]+'</th>';
4220                 }
4221                 html = html + '</tr></thead><tbody>';
4222                 for (var i=0; i<response.results.length; i++) {
4223                     html = html + '<tr><td><a target="_blank" href="/stock/' + response.results[i].stock_id + '/view" >' + response.results[i].stock_uniquename + '</a></td><td>' + response.results[i].image + '</td>';
4224                     for (var j=0; j<response.results[i].result.length; j++){
4225                         html = html + '<td>'+response.results[i].result[j]+'</td>';
4226                     }
4227                     html = html + '</tr>';
4228                 }
4229                 jQuery('#manage_drone_imagery_calculate_phenotypes_show_zonal_stats').html(html);
4230                 jQuery('#manage_drone_imagery_zonal_stats_table').DataTable();
4231
4232                 jQuery('#drone_imagery_calc_phenotypes_zonal_channel_dialog').modal('hide');
4233                 return false;
4234             },
4235             error: function(response){
4236                 jQuery("#working_modal").modal("hide");
4237                 alert('Error calculating zonal stats!')
4238             }
4239         });
4240     });
4241
4242     //
4243     //RGB/3band Image Vegetative Index
4244     //
4245
4246     var manage_drone_imagery_vi_rgb_drone_run_band_project_id;
4247     var manage_drone_imagery_vi_rgb_denoised_stitched_image_id;
4248     var manage_drone_imagery_vi_drone_run_band_type;
4249     var manage_drone_imagery_vi_selected_index;
4250     var manage_drone_imagery_vi_selected_image_type;
4251
4252     jQuery(document).on('click', 'button[name="project_drone_imagery_rgb_vegetative"]', function(){
4253         manage_drone_imagery_vi_rgb_drone_run_band_project_id = jQuery(this).data('drone_run_band_project_id');
4254         manage_drone_imagery_vi_rgb_denoised_stitched_image_id = jQuery(this).data('denoised_stitched_image_id');
4255         manage_drone_imagery_vi_drone_run_band_type = jQuery(this).data('drone_run_band_project_type');
4256
4257         showManageDroneImagerySection('manage_drone_imagery_vegetative_index_div');
4258
4259         jQuery('#manage_drone_imagery_vegetative_index_tgi_rgb_div').show();
4260         jQuery('#manage_drone_imagery_vegetative_index_tgi_bgr_div').hide();
4261         jQuery('#manage_drone_imagery_vegetative_index_vari_rgb_div').show();
4262         jQuery('#manage_drone_imagery_vegetative_index_vari_bgr_div').hide();
4263         jQuery('#manage_drone_imagery_vegetative_index_ndvi_div').hide();
4264         jQuery('#manage_drone_imagery_vegetative_index_ndre_div').hide();
4265     });
4266
4267     jQuery(document).on('click', 'button[name="project_drone_imagery_3_band_bgr_vegetative"]', function(){
4268         manage_drone_imagery_vi_rgb_drone_run_band_project_id = jQuery(this).data('drone_run_band_project_id');
4269         manage_drone_imagery_vi_rgb_denoised_stitched_image_id = jQuery(this).data('denoised_stitched_image_id');
4270         manage_drone_imagery_vi_drone_run_band_type = jQuery(this).data('drone_run_band_project_type');
4271
4272         showManageDroneImagerySection('manage_drone_imagery_vegetative_index_div');
4273
4274         jQuery('#manage_drone_imagery_vegetative_index_tgi_rgb_div').hide();
4275         jQuery('#manage_drone_imagery_vegetative_index_tgi_bgr_div').show();
4276         jQuery('#manage_drone_imagery_vegetative_index_vari_rgb_div').hide();
4277         jQuery('#manage_drone_imagery_vegetative_index_vari_bgr_div').show();
4278         jQuery('#manage_drone_imagery_vegetative_index_ndvi_div').hide();
4279         jQuery('#manage_drone_imagery_vegetative_index_ndre_div').hide();
4280     });
4281
4282     jQuery(document).on('click', 'button[name="project_drone_imagery_3_band_nrn_vegetative"]', function(){
4283         manage_drone_imagery_vi_rgb_drone_run_band_project_id = jQuery(this).data('drone_run_band_project_id');
4284         manage_drone_imagery_vi_rgb_denoised_stitched_image_id = jQuery(this).data('denoised_stitched_image_id');
4285         manage_drone_imagery_vi_drone_run_band_type = jQuery(this).data('drone_run_band_project_type');
4286
4287         showManageDroneImagerySection('manage_drone_imagery_vegetative_index_div');
4288
4289         jQuery('#manage_drone_imagery_vegetative_index_tgi_rgb_div').hide();
4290         jQuery('#manage_drone_imagery_vegetative_index_tgi_bgr_div').hide();
4291         jQuery('#manage_drone_imagery_vegetative_index_vari_rgb_div').hide();
4292         jQuery('#manage_drone_imagery_vegetative_index_vari_bgr_div').hide();
4293         jQuery('#manage_drone_imagery_vegetative_index_ndvi_div').show();
4294         jQuery('#manage_drone_imagery_vegetative_index_ndre_div').hide();
4295     });
4296
4297     jQuery(document).on('click', 'button[name="project_drone_imagery_3_band_nren_vegetative"]', function(){
4298         manage_drone_imagery_vi_rgb_drone_run_band_project_id = jQuery(this).data('drone_run_band_project_id');
4299         manage_drone_imagery_vi_rgb_denoised_stitched_image_id = jQuery(this).data('denoised_stitched_image_id');
4300         manage_drone_imagery_vi_drone_run_band_type = jQuery(this).data('drone_run_band_project_type');
4301
4302         showManageDroneImagerySection('manage_drone_imagery_vegetative_index_div');
4303
4304         jQuery('#manage_drone_imagery_vegetative_index_tgi_rgb_div').hide();
4305         jQuery('#manage_drone_imagery_vegetative_index_tgi_bgr_div').hide();
4306         jQuery('#manage_drone_imagery_vegetative_index_vari_rgb_div').hide();
4307         jQuery('#manage_drone_imagery_vegetative_index_vari_bgr_div').hide();
4308         jQuery('#manage_drone_imagery_vegetative_index_ndvi_div').hide();
4309         jQuery('#manage_drone_imagery_vegetative_index_ndre_div').show();
4310     });
4311
4312     jQuery('#drone_imagery_vegetative_index_TGI_bgr').click(function(){
4313         manage_drone_imagery_vi_selected_index = 'TGI';
4314         manage_drone_imagery_vi_selected_image_type = 'BGR';
4315         getVegetativeIndex('calculate_vegetative_index', manage_drone_imagery_vi_rgb_denoised_stitched_image_id, manage_drone_imagery_vi_rgb_drone_run_band_project_id, manage_drone_imagery_vi_drone_run_band_type, manage_drone_imagery_vi_selected_index, 1, manage_drone_imagery_vi_selected_image_type);
4316     });
4317
4318     jQuery('#drone_imagery_vegetative_index_TGI_rgb').click(function(){
4319         manage_drone_imagery_vi_selected_index = 'TGI';
4320         manage_drone_imagery_vi_selected_image_type = 'BGR';
4321         getVegetativeIndex('calculate_vegetative_index', manage_drone_imagery_vi_rgb_denoised_stitched_image_id, manage_drone_imagery_vi_rgb_drone_run_band_project_id, manage_drone_imagery_vi_drone_run_band_type, manage_drone_imagery_vi_selected_index, 1, manage_drone_imagery_vi_selected_image_type);
4322     });
4323
4324     jQuery('#drone_imagery_vegetative_index_VARI_bgr').click(function(){
4325         manage_drone_imagery_vi_selected_index = 'VARI';
4326         manage_drone_imagery_vi_selected_image_type = 'BGR';
4327         getVegetativeIndex('calculate_vegetative_index', manage_drone_imagery_vi_rgb_denoised_stitched_image_id, manage_drone_imagery_vi_rgb_drone_run_band_project_id, manage_drone_imagery_vi_drone_run_band_type, manage_drone_imagery_vi_selected_index, 1, manage_drone_imagery_vi_selected_image_type);
4328     });
4329
4330     jQuery('#drone_imagery_vegetative_index_VARI_rgb').click(function(){
4331         manage_drone_imagery_vi_selected_index = 'VARI';
4332         manage_drone_imagery_vi_selected_image_type = 'BGR';
4333         getVegetativeIndex('calculate_vegetative_index', manage_drone_imagery_vi_rgb_denoised_stitched_image_id, manage_drone_imagery_vi_rgb_drone_run_band_project_id, manage_drone_imagery_vi_drone_run_band_type, manage_drone_imagery_vi_selected_index, 1, manage_drone_imagery_vi_selected_image_type);
4334     });
4335
4336     jQuery('#drone_imagery_vegetative_index_NDVI').click(function(){
4337         manage_drone_imagery_vi_selected_index = 'NDVI';
4338         manage_drone_imagery_vi_selected_image_type = 'NRN';
4339         getVegetativeIndex('calculate_vegetative_index', manage_drone_imagery_vi_rgb_denoised_stitched_image_id, manage_drone_imagery_vi_rgb_drone_run_band_project_id, manage_drone_imagery_vi_drone_run_band_type, manage_drone_imagery_vi_selected_index, 1, manage_drone_imagery_vi_selected_image_type);
4340     });
4341
4342     jQuery('#drone_imagery_vegetative_index_NDRE').click(function(){
4343         manage_drone_imagery_vi_selected_index = 'NDRE';
4344         manage_drone_imagery_vi_selected_image_type = 'NReN';
4345         getVegetativeIndex('calculate_vegetative_index', manage_drone_imagery_vi_rgb_denoised_stitched_image_id, manage_drone_imagery_vi_rgb_drone_run_band_project_id, manage_drone_imagery_vi_drone_run_band_type, manage_drone_imagery_vi_selected_index, 1, manage_drone_imagery_vi_selected_image_type);
4346     });
4347
4348     jQuery('#drone_imagery_rgb_vegetative_index_submit').click(function(){
4349         getVegetativeIndex('calculate_vegetative_index', manage_drone_imagery_vi_rgb_denoised_stitched_image_id, manage_drone_imagery_vi_rgb_drone_run_band_project_id, manage_drone_imagery_vi_drone_run_band_type, manage_drone_imagery_vi_selected_index, 0, manage_drone_imagery_vi_selected_image_type);
4350     });
4351
4352     function getVegetativeIndex(url_part, image_id, drone_run_band_project_id, drone_run_band_project_type, index, view_only, manage_drone_imagery_vi_selected_image_type) {
4353         jQuery.ajax({
4354             type: 'POST',
4355             url: '/api/drone_imagery/'+url_part,
4356             dataType: "json",
4357             data: {
4358                 'image_id': image_id,
4359                 'drone_run_band_project_id': drone_run_band_project_id,
4360                 'vegetative_index': index,
4361                 'drone_run_band_project_type': drone_run_band_project_type,
4362                 'view_only': view_only,
4363                 'image_type': manage_drone_imagery_vi_selected_image_type
4364             },
4365             beforeSend: function() {
4366                 jQuery("#working_modal").modal("show");
4367             },
4368             success: function(response){
4369                 console.log(response);
4370                 jQuery("#working_modal").modal("hide");
4371
4372                 if(response.error) {
4373                     alert(response.error);
4374                 }
4375
4376                 if (view_only == 1) {
4377                     var canvas = document.getElementById('drone_imagery_vegetative_index_original_stitched_div');
4378                     ctx = canvas.getContext('2d');
4379                     var image = new Image();
4380                     image.onload = function () {
4381                         canvas.width = this.naturalWidth;
4382                         canvas.height = this.naturalHeight;
4383                         ctx.drawImage(this, 0, 0);
4384                     };
4385                     image.src = response.index_image_url;
4386                 } else {
4387                     location.reload();
4388                 }
4389             },
4390             error: function(response){
4391                 alert('Error getting vegetative index!')
4392             }
4393         });
4394     }
4395
4396     //
4397     // Apply Masks From Background Removed Vegetative Index to Denoised Image
4398     //
4399
4400     jQuery(document).on('click', 'button[name="project_drone_imagery_apply_tgi_removed_background_mask_to_denoised_image"]', function(){
4401         drone_imagery_mask_remove_background(jQuery(this).data('denoised_stitched_image_id'), jQuery(this).data('background_removed_tgi_stitched_image_id'), jQuery(this).data('drone_run_band_project_id'), 'denoised_background_removed_thresholded_tgi_mask_original');
4402     });
4403
4404     jQuery(document).on('click', 'button[name="project_drone_imagery_apply_vari_removed_background_mask_to_denoised_image"]', function(){
4405         drone_imagery_mask_remove_background(jQuery(this).data('denoised_stitched_image_id'), jQuery(this).data('background_removed_vari_stitched_image_id'), jQuery(this).data('drone_run_band_project_id'), 'denoised_background_removed_thresholded_vari_mask_original');
4406     });
4407
4408     jQuery(document).on('click', 'button[name="project_drone_imagery_apply_ndvi_removed_background_mask_to_denoised_image"]', function(){
4409         drone_imagery_mask_remove_background(jQuery(this).data('denoised_stitched_image_id'), jQuery(this).data('background_removed_ndvi_stitched_image_id'), jQuery(this).data('drone_run_band_project_id'), 'denoised_background_removed_thresholded_ndvi_mask_original');
4410     });
4411
4412     jQuery(document).on('click', 'button[name="project_drone_imagery_apply_ndre_removed_background_mask_to_denoised_image"]', function(){
4413         drone_imagery_mask_remove_background(jQuery(this).data('denoised_stitched_image_id'), jQuery(this).data('background_removed_ndre_stitched_image_id'), jQuery(this).data('drone_run_band_project_id'), 'denoised_background_removed_thresholded_ndre_mask_original');
4414     });
4415
4416     jQuery(document).on('click', 'button[name="project_drone_imagery_apply_tgi_mask_to_denoised_image"]', function(){
4417         drone_imagery_mask_remove_background(jQuery(this).data('denoised_stitched_image_id'), jQuery(this).data('tgi_stitched_image_id'), jQuery(this).data('drone_run_band_project_id'), 'denoised_background_removed_tgi_mask_original');
4418     });
4419
4420     jQuery(document).on('click', 'button[name="project_drone_imagery_apply_vari_mask_to_denoised_image"]', function(){
4421         drone_imagery_mask_remove_background(jQuery(this).data('denoised_stitched_image_id'), jQuery(this).data('vari_stitched_image_id'), jQuery(this).data('drone_run_band_project_id'), 'denoised_background_removed_vari_mask_original');
4422     });
4423
4424     jQuery(document).on('click', 'button[name="project_drone_imagery_apply_ndvi_mask_to_denoised_image"]', function(){
4425         drone_imagery_mask_remove_background(jQuery(this).data('denoised_stitched_image_id'), jQuery(this).data('ndvi_stitched_image_id'), jQuery(this).data('drone_run_band_project_id'), 'denoised_background_removed_ndvi_mask_original');
4426     });
4427
4428     jQuery(document).on('click', 'button[name="project_drone_imagery_apply_ndre_mask_to_denoised_image"]', function(){
4429         drone_imagery_mask_remove_background(jQuery(this).data('denoised_stitched_image_id'), jQuery(this).data('ndre_stitched_image_id'), jQuery(this).data('drone_run_band_project_id'), 'denoised_background_removed_ndre_mask_original');
4430     });
4431
4432     function drone_imagery_mask_remove_background(image_id, mask_image_id, drone_run_band_project_id, mask_type) {
4433         jQuery.ajax({
4434             type: 'POST',
4435             url: '/api/drone_imagery/mask_remove_background',
4436             dataType: "json",
4437             data: {
4438                 'image_id': image_id,
4439                 'mask_image_id': mask_image_id,
4440                 'drone_run_band_project_id': drone_run_band_project_id,
4441                 'mask_type': mask_type
4442             },
4443             beforeSend: function() {
4444                 jQuery("#working_modal").modal("show");
4445             },
4446             success: function(response){
4447                 console.log(response);
4448                 jQuery("#working_modal").modal("hide");
4449
4450                 if(response.error) {
4451                     alert(response.error);
4452                 }
4453
4454                 location.reload();
4455             },
4456             error: function(response){
4457                 alert('Error removing background using mask of vegetative index!' + mask_type);
4458             }
4459         });
4460     }
4461
4462     //
4463     // Run and save Fourier Transform HPF30
4464     //
4465
4466     var manage_drone_imagery_ft_hpf30_drone_run_band_project_id = '';
4467     var manage_drone_imagery_ft_hpf30_image_id = '';
4468     var manage_drone_imagery_ft_hpf30_drone_run_band_type = '';
4469     var manage_drone_imagery_ft_hpf30_selected_image_type = '';
4470
4471     jQuery(document).on('click', 'button[name="project_drone_imagery_fourier_transform_hpf30"]', function(){
4472         manage_drone_imagery_ft_hpf30_drone_run_band_project_id = jQuery(this).data('drone_run_band_project_id');
4473         manage_drone_imagery_ft_hpf30_image_id = jQuery(this).data('image_id');
4474         manage_drone_imagery_ft_hpf30_drone_run_band_type = jQuery(this).data('drone_run_band_project_type');
4475         manage_drone_imagery_ft_hpf30_selected_image_type = jQuery(this).data('selected_image_type');
4476         getFourierTransform(30, manage_drone_imagery_ft_hpf30_image_id, manage_drone_imagery_ft_hpf30_drone_run_band_project_id, manage_drone_imagery_ft_hpf30_drone_run_band_type, manage_drone_imagery_ft_hpf30_selected_image_type, 'frequency');
4477     });
4478
4479     function getFourierTransform(high_pass_filter, image_id, drone_run_band_project_id, drone_run_band_project_type, selected_image_type, high_pass_filter_type) {
4480         jQuery.ajax({
4481             type: 'POST',
4482             url: '/api/drone_imagery/calculate_fourier_transform',
4483             dataType: "json",
4484             data: {
4485                 'image_id': image_id,
4486                 'drone_run_band_project_id': drone_run_band_project_id,
4487                 'drone_run_band_project_type': drone_run_band_project_type,
4488                 'high_pass_filter': high_pass_filter,
4489                 'high_pass_filter_type': high_pass_filter_type,
4490                 'image_type': selected_image_type
4491             },
4492             beforeSend: function() {
4493                 jQuery("#working_modal").modal("show");
4494             },
4495             success: function(response){
4496                 console.log(response);
4497                 jQuery("#working_modal").modal("hide");
4498
4499                 if(response.error) {
4500                     alert(response.error);
4501                 }
4502
4503                 location.reload();
4504             },
4505             error: function(response){
4506                 jQuery("#working_modal").modal("hide");
4507                 alert('Error getting fourier transform!')
4508             }
4509         });
4510     }
4511
4512     //
4513     // Merge bands into single image
4514     //
4515
4516     var drone_imagery_merge_channels_drone_run_project_id;
4517     var drone_imagery_merge_channels_drone_run_project_name;
4518     jQuery(document).on('click', 'button[name="project_drone_imagery_merge_channels"]', function() {
4519         drone_imagery_merge_channels_drone_run_project_id = jQuery(this).data('drone_run_project_id');
4520         drone_imagery_merge_channels_drone_run_project_name = jQuery(this).data('drone_run_project_name');
4521
4522         jQuery('#drone_imagery_merge_channels_dialog').modal('show');
4523
4524         get_select_box('drone_imagery_drone_run_band','drone_imagery_merge_bands_band1_select', {'id':'drone_run_merge_band_select_1', 'name':'drone_run_merge_band_select_1', 'empty':1, 'drone_run_project_id':drone_imagery_merge_channels_drone_run_project_id });
4525         get_select_box('drone_imagery_drone_run_band','drone_imagery_merge_bands_band2_select', {'id':'drone_run_merge_band_select_2', 'name':'drone_run_merge_band_select_2', 'empty':1, 'drone_run_project_id':drone_imagery_merge_channels_drone_run_project_id });
4526         get_select_box('drone_imagery_drone_run_band','drone_imagery_merge_bands_band3_select', {'id':'drone_run_merge_band_select_3', 'name':'drone_run_merge_band_select_3', 'empty':1, 'drone_run_project_id':drone_imagery_merge_channels_drone_run_project_id });
4527     });
4528
4529     jQuery('#drone_imagery_merge_bands_submit').click(function(){
4530         var band_1_drone_run_band_project_id = jQuery('#drone_run_merge_band_select_1').val();
4531         var band_2_drone_run_band_project_id = jQuery('#drone_run_merge_band_select_2').val();
4532         var band_3_drone_run_band_project_id = jQuery('#drone_run_merge_band_select_3').val();
4533         var merged_image_type = jQuery('#drone_run_merge_image_type').val();
4534         if (merged_image_type == '') {
4535             alert('Please select a merged image type first!');
4536             return false;
4537         }
4538
4539         jQuery.ajax({
4540             type: 'POST',
4541             url: '/api/drone_imagery/merge_bands',
4542             dataType: "json",
4543             data: {
4544                 'band_1_drone_run_band_project_id': band_1_drone_run_band_project_id,
4545                 'band_2_drone_run_band_project_id': band_2_drone_run_band_project_id,
4546                 'band_3_drone_run_band_project_id': band_3_drone_run_band_project_id,
4547                 'drone_run_project_id': drone_imagery_merge_channels_drone_run_project_id,
4548                 'drone_run_project_name': drone_imagery_merge_channels_drone_run_project_name,
4549                 'merged_image_type' : merged_image_type
4550             },
4551             beforeSend: function() {
4552                 jQuery("#working_modal").modal("show");
4553             },
4554             success: function(response){
4555                 console.log(response);
4556                 jQuery("#working_modal").modal("hide");
4557
4558                 if(response.error) {
4559                     alert(response.error);
4560                 }
4561
4562                 location.reload();
4563             },
4564             error: function(response){
4565                 jQuery("#working_modal").modal("hide");
4566                 alert('Error merging bands!')
4567             }
4568         });
4569     });
4570
4571     //
4572     // Delete drone run
4573     //
4574
4575     var manage_drone_imagery_delete_drone_run_project_id;
4576     jQuery(document).on('click', 'button[name="project_drone_imagery_delete_drone_run"]', function(){
4577         manage_drone_imagery_delete_drone_run_project_id = jQuery(this).data('drone_run_project_id');
4578         jQuery('#drone_imagery_delete_drone_run_dialog').modal('show');
4579     });
4580
4581     jQuery('#drone_imagery_delete_drone_run_confirm').click(function(){
4582         jQuery.ajax({
4583             type: 'GET',
4584             url: '/api/drone_imagery/delete_drone_run?drone_run_project_id='+manage_drone_imagery_delete_drone_run_project_id,
4585             beforeSend: function() {
4586                 jQuery("#working_modal").modal("show");
4587             },
4588             success: function(response){
4589                 console.log(response);
4590                 jQuery("#working_modal").modal("hide");
4591
4592                 if(response.error) {
4593                     alert(response.error);
4594                 }
4595                 if(response.success) {
4596                     alert('Drone run deleted successfully!');
4597                 }
4598                 location.reload();
4599             },
4600             error: function(response){
4601                 jQuery("#working_modal").modal("hide");
4602                 alert('Error deleting drone run!')
4603             }
4604         });
4605     });
4606
4607     function showManageDroneImagerySection(section_div_id) {
4608         console.log(section_div_id);
4609         if (section_div_id == 'manage_drone_imagery_crop_div') {
4610             jQuery('#manage_drone_imagery_crop_div').show();
4611             jQuery('#manage_drone_imagery_top_div').hide();
4612             jQuery('#manage_drone_imagery_plot_polygons_div').hide();
4613             jQuery('#manage_drone_imagery_calculate_phenotypes_div').hide();
4614             jQuery('#manage_drone_imagery_remove_background_div').hide();
4615             jQuery('#manage_drone_imagery_rotate_div').hide();
4616             jQuery('#manage_drone_imagery_vegetative_index_div').hide();
4617             jQuery('#manage_drone_imagery_standard_process_div').hide();
4618             jQuery('#manage_drone_imagery_loading_div').hide();
4619         } else if (section_div_id == 'manage_drone_imagery_top_div'){
4620             jQuery('#manage_drone_imagery_crop_div').hide();
4621             jQuery('#manage_drone_imagery_top_div').show();
4622             jQuery('#manage_drone_imagery_plot_polygons_div').hide();
4623             jQuery('#manage_drone_imagery_calculate_phenotypes_div').hide();
4624             jQuery('#manage_drone_imagery_remove_background_div').hide();
4625             jQuery('#manage_drone_imagery_rotate_div').hide();
4626             jQuery('#manage_drone_imagery_vegetative_index_div').hide();
4627             jQuery('#manage_drone_imagery_standard_process_div').hide();
4628             jQuery('#manage_drone_imagery_loading_div').hide();
4629         } else if (section_div_id == 'manage_drone_imagery_plot_polygons_div'){
4630             jQuery('#manage_drone_imagery_crop_div').hide();
4631             jQuery('#manage_drone_imagery_top_div').hide();
4632             jQuery('#manage_drone_imagery_plot_polygons_div').show();
4633             jQuery('#manage_drone_imagery_calculate_phenotypes_div').hide();
4634             jQuery('#manage_drone_imagery_remove_background_div').hide();
4635             jQuery('#manage_drone_imagery_rotate_div').hide();
4636             jQuery('#manage_drone_imagery_vegetative_index_div').hide();
4637             jQuery('#manage_drone_imagery_standard_process_div').hide();
4638             jQuery('#manage_drone_imagery_loading_div').hide();
4639         } else if (section_div_id == 'manage_drone_imagery_calculate_phenotypes_div'){
4640             jQuery('#manage_drone_imagery_crop_div').hide();
4641             jQuery('#manage_drone_imagery_top_div').hide();
4642             jQuery('#manage_drone_imagery_plot_polygons_div').hide();
4643             jQuery('#manage_drone_imagery_calculate_phenotypes_div').show();
4644             jQuery('#manage_drone_imagery_remove_background_div').hide();
4645             jQuery('#manage_drone_imagery_rotate_div').hide();
4646             jQuery('#manage_drone_imagery_vegetative_index_div').hide();
4647             jQuery('#manage_drone_imagery_standard_process_div').hide();
4648             jQuery('#manage_drone_imagery_loading_div').hide();
4649         } else if (section_div_id == 'manage_drone_imagery_remove_background_div'){
4650             jQuery('#manage_drone_imagery_crop_div').hide();
4651             jQuery('#manage_drone_imagery_top_div').hide();
4652             jQuery('#manage_drone_imagery_plot_polygons_div').hide();
4653             jQuery('#manage_drone_imagery_calculate_phenotypes_div').hide();
4654             jQuery('#manage_drone_imagery_remove_background_div').show();
4655             jQuery('#manage_drone_imagery_rotate_div').hide();
4656             jQuery('#manage_drone_imagery_vegetative_index_div').hide();
4657             jQuery('#manage_drone_imagery_standard_process_div').hide();
4658             jQuery('#manage_drone_imagery_loading_div').hide();
4659         } else if (section_div_id == 'manage_drone_imagery_rotate_div'){
4660             jQuery('#manage_drone_imagery_crop_div').hide();
4661             jQuery('#manage_drone_imagery_top_div').hide();
4662             jQuery('#manage_drone_imagery_plot_polygons_div').hide();
4663             jQuery('#manage_drone_imagery_calculate_phenotypes_div').hide();
4664             jQuery('#manage_drone_imagery_remove_background_div').hide();
4665             jQuery('#manage_drone_imagery_rotate_div').show();
4666             jQuery('#manage_drone_imagery_vegetative_index_div').hide();
4667             jQuery('#manage_drone_imagery_standard_process_div').hide();
4668             jQuery('#manage_drone_imagery_loading_div').hide();
4669         } else if (section_div_id == 'manage_drone_imagery_vegetative_index_div'){
4670             jQuery('#manage_drone_imagery_crop_div').hide();
4671             jQuery('#manage_drone_imagery_top_div').hide();
4672             jQuery('#manage_drone_imagery_plot_polygons_div').hide();
4673             jQuery('#manage_drone_imagery_calculate_phenotypes_div').hide();
4674             jQuery('#manage_drone_imagery_remove_background_div').hide();
4675             jQuery('#manage_drone_imagery_rotate_div').hide();
4676             jQuery('#manage_drone_imagery_vegetative_index_div').show();
4677             jQuery('#manage_drone_imagery_standard_process_div').hide();
4678             jQuery('#manage_drone_imagery_loading_div').hide();
4679         } else if (section_div_id == 'manage_drone_imagery_standard_process_div'){
4680             jQuery('#manage_drone_imagery_crop_div').hide();
4681             jQuery('#manage_drone_imagery_top_div').hide();
4682             jQuery('#manage_drone_imagery_plot_polygons_div').hide();
4683             jQuery('#manage_drone_imagery_calculate_phenotypes_div').hide();
4684             jQuery('#manage_drone_imagery_remove_background_div').hide();
4685             jQuery('#manage_drone_imagery_rotate_div').hide();
4686             jQuery('#manage_drone_imagery_vegetative_index_div').hide();
4687             jQuery('#manage_drone_imagery_standard_process_div').show();
4688             jQuery('#manage_drone_imagery_loading_div').hide();
4689         } else if (section_div_id == 'manage_drone_imagery_loading_div'){
4690             jQuery('#manage_drone_imagery_crop_div').hide();
4691             jQuery('#manage_drone_imagery_top_div').hide();
4692             jQuery('#manage_drone_imagery_plot_polygons_div').hide();
4693             jQuery('#manage_drone_imagery_calculate_phenotypes_div').hide();
4694             jQuery('#manage_drone_imagery_remove_background_div').hide();
4695             jQuery('#manage_drone_imagery_rotate_div').hide();
4696             jQuery('#manage_drone_imagery_vegetative_index_div').hide();
4697             jQuery('#manage_drone_imagery_standard_process_div').hide();
4698             jQuery('#manage_drone_imagery_loading_div').show();
4699         }
4700         window.scrollTo(0,0);
4701     }
4702
4703 });
4704
4705 </script>