mason/tracking_activities/activity_project_tree.mas

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