portal/templates/servicedirectory.html

   1 {% extends "layout_wide.html" %}
   2
   3 {% block head %}
   4 <!-- <script type="text/javascript" src="{{STATIC_URL}}/js/institution.js"></script> -->
   5 {% endblock head %}
   6
   7 {% block content %}
   8 <div class="container">
   9         <div class="row">
  10                 <div class="col-md-12">
  11                         <ul class="nav nav-tabs nav-section-mod">
  12                                 <li class="active"><a href="#appservices"> Application Services </a></li>
  13                                 <li><a href="#fedservices"> Federation Services </a></li>
  14                         </ul>
  15             </div>
  16         </div>
  17 </div>
  18 <div class="container tab-content">
  19         <div class="tab-pane active row" id="appservices">
  20                 <div class="col-md-12">
  21                         <div id="appservices-tab-loading"><img src="{{ STATIC_URL }}img/loading.gif" alt="Loading Services" /></div>
  22                     <div id="appservices-tab-loaded" style="display:none;">
  23             <div class="container" id="appservices-tab">
  24
  25                         <!-- <table class="table" id="appservices-tab">
  26                         <tr>
  27                             <th>Name</th>
  28                             <th>Provider</th>
  29                             <th>Endpoint URL</th>
  30                             <th>Protocol</th>
  31                             <th>Basic API</th>
  32                             <th>Brief Description</th>
  33                         </tr>
  34                     </table> -->
  35               </div>
  36                     </div>
  37            </div>
  38         </div>
  39
  40         <div class="tab-pane row" id="fedservices" data-authority="{{user_details.parent_authority}}">
  41                 <div class="col-md-12">
  42                         <div id="fedservices-tab-loading"><img src="{{ STATIC_URL }}img/loading.gif" alt="Loading Services" /></div>
  43                                 <div id="fedservices-tab-loaded" style="display:none;">
  44                                 <table class="table" id="fedservices-tab">
  45                                         <tr>
  46                                         <th>Name</th>
  47                                         <th>Brief Description</th>
  48                                         <th>URL</th>
  49                                         </tr>
  50                                 </table>
  51                              </div>
  52                 </div>
  53         </div>
  54 </div>
  55
  56 <script>
  57
  58 $(document).ready(function() {
  59
  60 loadedTabs = [];
  61
  62   $('.nav-tabs a').click(function (e) {
  63     e.preventDefault();
  64     $(this).tab('show');
  65     // id = $(this).attr('href').substr(1);
  66     // if (!(id in loadedTabs)) {
  67     //   switch(id) {
  68     //     case 'users':
  69     //       //loadUsers();
  70     //       loadedTabs[id] = true;
  71     //     break;
  72     //   }
  73     // }
  74
  75   });
  76
  77     {% if person %}
  78
  79         $.ajax({
  80             type: "GET",
  81             dataType: "json",
  82             async: "false",
  83             url: "{{ servdirurl }}appservices/",
  84             success: function(data, status, jqXHR){
  85                 // console.log(data);
  86                 // $.each(data, function(i, item){
  87                 //     console.log(item);
  88                 //     var tr = $('<tr>').append(
  89                 //         $('<td id="name">').text(item.name),
  90                 //         $('<td>').text(item.provider),
  91                 //         $('<td>').append('<a href="' + item.endPoint + '">' + item.endPoint + "</a>"),
  92                 //         $('<td>').text(item.protocol),
  93                 //         $('<td>').text(item.APIBasic),
  94                 //         $('<td>').text(item.briefDescription)
  95                 //     );
  96                 //     $("#appservices-tab > tbody:last").append(tr);
  97                 //     $("td#name").click(function(){
  98                 //         window.location.href = data.endPoint;
  99                 //     });
 100                 // });
 101                   function createToggle(name){
 102                       return function(){
 103                         var el = $('p#expandable-' + name);
 104                         if(!el.is(':animated')){
 105                           $(el).toggle(300);
 106                         }
 107                       }
 108                     }
 109
 110                   $.each(data, function(i, item){
 111
 112                     var imgsrc;
 113
 114                     if(item.name.toLowerCase().indexOf("santander") >= 0){
 115                       imgsrc = "smartsantander.png";
 116                     } else if(item.name.toLowerCase().indexOf("hadoop") >= 0){
 117                       imgsrc = "hadoop.png";
 118                     } else if(item.name.toLowerCase().indexOf("openstack") >= 0){
 119                       imgsrc = "openstack.png";
 120                     }
 121
 122                     var row = $('<div class="row">').append(
 123                       $('<div>').addClass("col-md-3 portfolio-item").append(
 124                         $('<img>').attr('src', "{{ STATIC_URL }}img/servicedirectory/" + imgsrc)
 125                      ),
 126                       $('<div>').addClass("col-md-6 portfolio-item").append(
 127                         $('<p id="name-' + item.name.replace(/ /g,'') + '">').text(item.name),
 128                         $('<p>').text(item.briefDescription),
 129                         $('<p>').text("Provider: " + item.provider),
 130                         $('<p>').append('Endpoint: <a href="' + item.endPoint + '">' + item.endPoint + "</a>"),
 131                         $('<p id="expandable-' + item.name.replace(/ /g,'') + '">').text(item.fullDescription).hide(),
 132                         $('<p id="expandable-' + item.name.replace(/ /g,'') + '">').text("Protocol: " + item.protocol).hide(),
 133                         $('<p id="expandable-' + item.name.replace(/ /g,'') + '">')
 134                               .append('API documentation: <a href="' + item.APILink + '">' + item.APILink + "</a>").hide(),
 135                         $('<p id="expandable-' + item.name.replace(/ /g,'') + '">').text(item.APIBasic).hide()
 136                       )
 137                     );
 138                     $("#appservices-tab").append(row);
 139                     $('p#name-' + item.name.replace(/ /g,'')).click(createToggle(item.name.replace(/ /g,'')));
 140                 });
 141
 142
 143                 $("div#appservices-tab-loaded").css("display","block");
 144                 $("div#appservices-tab-loading").css("display","none");
 145             },
 146             error: function(jqXHR, status){
 147                 console.log("ERROR: " + status);
 148             }
 149         });
 150
 151         $.ajax({
 152             type: "GET",
 153             dataType: "json",
 154             async: "false",
 155             url: "{{ servdirurl }}fedservices/",
 156             success: function(data, status, jqXHR){
 157                 // console.log(data);
 158                 $.each(data, function(i, item){
 159                     console.log(item);
 160                     var tr = $('<tr>').append(
 161                         $('<td>').text(item.name),
 162                         $('<td>').text(item.briefDescription),
 163                         $('<td>').append('<a href="' + item.endPoint + '">' + item.endPoint + "</a>")
 164                     );
 165                     $("#fedservices-tab > tbody:last").append(tr);
 166                 });
 167
 168
 169                 $("div#fedservices-tab-loaded").css("display","block");
 170                 $("div#fedservices-tab-loading").css("display","none");
 171             },
 172             error: function(jqXHR, status){
 173                 console.log("ERROR: " + status);
 174             }
 175         });
 176
 177   //       $.post("/rest/authority/",{'filters':{'authority_hrn':'{{user_details.parent_authority}}'}}, function( data ) {
 178   //           var authority_data = [];
 179   //           var onelab_data = [];
 180                 //      /* 'city','enabled','legal','longitude','onelab_membership','address','parent_authority','slice','user','country',
 181   //           'tech','abbreviated_name','url','postcode','description','scientific','authority_hrn','latitude','name'  */
 182   //           $.each( data, function( key, val ) {
 183   //               authority_row = "<img src='{{ STATIC_URL }}img/institutions/{{user_details.parent_authority}}.gif' alt='' /><br>";
 184   //               authority_row += "<br>";
 185   //               authority_row += "<b>authority:</b> "+val.authority_hrn+"<br>";
 186   //               authority_data.push(authority_row);
 187   //           });
 188   //           $("div#authority-data").html(authority_data.join( "" ));
 189   //           $("div#onelab-data").html(onelab_data.join( "" ));
 190   //           $("div#authority-tab-loaded").css("display","block");
 191   //           $("div#authority-tab-loading").css("display","none");
 192   //        });
 193
 194   //       $.post("/rest/slice/",{'filters':{'parent_authority':'{{user_details.parent_authority}}'}}, function( data ) {
 195   //           var list_slices = [];
 196   //           var table_slices = [];
 197   //           /* "slice_hrn", "slice_description", "slice_type", "parent_authority", "created", "nodes", "slice_url", "slice_last_updated", "users", "slice_urn", "slice_expires" */
 198   //           $.each( data, function( key, val ) {
 199   //               list_slices.push( "<li><a href=\"portal/slice/"+val.slice_hrn+"\">" + val.slice_hrn + "</a></li>" );
 200   //               if(val.nodes=="undefined" || val.nodes==null){
 201   //                   nodes_length=0;
 202   //               }else{
 203   //                   nodes_length=val.nodes.length;
 204   //               }
 205   //               if(val.users=="undefined" || val.users==null){
 206   //                   users_length=0;
 207   //               }else{
 208   //                   users_length=val.users.length;
 209   //               }
 210
 211   //               if(val.slice_url=="undefined" || val.slice_url==null){
 212   //                   slice_url="";
 213   //               }else{
 214   //                   slice_url="<a href='"+val.slice_url+"' target='_blank'>"+val.slice_url+"</a>";
 215   //               }
 216
 217   //               slice_row = "<tr id='"+val.slice_hrn+"'>";
 218   //               slice_row += "<td><input type='checkbox' class='slice' id='"+val.slice_hrn+"'></td>";
 219   //               slice_row += "<td><a href=\"/slice/"+val.slice_hrn+"\">" + val.slice_hrn + "</a></td>";
 220   //               slice_row += "<td>"+users_length+"</td>";
 221   //               slice_row += "<td>"+slice_url+"</td>";
 222   //               //slice_row += "<td>"+nodes_length+"</td>";
 223   //               slice_row += "<td>"+val.slice_expires+"</td>";
 224   //               slice_row += "</tr>";
 225   //               table_slices.push(slice_row);
 226
 227   //           });
 228
 229   //           /* $("div#slice-list").html($( "<ul/>", { html: list_slices.join( "" ) })); */
 230   //           $("table#slice-tab tr:last").after(table_slices.join( "" ));
 231   //           $("div#slice-tab-loaded").css("display","block");
 232   //           $("div#slice-tab-loading").css("display","none");
 233   //       });
 234
 235                 // $.post("/rest/user/",{'filters':{'parent_authority':'{{user_details.parent_authority}}'}}, function( data ) {
 236   //            var list_users = [];
 237   //            var table_users = [];
 238                 //       /* Available fields
 239                 //       user_gid, user_enabled, slices, pi_authorities, keys, parent_authority, user_first_name,
 240                 //       user_urn, user_last_name, user_phone, user_hrn, user_email, user_type
 241                 //       */
 242   //            $.each( data, function( key, val ) {
 243   //                list_users.push( "<li><a href=\"portal/user/"+val.user_email+"\">" + val.user_email + "</a></li>" );
 244   //                user_row = "<tr id='"+val.user_hrn+"'>";
 245   //                user_row += "<td><input type='checkbox' class='user' id='"+val.user_hrn+"'></td>";
 246   //                user_row += "<td>"+val.user_email+"</td>";
 247   //                user_row += "<td>"+val.user_hrn+"</td>";
 248   //                user_row += "<td>"+val.user_first_name+"</td>";
 249   //                user_row += "<td>"+val.user_last_name+"</td>";
 250                 //               user_row += "<td>"+val.user_enabled+"</td>";
 251   //                user_row += "</tr>";
 252   //                table_users.push(user_row);
 253   //            });
 254   //            $("table#user-tab tr:last").after(table_users.join( "" ));
 255   //            $("div#user-tab-loaded").css("display","block");
 256   //            $("div#user-tab-loading").css("display","none");
 257   //         });
 258
 259    {% endif %}
 260
 261 }); // end document.ready
 262 </script>
 263 {% endblock %}