Testbed list: Add coloration when checkbox active
[unfold.git] / portal / static / js / myslice-ui.js
1
2 /* Table initialisation */
3 $(document).ready(function() {
4         
5         var platformParameters = {};
6         
7                 
8         
9         
10         /* Testbeds list */
11         $.post("/rest/network/", { "fields" : ["network_hrn", "network_longname", "description"]}, function(data) {
12                         var testbed_data = [];
13                         var testbed_row = "<thead>";
14                         testbed_row += "<tr>";
15                         testbed_row += "<th id=testbed_check><input type=\"checkbox\" name=\"network_hrn\" value=\"all\"/></th>";
16                         testbed_row += "<th id=testbed_icon></th>";
17                         testbed_row += "<th>network_hrn</th>";
18                         testbed_row += "<th>Full name</th>";
19                         testbed_row += "<th>Description</th>";
20                         testbed_row += "</tr>";
21                         testbed_row += "</thead>";
22                         testbed_data.push(testbed_row);
23                         $.each( data, function(key, val) {
24                                 testbed_row = "<tr data-keys=\""+val.network_hrn+"\" class=\"odd\">"
25                                 testbed_row += "<td><input type=\"checkbox\" name=\"network_hrn\" value=\""+val.network_hrn+"\"/></td>";
26                                 testbed_row += "<td><img src='/static/img/testbeds/"+val.network_hrn+".png' alt='' /></td>";
27                                 testbed_row += "<td>"+val.network_hrn+"</td>";
28                                 testbed_row += "<td>"+val.network_longname+"</td>";
29                                 testbed_row += "<td>"+val.description+"</td>";
30                                 testbed_row += "</thead>";
31         
32                                 testbed_data.push(testbed_row);
33                         });
34                 $("table#testbedList").html(testbed_data.join(''));
35                 $("div#testbed-list-loaded").css("display","block");
36                 $("div#testbed-list-loading").css("display","none");
37                         
38                 $("input[type=checkbox]").click(function() {
39                         var cnt = 0;
40                         var id = $(this).val();
41                         var row = $(this).parent().parent()
42                         if (row.hasClass("active")) {
43                                 row.removeClass("active");
44                         } else {
45                                 row.addClass("active");
46                                 }
47                 });
48         });
49         
50         $("#objectList").load("/table/resource/", {"fields" : ["hostname","hrn","country","type"], "options": ["checkbox"] }, function(data) {
51                 $(this).dataTable( {
52                         "sScrollY": window.innerHeight - 275,
53                         "sDom": "frtiS",
54                 "bScrollCollapse": true,
55                 "bStateSave": true,
56                 "bPaginate": false,
57                 "bLengthChange": false,
58                 "bFilter": false,
59                 "bSort": true,
60                 "bInfo": false,
61                 "bAutoWidth": true,
62                 "bAutoHeight": false,
63                 "fnInitComplete": function(oSettings, json) {
64                                 for(var i = 0; i < myslice.pending.length; i++) {
65                                         var el = $('*[data-key="'+myslice.pending[i]+'"]');
66                                         el.addClass("active");
67                                         el.find('input[type=checkbox]').prop('checked', true);
68                                 }
69                     }
70                 } );
71                 
72                 
73                 $("input[type=checkbox]").click(function() {
74                         var cnt = 0;
75                         var id = $(this).val();
76                         var row = $(this).parent().parent()
77                         if (row.hasClass("active")) {
78                                 row.removeClass("active");
79                                 myslice.del(id);
80                                 cnt = myslice.count();
81                                 $('#badge-pending').text(cnt);
82                                 if (cnt <= 0) {
83                                         $('#badge-pending').hide();
84                                 }
85                         } else {
86                                 row.addClass("active");
87                                 myslice.add(id);
88                                 cnt = myslice.count();
89                                 $('#badge-pending').text(cnt);
90                                 if (cnt > 0) {
91                                         $('#badge-pending').show();
92                                 }
93                         }
94                 });
95         });
96         
97         
98 });
99
100 //http://stackoverflow.com/questions/5100539/django-csrf-check-failing-with-an-ajax-post-request
101 //make sure to expose csrf in our outcoming ajax/post requests
102 $.ajaxSetup({ 
103      beforeSend: function(xhr, settings) {
104          function getCookie(name) {
105              var cookieValue = null;
106              if (document.cookie && document.cookie != '') {
107                  var cookies = document.cookie.split(';');
108                  for (var i = 0; i < cookies.length; i++) {
109                      var cookie = jQuery.trim(cookies[i]);
110                      // Does this cookie string begin with the name we want?
111                  if (cookie.substring(0, name.length + 1) == (name + '=')) {
112                      cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
113                      break;
114                  }
115              }
116          }
117          return cookieValue;
118          }
119          if (!(/^http:.*/.test(settings.url) || /^https:.*/.test(settings.url))) {
120              // Only send the token to relative URLs i.e. locally.
121              xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));
122          }
123      } 
124 });