New OneLab dashboard - home-view.html
[unfold.git] / portal / templates / slice-tab-users-view.html
1 <script type="text/javascript" src="{{STATIC_URL}}/js/jquery-ui.js"></script>
2 <script type="text/javascript" src="{{STATIC_URL}}/js/jquery.qtip.min.js"></script>
3 <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/jquery.qtip.min.css">
4 <link rel="stylesheet" href="{{ STATIC_URL }}css/jquery-ui.css">
5 <script>
6     function get_users_in_slice(authority_hrn){
7         $("table#user-tab").html("<tr><th>+/-</th><th>Email</th><th>User hrn</th></tr>");
8         var slice_users = [];
9         var slice_users_removed = [];
10                 var slice_users_emails = [];
11         var slice_users_emails_removed = [];
12         $.post("/rest/myslice:user/",{'filters':{'parent_authority': authority_hrn}}, function( data ) {
13                 var list_users = [];
14                 var table_users = [];
15                 /* Available fields
16                 user_gid, user_enabled, slices, pi_authorities, keys, parent_authority, user_first_name,
17             user_urn, user_last_name, user_phone, user_hrn, user_email, user_type
18                 */
19                 $.each( data, function( key, val ) {
20                 list_users.push( "<li><a href=\"portal/user/"+val.user_email+"\">" + val.user_email + "</a></li>" );
21                 user_row = "<tr>";
22                         // checking the box for the users that belong to the selected slice
23                         var flag_checkbox = 0;
24                         for(var data in val.slices) {
25                                 var element = val.slices[data];
26                                 if (element == "{{slice}}"){
27                                         //console.log("the slice is: "+ element);       
28                                         flag_checkbox = 1;
29                                         slice_users.push (val.user_hrn)
30                                         user_row += "<td><input type='checkbox' checked='True' class='user'></td>";
31                                 }
32                         }
33                         if(flag_checkbox != 1){
34                         user_row += "<td><input type='checkbox' class='user'></td>";
35                         }
36                 user_row += "<td>"+val.user_email+"</td>";
37                 user_row += "<td>"+val.user_hrn+"</td>";
38                         //user_row += "<td>"+val.user_enabled+"</td>";
39                 user_row += "</tr>";
40                 table_users.push(user_row);
41             
42                 });
43                 $("table#user-tab tr:first").after(table_users.join( "" ));
44                 $("div#user-tab-loaded").css("display","block");
45                 $("div#user-tab-loading").css("display","none");
46             $("input:checkbox.user").click(function() {
47                 user_hrn = $(this).closest('tr').find('td:eq(2)').html();
48                 user_email = $(this).closest('tr').find('td:eq(1)').html();
49                 if(this.checked){
50                     var record_id = this.id;
51                     slice_users.push (user_hrn);
52                                         slice_users_removed.splice($.inArray(user_hrn, slice_users_removed),1);
53                     slice_users_emails.push (user_email);
54                                         slice_users_emails_removed.splice($.inArray(user_email, slice_users_emails_removed),1); 
55         
56                 }else{
57                     slice_users_removed.push (user_hrn);
58                                         slice_users.splice($.inArray(user_hrn, slice_users),1);
59                     slice_users_emails_removed.push (user_email);
60                                         // this one is removing from the list wrong user when u uncheck
61                                         //slice_users_emails.splice($.inArray(user_email, slice_users_emails),1);
62                                         //this one is still buggy cz it still keeps users in both arrays
63                                         // but it's ok for the moment
64                                         slice_users_emails;
65         
66                 }
67             });
68         }); // post rest/use
69
70                 $('button#addusers').click(function() {
71                 $.post("/update/myslice:slice/",{'filters':{'slice_hrn':'{{slice}}'},'params':{'users':slice_users}}, function(data) {
72                         if(data.success){
73                         // TODO: highlight row after success
74                         //$('tr[id="'+record_id+'"]').highlight();
75                         mysliceAlert('Success: slice updated','success', true);
76                         }else{
77                         mysliceAlert('Rest Error for: '+data.error,'warning', true);
78                         }
79                 }); // post update slice
80                         emails = slice_users_emails.concat(slice_users_emails_removed);
81                 $.post("/credentials/clear/",{'emails':emails}, function(data) {
82                 }); // post credentials clear
83
84                 }); // button#addusers click
85
86     } // get_users_in_slice
87
88     $(document).ready(function() {
89             // TODO: Add a filter based on the list of authorities
90                 $.post("/rest/myslice:authority/",{'fields':['authority_hrn']}, function( data ) {
91                 var list_authorities = [];
92                 $.each( data, function( key, val ) {
93                     auth_hrn = val.authority_hrn;
94                     // Keep only the sub authorities, remove root auth
95                     if(auth_hrn.indexOf(".") > -1){
96                         list_authorities.push(auth_hrn);
97                                                 list_authorities.sort();
98                         if(auth_hrn=="{{user_details.parent_authority}}"){
99                                                         $('#auth_list').val(auth_hrn);
100                                                 }
101                     }
102                 });
103                                 $( "#auth_list" ).autocomplete({
104                                 source: list_authorities,
105                                 minLength: 0,
106                                 select: function (event, ui) {
107                                                 get_users_in_slice(ui.item.value);
108                                 }
109                                 //select: function( event, ui ) {console.log(jQuery(this))}
110                         });
111             }); // post rest/authority
112
113             get_users_in_slice("{{user_details.parent_authority}}");
114
115         $('[title!=""]').qtip();
116     }); // document ready
117 </script>
118
119         <div class="col-md-2">
120                 <div id="select-platform" class="list-group">
121                 </div>
122                         
123                 <ul class="list-group">
124                   <li class="list-group-item">Authority</li>
125                   <li class="list-group-item" style="padding-left:5px;">
126                         <input type="text" id="auth_list"  style ="min-width:190px;" 
127                         title="The default value is  the authority that you belong to and the selected users belong to this slice.
128                                    You can view users of other authorities (organizations) from the list that apears when you click in the field and start to type.
129                                    Use the arrow keys to scroll through the list; type part of the name to narrow down the list."/>
130           </li>
131                 </ul>
132         
133         </div>
134         <div class="col-md-10">
135                 <div class="row">
136                 </div>
137                 <div id="user-tab-loading"><img src="{{ STATIC_URL }}img/loading.gif" alt="Loading Useres" /></div>
138                 <div id="user-tab-loaded" style="display:none;">
139                 <table id="user-tab" class="table">
140                 </table>
141                                 <button id="addusers" type="button" class="btn btn-default"><span class="glyphicon glyphicon-ok"></span> Update users</button>
142                 </div>
143