mason/breeders_toolbox/cross/upload_update_crosses.mas

   1 <%args>
   2
   3 </%args>
   4
   5
   6 <div class="modal fade" id="update_crossinfo_dialog" name="update_crossinfo_dialog" tabindex="-1" role="dialog" aria-labelledby="updateCrossinfoDialog">
   7     <div class="modal-dialog modal-lg" role="document">
   8         <div class="modal-content">
   9             <div class="modal-header">
  10                 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  11                 <h4 class="modal-title" id="updateCrossinfoDialog">Upload Cross Info of Existing Crosses </h4>
  12             </div>
  13             <div class="modal-body">
  14                 <div class="container-fluid">
  15                     <label class="col-sm-12 control-label">If you are uploading an Intercross file, please use manage Intercross section</label>
  16                     <br>
  17                     <&| /page/explanation.mas, title=>'Template Information' &>
  18                         <p>
  19                             <b>File Format Information</b>
  20                             <br>
  21                             <a id="update_crossinfo_spreadsheet_format">Spreadsheet Format</a>
  22                             <br>
  23                         </p>
  24                     </&>
  25                     <form class="form-horizontal" role="form" method="post" enctype="multipart/form-data" encoding="multipart/form-data" id="upload_crossinfo_form" name="upload_crossinfo_form">
  26                         <div class="form-group">
  27                             <label class="col-sm-2 control-label">Upload File: </label>
  28                                 <div class="col-sm-10">
  29                                     <input type="file" name="crossinfo_upload_file" id="crossinfo_upload_file" encoding="multipart/form-data" />
  30                                 </div>
  31                         </div>
  32                     </form>
  33                 </div>
  34             </div>
  35             <div class="modal-footer">
  36                 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  37                 <button type="button" class="btn btn-primary" name="update_crossinfo_submit" id="update_crossinfo_submit">Upload File</button>
  38             </div>
  39         </div>
  40     </div>
  41 </div>
  42
  43 <div class="modal fade" id="upload_crossinfo_error_display" name="upload_crossinfo_error_display" tabindex="-1" role="dialog" aria-labelledby="uploadCrossinfoErrorDialog">
  44     <div class="modal-dialog modal-lg" role="document">
  45         <div class="modal-content">
  46             <div class="modal-header">
  47                 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  48                 <h4 class="modal-title" id="uploadCrossinfoErrorDialog">Upload Cross Info File Error</h4>
  49             </div>
  50             <div class="modal-body">
  51                 <div class="container-fluid">
  52                     <table>
  53                         <tbody></tbody>
  54                     </table>
  55                 </div>
  56             </div>
  57             <div class="modal-footer">
  58                 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  59             </div>
  60         </div>
  61     </div>
  62 </div>
  63
  64 <div class="modal fade" id="update_crossinfo_spreadsheet_info_dialog" name="update_crossinfo_spreadsheet_info_dialog" tabindex="-1" role="dialog" aria-labelledby="uploadCrossinfoInfoDialog">
  65     <div class="modal-dialog modal-lg" role="document">
  66         <div class="modal-content">
  67             <div class="modal-header">
  68                 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  69                 <h4 class="modal-title" id="uploadCrossinfoInfoDialog">Template Information</h4>
  70             </div>
  71             <div class="modal-body">
  72                 <div class="container-fluid">
  73                     <b>
  74                         Cross info of existing crosses may be uploaded in an Excel file (.xls or .xlsx)
  75                     </b>
  76                     <br>
  77                     <b>
  78                         Header:
  79                     </b>
  80                     <br>
  81                         The first row (header) must contain the following:
  82                     <br>
  83
  84                     <table class="table table-bordered table-hover">
  85                         <tbody>
  86                             <tr>
  87                                 <td>cross_unique_id</td>
  88                                 <td>At least one column of cross info listed below (please use exact column header as shown)</td>
  89                             </tr>
  90                         </tbody>
  91                     </table>
  92                     <b>
  93                         Required columns:
  94                     </b>
  95                     <ul>
  96                         <li><b>cross_unique_id:</b> Must exist in the database, must not have duplicate cross unique id in the same upload file.
  97                         <li><b>At least one of the following columns:</b> You can upload different types of cross info by selecting corresponding column headers. All of cross info of the same cross unique id must be in a single row. Dates must be in the <b>YYYY/MM/DD</b> format.</li>
  98                         <br>
  99 % my $cross_properties = $c->config->{cross_properties};
 100 % my @column_header = split ',',$cross_properties;
 101 % foreach my $column_header(@column_header){
 102                         <%$column_header%>
 103                         <br>
 104 %}
 105                     </ul>
 106                 </div>
 107             </div>
 108             <div class="modal-footer">
 109                 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 110             </div>
 111         </div>
 112     </div>
 113 </div>
 114
 115 <div class="modal fade" id="cross_info_saved_dialog_message" name="cross_info_saved_dialog_message" tabindex="-1" role="dialog" aria-labelledby="crossInfoSavedDialog">
 116     <div class="modal-dialog" role="document">
 117         <div class="modal-content">
 118             <div class="modal-header">
 119                 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 120                 <h4 class="modal-title" id="crossInfoSavedDialog">Success</h4>
 121             </div>
 122             <div class="modal-body">
 123                 <div class="container-fluid">
 124                     <p>
 125                         <span class="ui-icon ui-icon-circle-check" style="float: left; margin: 0 7px 50px 0;"></span>
 126                         The cross information was saved successfully.
 127                     </p>
 128                 </div>
 129             </div>
 130             <div class="modal-footer">
 131                 <button id="dismiss_cross_info_saved_dialog" type="button" class="btn btn-default" data-dismiss="modal">Close & Reload</button>
 132             </div>
 133         </div>
 134     </div>
 135 </div>
 136
 137
 138 <div class="modal fade" id="upload_additional_info_dialog" name="upload_additional_info_dialog" tabindex="-1" role="dialog" aria-labelledby="uploadAdditionalInfoDialog">
 139     <div class="modal-dialog modal-lg" role="document">
 140         <div class="modal-content">
 141             <div class="modal-header">
 142                 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 143                 <h4 class="modal-title" id="uploadAdditionalInfoDialog">Upload Additional Parent Info of Existing Crosses </h4>
 144             </div>
 145             <div class="modal-body">
 146                 <div class="container-fluid">
 147                     <&| /page/explanation.mas, title=>'Template Information' &>
 148                         <p>
 149                             <b>File Format Information</b>
 150                             <br>
 151                             <a id="upload_additional_info_format">Spreadsheet Format</a>
 152                             <br>
 153                         </p>
 154                     </&>
 155                     <form class="form-horizontal" role="form" method="post" enctype="multipart/form-data" encoding="multipart/form-data" id="upload_additional_info_form" name="upload_additional_info_form">
 156                         <div class="form-group">
 157                             <label class="col-sm-2 control-label">Upload File: </label>
 158                                 <div class="col-sm-10">
 159                                     <input type="file" name="additional_info_upload_file" id="additional_info_upload_file" encoding="multipart/form-data" />
 160                                 </div>
 161                         </div>
 162                     </form>
 163                 </div>
 164             </div>
 165             <div class="modal-footer">
 166                 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 167                 <button type="button" class="btn btn-primary" name="upload_additional_info_submit" id="upload_additional_info_submit">Upload File</button>
 168             </div>
 169         </div>
 170     </div>
 171 </div>
 172
 173 <div class="modal fade" id="upload_additional_info_format_dialog" name="upload_additional_info_format_dialog" tabindex="-1" role="dialog" aria-labelledby="uploadAdditionalInfoFormatDialog">
 174     <div class="modal-dialog modal-lg" role="document">
 175         <div class="modal-content">
 176             <div class="modal-header">
 177                 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 178                 <h4 class="modal-title" id="uploadAdditionalInfoFormatDialog">Template Information</h4>
 179             </div>
 180             <div class="modal-body">
 181                 <div class="container-fluid">
 182                     <b>
 183                         Additional Parent Info of existing crosses may be uploaded in an Excel file (.xls or .xlsx)
 184                     </b>
 185                     <br>
 186                     <b>
 187                         Header:
 188                     </b>
 189                     <br>
 190                         The first row (header) must contain the following:
 191                     <br>
 192                     <table class="table table-bordered table-hover">
 193                         <tbody>
 194                             <tr>
 195                                 <td>cross_unique_id</td>
 196                                 <td>At least one column of parent info listed below (please use exact column header as shown)</td>
 197                             </tr>
 198                         </tbody>
 199                     </table>
 200                     <b>
 201                         Required columns:
 202                     </b>
 203                     <ul>
 204                         <li><b>cross_unique_id:</b> Must exist in the database, must not have duplicate cross unique id in the same upload file.
 205                         <li><b>At least one of the following columns:</b> You can upload different types of parent info by selecting corresponding column headers. All of parent info of the same cross unique id must be in a single row. Each field can have several values by using comma-delimited list (e.g. trait_1,trait_2)</li>
 206                         <br>
 207 % my $cross_additional_info_string = $c->config->{cross_additional_info};
 208 % my @additional_info_headers = split ',',$cross_additional_info_string;
 209 % foreach my $info_header(@additional_info_headers){
 210                         <%$info_header%>
 211                         <br>
 212 %}
 213                     </ul>
 214                 </div>
 215             </div>
 216             <div class="modal-footer">
 217                 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 218             </div>
 219         </div>
 220     </div>
 221 </div>
 222
 223 <script>
 224
 225 jQuery(document).ready(function(){
 226
 227     jQuery('[name="upload_cross_info"]').click(function(){
 228         jQuery("#update_crossinfo_spreadsheet_format").click(function(){
 229             jQuery("#update_crossinfo_spreadsheet_info_dialog").modal("show");
 230         });
 231
 232         jQuery("#update_crossinfo_dialog").modal("show");
 233     });
 234
 235     jQuery("#update_crossinfo_submit").click(function(){
 236         var uploadFile = jQuery("#crossinfo_upload_file").val();
 237         jQuery('#upload_crossinfo_form').attr("action", "/ajax/cross/upload_info");
 238         if (uploadFile === ''){
 239             alert("Please select a file");
 240             return;
 241         }
 242         jQuery("#upload_crossinfo_form").submit();
 243         jQuery("#update_crossinfo_dialog").modal("hide");
 244     });
 245
 246     jQuery('#upload_crossinfo_form').iframePostForm({
 247         json: true,
 248         post: function(){
 249             jQuery("#working_modal").modal("show");
 250         },
 251         complete: function(response){
 252             jQuery("#working_modal").modal("hide");
 253             if (response.error_string){
 254                 jQuery("#upload_crossinfo_error_display tbody").html('');
 255                 jQuery("#upload_crossinfo_error_display tbody").append(response.error_string);
 256                 jQuery("#upload_crossinfo_error_display").modal("show");
 257                 return;
 258             }
 259             if (response.error) {
 260                 alert(response.error);
 261                 return;
 262             }
 263             if (response.success) {
 264                 jQuery('#cross_info_saved_dialog_message').modal("show");
 265             }
 266         }
 267     });
 268
 269     jQuery("#dismiss_cross_info_saved_dialog").click(function(){
 270         location.reload();
 271     });
 272
 273     jQuery("#upload_additional_info").click(function(){
 274
 275         jQuery("#upload_additional_info_format").click(function(){
 276             jQuery("#upload_additional_info_format_dialog").modal("show");
 277         });
 278
 279         jQuery("#upload_additional_info_dialog").modal("show");
 280     });
 281
 282     jQuery("#upload_additional_info_submit").click(function(){
 283         var uploadFile = jQuery("#additional_info_upload_file").val();
 284         jQuery('#upload_additional_info_form').attr("action", "/ajax/cross/upload_info");
 285         if (uploadFile === ''){
 286             alert("Please select a file");
 287             return;
 288         }
 289         jQuery("#upload_additional_info_form").submit();
 290         jQuery("#upload_additional_info_dialog").modal("hide");
 291     });
 292
 293     jQuery('#upload_additional_info_form').iframePostForm({
 294         json: true,
 295         post: function(){
 296             jQuery("#working_modal").modal("show");
 297         },
 298         complete: function(response){
 299             jQuery("#working_modal").modal("hide");
 300             if (response.error_string){
 301                 jQuery("#upload_crossinfo_error_display tbody").html('');
 302                 jQuery("#upload_crossinfo_error_display tbody").append(response.error_string);
 303                 jQuery("#upload_crossinfo_error_display").modal("show");
 304                 return;
 305             }
 306             if (response.error) {
 307                 alert(response.error);
 308                 return;
 309             }
 310             if (response.success) {
 311                 jQuery('#cross_info_saved_dialog_message').modal("show");
 312             }
 313         }
 314     });
 315
 316
 317 });
 318
 319 </script>