mason/transformation/transformation_project_tree.mas

   1 <%args>
   2 $user_id => undef
   3 @programs => ()
   4 @locations => ()
   5 @roles => ()
   6 </%args>
   7
   8 <& /util/import_javascript.mas, classes => [ 'jquery.iframe-post-form', 'jstree.dist.jstree', 'CXGN.TrialTreeFolders'] &>
   9
  10 <& /util/import_css.mas, paths => ['/static/documents/inc/jstree_theme/jstree-bstheme-min.css'] &>
  11
  12 <& /transformation/add_transformation_project_dialog.mas, user_id=>$user_id, programs=>\@programs, locations=>\@locations, roles=>\@roles &>
  13 <& /breeders_toolbox/folder/folder_set.mas, project_type=>'transformation' &>
  14 <& /breeders_toolbox/folder/folder_new.mas, project_type=>'transformation' &>
  15 <& /breeders_toolbox/folder/folder_move.mas, project_type=>'transformation' &>
  16 <& /breeders_toolbox/folder/folders_edit.mas, folder_tree_type => 'Transformation', folder_tree_identifier => 'transformation_projects_list', folder_tree_refresh_name => 'refresh_transformation_project_jstree_html' &>
  17
  18 <table class="table table-bordered">
  19     <thead>
  20         <tr>
  21             <th>Information</th>
  22             <th>Breeding Programs -- Folders -- Transformation Projects&nbsp;&nbsp;&nbsp;&nbsp;<button class="btn btn-sm btn-default" id="refresh_transformation_project_jstree_html_trialtree_button" name="refresh_transformation_project_jstree_html">Refresh</button></th>
  23         </tr>
  24     </thead>
  25     <tbody>
  26         <tr>
  27             <td>
  28                 <h4>Search</h4>
  29                 <input type="text" class="form-control input-sm" id="transformation_tree_search" placeholder="Search" />
  30                 <hr>
  31
  32                 <h5><i>Double click<br />transformation project (&nbsp;<span class="glyphicon glyphicon-text-width text-success"></span>&nbsp;) or folder (&nbsp;<span class="glyphicon glyphicon-folder-open text-danger"></span>&nbsp;)<br/>to view detail page.</i></h5>
  33                 <h5><i>Breeding programs (&nbsp;<span class="glyphicon glyphicon-briefcase text-info"></span>&nbsp;)</i></h5>
  34                 <hr>
  35                 <!--
  36                 <h4>Folders</h4>
  37                 <button class="btn btn-sm btn-default" id="new_folder_dialog_link">Create new folder</button><br/><br/>
  38                 <button class="btn btn-sm btn-default" id="open_folder_dialog_link">Move transformation project(s) to folder</button><br/><br/>
  39                 <button class="btn btn-sm btn-default" id="move_folder_dialog_link">Move folder</button>
  40                 -->
  41                 <div id="folder_edit_options" style="display:none">
  42                     <hr>
  43                     <h5><i>Select multiple folders by holding 'Ctrl'.</i></h5>
  44                     <button class="btn btn-primary" id="edit_folders_button" title="First Select Folder(s) to Edit">Edit Folder(s)</button>
  45                     <br/>
  46                 </div>
  47
  48                 <!--<button id="delete" disabled="disabled" >Delete</button -->
  49                 <br />
  50             </td>
  51             <td>
  52                 <div id="transformation_projects_list" >[loading...]</div>
  53             </td>
  54         </tr>
  55     </tbody>
  56 </table>
  57
  58
  59 <script>
  60
  61 jQuery.noConflict();
  62
  63 jQuery(document).ready(function($) {
  64
  65     jQuery('#create_transformation_project_link').click(function() {
  66         var lo = new CXGN.List();
  67         get_select_box('years', 'transformation_project_year', {'id':'transformation_project_year_select', 'name':'transformation_project_year_select', 'auto_generate':1});
  68         jQuery("#create_transformation_project_dialog").modal("show");
  69     });
  70
  71     jQuery.ajax( {
  72         url: '/ajax/breeders/get_trials_with_folders_cached?type=transformation',
  73         success: function(response) {
  74             var html = '<ul>'+response.html+'</ul>';
  75
  76             jQuery('#transformation_projects_list').html(html);
  77             jQuery('#transformation_projects_list').jstree( {
  78                 "core": { 'themes': { 'name': 'proton', 'responsive': true}},
  79                 "valid_children" : [ "folder", "trial", "breeding_program" ],
  80                 "types" : {
  81                     "breeding_program" : {
  82                         "icon": 'glyphicon glyphicon-briefcase text-info',
  83                     },
  84                     "folder" : {
  85                         "icon": 'glyphicon glyphicon-folder-open text-danger',
  86                     },
  87                     "transformation" : {
  88                         "icon": 'glyphicon glyphicon-text-width text-success',
  89                     }
  90                 },
  91                 "search" : {
  92                     "case_insensitive" : true,
  93                  },
  94                 "plugins" : ["html_data","types","search"],
  95             });
  96         },
  97         error: function(response) {
  98             alert("An error occurred while loading the transformation project data.");
  99           }
 100     });
 101
 102     jQuery("#transformation_tree_search").keyup(function() {
 103         var v = jQuery("#transformation_tree_search").val();
 104         jQuery("#transformation_projects_list").jstree(true).search(v);
 105     });
 106
 107     jQuery('#transformation_projects_list').on("changed.jstree", function (e, data) {
 108         if ($('#transformation_projects_list').jstree('is_leaf', data.node) && data.node.data.jstree.type == 'folder') {
 109             jQuery("#folder_edit_options").show();
 110         }
 111         else {
 112             jQuery("#folder_edit_options").hide();
 113         }
 114     });
 115
 116     jQuery("#transformation_projects_list").delegate("li", "dblclick", function(event){
 117         var node = $("#transformation_projects_list").jstree("get_node", this);
 118         //console.log(node);
 119         if (node.id.substr(0,1) !== 'j') {
 120             if (node.type == 'folder') {
 121                 window.open('/folder/'+node.id);
 122                 event.stopPropagation();
 123             } else if (node.type == 'transformation') {
 124                 window.open('/breeders_toolbox/trial/'+node.id);
 125                 event.stopPropagation();
 126             }
 127         }
 128     });
 129
 130 });
 131
 132 </script>