Manage Institution page: improved display and quick loading using explicit fields...
[myslice.git] / portal / templates / onelab / onelab_institution.html
index 4b429c9..bd361de 100644 (file)
@@ -5,11 +5,20 @@
 {% endblock head %}
 
 {% block content %}
+<div class="container">
+       <div class="row">
+               <div class="col-md-12">
+                        <div class="breadcrumbs">
+                                Management &nbsp;>&nbsp; Institution: <span id="authority_name"></span>
+                        </div>
+               </div>
+       </div>
+</div>
 <div class="container">
        <div class="row">
                <div class="col-md-12">
                        <ul class="nav nav-tabs nav-section">
-                               <li class="active"><a href="#info"><img src="{{ STATIC_URL }}icons/authority-xs.png" alt="Institution" /> Institution {{user_details.parent_authority}}</a></li>
+                               <li class="active"><a href="#about">About</a></li>
                                <li><a href="#users">Users</a></li>
                                <li><a href="#slices">Slices</a></li>
                                <li><a href="#requests">Requests</a></li>
        </div>
 </div>
 <div class="container tab-content">
-       <div class="tab-pane active row" id="info">
-               <div class="col-md-12 el">
-                       <div id="authority-tab-loading"><img src="{{ STATIC_URL }}img/loading.gif" alt="Loading Authority" /></div>
-                   <div id="authority-tab-loaded" style="display:none;">
-                       <div id="authority-data" style="float:left; width:50%;"></div>
-                               <div id="onelab_membership" style="float:right; width:50%;">
-                                   <img src="{{ STATIC_URL }}img/onelab-logo.png" alt="" /><br>
-                               <div id="onelab-data"></div>
-                               </div>
-                   </div>
-          </div>
+       <div class="tab-pane active row" id="about">
        </div>
        
        <div class="tab-pane row" id="users" data-authority="{{user_details.parent_authority}}">
                                        <th>+/-</th>
                                        <th>Email</th>
                                        <th>User hrn</th>
+                            <!--
                                        <th>First name</th>
                                        <th>Last name</th>
                                        <th>Enabled</th>
+                            -->
                                        </tr>
                                </table>
                                
 
        <div class="tab-pane row" id="slices">
                <div class="col-md-12 el">
-               {% if 'is_pi'  in pi %}
-               <button id="createslice" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span> Create slice</button>
-               {% else %}
-               <button id="createslice" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span> Request slice</button>
-               {% endif %}
-               <br /><br />
            <div id="slice-tab-loading"><img src="{{ STATIC_URL }}img/loading.gif" alt="Loading Slices" /></div>
            <div id="slice-tab-loaded" style="display:none;">
                <table id="slice-tab" class="table">
                        <th>Users</th>
                        <th>Url</th>
                        <!-- <th>nodes</th> -->
-                       <th>Expiration</th>
+                       <th>Creation</th>
                    </tr>
                </table>                        
            </div>
        {% if 'is_pi'  in pi %}
         <div>
