mason/breeders_toolbox/location_table.mas

   1
   2 <%args>
   3 $user_id => undef
   4 </%args>
   5
   6 <& /util/import_javascript.mas, classes => ['jquery.dataTables-buttons-min', 'jquery.iframe-post-form', 'jszip-min', 'pdfmake.pdfmake-min', 'pdfmake.vfs_fonts', 'buttons.bootstrap-min', 'buttons.html5-min', 'buttons.print-min', 'buttons.colvis-min'] &>
   7 <br>
   8 <div class="table-responsive" style="margin-top: 10px;">
   9     <table id="location_table" class="table table-hover table-striped table-bordered" width="100%">
  10         <thead>
  11             <tr>
  12                 <th>Id</th>
  13                 <th>Name</th>
  14                 <th>Abbreviation</th>
  15                 <th>Country</th>
  16                 <th>Program</th>
  17                 <th>Type</th>
  18                 <th>Lat</th>
  19                 <th>Long</th>
  20                 <th>Altitude(m)</th>
  21                 <th>Trials</th>
  22                 <th>Nearest NOAA Station ID</th>
  23             </tr>
  24         </thead>
  25         <!-- <caption class="well well-sm" style="caption-side: bottom;margin-top: 10px;"><center> Locations </center></caption> -->
  26     </table>
  27 </div>
  28 <br>
  29
  30 <& /breeders_toolbox/upload_locations_dialogs.mas &>
  31
  32 <script defer="defer">
  33
  34 jQuery(document).ready(function() {
  35
  36     jQuery.ajax( {
  37         url: '/ajax/location/all',
  38         beforeSend: function() {
  39             // put working animation handling here
  40         },
  41         success: function(response) {
  42             var export_message = 'Location data from ' + window.location.href;
  43             locationJSON = response.data;
  44             // console.log("Data is "+JSON.stringify(locationJSON, null, 2));
  45
  46             // Remove [Computataion] location from response
  47             locationJSON = locationJSON.filter(function(loc) {
  48                 return loc.properties.Name !== '[Computation]';
  49             });
  50
  51             var table = jQuery('#location_table').DataTable( {
  52                 data: locationJSON,
  53                 dom: 'Bfrtip',
  54                 rowId: 'properties.Id',
  55                 "columns": [
  56                     { "data": "properties.Id" },
  57                     { "data": "properties.Name" },
  58                     { "data": "properties.Abbreviation" },
  59                     { "data": "properties.Code",
  60                         "render":function(data, type, full, meta){
  61                            return full.properties.Code + ' ' + full.properties.Country;
  62                         }
  63                     },
  64                     { "data": "properties.Program" },
  65                     { "data": "properties.Type" },
  66                     { "data": "properties.Latitude" },
  67                     { "data": "properties.Longitude" },
  68                     { "data": "properties.Altitude" },
  69                     { "data": "properties.Trials" },
  70                     { "data": "properties.NOAAStationID",
  71                         "render":function(data, type, full, meta) {
  72                             return full.properties.NOAAStationID ? "<a href='https://www.ncdc.noaa.gov/cdo-web/datasets/GHCND/stations/" + full.properties.NOAAStationID + "/detail' target=_blank>"+ full.properties.NOAAStationID + "</a>" : "";
  73                         }
  74                     }
  75                 ],
  76                 buttons: [ 'colvis',
  77                     {
  78                         extend: 'copy',
  79                         exportOptions: {
  80                             columns: ':visible'
  81                         }
  82                     },
  83                     {
  84                         extend: 'excelHtml5',
  85                         title: document.title +'_locations',
  86                         exportOptions: {
  87                             columns: ':visible'
  88                         }
  89                     },
  90                     {
  91                         extend: 'csvHtml5',
  92                         title: document.title +'_locations',
  93                         exportOptions: {
  94                             columns: ':visible'
  95                         }
  96                     },
  97                     {
  98                         extend: 'pdfHtml5',
  99                         title: document.title +'_locations',
 100                         exportOptions: {
 101                             columns: ':visible'
 102                         },
 103                         message: export_message
 104                     },
 105                     {
 106                         extend: 'print',
 107                         exportOptions: {
 108                             columns: ':visible'
 109                         },
 110                         message: export_message
 111                     }
 112                 ],
 113                 drawCallback: function( settings ) {
 114                    var api = this.api();
 115                    var name_data = api.column(1, { search:'applied' } ).data();
 116                    var names = [];
 117                    for (var i = 0; i < name_data.length; i++) { //extract names from data object
 118                        names.push(name_data[i]+'\n');
 119                    }
 120                    //console.log("Names are: "+JSON.stringify(names));
 121                    $('#location_names').html(names);
 122                    addToListMenu('locations_to_list_menu', 'location_names', {
 123                      listType: 'locations'
 124                    });
 125                 }
 126             });
 127
 128             var map = initialize_map('location_map', locationJSON, table);
 129
 130         },
 131         error: function(response) {
 132             alert("An error occurred");
 133         }
 134     });
 135
 136  });
 137 </script>