planetstack/templates/admin/dashboard/tenant.html

   1 <!doctype html>
   2 <script type="text/javascript" src="http://www.google.com/jsapi"></script>
   3 <div id="dialog-form" title="Add/Remove Slivers" style="display: none;">
   4         <form>
   5                 <fieldset>
   6                         <label for="numberOfSlivers">Number of Slivers</label>
   7                         <input type="text" name="numberOfSlivers" id="numOfSlivers" class="text ui-widget-content ui-corner-all">
   8                         <div id=basic-tooltip>Please enter number of slivers</div>
   9                 </fieldset>
  10         </form>
  11 </div>
  12 <div id="adv-dialog-form" title="Add/Remove Slivers" style="display: none;">
  13         <form>
  14                 <fieldset>
  15                         <label for="numberOfSlivers">Number of Slivers</label>
  16                         <input type="text" name="numberOfSlivers" id="advNumOfSlivers" class="text ui-widget-content ui-corner-all">
  17                         <div id=adv-tooltip>Please enter number of slivers</div>
  18                 </fieldset>
  19         </form>
  20 </div>
  21 <div id="create-slice-form" title="Create New Slice" style="display: none;">
  22         <form>
  23                 <fieldset>
  24                         <div class="create-slice-row">
  25                                 <label for="new-slice-name">Name</label>
  26                                 <input type="text" name="new-slice-name" id="new-slice-name">
  27                         </div>
  28                         <div class="create-slice-row">
  29                                 <label for="new-service-class">Service Class</label>
  30                                 <select id="new-service-class" class="tenant-create-slice"></select>
  31                         </div>
  32                         <div class="create-slice-row">
  33                                 <label for="new-image">Image</label>
  34                                 <select id="new-image" class="tenant-create-slice"></select>
  35                         </div>
  36                         <div class="create-slice-row">
  37                                 <label for="new-network">Network Ports</label>
  38                                 <input type="text" name="new-network" id="new-network">
  39                         </div>
  40                         <div class="create-slice-row">
  41                                 <label for="private-vol">Include Private Vol</label>
  42                                 <input type="checkbox" name="checkbox" id="private-vol" value="value">
  43                         </div>
  44                         <div class="create-slice-row">
  45                                 <label for="mount-data-sets">Data Sets</label>
  46                                 <select id="mount-data-sets" class="tenant-create-slice"></select>
  47                         </div>
  48                         <div class="create-slice-row">
  49                                 <label for="number-of-slivers">Number Of Slivers</label>
  50                                 <input type="text" name="number-of-slivers" id="number-of-slivers">
  51                         </div>
  52                         <div id=tooltip>Slice Name cannot be empty</div>
  53                 </fieldset>
  54         </form>
  55 </div>
  56 <div id="delete-slice-form" title="Delete a  Slice" style="display: none;">
  57         <form>
  58                 <fieldset>
  59                         <div class="create-slice-row">
  60                                 <label for="delete-slice">Choose a Slice</label>
  61                                 <select id="delete-slice"></select>
  62                         </div>
  63                 </fieldset>
  64         </form>
  65 </div>
  66 <script type="text/javascript">
  67         google.load('visualization', '1', {
  68                 'packages': ['controls', 'table', 'corechart', 'geochart']
  69         });
  70         </script>
  71         <script>
  72         $(document).ready(function () {
  73                 function showSliceData(rows,imageData,serviceLevelData,siteRows,dataSet,value) {
  74                         $("#service-level-value").empty();
  75                         $("#slice-image-value").empty();
  76                         $("#tenantSiteTable").empty();
  77                         $('#tenantSiteTable').html('<table cellpadding="0" cellspacing="0" border="0" class="display" id="tenantSiteTableData"></table>');
  78                         $("#tenantSliceDropDown").val(value);
  79                         var siteNames = [];
  80                         var sliverCount;
  81                         for (row in rows) {
  82                                 if (rows[row]['sliceName'] == value) {
  83                                         sliceImageData = rows[row]['preferredImage'];
  84                                         $("#slice-image-value").html(sliceImageData);
  85                                         serviceLevelDataBasic = rows[row]['sliceServiceClass'];
  86                                         $("#service-level-value").html(serviceLevelDataBasic);
  87                                         var innerRows = rows[row]['sliceSite'];
  88                                         for (innerRow in innerRows) {
  89                                                 sliverCount = innerRows[innerRow];
  90                                                 siteNames.push([innerRow, sliverCount]);
  91                                         }
  92                                 }
  93                         }
  94                         oTable = $('#tenantSiteTableData').dataTable({
  95                                 "bJQueryUI": true,
  96                                 "bFilter": false,
  97                                 "bInfo": false,
  98                                 "bLengthChange": false,
  99                                 "aaData": siteNames,
 100                                 "bStateSave": true,
 101                                 "aoColumns": [{
 102                                                 "sTitle": "Site Name"
 103                                         }, {
 104                                                 "sTitle": "Allocated",
 105                                                 sClass: "alignCenter"
 106                                         }
 107                                 ]
 108                         });
 109                                 $('#tenantSliceDropDown').on('change', function () {
 110                                         var value = $("#tenantSliceDropDown").val();
 111         //alert(value);
 112                                         checkForBasicAdvView(value,rows,imageData,serviceLevelData,siteRows,dataSet);
 113                                 });
 114                 }
 115
 116                 function downloadSliceInfo(rows,imageData,serviceLevelData,siteRows,dataSet,value){
 117                          $("#download-details").unbind().click(function(){
 118                                                 function download(filename, text) {
 119                                                 var sliceDetails = document.createElement('a');
 120                                                 sliceDetails.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
 121                                                 sliceDetails.setAttribute('download', filename);
 122                                                 sliceDetails.click();
 123                                         }
 124                                         var sliceInfo;
 125                                         for (row in rows){
 126                                                 if(rows[row]['sliceName']==value){
 127                                                         sliceInfo = "Slice Name: "+rows[row]['sliceName']+"\nNumber of Slivers: "+rows[row]['numOfSlivers']+"\nService Level: "+rows[row]['sliceServiceClass']+"\nImage: "+rows[row]['preferredImage']+"\n";
 128                                                 for (instanceNodePairs in rows[row]['instanceNodePair']){
 129                                                         sliceInfo += instanceNodePairs+"@"+rows[row]['instanceNodePair'][instanceNodePairs]+"\n";
 130                                                 }
 131                                                 }
 132                                         }
 133                                         download('slice.txt', sliceInfo);
 134                           });
 135                 }
 136                 function editSliverAdv() {
 137                         $(".edit-view").click(function () {
 138                                 var allocatedSlivers = parseInt($(this).parent().siblings(".allocated").html());
 139                                 var td = $(this).parent().siblings(".allocated");
 140                                 var pos = oTable.fnGetPosition(td[0]);
 141                                 $("#numOfSlivers").val("");;
 142                                 $("#advNumOfSlivers").val("");;
 143                                 $("#adv-tooltip").css("display", "none");
 144                                 $("#adv-dialog-form").dialog({
 145                                         autoOpen: false,
 146                                         height: 200,
 147                                         width: 350,
 148                                         modal: true,
 149                                         dialogClass: "tenantDialog",
 150                                         buttons: {
 151                                                 "Add": function () {
 152                                                         allocatedSlivers += parseInt($("#advNumOfSlivers").val());
 153                                                                 $("#adv-tooltip").css("display", "block");
 154                                                                 $(this).dialog("close");
 155                                                                 td.html(allocatedSlivers);
 156                                                 },
 157                                                 "Remove": function () {
 158                                                         allocatedSlivers -= parseInt($("#advNumOfSlivers").val());
 159                                                                 $("#adv-tooltip").css("display", "block");
 160                                                                 $(this).dialog("close");
 161                                                                 td.html(allocatedSlivers);
 162                                                 }
 163                                         }
 164                                 });
 165                                 $("#adv-dialog-form").dialog("open");
 166                         });
 167                 }
 168
 169                 function advShowSliceData(rows,imageData,serviceLevelData,siteRows,dataSet,value) {
 170                         $("#adv-service-level-value").empty();
 171                         $("#adv-slice-image-value").empty();
 172                         $("#adv-slice-data-set-value").empty();
 173                         $("#advTenantSliceDropDown").val(value);
 174                         $("<select></select>").attr('id', 'adv-service-level-dropdown').appendTo('#adv-service-level-value');
 175                         $("<select></select>").attr('id', 'adv-image-dropdown').appendTo('#adv-slice-image-value');
 176                         $("<select></select>").attr('id', 'adv-dataset-dropdown').appendTo('#adv-slice-data-set-value');
 177                         $('#advTenantSiteTable').html('<table cellpadding="0" cellspacing="0" border="0" class="display" id="advTenantSiteTableData"></table>');
 178                         var siteNames = [];
 179                         var sliverCount;
 180                         var tableData = {};
 181                         for (row in serviceLevelData) {
 182                                 $("#adv-service-level-dropdown").append("<option>" + serviceLevelData[row]['serviceClass'] + "</option>");
 183                         }
 184                         for (row in imageData) {
 185                                 $("#adv-image-dropdown").append("<option>" + imageData[row]['Image'] + "</option>");
 186                         }
 187                         for (row in dataSet) {
 188                                 $("#adv-dataset-dropdown").append("<option>" + dataSet[row]['DataSet'] + "</option>");
 189                         }
 190
 191                         for (row in rows) {
 192                                 if (rows[row]['sliceName'] == value) {
 193                                         var innerRows = rows[row]['sliceSite'];
 194                                         $("#adv-service-level-dropdown").val(rows[row]['sliceServiceClass']);
 195                                         $("#adv-image-dropdown").val(rows[row]['preferredImage']);
 196                                         $("#adv-dataset-dropdown").val(rows[row]['sliceDataSet']);
 197                                         for (innerRow in innerRows) {
 198                                                 tableData[innerRow] = innerRows[innerRow];
 199                                         }
 200                                 }
 201                         }
 202                         for (row in siteRows) {
 203                                 var entry = siteRows[row]['siteName'];
 204                                 if (!(entry in tableData)) {
 205                                         tableData[siteRows[row]['siteName']] = 0;
 206                                 }
 207                         }
 208                         for (row in tableData) {
 209                                 siteNames.push([row, tableData[row], '<a href="#" class="edit-view">Edit</a>']);
 210                         }
 211                         $("#save-btn").unbind().click(function () {
 212                                 var newTableData = {};
 213                                 var newSite = $(".siteName");
 214                                 var newAllocated = $(".allocated");
 215                                 for (i = 1; i < newSite.length; i++) {
 216                                         newTableData[$($(".siteName")[i]).text()] = parseInt($($(".allocated")[i]).text());
 217                                 }
 218                                 for (newRow in newTableData) {
 219                                         if (newTableData[newRow] > tableData[newRow]) {
 220                                                 $.ajax({
 221                                                         url: '/tenantaddorremsliver/',
 222                                                         dataType: 'json',
 223                                                         data: {
 224                                                                 siteName: newRow,
 225                                                                 count: newTableData[newRow] - tableData[newRow],
 226                                                                 slice: $("#advTenantSliceDropDown").val(),
 227                                                                 actionToDo: "add",
 228                                                                 csrfmiddlewaretoken: "{{ csrf_token }}", // < here
 229                                                                 state: "inactive"
 230                                                         },
 231                                                         type: 'POST',
 232                                                         complete: function () {
 233                                                                 //location.reload();
 234
 235                                                         }
 236                                                 });
 237                                         } else if (newTableData[newRow] < tableData[newRow]) {
 238                                                 $.ajax({
 239                                                         url: '/tenantaddorremsliver/',
 240                                                         dataType: 'json',
 241                                                         data: {
 242                                                                 siteName: newRow,
 243                                                                 count: tableData[newRow] - newTableData[newRow],
 244                                                                 slice: $("#advTenantSliceDropDown").val(),
 245                                                                 actionToDo: "rem",
 246                                                                 csrfmiddlewaretoken: "{{ csrf_token }}", // < here
 247                                                                 state: "inactive"
 248                                                         },
 249                                                         type: 'POST',
 250                                                         complete: function () {
 251                                                                 //location.reload();
 252                                                         }
 253                                                 });
 254                                         }
 255                                 }
 256                                  $.ajax({
 257                                                         url: '/updateslice/',
 258                                                         dataType: 'json',
 259                                                         data: {
 260                                                                 sliceName: $("#advTenantSliceDropDown").val(),
 261                                                                 serviceClass: $("#adv-service-level-dropdown").val(),
 262                                                                 imageName: $("#adv-image-dropdown").val(),
 263                                                                 dataSet: $("#adv-dataset-dropdown").val(),
 264                                                                 networkPorts:  $("#adv-network-value").val(),
 265                                                                 privateVolume: $("#private-vol-checkbox").is(":checked"),
 266                                                                 actionToDo: "update",
 267                                                                 csrfmiddlewaretoken: "{{ csrf_token }}", // < here
 268                                                                 state: "inactive"
 269                                                         },
 270                                                         type: 'POST',
 271                                                         success: function () {
 272                                                                 $("#tabs-5").empty();
 273                                                                 initTenant();    //location.reload();
 274                                                         },
 275                                                           error:function (xhr, textStatus, thrownError){
 276                                                                    errorDialog("Error:", textStatus + " " + xhr.responseText);
 277                                                         }
 278
 279                                                 });
 280
 281                         });
 282                         oTable = $('#advTenantSiteTableData').dataTable({
 283                                 "bJQueryUI": true,
 284                                 "bFilter": false,
 285                                 "bInfo": false,
 286                                 "bLengthChange": false,
 287                                 "bPaginate": false,
 288                                 "aaData": siteNames,
 289                                 "bStateSave": true,
 290                                 "aoColumns": [{
 291                                         "sTitle": "Site Name",
 292                                         sClass: "siteName"
 293                                 }, {
 294                                         "sTitle": "Allocated",
 295                                         sClass: "alignCenter allocated"
 296                                 }, {
 297                                         "sTitle": "Edit",
 298                                         sClass: "alignCenter"
 299                                 }]
 300                         });
 301                         editSliverAdv();
 302                                 $('#advTenantSliceDropDown').on('change', function () {
 303                                         var selectedValue = $("#advTenantSliceDropDown").val();
 304                                         checkForBasicAdvView(selectedValue, rows,imageData,serviceLevelData,siteRows,dataSet);
 305                                 });
 306                 }
 307
 308                 function checkForBasicAdvView(value, rows,imageData,serviceLevelData,siteRows,dataSet) {
 309                         for (row in rows) {
 310                                 if (rows[row]['sliceName'] == value) {
 311                                         if (rows[row]['numOfSites'] > 1) {
 312                                                 advShowSliceData(rows,imageData,serviceLevelData,siteRows,dataSet,value);
 313                                                 downloadSliceInfo(rows,imageData,serviceLevelData,siteRows,dataSet,value);
 314                                                 $("#tenantSliceDataWrapper").css("display","none");
 315                                                 $("#advancedTenantSliceDataWrapper").css("display","block");
 316                                                 $("#advTenantSiteTable").css("display","block");
 317                                                 $("#tenantSiteTable").css("display","none");
 318                                                 $("#sliver-btn").css("display","none");
 319                                                 $("#save-btn").css("display","block");
 320                                                 break;
 321                                         } else if(rows[row]['numOfSites'] <= 1){
 322                                                 showSliceData(rows,imageData,serviceLevelData,siteRows,dataSet,value);
 323                                                 downloadSliceInfo(rows,imageData,serviceLevelData,siteRows,dataSet,value);
 324                                                 $("#tenantSliceDataWrapper").css("display","block");
 325                                                 $("#advancedTenantSliceDataWrapper").css("display","none");
 326                                                 $("#advTenantSiteTable").css("display","none");
 327                                                 $("#tenantSiteTable").css("display","block");
 328                                                 $("#sliver-btn").css("display","block");
 329                                                 $("#save-btn").css("display","none");
 330                                                 break;
 331                                         }break;
 332                                 }
 333                         }
 334                 }
 335
 336                 function UserSliceTable(rows,imageData,serviceLevelData,siteRows,dataSet) {
 337                                 //Add check for #dynamicusersliceinfo_filter label-> input having focus here
 338                                 $("<div></div>").attr('id', 'tenantSliceDataWrapper').appendTo('#tabs-5');
 339                                 $("<div></div>").attr('id', 'advancedTenantSliceDataWrapper').appendTo('#tabs-5');
 340                                 var sliceData = '';
 341                                 sliceData += '<div class="tenant-row public-key-warning"><span class="summary-attr">You have not uploaded your Public Key. <a href="http://{{ request.get_host}}/admin/core/user/{{user.id}}">Click here</a> to upload it now.</span></div><div class="tenant-row"><span class="summary-attr"><b>Slice Name:</b> <span id="slice-name-value"> </span> </span><br></div><div class="tenant-row"><span class="summary-attr"><b>Service Level:</b> <span id="service-level-value"> </span>  </span><br></div><div class="tenant-row"><span class="summary-attr"><b>Image:</b> <span id="slice-image-value"> </span>  </span><br></div><div class="btn btn-high btn-info" id="advanced-tenant">Go to Advanced View</div>';
 342                                 var advSliceData = '';
 343                                 advSliceData += '<div class="tenant-row public-key-warning"><span class="summary-attr">You have not uploaded your Public Key. <a href="http://{{ request.get_host}}/admin/core/user/{{user.id}}">Click here</a> to upload it now.</span></div><div class="adv-tenant-row"><span class="summary-attr"><b>Slice Name:</b> <span id="adv-slice-name-value"> </span> </span><br><br></div><div class="tenant-row"><span class="summary-attr"><b>Service Level:</b> <span id="adv-service-level-value"> </span> <span class="help-inline">Changes are potentially disruptive to existing slivers</span> </span><br></div><div class="tenant-row"><span class="summary-attr"><b>Image:</b> <span id="adv-slice-image-value"> </span><span class="help-inline">Changes are potentially disruptive to existing slivers</span>  </span><br></div><div class="tenant-row"><span class="summary-attr"><b>Network:</b> <input type="text" name="adv-network-value" id="adv-network-value"> <span class="help-inline">List of port ranges(if any) e.g. 1021-1026,1029</span><br></div><div class="tenant-row"><span class="summary-attr"><b>Data Sets:</b> <span id="adv-slice-data-set-value"> </span>  <input type="checkbox" name="checkbox" id="private-vol-checkbox" value="value"><span class="help-inline">Include Private Volume</span></span></div>';
 344                                 $('#tenantSliceDataWrapper').append(sliceData).css("display", "none");
 345                                 $('#advancedTenantSliceDataWrapper').append(advSliceData);
 346                                 $("#advancedTenantSliceDataWrapper").css("display", "none");
 347                                 $("<select></select>").attr('id', 'tenantSliceDropDown').appendTo('#slice-name-value');
 348                                 for (row in rows) {
 349                                         $("#tenantSliceDropDown").append("<option>" + rows[row]['sliceName'] + "</option>");
 350                                 }
 351                                 $("<select></select>").attr('id', 'advTenantSliceDropDown').appendTo('#adv-slice-name-value');
 352                                         for (row in rows) {
 353                                                 $("#advTenantSliceDropDown").append("<option>" + rows[row]['sliceName'] + "</option>");
 354                                         }
 355                                 $("<div></div>").attr('id', 'tenantSiteTable').appendTo('#tabs-5').css("display","none");
 356                                 $("<div></div>").attr('id', 'advTenantSiteTable').appendTo('#tabs-5').css("display", "none");
 357                                 $('<div class="btn btn-success" id="create-slice-btn"><i class="icon-plus-sign icon-white"></i>&nbsp;Create New Slice</div>').appendTo("#tabs-5");
 358                                 $('<div class="btn btn-success" id="delete-slice-btn"><i class="icon-plus-sign icon-white"></i>&nbsp;Delete a Slice</div>').appendTo("#tabs-5");
 359                                 $('<div class="btn btn-high btn-info" id="download-details">Download Slice Details</div>').appendTo("#tabs-5");
 360                                 $('<div class="btn btn-success" id="sliver-btn"><i class="icon-plus-sign icon-white"></i>&nbsp;Add/Remove Slivers</div>').appendTo("#tabs-5");
 361                                 $('<div class="btn btn-high btn-info" id="save-btn">Save</div>').appendTo("#tabs-5").css("display", "none");
 362                                 $("#advanced-tenant").unbind().click(function () {
 363                                         var value = $("#tenantSliceDropDown").val();
 364                                         advShowSliceData(rows,imageData,serviceLevelData,siteRows,dataSet,value);
 365                                                 $("#tenantSliceDataWrapper").css("display","none");
 366                                                 $("#advancedTenantSliceDataWrapper").css("display","block");
 367                                                 $("#advTenantSiteTable").css("display","block");
 368                                                 $("#tenantSiteTable").css("display","none");
 369                                                 $("#sliver-btn").toggle();
 370                                                 $("#save-btn").toggle();
 371
 372                         });
 373                         $("#sliver-btn").click(function () {
 374                                 $("#basic-tooltip").css("display", "none");
 375                                 $("#dialog-form").dialog({
 376                                         autoOpen: false,
 377                                         height: 200,
 378                                         width: 400,
 379                                         modal: true,
 380                                         dialogClass: "tenantDialog",
 381                                         buttons: {
 382                                                 "Add": function () {
 383                                                         $.ajax({
 384                                                                 url: '/tenantaddorremsliver/',
 385                                                                 dataType: 'json',
 386                                                                 data: {
 387                                                                         count: parseInt($("#numOfSlivers").val()),
 388                                                                         slice: $("#tenantSliceDropDown").val(),
 389                                                                         actionToDo: "add",
 390                                                                         csrfmiddlewaretoken: "{{ csrf_token }}", // < here
 391                                                                         state: "inactive"
 392                                                                 },
 393                                                                 type: 'POST',
 394                                                                 beforeSend: function () {
 395                                                                         if (!$("#numOfSlivers").val()) {
 396                                                                                 $("#basic-tooltip").css("display", "block");
 397                                                                                 return false;
 398                                                                         } else {
 399                                                                                 return true;
 400                                                                         }
 401                                                                 },
 402                                                                 success: function () {
 403                                                                         location.reload();
 404 $("#dialog-form").dialog("close");
 405                                                                 }
 406                                                         });
 407                                                 },
 408                                                 Remove: function () {
 409                                                         $.ajax({
 410                                                                 url: '/tenantaddorremsliver/',
 411                                                                 dataType: 'json',
 412                                                                 data: {
 413                                                                         count: parseInt($("#numOfSlivers").val()),
 414                                                                         slice: $("#tenantSliceDropDown").val(),
 415                                                                         actionToDo: "rem",
 416                                                                         csrfmiddlewaretoken: "{{ csrf_token }}", // < here
 417                                                                         state: "inactive"
 418                                                                 },
 419                                                                 type: 'POST',
 420                                                                 beforeSend: function () {
 421                                                                         if (!$("#numOfSlivers").val()) {
 422                                                                                 $("#basic-tooltip").css("display", "block");
 423                                                                                 return false;
 424                                                                         } else {
 425                                                                                 return true;
 426                                                                         }
 427                                                                 },
 428                                                                 success: function () {
 429 $("#dialog-form").dialog("close");
 430 location.reload();
 431
 432                                                                 }
 433                                                         });
 434                                                 }
 435                                         }
 436                                 });
 437                                 $("#dialog-form").dialog("open");
 438                         });
 439                         $("#create-slice-btn").unbind().click(function () {
 440                                 $("#new-service-class").empty();
 441                                 $("#new-image").empty();
 442                                 $("#mount-data-sets").empty();
 443                                 $("#new-network").empty();
 444                                 for (row in serviceLevelData) {
 445                                         $("#new-service-class").append("<option>" + serviceLevelData[row]['serviceClass'] + "</option>");
 446                                 }
 447                                 for (row in imageData) {
 448                                         $("#new-image").append("<option>" + imageData[row]['Image'] + "</option>");
 449                                 }
 450                                 for (row in dataSet) {
 451                                         $("#mount-data-sets").append("<option>" + dataSet[row]['DataSet'] + "</option>");
 452                                 }
 453                                 var nameOfSlice = $("#new-slice-name").val();
 454                                 var nameOfServiceClass = $("#new-service-class").val();
 455                                 var nameOfImage = $("#new-image").val();
 456                                 $("#create-slice-form").dialog({
 457                                         autoOpen: false,
 458                                         height: 400,
 459                                         width: 400,
 460                                         modal: true,
 461                                         dialogClass: "tenantDialog",
 462                                         buttons: {
 463                                                 "Submit": function () {
 464                                                         $.ajax({
 465                                                                 url: '/createnewslice/',
 466                                                                 dataType: 'json',
 467                                                                 data: {
 468                                                                         sliceName: $("#new-slice-name").val(),
 469                                                                         serviceClass: nameOfServiceClass,
 470                                                                         imageName: $("#new-image").val(),
 471                                                                         network: $("#new-network").val(),
 472                                                                         privateVolume: $("#private-vol").is(":checked"),
 473                                                                         mountDataSets: $("#mount-data-sets").val(),
 474                                                                         actionToDo: "add",
 475                                                                         csrfmiddlewaretoken: "{{ csrf_token }}", // < here
 476                                                                         state: "inactive"
 477                                                                 },
 478                                                                 async: false,
 479                                                                 type: 'POST',
 480                                                                 beforeSend: function () {
 481                                                                         if (!$("#new-slice-name").val()) {
 482                                                                                 $("#tooltip").css("display", "block");
 483                                                                                 return false;
 484                                                                         } else {
 485                                                                                 return true;
 486                                                                         }
 487                                                                 },
 488                                                                 success: function () {
 489                                                                         location.reload();
 490                                                                 }
 491                                                         });
 492                                                    $.ajax({
 493                                                                 url: '/tenantaddorremsliver/',
 494                                                                 dataType: 'json',
 495                                                                 data: {
 496                                                                         count: parseInt($("#number-of-slivers").val()),
 497                                                                         slice: $("#new-slice-name").val(),
 498                                                                         actionToDo: "add",
 499                                                                         csrfmiddlewaretoken: "{{ csrf_token }}", // < here
 500                                                                         state: "inactive"
 501                                                                 },
 502                                                                 async: false,
 503                                                                 type: 'POST',
 504                                                                 success: function () {
 505                                                                         location.reload();
 506                                                                 }
 507                                                         });
 508
 509                                                 },
 510                                                 Cancel: function () {
 511                                                         $(this).dialog("close");
 512                                                 }
 513                                         }
 514                                 });
 515                                 $("#create-slice-form").dialog("open");
 516                         });
 517                         $("#delete-slice-btn").unbind().click(function () {
 518                                 $("#delete-slice").empty();
 519                                 for (row in rows) {
 520                                         $("#delete-slice").append("<option>" + rows[row]['sliceName'] + "</option>");
 521                                 }
 522                                 $("#delete-slice-form").dialog({
 523                                         autoOpen: false,
 524                                         height: 200,
 525                                         width: 350,
 526                                         modal: true,
 527                                         dialogClass: "tenantDialog",
 528                                         buttons: {
 529                                                 "Delete": function () {
 530                                                         $.ajax({
 531                                                                 url: '/tenantdeleteslice/',
 532                                                                 dataType: 'json',
 533                                                                 data: {
 534                                                                         sliceName: $("#delete-slice").val(),
 535                                                                         csrfmiddlewaretoken: "{{ csrf_token }}", // < here
 536                                                                         state: "inactive"
 537                                                                 },
 538                                                                 type: 'POST',
 539                                                                 success: function () {
 540                                                                         location.reload();
 541                                                                 },
 542                                                           error:function (xhr, textStatus, thrownError){
 543                                                                    errorDialog("Error:", textStatus + " " + xhr.responseText);
 544                                                         }
 545                                                         });
 546                                                 },
 547                                                 Cancel: function () {
 548                                                         $(this).dialog("close");
 549                                                 }
 550                                         }
 551                                 });
 552                                 $("#delete-slice-form").dialog("open");
 553                         });
 554                 }
 555
 556
 557         function initTenant() {
 558                 jQuery.ajax({
 559                         url: '/tenantview',
 560                         dataType: 'json',
 561                         success: function (data) {
 562                                 var rows = data['userSliceInfo']['rows'];
 563                                 var imageData = data['image']['rows'];
 564                                 //var networkData = data['network']['rows'];
 565                                 var serviceLevelData = data['sliceServiceClass']['rows'];
 566                                 var siteRows = data['sites']['rows'];
 567                                 var dataSet = data['mountDataSets']['rows'];
 568                                 UserSliceTable(rows,imageData,serviceLevelData,siteRows,dataSet);
 569                                 if(!(data['publicKey'])){
 570                                         $(".public-key-warning").css("display","block");
 571                                 }
 572                                 var value = $("#tenantSliceDropDown").val();
 573                                 checkForBasicAdvView(value,rows,imageData,serviceLevelData,siteRows,dataSet);
 574                                 $("#tooltip").css("display", "none");
 575                                 $("#basic-tooltip").css("display", "none");
 576                                 $("#adv-tooltip").css("display", "none");
 577                         },
 578                         complete: function () {}
 579                 });
 580         }
 581
 582         initTenant();
 583 });
 584 </script>
 585
 586 </html>