+               {% if 'is_pi'  in pi %}
+                       <button id="createslice" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span> Create slice</button>
+                       {% else %}
+                       <button id="createslice" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span> Request slice</button>
+                       {% endif %}
             <button id="renewslices" type="button" class="btn btn-primary"><span class="glyphicon glyphicon-refresh"></span> Renew Slices</button>
             <button id="deleteslices" type="button" class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span> Delete Slices</button>
         </div>
 $(document).ready(function() {
     {% if person %}
     {% if user_details.parent_authority %}
-        
-        $.post("/rest/authority/",{'filters':{'authority_hrn':'{{user_details.parent_authority}}'}}, function( data ) {
-            var authority_data = [];
-            var onelab_data = [];
-                       /* 'city','enabled','legal','longitude','onelab_membership','address','parent_authority','slice','user','country',
-            'tech','abbreviated_name','url','postcode','description','scientific','authority_hrn','latitude','name'    */
-            $.each( data, function( key, val ) {
-                authority_row = "<img src='{{ STATIC_URL }}img/institutions/{{user_details.parent_authority}}.gif' alt='' /><br>";
-                authority_row += "<br>";
-                authority_row += "<b>authority:</b> "+val.authority_hrn+"<br>";
-                               authority_row += "<br>";
-                authority_row += "<b>"+val.name+"</b><br>";
-                authority_row += "<br>";
-                authority_row += "<b>Address:</b> "+val.address+"<br>";
-                authority_row += "<b>City:</b> "+val.postcode+" "+val.city+"<br>";
-                authority_row += "<br>";
-                authority_row += "<b>Country:</b> "+val.country+"<br>";
-                authority_row += "<br>";
-                authority_row += "<br>";
-                authority_row += "<h2>Contacts</h2>";
-                authority_row += "<b>Legal:</b> ";
-                               /*
-
-                TODO: find a way to express JSON correctly given the constrains: CSV / JSON
 
-                legal = jQuery.parseJSON(val.legal);
-                if($.isArray(legal)){
-                    $.each(legal, function(k,v){
-                        authority_row += k+" "+v+"<br>";
-                    });
-                }else{
-                */
-                    authority_row += val.legal+"<br>";
-                //}
-                authority_row += "<br>";
-                authority_row += "<b>Scientific:</b> ";
-                /*
-                scientific = jQuery.parseJSON(val.scientific);
-                if($.isArray(scientific)){
-                    $.each(scientific, function(v){
-                        authority_row += v+", ";
-                    });
-                }else{
-                */
-                    authority_row += val.scientific+"<br>";
-                //}
-                onelab_membership = "<b>Status: </b>"+val.onelab_membership;
-                onelab_data.push(onelab_membership);
-                authority_data.push(authority_row);
-
-            });
-            $("div#authority-data").html(authority_data.join( "" ));
-            $("div#onelab-data").html(onelab_data.join( "" ));
-            $("div#authority-tab-loaded").css("display","block");
-            $("div#authority-tab-loading").css("display","none");
-         });
-
-        $.post("/rest/slice/",{'filters':{'parent_authority':'{{user_details.parent_authority}}'}}, function( data ) {
+        $.post("/rest/slice/",{'fields':['slice_hrn','users','url','slice_date_created'],'filters':{'parent_authority':'{{user_details.parent_authority}}'}}, function( data ) {
             var list_slices = [];
             var table_slices = [];
             /* "slice_hrn", "slice_description", "slice_type", "parent_authority", "created", "nodes", "slice_url", "slice_last_updated", "users", "slice_urn", "slice_expires" */
@@ -166,10 +110,10 @@ $(document).ready(function() {
                     users_length=val.users.length;
                 }
 
-                if(val.slice_url=="undefined" || val.slice_url==null){
+                if(val.url=="undefined" || val.url==null){
                     slice_url="";
                 }else{
-                    slice_url="<a href='"+val.slice_url+"' target='_blank'>"+val.slice_url+"</a>";
+                    slice_url="<a href='"+val.url+"' target='_blank'>"+val.url+"</a>";
                 }
                 
                 slice_row = "<tr id='"+val.slice_hrn+"'>";
@@ -178,7 +122,7 @@ $(document).ready(function() {
                 slice_row += "<td>"+users_length+"</td>";
                 slice_row += "<td>"+slice_url+"</td>";
                 //slice_row += "<td>"+nodes_length+"</td>";
-                slice_row += "<td>"+val.slice_expires+"</td>";
+                slice_row += "<td>"+val.slice_date_created+"</td>";
                 slice_row += "</tr>";
                 table_slices.push(slice_row);
                 
@@ -191,7 +135,7 @@ $(document).ready(function() {
         });
                
                
-        $.post("/rest/user/",{'filters':{'parent_authority':'{{user_details.parent_authority}}'}}, function( data ) {
+        $.post("/rest/user/",{'fields':['user_hrn','user_email'],'filters':{'parent_authority':'{{user_details.parent_authority}}'}}, function( data ) {
             var list_users = [];
             var table_users = [];
                    /* Available fields
@@ -204,9 +148,11 @@ $(document).ready(function() {
                 user_row += "<td><input type='checkbox' class='user' id='"+val.user_hrn+"'></td>";
                 user_row += "<td>"+val.user_email+"</td>";
                 user_row += "<td>"+val.user_hrn+"</td>";
+                /*
                 user_row += "<td>"+val.user_first_name+"</td>";
                 user_row += "<td>"+val.user_last_name+"</td>";
                            user_row += "<td>"+val.user_enabled+"</td>";
+                */
                 user_row += "</tr>";
                 table_users.push(user_row);
             });
@@ -225,12 +171,14 @@ $(document).ready(function() {
                e.preventDefault();
                $(this).tab('show');
        var id = $(this).attr('href').substr(1);
-       if (id == 'requests') 
+       if ((id == 'requests') || (id == 'about'))
                $("#" + id).load('/management/' + id);
        });
        var hash = window.location.hash;
        if (hash) {
                $('.nav-tabs a[href='+hash+']').click();
+       } else {
+               $('.nav-tabs a[href=#about]').click();
        }
 });
 </script>