mason/tools/available_seedlots.mas

   1 <& /util/import_javascript.mas, classes => ['jquery','d3.d3v4Min'] &>
   2 <form id="available-seedlots">
   3   <table class="table table-hover table-bordered">
   4     <thead>
   5       <tr>
   6         <th rowspan="2" style="text-align: center;">Accessions</th><th colspan="7" style="text-align: center;">Seedlots</th>
   7       </tr>
   8       <tr>
   9         <th style="text-align: center;"><button id="selectallaccessions" type="button" disabled>Select/Deselect All</button></th>
  10         <th style="text-align: center;">Breeding Program</th>
  11         <th style="text-align: center;">Seedlot Name</th>
  12         <th style="text-align: center;">Contents</th>
  13         <th style="text-align: center;">Seedlot Location</th>
  14         <th style="text-align: center;">Count</th>
  15         <th style="text-align: center;">Weight(g)</th>
  16       </tr>
  17     </thead>
  18   </table>
  19 </form>
  20 <script type="text/javascript">
  21   (function(global){
  22     var mainFormSelector = "#available-seedlots";
  23     var d3 = global.d3v4;
  24     var ex = {};
  25
  26         const selectall_button = document.getElementById('selectallaccessions');
  27     const seedlot_form = document.getElementById('available-seedlots');
  28     function selectAllAccessions(event){
  29                 var seedlot_checkboxes = seedlot_form.querySelectorAll('input[type="checkbox"]:not(#selectallaccessions):not(:disabled)');
  30                 var any_checked = false;
  31                 seedlot_checkboxes.forEach(function(checkbox){
  32                         if (checkbox.checked == true){
  33                                 any_checked = true;
  34                         }
  35                 });
  36                 seedlot_checkboxes.forEach(function(checkbox){
  37                         checkbox.checked = !any_checked;
  38                 });
  39     }
  40     selectall_button.addEventListener('click', selectAllAccessions);
  41
  42     ex.build_table = function(accession_names, list_type){
  43       jQuery('#working_modal').modal('show');
  44           selectall_button.setAttribute('disabled', 'true'); //Reset the checkbox if looking at a different list
  45       jQuery.ajax({
  46         type: 'POST',
  47         url: '/ajax/accessions/possible_seedlots',
  48         data: {'names': accession_names, 'type': list_type},
  49         dataType: "json",
  50         success: function(response) {
  51           _build_table(accession_names,response.seedlots,response.synonyms);
  52                   var seedlot_checkboxes = seedlot_form.querySelectorAll('input[type="checkbox"]:not(#selectallaccessions):not(:disabled)');
  53                   if (seedlot_checkboxes.length > 0){
  54                         selectall_button.removeAttribute('disabled');
  55                   }
  56           jQuery('#working_modal').modal('hide');
  57         },
  58         error: function(response) {
  59           jQuery('#working_modal').modal('hide');
  60           console.log(response);
  61           alert("Something went wrong in the available-seedlots AJAX call. See console for more information.")
  62         }
  63       });
  64     };
  65     ex.get_selected = function(){
  66       return jQuery(mainFormSelector).serializeArray();
  67     };
  68     var empty_placeholder = new Object();
  69     function _build_table(accession_list,seedlot_obj,synonyms){
  70       console.log(seedlot_obj);
  71       synonymized = {};
  72       for (var acc_uname in seedlot_obj) {
  73         if (seedlot_obj.hasOwnProperty(acc_uname)) {
  74           var name;
  75           if (accession_list.indexOf(acc_uname)>-1){
  76             name = acc_uname;
  77           } else {
  78             for (var i = 0; i < synonyms[acc_uname].length; i++) {
  79               if (accession_list.indexOf(synonyms[acc_uname][i])>-1){
  80                 name = synonyms[acc_uname][i];
  81                 break;
  82               }
  83             }
  84           }
  85           synonymized[name] = seedlot_obj[acc_uname];
  86         }
  87       }
  88       var row_data = accession_list.map(function(acc){
  89         return {'name':acc,'seedlots':synonymized[acc]?synonymized[acc]:[]};
  90       });
  91       var table = d3.select(mainFormSelector).select("table");
  92       var groups = table.selectAll("tbody").data(row_data,function(d){return d.name;});
  93       groups.exit().remove();
  94       var newGroups = groups.enter().append("tbody");
  95       var newInitRows = newGroups.append("tr");
  96       newInitRows.append("th").classed("as-acc-name",true)
  97         .style("text-align","center")
  98         .style("vertical-align","middle");
  99       var allGroups = newGroups.merge(groups);
 100       allGroups.style("border-top","2px solid #999")
 101       allGroups.select(".as-acc-name")
 102         .attr("rowspan",function(d){return Math.max(1,d.seedlots.length);})
 103         .text(function(d){return d.name;});
 104       var optionRows = allGroups.selectAll("tr")
 105         .data(function(d){
 106           return d.seedlots.length>0 ? d.seedlots : [empty_placeholder];
 107         });
 108       optionRows.exit().remove();
 109       newOptionRows = optionRows.enter().append("tr");
 110       allOptionRows = newOptionRows.merge(optionRows);
 111       var optionRowCells = allOptionRows.selectAll("td").data(function(d){
 112           if (d==empty_placeholder){
 113             return ['<input disabled type="checkbox">'," ","No Available Seedlots"," "," "," "," "]
 114           }
 115           var cells = [];
 116           cells.push('<input value="'+d.seedlot[0]+'" name="'+d.seedlot[0]+'" type="checkbox">');
 117           cells.push(d.program);
 118           cells.push('<a href="/breeders/seedlot/'+d.seedlot[1]+'">'+d.seedlot[0]+'</a>');
 119           cells.push('<a href="/stock/'+d.contents[1]+'/view">'+d.contents[0]+'</a>');
 120           cells.push(d.location);
 121           cells.push(d.count);
 122           cells.push(d.weight_gram);
 123           return cells;
 124         });
 125       var newOptionRowCells = optionRowCells.enter().append("td");
 126       optionRowCells.exit().remove();
 127       var allOptionRowCells = newOptionRowCells.merge(optionRowCells);
 128       allOptionRowCells.html(function(d){return d;});
 129       allOptionRows.select("td") //select the checkbox cells
 130         .style("text-align","center")
 131         .style("vertical-align","middle");
 132     };
 133     global.available_seedlots = ex;
 134   }(window));
 135 </script>