mason/stock/stockprops.mas

   1 <%doc>
   2 =head1 NAME
   3
   4 stockprops.mas
   5
   6 =head1 DESCRIPTION
   7
   8 This component can print stock properties
   9
  10
  11 =head1 ARGUMENTS
  12
  13 =over 1
  14
  15 =item props
  16 hashref of stockprops . keys = prop name (cvterm.name) values = list of prop values
  17
  18 =back
  19
  20 =head1 AUTHOR
  21 Naama Menda <nm249@cornell.edu>
  22
  23
  24 =cut
  25
  26 </%doc>
  27
  28 <%args>
  29   $stock_id
  30   $form_div_id
  31   $subset => [  'released_variety_name' ]
  32   $props
  33   $editable => []
  34   $div_name => ''
  35   $edit_privs => 0
  36 </%args>
  37 <& /util/import_javascript.mas,
  38    classes => ["jquery", "jqueryui", "CXGN.Page.FormattingHelpers",  "CXGN.Stock" ],
  39 &>
  40
  41 <%perl>
  42 use JSON::Any;
  43 use CXGN::Page::FormattingHelpers qw | simple_selectbox_html simple_checkbox_html |;
  44
  45 my $subset_json = JSON::Any->objToJson($subset);
  46
  47
  48 $div_name ||= join("_", @$subset);
  49 $div_name =~ s/ +/\_/g;
  50
  51 $edit_privs ||= 0;
  52
  53 my $prop_select = simple_selectbox_html(
  54      name => $div_name."_select",
  55      id => $div_name."_select",
  56      choices => $editable
  57 );
  58
  59
  60 </%perl>
  61
  62 <div id="<% $div_name %>_content">
  63 </div>
  64
  65
  66 <div class ="modal fade" id="<% $div_name %>_add_dialog" name="<% $div_name %>_add_dialog" tabindex="-1" role="dialog" aria-labelledby="add<% $div_name %>Dialog">
  67
  68   <div class="modal-dialog" role="document">
  69     <div class="modal-content">
  70       <div class="modal-header" style="text-align: center">
  71         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  72         <h4 class="modal-title" id="add<% $div_name %>Dialog">Add Property</h4>
  73       </div>
  74       <div class="modal-body">
  75         <div class="container-fluid">
  76
  77           <form class="form-horizontal" role="form" method="post" id="add_<% $div_name %>_dialog_form" name="add_<% $div_name %>_dialog_form">
  78             <div class="form-group">
  79               <label class="col-sm-6 control-label"><% $prop_select %> </label><br />
  80             </div>
  81             <div class ="form-group">
  82               <div class="col-sm-6" >
  83                 <input name="<% $div_name %>_prop" id="<% $div_name %>_prop" class="form-control" type="text" />
  84               </div>
  85             </div>
  86
  87           </div>
  88         </div>
  89
  90       <div class="modal-footer">
  91         <button id="close_add_<% $div_name %>_stockprop_dialog" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  92         <button type="button" class="btn btn-primary" name="<% $div_name %>_addProp_submit" id="<% $div_name %>_addProp_submit" title="submit">Submit</button>
  93       </div>
  94       </form>
  95     </div>
  96   </div>
  97 </div>
  98
  99
 100
 101 <script defer="defer" >
 102
 103 jQuery(document).ready(function() {
 104    <% $div_name %>_getProps();
 105
 106
 107    jQuery('#<% $form_div_id %>').click(function(){
 108       jQuery('#<% $div_name %>_add_dialog').modal("show");
 109    });
 110
 111    jQuery('#<% $div_name %>_addProp_submit').click( function () {
 112     <% $div_name %>_addProp() },
 113     );
 114 });
 115
 116 // note: the $div_name prefix is needed when several instances are created on a page
 117
 118 function <% $div_name %>_getProps() {
 119   jQuery.ajax( {
 120     type: 'GET',
 121     url: '/stock/prop/get',
 122     data: { stock_id: <% $stock_id %> },
 123     success: function(response) { <% $div_name %>_renderProps(response);  },
 124     error: function(response) { alert('an error occurred'); }
 125     });
 126
 127  }
 128
 129
 130 function <% $div_name %>_renderProps(props) {
 131    var subset = eval(<% $subset_json %>);
 132
 133    // eliminate types without values
 134    var filteredSet = {};
 135    for (var n=0; n<subset.length; n++) {
 136      for (var i=0; i<props.length; i++) {
 137        if (subset[n] ==  props[i]['type_name']) {
 138          filteredSet[subset[n]]=1;
 139            }
 140        }
 141    }
 142
 143
 144    var html = '';
 145    var prop_string;
 146    var edit_privs = <% $edit_privs %>;
 147    for (var n in filteredSet) {
 148       var lines = new Array();
 149       for(var i=0; i<props.length; i++) {
 150         if (n ===  props[i]['type_name']) {
 151           var lineStr = props[i]['value'];
 152           if (jQuery.cookie("sgn_session_id") && edit_privs === 1) {
 153             lineStr = lineStr + '[<a href="javascript:<% $div_name %>_deleteProp(\''+props[i]['value']+'\', '+props[i]['stockprop_id']+')">X</a>]';
 154           }
 155           lines.push(lineStr);
 156         }
 157
 158       }
 159       html = html + '<b>'+n+'</b>&nbsp;&nbsp;';
 160       //html  = html + lineStr;
 161       html = html + lines.join(", ");
 162       html = html + '<br />\n';
 163    }
 164    jQuery('#<% $div_name %>_content').html(html);
 165
 166 }
 167
 168
 169
 170 function <% $div_name %>_addProp() {
 171   var prop_type = jQuery('#<% $div_name %>_select').val();
 172   var prop = jQuery('#<% $div_name %>_prop').val();
 173   prop = prop.trim();
 174   if (prop === '') { alert("Please fill in the field."); return; }
 175
 176   jQuery.ajax( {
 177     type: 'POST',
 178     url: '/stock/prop/add',
 179     beforeSend: function(){
 180         jQuery('#working_modal').modal('show');
 181     },
 182     data: { 'stock_id' : <% $stock_id %>, 'prop' : prop, 'prop_type': prop_type },
 183     success: function(response) {
 184         jQuery('#working_modal').modal('hide');
 185         if ("error" in response) { alert ('ERROR '+response.error); }
 186         if ("message" in response) {
 187             alert('Successfully added property: ' + prop + '. ('+response.message+')');
 188         }
 189     },
 190     error: function(response) {
 191         jQuery('#working_modal').modal('hide');
 192         alert('an error occurred while storing the prop ' + response.error);
 193     },
 194     complete: function() {
 195         <% $div_name %>_getProps();
 196         jQuery('#<% $div_name %>_add_dialog').modal("hide");
 197     },
 198   });
 199
 200   }
 201
 202
 203 function <% $div_name %>_deleteProp(stockprop_value, stockprop_id) {
 204     var yes = confirm('Delete stockprop '+stockprop_value+'?');
 205     if (yes) {
 206         jQuery.ajax( {
 207             method: 'GET',
 208             url: '/stock/prop/delete',
 209             data: { 'stockprop_id' : stockprop_id },
 210             success: function(response) {
 211             if ('message' in response) {
 212                 alert(response.message);
 213                 //location.reload();
 214             }
 215             if ('error'   in response) {  alert(response.error);   }
 216            },
 217            error: function(response) { alert('An error occurred. Please try again later.');
 218            },
 219          complete: function() {
 220            <% $div_name %>_getProps();
 221          }
 222         });
 223     }
 224 }
 225
 226 </script>