MyAcc: tabbed
[myslice.git] / portal / templates / account-view.html
1 {% extends "layout-unfold1.html" %}
2 {% block unfold_main %}
3
4
5 {% if messages %}
6 <ul class="messages">
7     {% for message in messages %}
8     <li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
9     {% endfor %}
10 </ul>
11 {% endif %}
12
13 <div class="wrapper" id="institution">
14     <ul class="nav nav-tabs">
15       <li class="active"><a class="home-tab" data-panel="user_profile" href="#">User Profile</a></li>
16       <li><a class="home-tab" data-panel="principal_acc" href="#">User Account</a></li>
17       <li><a class="home-tab" data-panel="ref_acc" href="#">Testbed Access</a></li>
18     </ul>
19 <div class="home-panel" id="user_profile">
20 <form id="editForm"  method="POST" action="account_process" enctype="multipart/form-data">
21 <div id="middle" align="center">
22         <div class="well">
23                 {% csrf_token %}
24                         <table class="profile">          
25                         <tr class="odd">
26                                 <td colspan="2">
27                                                 <div id="info">Platform: Myslice</div>
28                                 </td>
29                         </tr>
30                         <tr class="even">
31                                 <td class="key">Email</td>
32                                 <td class="value">
33                                                 <span id="emailval" class="value" >{{ person.email }}</span>
34                                                 <button class="btn btn-default btn-xs" type="button" id="edit_email" onclick="editAlert()"  title="To change your affiliation please contact the administrator">
35                                                 <span class="glyphicon glyphicon-question-sign"></span> Edit
36                                                 </button>
37                                         </td>
38                         </tr>
39                         <tr class="odd">
40                                         <td class="key">Password</td>
41                                         <td class="value"> 
42                                                 <button class="btn btn-default btn-xs" type="button" title="Password" name="edit_pass" id="edit_pass">
43                                                         <span class="glyphicon glyphicon-edit"></span> Edit
44                                                 </button>
45                                                 <span id="passval"class="value">******** </span>
46                                                 <span class="hide_this" id="span_pass">
47                                                 <button type="button" class="btn btn-default btn-xs" title="Cancel" id="cancel_pass_change"> Cancel </button>
48                                                 <div style='display:none;' id="pass_form">
49                                                 <input type='hidden'  value='' /></div>
50                                                 <table id="edit_password">
51                                                         <tr>
52                                                                         <td>Enter password: </td>
53                                                                         <td class="field"> <input type="password" name="password" id="password" /> </td>
54                                                                 </tr>
55                                                                 <tr>
56                                                                         <td>Confirm password: </td>
57                                                                         <td class="field"> 
58                                                                                 <input type="password" name="confirmpassword" id="confirmpassword" /> 
59                                                                                 <input type="submit" class="btn btn-default btn-xs" name="submit_pass" value="Save"/> 
60                                                                         </td>
61                                                         </tr>
62                                                 </table>
63                                                 </span> 
64                                         </td>
65                         </tr>
66                         <tr class="even">
67                                         <td class="key">Full Name</td>
68                                         <td class="value">
69                                                 <span id="nameval" class="value" >{{ fullname }} </span>
70                                                 <span class="hide_this" id="span_name">
71                                                 <button type="button" class="btn btn-default btn-xs" title="Cancel" id="cancel_name_change"> Cancel </button> 
72                                                 <div style='display:none;'><input type='hidden'  name='nameform'  /></div>
73                                                 <input id="fname" type="text" name="fname" class="required"  maxlength="200" value="{{firstname}}" />
74                                                 <input id="lname" type="text" name="lname" class="required"  maxlength="200" value="{{lastname}}" />
75                                                 <input type="submit" class="btn btn-default btn-xs" name="submit_name" value="Save"/>
76                                                 </span>
77                                                 <button class="btn btn-default btn-xs" type="button"title="Full Name" id="edit_name">
78                                                         <span class="glyphicon glyphicon-edit"></span> Edit
79                                                 </button>
80                                         </td>
81                         </tr>
82                         <tr class="odd">
83                                         <td class="key">Authority</td>
84                                         <td class="value">
85                                                 <span id="affval" class="value">{{ authority }}</span>
86                                                  <button class="btn btn-default btn-xs" type="button" id="edit_auth" onclick="editAlert()"  title="To change your authority please contact the administrator">
87                                                 <span class="glyphicon glyphicon-question-sign"></span> Edit
88                                                  </button>
89                                         </td>
90                                 </tr>
91                                 <tr class="even">
92                                         <td class="key">Generate Keys</td>
93                                         <td>
94                                                 <input type="submit" name="generate" class="btn btn-danger btn-xs" value="Generate a new Key Pair" id="generate_keypair" 
95                                                            onclick="return confirm('Are you sure? If you do so, your current credentials will be overwritten.');" 
96                                                            title="It will generate a new key Pair and your current credentials will be overwritten."/>
97                                 </td> 
98                         </tr>
99                         <tr class="odd">
100                                 <td class="key">Public Key</td>
101                                 <td class="value">
102                                                 <span id="keyval" class="value">******** </span>
103                                                 <span class="hide_this" id="span_upload">
104                                                         <button type="button" class="btn btn-default btn-xs" title="Cancel" id="cancel_upload"> Cancel </button>
105                                                         <div style='display:none;'>
106                                                                 <input type='hidden'  name='upload'  /></div>
107                                                                 <input type="file" name="pubkey" class="required" id="pubkey"/>  
108                                                                 <input class="btn btn-default btn-xs" name="upload_key" id="upload_key"  type="submit" title="Upload your public key" value="Upload"
109                                                                    onclick="return confirm('Are you sure? It will overwrite your current credentials and you have delegate it manually.');"/>
110                                                 </span>
111                                                 <div style='display:none;'> <input type='hidden'  name='dload'  /> </div> 
112                                                 <button type="submit" name="dl_pubkey" class="btn btn-default btn-xs" title="Download your public key" id="dl_file">
113                                                         <span class="glyphicon glyphicon-download"></span> Download
114                                                 </button>
115                                                 <button class="btn btn-default btn-xs" id="upload_file" type="button" title="Upload a public key">
116                                                         <span class="glyphicon glyphicon-upload"></span> Upload
117                                                 </button>       
118                                 </td>
119                         </tr>
120                         <tr class="even" id="pkey_row">
121                                  {%if 'N/A' not in user_private_key%}
122                                 <td class="key">Private Key </td> <!-- Hide if priv_key doesn't exist in myslice platform   -->
123                                 <td class="value">********<a href="#">
124                                         <button type="submit" name="dl_pkey" class="btn btn-default btn-xs" title="Download your privaye key" id="dl_pkey">
125                                                         <span class="glyphicon glyphicon-download"></span> Download     
126                                                 </button>
127                                         <input class="btn btn-danger btn-xs" id="delete" name="delete" type="submit"  value="Delete" title="Delete your private key"
128                                                                 onclick="return confirm('Are you sure? If you do so, you have to delegate your credentials manually.');"/> 
129                                 </td>
130                                   {%else%}
131                                         <td class="key">Private Key </td> <!-- Hide if priv_key doesn't exist in myslice platform   -->
132                                         <td class="value">********<a href="#">
133                                         <button type="submit" name="dl_pkey" class="btn btn-default btn-xs disabled" title="Download your privaye key" id="dl_pkey">
134                                                 <span class="glyphicon glyphicon-download"></span> Download 
135                                         </button>
136                                         <input class="btn btn-danger btn-xs disabled" id="delete" name="delete" type="submit" title="Delete your private key"
137                                                                 value="Delete"  />
138                                         </td>
139                                  {%endif%}              
140                                 </tr>
141                                 <tr class="odd">
142                                 <td colspan="2">
143                                         <p class="message" id="pkey_del_msg"><b> Tradeoff:</b> Ease-of-use vs Security.<br>
144                                                         <b>Ease-of-use:</b> Automatic account delegation. Don't delete private key.<br>
145                                                         <b>Security:</b> Manual account delegation. Download & Delete private key.
146                                                 </p>
147                                 </td>
148                                 </tr>
149                         </table>
150         </div>
151 </div>
152 </div>
153
154 <div class="home-panel" id="principal_acc" style="display:none;">
155
156 <h3>Principal Account <small>Account used for delegating credentials</small></h3>
157 <div id="middle" align="center">
158         <div class="well">
159                 <table class="table table-bordered table-hover  mytable"> 
160                         <tr class="odd"> 
161                         <th>Platform</th> 
162                         <th>Account Type</th>
163                                 <th>Account Delegation</th>
164                         <th>User hrn</th>
165                                 <th>User Status</th>
166                         <!--<th>Pub Key</th> -->
167                 </tr>   
168                         {% for row in principal_acc %}         
169                         <tr class="border_bottom">
170                         <td class="odd"> {{ row.platform_name }} </td>
171                         <td class="odd"> {{ row.account_type }} </td>
172                                 <td class="odd"> {{ row.delegation_type }} </td>
173                         <td class="odd"> {{ row.usr_hrn }}  </td>
174                                 <td class="odd"> {{ row.user_status }}  </td>
175                 <!--    <td class="even"> {{ row.usr_pubkey }} </td> -->
176                 </tr> 
177                         {%endfor%}               
178                 </table>
179         </div>
180 </div>
181
182
183
184 {%if 'Enabled'  in user_status %}
185 <h3>Credentials <small>Delegated to Principal Account</small></h3>
186 <div id="middle" align="center">
187     <div class="well">
188         <table class="mytable table table-bordered table-hover">
189                         <caption><b>Delegated User Credential</b></caption> 
190             <tr class="odd"> 
191                 <th>Expiration Date</th>
192                                 <th>Download</th>
193             </tr>
194                         {% for row in my_users %}         
195                         <tr class="border_bottom">
196                         <td class="odd"> {{ row.cred_exp }} </td>
197                                 <td class="odd">
198                                         <button class="btn btn-default btn-xs" name= "dl_user_cred" type="submit" title="Download User Credential">
199                                                 <span class="glyphicon glyphicon-download"></span> Download
200                                         </button>
201                                 </td>
202                         </tr>
203                         {%endfor%}
204                  </table>
205                 <p></p>
206                 <table class="mytable table table-bordered table-hover">
207                         <caption><b>Delegated Slice Credentials</b></caption>  
208                 <tr class="odd"> 
209                                 <th>Slice Name</th> 
210                         <th>Expiration Date</th>
211                                 <th>Download</th>
212                 </tr>
213                         {% for row in my_slices %}     
214                 <tr class="border_bottom">
215                         <td class="odd"> {{ row.slice_name }} </td>
216                                 <td class="odd"> {{ row.cred_exp }} </td>
217                                 <td class="odd"> 
218                                         <button class="btn btn-default btn-xs" name= "dl_{{row.slice_name}}" type="submit" title="Download Slice Credentials">
219                                                 <span class="glyphicon glyphicon-download"></span> Download
220                                         </button> 
221                                 </td>
222                 </tr>
223                 {%endfor%}
224                 </table>
225                 <p></p>
226                 <table class="mytable table table-bordered table-hover">
227                         <caption><b>Delegated Authority Credentials</b></caption>
228                         <tr class="odd"> 
229                         <th>Authority Name</th> 
230                         <th>Expiration Date</th>
231                                 <th>Download</th>
232                         </tr>
233                         {% for row in my_auths %}
234                         <tr class="border_bottom">
235                         <td class="odd"> {{ row.auth_name }} </td>
236                         <td class="odd"> {{ row.cred_exp }} </td>
237                                 <td class="odd">
238                                         <button class="btn btn-default btn-xs" name= "dl_{{row.auth_name}}" type="submit" title="Download Authority Credentials">
239                                                 <span class="glyphicon glyphicon-download"></span> Download
240                                         </button>
241                                 </td>
242                         </tr>
243                         {%endfor%}
244                 </table>
245                 <p></p>
246                  {%if '' not in my_users%}      
247                 <p><button class="btn btn-danger btn-lg btn-block"   name= "clear_cred" type="submit" title="Clear All Credentials">Clear Credentials</button></p>
248                 {%else%}
249                 <p><button class="btn btn-danger btn-lg btn-block disabled"   name= "clear_cred" type="submit" title="Clear All Credentials">Clear Credentials</button></p>
250                 {%endif%}
251     </div>
252 </div>
253 </div>
254
255
256 <div class="home-panel" id="ref_acc" style="display:none;">
257 <h3>Testbed Access <small>Reference Accounts in the following testbeds</small></h3>
258 <div id="middle" align="center">
259     <div class="well">
260         <table class="mytable table table-bordered table-hover"> 
261             <tr class="odd"> 
262                 <th>Platform</th> 
263                 <th>Account Type</th>
264                                 <th>Reference to</th>
265                                 <th>Remove Account</th>
266             </tr>   
267             {% for row in ref_acc %}         
268             <tr class="border_bottom">
269                 <td class="odd"> {{ row.platform_name }} </td>
270                 <td class="odd"> {{ row.account_type }} </td>
271                                 <td class="odd"> {{ row.account_reference }} </td>
272                                 <td class="odd">
273                                 <button class="btn btn-danger btn-xs" name="delete_{{row.platform_name}}" type="submit" title="Delete account from this platform">
274                                                 <span class="glyphicon glyphicon-minus"></span>
275                                         </button>
276                                 </td>
277             </tr> 
278             {%endfor%}               
279         </table>
280     </div>
281 </div>
282
283
284
285 <h3>Add reference account to the following testbeds</h3>
286 <div id="middle" align="center">
287     <div class="well">
288         <table class="mytable table table-bordered table-hover"> 
289             <tr class="odd"> 
290                 <th>Platforms</th> 
291                 <th>Add Account</th>
292             </tr>   
293             {% for platform in platform_list %}         
294             <tr class="border_bottom">
295                 <td class="odd"> {{ platform.platform_no_access }} </td>
296                 <td class="odd">
297                                         <button class="btn btn-success btn-sm" name= "add_{{platform.platform_no_access}}" type="submit" title="Add account to this platform">
298                                                 <span class="glyphicon glyphicon-plus"></span>
299                                         </button>
300                                 </td>
301             </tr> 
302             {%endfor%}               
303         </table>
304     </div>
305 </div>
306 </div>
307 {%endif%} 
308 </div>
309 </form>
310 </div>
311
312 <script>
313     $(document).ready(function() {
314         $('a.home-tab').click(function() {
315             $('ul.nav-tabs li').removeClass('active');
316             $(this).parent().addClass('active');
317             $('div.home-panel').hide();
318             $('div#'+$(this).data('panel')).show();
319         });
320         $('button#createslice').click(function() {
321             window.location="/portal/slice_request/";
322         })
323         ;$('button#slicerequestbtn').click(function() {
324             /*
325             window.location="/portal/slice_request/";
326             */
327         });
328     });
329 </script>
330
331 {% endblock %}