Amisha's latest changes
authorScott Baker <smbaker@gmail.com>
Tue, 22 Apr 2014 17:17:37 +0000 (10:17 -0700)
committerScott Baker <smbaker@gmail.com>
Tue, 22 Apr 2014 17:17:37 +0000 (10:17 -0700)
planetstack/core/plus/views.py
planetstack/templates/admin/dashboard/tenant.html

index 2b015ef..4e58508 100644 (file)
@@ -63,15 +63,41 @@ class TenantCreateSlice(View):
         serviceClass = request.POST.get("serviceClass", "0")
         imageName = request.POST.get("imageName", "0")
         actionToDo = request.POST.get("actionToDo", "0")
-        print sliceName
+        network = request.POST.get("network","0")
+        mountDataSets = request.POST.get("mountDataSets","0")
         if (actionToDo == "add"):
            serviceClass = ServiceClass.objects.get(name=serviceClass)
            site = request.user.site
            #image = Image.objects.get(name=imageName)
-           newSlice = Slice(name=sliceName,serviceClass=serviceClass,site=site,imagePreference=imageName)
+           newSlice = Slice(name=sliceName,serviceClass=serviceClass,site=site,imagePreference=imageName,mountDataSets=mountDataSets,network=network)
            newSlice.save()
         return newSlice
 
+class TenantUpdateSlice(View):
+    def post(self, request, *args, **kwargs):\r
+        sliceName = request.POST.get("sliceName", "0")\r
+        serviceClass = request.POST.get("serviceClass", "0")\r
+        imageName = request.POST.get("imageName", "0")\r
+        actionToDo = request.POST.get("actionToDo", "0")\r
+        network = request.POST.get("network","0")\r
+        slice = Slice.objects.filter(name = sliceName)\r
+        abc = ServiceClass.objects.get(name=serviceClass)\r
+        if (actionToDo == "update"):\r
+        #       print getattr(slice,'serviceClass',abc)\r
+                setattr(slice,'serviceClass',abc)\r
+        #fields = {'serviceClass':ServiceClass.objects.get(name=serviceClass),\r
+         #         'imagePreference':imageName,\r
+          #        'network':network\r
+           #      }\r
+        #update_slice(sliceName,**fields)\r
+        return HttpResponse("Slice updated")
+
+def  update_slice(sliceName,**fields):
+         slice = Slice.objects.filter(name = sliceName)\r
+         for (k,v) in fields.items():\r
+                setattr(slice, k, v)\r
+                slice.save()\r
+         return slice
 
 def getTenantSliceInfo(user, tableFormat = False):
     tenantSliceDetails = {}
@@ -99,17 +125,21 @@ def getTenantInfo(user):
        slice = Slice.objects.get(name=Slice.objects.get(id=entry.id).name)
        sliceServiceClass = entry.serviceClass.name
        preferredImage =  entry.imagePreference
+       sliceDataSet = entry.mountDataSets
+       sliceNetwork = entry.network
        numSliver = 0
        sliceImage=""
        sliceSite = {}
+       sliceNode = {}
+       sliceInstance= {}
        for sliver in slice.slivers.all():
-            numSliver +=sliver.numberCores
-           # sliceSite[sliver.deploymentNetwork.name] =sliceSite.get(sliver.deploymentNetwork.name,0) + 1
            if sliver.node.site.name in BLESSED_SITES:
                 sliceSite[sliver.node.site.name] = sliceSite.get(sliver.node.site.name,0) + 1
                 sliceImage = sliver.image.name
+                sliceNode[sliver.instance_name] = sliver.name
+       numSliver = sum(sliceSite.values())
        numSites = len(sliceSite)
-       userSliceInfo.append({'sliceName': sliceName,'sliceServiceClass': sliceServiceClass,'preferredImage':preferredImage,'numOfSites':numSites, 'sliceSite':sliceSite,'sliceImage':sliceImage,'numOfSlivers':numSliver})
+       userSliceInfo.append({'sliceName': sliceName,'sliceServiceClass': sliceServiceClass,'preferredImage':preferredImage,'numOfSites':numSites, 'sliceSite':sliceSite,'sliceImage':sliceImage,'numOfSlivers':numSliver,'sliceDataSet':sliceDataSet,'sliceNetwork':sliceNetwork, 'instanceNodePair':sliceNode})
     return userSliceInfo
 
 def getTenantSitesInfo():
@@ -143,7 +173,7 @@ def getImageInfo(user):
     return imageInfo
 
 def getMountDataSets():
-        dataSetList = ['GenBank','LSST','LHC','NOAA','Measurement Lab','Common Crawl']\r
+        dataSetList = ['------','GenBank','LSST','LHC','NOAA','Measurement Lab','Common Crawl']\r
         dataSetInfo = []\r
         for entry in dataSetList:\r
                 dataSetInfo.append({'DataSet':entry})\r
@@ -208,9 +238,10 @@ def getCDNOperatorData(randomizeData = False, wait=True):
 
     rows = bq.get_cached_query_results(bq.compose_latest_query(groupByFields=["%hostname", "event", "%slice"]), wait)
 
-    # if wait==False, then we could have no rows yet
+    # wait=False on the first time the Dashboard is opened. This means we might
+    # not have any rows yet. The dashboard code polls every 30 seconds, so it
+    # will eventually pick them up.
 
-    stats_rows = {}
     if rows:
         rows = bq.postprocess_results(rows, filter={"slice": HPC_SLICE_NAME}, maxi=["cpu"], count=["hostname"], computed=["bytes_sent/elapsed"], groupBy=["Time","site"], maxDeltaTime=80)
 
@@ -218,6 +249,8 @@ def getCDNOperatorData(randomizeData = False, wait=True):
         stats_rows = {}
         for row in rows:
             stats_rows[row["site"]] = row
+    else:
+        stats_rows = {}
 
     slice = Slice.objects.get(name=HPC_SLICE_NAME)
     slice_slivers = list(slice.slivers.all())
index 24db6c4..6fedd6c 100644 (file)
@@ -1,17 +1,11 @@
 <!doctype html>
-<style>
-#tenantSliceDataWrapper {
-       padding: 1% 0;
-}
-</style>
 <script type="text/javascript" src="http://www.google.com/jsapi"></script>
-<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">
-<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
 <div id="dialog-form" title="Add/Remove Slivers" style="display: none;">
        <form>
                <fieldset>
                        <label for="numberOfSlivers">Number of Slivers</label>
                        <input type="text" name="numberOfSlivers" id="numOfSlivers" class="text ui-widget-content ui-corner-all">
+                       <div id=basic-tooltip>Please enter number of slivers</div>
                </fieldset>
        </form>
 </div>
@@ -20,6 +14,7 @@
                <fieldset>
                        <label for="numberOfSlivers">Number of Slivers</label>
                        <input type="text" name="numberOfSlivers" id="advNumOfSlivers" class="text ui-widget-content ui-corner-all">
+                       <div id=adv-tooltip>Please enter number of slivers</div>
                </fieldset>
        </form>
 </div>
                <fieldset>
                        <div class="create-slice-row">
                                <label for="new-slice-name">Name</label>
-                               <input type="text" name="new-slice-name" id="new-slice-name" class="text">
+                               <input type="text" name="new-slice-name" id="new-slice-name" class="text tenant-create-slice">
                        </div>
                        <div class="create-slice-row">
                                <label for="new-service-class">Service Class</label>
-                               <select id="new-service-class"></select>
+                               <select id="new-service-class" class="tenant-create-slice"></select>
                        </div>
                        <div class="create-slice-row">
                                <label for="new-image">Image</label>
-                               <select id="new-image"></select>
+                               <select id="new-image" class="tenant-create-slice"></select>
                        </div>
+                       <div class="create-slice-row">
+                                <label for="new-network">Network</label>
+                                <select id="new-network" class="tenant-create-slice"></select>
+                        </div>
+                       <div class="create-slice-row">
+                                <label for="mount-data-sets">Data Sets</label>
+                                <select id="mount-data-sets" class="tenant-create-slice"></select>
+                        </div>
+                       <div class="create-slice-row">
+                                <label for="number-of-slivers">Number Of Slivers</label>
+                                <input type="text" name="number-of-slivers" id="number-of-slivers" class="text tenant-create-slice">
+                        </div>
                        <div id=tooltip>Slice Name cannot be empty</div>
                </fieldset>
        </form>
 </div>
+<div id="delete-slice-form" title="Delete a  Slice" style="display: none;">
+       <form>
+               <fieldset>
+                       <div class="create-slice-row">
+                               <label for="delete-slice">Choose a Slice</label>
+                               <select id="delete-slice"></select>
+                       </div>
+               </fieldset>
+       </form>
+</div>
 <script type="text/javascript">
-google.load('visualization', '1', {
-       'packages': ['controls', 'table', 'corechart', 'geochart']
-});
-</script>
-<script>
-$(document).ready(function () {
-       function showSliceData(data) {
-               var value = $("#tenantSliceDropDown").val();
-               var imageData = data['image']['rows'];
-               var networkData = data['network']['rows'];
-               $("#service-level-value").empty();
-               $("#slice-image-value").empty();
-               $("#tenantSiteTable").empty();
-               $('#tenantSiteTable').html('<table cellpadding="0" cellspacing="0" border="0" class="display" id="tenantSiteTableData"></table>');
-               var rows = data['userSliceInfo']['rows'];
-               var siteNames = [];
-               var sliverCount;
-               for (row in rows) {
-                       if (rows[row]['sliceName'] == value) {
-                               sliceImageData = rows[row]['sliceImage'];
-                               $("#slice-image-value").html(sliceImageData);
-                               serviceLevelData = rows[row]['sliceServiceClass'];
-                               $("#service-level-value").html(serviceLevelData);
-                               var innerRows = rows[row]['sliceSite'];
-                               for (innerRow in innerRows) {
-                                       sliverCount = innerRows[innerRow];
-                                       siteNames.push([innerRow, sliverCount]);
+       google.load('visualization', '1', {
+               'packages': ['controls', 'table', 'corechart', 'geochart']
+       });
+       </script>
+       <script>
+       $(document).ready(function () {
+               function showSliceData(data,value) {
+                       var imageData = data['image']['rows'];
+                       var networkData = data['network']['rows'];
+                       $("#service-level-value").empty();
+                       $("#slice-image-value").empty();
+                       $("#tenantSiteTable").empty();
+                       $('#tenantSiteTable').html('<table cellpadding="0" cellspacing="0" border="0" class="display" id="tenantSiteTableData"></table>');
+                       $("#tenantSliceDropDown").val(value);
+                       var rows = data['userSliceInfo']['rows'];
+                       var siteNames = [];
+                       var sliverCount;
+                       for (row in rows) {
+                               if (rows[row]['sliceName'] == value) {
+                                       sliceImageData = rows[row]['preferredImage'];
+                                       $("#slice-image-value").html(sliceImageData);
+                                       serviceLevelData = rows[row]['sliceServiceClass'];
+                                       $("#service-level-value").html(serviceLevelData);
+                                       var innerRows = rows[row]['sliceSite'];
+                                       for (innerRow in innerRows) {
+                                               sliverCount = innerRows[innerRow];
+                                               siteNames.push([innerRow, sliverCount]);
+                                       }
                                }
                        }
+                       oTable = $('#tenantSiteTableData').dataTable({
+                               "bJQueryUI": true,
+                               "bFilter": false,
+                               "bInfo": false,
+                               "bLengthChange": false,
+                               "aaData": siteNames,
+                               "bStateSave": true,
+                               "aoColumns": [{
+                                               "sTitle": "Site Name"
+                                       }, {
+                                               "sTitle": "Allocated",
+                                               sClass: "alignCenter"
+                                       }
+                                       //{ "sTitle": "Allocated" , sClass: "alignCenter"},
+                                       //{ "sTitle": "Desired" , sClass: "alignCenter"},
+                               ]
+                       });
+                               $('#tenantSliceDropDown').on('change', function () {
+                                       var value = $("#tenantSliceDropDown").val();
+       //alert(value);
+                                       checkForBasicAdvView(value, data);
+                               });
                }
-               oTable = $('#tenantSiteTableData').dataTable({
-                       "bJQueryUI": true,
-                       "bFilter": false,
-                       "bInfo": false,
-                       "bLengthChange": false,
-                       "aaData": siteNames,
-                       "bStateSave": true,
-                       "aoColumns": [{
-                                       "sTitle": "Site Name"
-                               }, {
-                                       "sTitle": "Allocated",
-                                       sClass: "alignCenter"
-                               }
-                               //{ "sTitle": "Allocated" , sClass: "alignCenter"},
-                               //{ "sTitle": "Desired" , sClass: "alignCenter"},
-                       ]
-               });
-       }
 
-       function initTenant() {
-               jQuery.ajax({
-                       url: '/tenantview',
-                       dataType: 'json',
-                       success: function (data) {
-                               UserSliceTable(data);
-                               showSliceData(data);
-                               $("#tooltip").css("display", "none");
-                       },
-                       complete: function () {}
-               });
+               function downloadSliceInfo(data,value){
+                        $("#download-details").unbind().click(function(){
+                                                function download(filename, text) {
+                                               var sliceDetails = document.createElement('a');
+                                               sliceDetails.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
+                                               sliceDetails.setAttribute('download', filename);
+                                               sliceDetails.click();
+                                       }
+                                       var rows = data['userSliceInfo']['rows'];
+                                       var sliceInfo;
+                                       for (row in rows){
+                                               if(rows[row]['sliceName']==value){
+                                                       sliceInfo = "Slice Name: "+rows[row]['sliceName']+"\nNumber of Slivers: "+rows[row]['numOfSlivers']+"\nService Level: "+rows[row]['sliceServiceClass']+"\nImage: "+rows[row]['sliceImage']+"\n";        
+                                               for (instanceNodePairs in rows[row]['instanceNodePair']){
+                                                       sliceInfo += instanceNodePairs+"@"+rows[row]['instanceNodePair'][instanceNodePairs]+"\n";
+                                               }
+                                               }
+                                       }
+                                       download('slice.txt', sliceInfo);
+                          });
+               }
+               function editSliverAdv() {
+                       $(".edit-view").click(function () {
+                               var allocatedSlivers = parseInt($(this).parent().siblings(".allocated").html());
+                               var td = $(this).parent().siblings(".allocated");
+                               var pos = oTable.fnGetPosition(td[0]);
+                               $("#adv-tooltip").css("display", "none");
+                               $("#numOfSlivers").empty();
+                               $("#adv-dialog-form").dialog({
+                                       autoOpen: false,
+                                       height: 200,
+                                       width: 350,
+                                       modal: true,
+                                       dialogClass: "tenantDialog",
+                                       buttons: {
+                                               "Add": function () {
+                                                       allocatedSlivers += parseInt($("#advNumOfSlivers").val());
+                                                       //if (!(parseInt($("#numOfSlivers").val()))) {
+                                                               $("#adv-tooltip").css("display", "block");
+                                                       //} else {
+                                                               $(this).dialog("close");
+                                                               td.html(allocatedSlivers);
+                                                       //}
+                                               },
+                                               "Remove": function () {
+                                                       allocatedSlivers -= parseInt($("#advNumOfSlivers").val());
+                                               //      if (!(parseInt($("#numOfSlivers").val()))) {
+                                                               $("#adv-tooltip").css("display", "block");
+                                               //      } else {
+                                                               $(this).dialog("close");
+                                                               td.html(allocatedSlivers);
+                                               //      }
+                                               }
+                                       }
+                               });
+                               $("#adv-dialog-form").dialog("open");
+                       });
+               }
 
-               function UserSliceTable(data) {
-                       //Add check for #dynamicusersliceinfo_filter label-> input having focus here
+               function advShowSliceData(data,value) {
+                       var serviceLevelData = data['sliceServiceClass']['rows'];
+                       var imageData = data['image']['rows'];
+                       var networkData = data['network']['rows'];
+                       var siteRows = data['sites']['rows'];
+                       var dataSet = data['mountDataSets']['rows'];
+                       $("#adv-service-level-value").empty();
+                       $("#adv-slice-image-value").empty();
+                       $("#adv-slice-data-set-value").empty();
+                       $("#adv-slice-network-value").empty();
+                       $("#advTenantSliceDropDown").val(value);
+                       $("<select></select>").attr('id', 'adv-service-level-dropdown').appendTo('#adv-service-level-value');
+                       $("<select></select>").attr('id', 'adv-image-dropdown').appendTo('#adv-slice-image-value');
+                       $("<select></select>").attr('id', 'adv-network-dropdown').appendTo('#adv-slice-network-value');
+                       $("<select></select>").attr('id', 'adv-dataset-dropdown').appendTo('#adv-slice-data-set-value');
+                       $('#advTenantSiteTable').html('<table cellpadding="0" cellspacing="0" border="0" class="display" id="advTenantSiteTableData"></table>');
                        var rows = data['userSliceInfo']['rows'];
-                       $("<div></div>").attr('id', 'tenantSliceDataWrapper').appendTo('#tabs-5');
-                       $("<div></div>").attr('id', 'advancedTenantSliceDataWrapper').appendTo('#tabs-5');
-                       var sliceData = '';
-                       sliceData += '<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>';
-                       var advSliceData = '';
-                       advSliceData += '<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><br></div><div class="tenant-row"><span class="summary-attr"><b>Image:</b> <span id="adv-slice-image-value"> </span>  </span><br></div><div class="tenant-row"><span class="summary-attr"><b>Network:</b> <span id="adv-slice-network-value"> </span>  </span></div><div class="btn btn-high btn-info" id="basic-tenant">Go to Basic View</div>';
-                       $('#tenantSliceDataWrapper').append(sliceData);
-                       $('#advancedTenantSliceDataWrapper').append(advSliceData);
-                       $("#advancedTenantSliceDataWrapper").css("display", "none");
-                       $("<select></select>").attr('id', 'tenantSliceDropDown').appendTo('#slice-name-value');
+                       var siteNames = [];
+                       var sliverCount;
+                       var tableData = {};
+                       for (row in serviceLevelData) {
+                                $("#adv-service-level-dropdown").append("<option>" + serviceLevelData[row]['serviceClass'] + "</option>");
+                        }
+                        for (row in imageData) {
+                                $("#adv-image-dropdown").append("<option>" + imageData[row]['Image'] + "</option>");
+                        }
+                        for (row in networkData) {
+                                $("#adv-network-dropdown").append("<option>" + networkData[row]['Network'] + "</option>");
+                        }
+                        for (row in dataSet) {
+                                $("#adv-dataset-dropdown").append("<option>" + dataSet[row]['DataSet'] + "</option>");
+                        }
+
                        for (row in rows) {
-                               $("#tenantSliceDropDown").append("<option>" + rows[row]['sliceName'] + "</option>");
+                               if (rows[row]['sliceName'] == value) {
+                                       var innerRows = rows[row]['sliceSite'];
+                                       $("#adv-service-level-dropdown").val(rows[row]['sliceServiceClass']);
+                                       $("#adv-image-dropdown").val(rows[row]['preferredImage']);
+                                       $("#adv-dataset-dropdown").val(rows[row]['sliceDataSet']);
+                                       $("#adv-network-dropdown").val(rows[row]['sliceNetwork']);
+                                       for (innerRow in innerRows) {
+                                               tableData[innerRow] = innerRows[innerRow];
+                                       }
+                               }
                        }
-                       $("<div></div>").attr('id', 'tenantSiteTable').appendTo('#tabs-5');
-                       $("<div></div>").attr('id', 'advTenantSiteTable').appendTo('#tabs-5').css("display", "none");
-                       $('<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");
-                       $('<div class="btn btn-success" id="sliver-btn"><i class="icon-plus-sign icon-white"></i>&nbsp;Add/Remove Slivers</div>').appendTo("#tabs-5");
-                       $('<div class="btn btn-high btn-info" id="save-btn">Save</div>').appendTo("#tabs-5").css("display", "none");
-                       $('#tenantSliceDropDown').on('change', function () {
-                               showSliceData(data);
-                       });
-                       $("#advanced-tenant").click(function () {
-                               var selectedValue = $("#tenantSliceDropDown").val();
-                               $("#tenantSliceDataWrapper").toggle();
-                               $("#advancedTenantSliceDataWrapper").toggle();
-                               $("#advTenantSiteTable").toggle();
-                               $("#tenantSiteTable").toggle();
-                               $("#sliver-btn").toggle();
-                               $("#save-btn").toggle();
-                               //$('#adv-slice-name-value').empty();
-                               $("<select></select>").attr('id', 'advTenantSliceDropDown').appendTo('#adv-slice-name-value');
-                               for (row in rows) {
-                                       $("#advTenantSliceDropDown").append("<option>" + rows[row]['sliceName'] + "</option>");
+                       for (row in siteRows) {
+                               var entry = siteRows[row]['siteName'];
+                               if (!(entry in tableData)) {
+                                       tableData[siteRows[row]['siteName']] = 0;
                                }
-                               $("#advTenantSliceDropDown").val(selectedValue);
-                               advShowSliceData(data);
-                               editSliverAdv();
+                       }
+                       for (row in tableData) {
+                               siteNames.push([row, tableData[row], '<a href="#" class="edit-view">Edit</a>']);
+                       }
+                       $("#save-btn").unbind().click(function () {
+                               var newTableData = {};
+                               var newSite = $(".siteName");
+                               var newAllocated = $(".allocated");
+                               for (i = 1; i < newSite.length; i++) {
+                                       newTableData[$($(".siteName")[i]).text()] = parseInt($($(".allocated")[i]).text());
+                               }
+                               for (newRow in newTableData) {
+                                       if (newTableData[newRow] > tableData[newRow]) {
+                                               $.ajax({
+                                                       url: '/tenantaddorremsliver/',
+                                                       dataType: 'json',
+                                                       data: {
+                                                               siteName: newRow,
+                                                               count: newTableData[newRow] - tableData[newRow],
+                                                               slice: $("#advTenantSliceDropDown").val(),
+                                                               actionToDo: "add",
+                                                               csrfmiddlewaretoken: "{{ csrf_token }}", // < here 
+                                                               state: "inactive"
+                                                       },
+                                                       type: 'POST',
+                                                       complete: function () {
+                                                                //oTable.fnReloadAjax();
+                                                               location.reload();
+                                                        }
+                                               });
+                                       } else if (newTableData[newRow] < tableData[newRow]) {
+                                               $.ajax({
+                                                       url: '/tenantaddorremsliver/',
+                                                       dataType: 'json',
+                                                       data: {
+                                                               siteName: newRow,
+                                                               count: tableData[newRow] - newTableData[newRow],
+                                                               slice: $("#advTenantSliceDropDown").val(),
+                                                               actionToDo: "rem",
+                                                               csrfmiddlewaretoken: "{{ csrf_token }}", // < here
+                                                               state: "inactive"
+                                                       },
+                                                       type: 'POST',
+                                                       complete: function () {
+                                                               // oTable.fnReloadAjax();
+                                                               location.reload();
+                                                        }
+                                               });
+                                       }
+                               }
+                                $.ajax({
+                                                        url: '/updateslice/',
+                                                        dataType: 'json',
+                                                        data: {
+                                                                sliceName: $("#advTenantSliceDropDown").val(),
+                                                               serviceClass: $("#adv-service-level-dropdown").val(),
+                                                               imageName: $("#adv-image-dropdown").val(),
+                                                               network: $("#adv-network-dropdown").val(),
+                                                                actionToDo: "update",
+                                                                csrfmiddlewaretoken: "{{ csrf_token }}", // < here
+                                                                state: "inactive"
+                                                        },
+                                                        type: 'POST',
+                                                        complete: function () {
+                                                                //oTable.fnReloadAjax();
+                                                                location.reload();
+                                                        }
+                                                });
+
+                       });
+                       oTable = $('#advTenantSiteTableData').dataTable({
+                               "bJQueryUI": true,
+                               "bFilter": false,
+                               "bInfo": false,
+                               "bLengthChange": false,
+                               "bPaginate": false,
+                               "aaData": siteNames,
+                               "bStateSave": true,
+                               "aoColumns": [{
+                                       "sTitle": "Site Name",
+                                       sClass: "siteName"
+                               }, {
+                                       "sTitle": "Allocated",
+                                       sClass: "alignCenter allocated"
+                               }, {
+                                       "sTitle": "Edit",
+                                       sClass: "alignCenter"
+                               }]
+                       });
+                       editSliverAdv();
                                $('#advTenantSliceDropDown').on('change', function () {
-                                       advShowSliceData(data);
-                                       editSliverAdv();
+       var selectedValue = $("#advTenantSliceDropDown").val();
+       //alert(selectedValue);
+                                       checkForBasicAdvView(selectedValue, data);
+                                       //editSliverAdv();
                                });
+               }
 
-                               function editSliverAdv() {
-                                       $(".edit-view").click(function () {
-                                               var allocatedSlivers = parseInt($(this).parent().siblings(".allocated").html());
-                                               var td = $(this).parent().siblings(".allocated");
-                                               var pos = oTable.fnGetPosition(td[0]);
-                                               $("#adv-dialog-form").dialog({
-                                                       autoOpen: false,
-                                                       height: 200,
-                                                       width: 350,
-                                                       modal: true,
-                                                       buttons: {
-                                                               "Add": function () {
-                                                                       allocatedSlivers += parseInt($("#advNumOfSlivers").val());
-                                                                       $(this).dialog("close");
-                                                                       td.html(allocatedSlivers);
-                                                               },
-                                                               "Remove": function () {
-                                                                       allocatedSlivers -= parseInt($("#advNumOfSlivers").val());
-                                                                       $(this).dialog("close");
-                                                                       td.html(allocatedSlivers);
-                                                               }
-                                                       }
-                                               });
-                                               $("#adv-dialog-form").dialog("open");
-                                       });
+               function checkForBasicAdvView(value, data) {
+                       var rows = data['userSliceInfo']['rows'];
+                       for (row in rows) {
+                               if (rows[row]['sliceName'] == value) {
+                                       if (rows[row]['numOfSites'] > 1) {
+                                               advShowSliceData(data,value);
+                                               downloadSliceInfo(data,value);
+                                               $("#tenantSliceDataWrapper").css("display","none");
+                                               $("#advancedTenantSliceDataWrapper").css("display","block");
+                                               $("#advTenantSiteTable").css("display","block");
+                                               $("#tenantSiteTable").css("display","none");
+                                               $("#sliver-btn").css("display","none");
+                                               $("#save-btn").css("display","block");
+                                               break;
+                                       } else if(rows[row]['numOfSites'] <= 1){
+                                               showSliceData(data,value);
+                                               downloadSliceInfo(data,value);
+                                               //editSliverAdv();
+                                               $("#tenantSliceDataWrapper").css("display","block");
+                                               $("#advancedTenantSliceDataWrapper").css("display","none");
+                                               $("#advTenantSiteTable").css("display","none");
+                                               $("#tenantSiteTable").css("display","block");
+                                               $("#sliver-btn").css("display","block");
+                                                $("#save-btn").css("display","none");
+                                               break;
+                                       }break;
                                }
+                       }
+               }
 
-                               function advShowSliceData(data) {
-                                       var value = $("#advTenantSliceDropDown").val();
-                                       var serviceLevelData = data['sliceServiceClass']['rows'];
-                                       var imageData = data['image']['rows'];
-                                       var networkData = data['network']['rows'];
-                                       var siteRows = data['sites']['rows'];
-                                       $("#adv-service-level-value").empty();
-                                       $("#adv-slice-image-value").empty();
-                                       $("#adv-slice-network-value").empty();
-                                       $("<select></select>").attr('id', 'adv-service-level-dropdown').appendTo('#adv-service-level-value');
-                                       $("<select></select>").attr('id', 'adv-image-dropdown').appendTo('#adv-slice-image-value');
-                                       $("<select></select>").attr('id', 'adv-network-dropdown').appendTo('#adv-slice-network-value');
-                                       $('#advTenantSiteTable').html('<table cellpadding="0" cellspacing="0" border="0" class="display" id="advTenantSiteTableData"></table>');
-                                       var rows = data['userSliceInfo']['rows'];
-                                       var siteNames = [];
-                                       var sliverCount;
-                                       var tableData = {};
+               function UserSliceTable(data) {
+                               //Add check for #dynamicusersliceinfo_filter label-> input having focus here
+                               var rows = data['userSliceInfo']['rows'];
+                               $("<div></div>").attr('id', 'tenantSliceDataWrapper').appendTo('#tabs-5');
+                               $("<div></div>").attr('id', 'advancedTenantSliceDataWrapper').appendTo('#tabs-5');
+                               var sliceData = '';
+                               sliceData += '<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>';
+                               var advSliceData = '';
+                               advSliceData += '<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> <span id="adv-slice-network-value"> </span>  <span class="help-inline">Changes are potentially disruptive to existing slivers</span></span></div><div class="tenant-row"><span class="summary-attr"><b>Data Sets:</b> <span id="adv-slice-data-set-value"> </span>  </span></div>';
+                               $('#tenantSliceDataWrapper').append(sliceData).css("display", "none");
+                               $('#advancedTenantSliceDataWrapper').append(advSliceData);
+                               $("#advancedTenantSliceDataWrapper").css("display", "none");
+                               $("<select></select>").attr('id', 'tenantSliceDropDown').appendTo('#slice-name-value');
+                               for (row in rows) {
+                                       $("#tenantSliceDropDown").append("<option>" + rows[row]['sliceName'] + "</option>");
+                               }
+                               $("<select></select>").attr('id', 'advTenantSliceDropDown').appendTo('#adv-slice-name-value');
                                        for (row in rows) {
-                                               if (rows[row]['sliceName'] == value) {
-                                                       var innerRows = rows[row]['sliceSite'];
-                                                       for (innerRow in innerRows) {
-                                                               tableData[innerRow] = innerRows[innerRow];
-                                                       }
-                                               }
+                                               $("#advTenantSliceDropDown").append("<option>" + rows[row]['sliceName'] + "</option>");
                                        }
-                                       for (row in siteRows) {
-                                               var entry = siteRows[row]['siteName'];
-                                               if (!(entry in tableData)) {
-                                                       tableData[siteRows[row]['siteName']] = 0;
-                                               }
-                                       }
-                                       for (row in tableData) {
-                                               siteNames.push([row, tableData[row], '<a href="#" class="edit-view">Edit</a>']);
-                                       }
-                                        $("#save-btn").click(function () {
-                                                       var newTableData={};
-                                                       var newSite = $(".siteName");
-                                                       var newAllocated = $(".allocated");
-                                                       for(i=1; i<newSite.length; i++){
-                                                               newTableData[$($(".siteName")[i]).text()]=$($(".allocated")[i]).text();
-                                                       }
-                                                       for(newRow in newTableData){
-                                                               if(newTableData[newRow] > tableData[newRow]){
-                                                                       $.ajax({
-                                                                                       url : '/tenantaddorremsliver/',
-                                                                               dataType : 'json',
-                                                                               data: {
-                                                                                       siteName: newRow,
-                                                                                       count : newTableData[newRow] - tableData[newRow],
-                                                                                       slice : $("#advTenantSliceDropDown").val(),
-                                                                                       actionToDo: "add",
-                                                                                       csrfmiddlewaretoken: "{{ csrf_token }}",   // < here
-                                                                                       state:"inactive" },
-                                                                               type : 'POST',
-                                                                               complete:function(){
-                                                                                       location.reload();
-                                                                               }
-                                                                       });
-                                                               }
-                                                               else if(newTableData[newRow] < tableData[newRow]){
-                                                                       $.ajax({
-                                                                                url : '/tenantaddorremsliver/',
-                                                                                dataType : 'json',
-                                                                                data: {
-                                                                                        siteName: newRow,
-                                                                                        count : tableData[newRow] - newTableData[newRow],
-                                                                                        slice : $("#advTenantSliceDropDown").val(),
-                                                                                actionToDo: "rem",
-                                                                                csrfmiddlewaretoken: "{{ csrf_token }}",   // < here
-                                                                                state:"inactive" },
-                                                                                type : 'POST',
-                                                                                complete:function(){
-                                                                                        location.reload();
-                                                                                }
-                                                                        });
-                                                                }
+                               $("<div></div>").attr('id', 'tenantSiteTable').appendTo('#tabs-5').css("display","none");
+                               $("<div></div>").attr('id', 'advTenantSiteTable').appendTo('#tabs-5').css("display", "none");
+                               $('<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");
+                               $('<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");
+                               $('<div class="btn btn-high btn-info" id="download-details">Download Slice Details</div>').appendTo("#tabs-5");
+                               $('<div class="btn btn-success" id="sliver-btn"><i class="icon-plus-sign icon-white"></i>&nbsp;Add/Remove Slivers</div>').appendTo("#tabs-5");
+                               $('<div class="btn btn-high btn-info" id="save-btn">Save</div>').appendTo("#tabs-5").css("display", "none");
+                               $("#advanced-tenant").click(function () {
+                                       var value = $("#advTenantSliceDropDown").val();
+                                       advShowSliceData(data,value);
+                                                $("#tenantSliceDataWrapper").css("display","none");
+                                                $("#advancedTenantSliceDataWrapper").css("display","block");
+                                                $("#advTenantSiteTable").css("display","block");
+                                                $("#tenantSiteTable").css("display","none");
+                                                $("#sliver-btn").toggle();
+                                                $("#save-btn").toggle();
 
-                                                       }
-                                       });
-                                       oTable = $('#advTenantSiteTableData').dataTable({
-                                               "bJQueryUI": true,
-                                               "bFilter": false,
-                                               "bInfo": false,
-                                               "bLengthChange": false,
-                                               "bPaginate": false,
-                                               "aaData": siteNames,
-                                               "bStateSave": true,
-                                               "aoColumns": [{
-                                                       "sTitle": "Site Name",
-                                                       sClass: "siteName"
-                                               }, {
-                                                       "sTitle": "Allocated",
-                                                       sClass: "alignCenter allocated"
-                                               }, {
-                                                       "sTitle": "Edit",
-                                                       sClass: "alignCenter"
-                                               }]
-                                       });
-                                       for (row in serviceLevelData) {
-                                               $("#adv-service-level-dropdown").append("<option>" + serviceLevelData[row]['serviceClass'] + "</option>");
-                                       }
-                                       for (row in imageData) {
-                                               $("#adv-image-dropdown").append("<option>" + imageData[row]['Image'] + "</option>");
-                                       }
-                                       for (row in networkData) {
-                                               $("#adv-network-dropdown").append("<option>" + networkData[row]['Network'] + "</option>");
-                                       }
-                               }
-                       });
-                       $("#basic-tenant").click(function () {
-                               $("#tenantSliceDataWrapper").toggle();
-                               $("#advancedTenantSliceDataWrapper").toggle();
-                               $("#advTenantSiteTable").toggle();
-                               $("#tenantSiteTable").toggle();
-                               $("#sliver-btn").toggle();
-                               $("#save-btn").toggle();
+                               //$("#advTenantSliceDropDown").val(selectedValue);
+                               //advShowSliceData(data);
+                               //editSliverAdv();
                        });
                        $("#sliver-btn").click(function () {
+                               $("#numOfSlivers").empty();
+                               $("#basic-tooltip").css("display", "none");
                                $("#dialog-form").dialog({
                                        autoOpen: false,
                                        height: 200,
                                        width: 350,
                                        modal: true,
+                                       dialogClass: "tenantDialog",
                                        buttons: {
-                                                "Add": function () {
-                                                        delta = parseInt($("#numOfSlivers").val());
-                                                        $(this).dialog("close");
-                                                        $.ajax({
-                                                                url : '/tenantaddorremsliver/',
-                                                                dataType : 'json',
-                                                                data: {
-                                                                        count : delta,
-                                                                        slice : $("#tenantSliceDropDown").val(),
-                                                                        actionToDo: "add",
-                                                                        csrfmiddlewaretoken: "{{ csrf_token }}",   // < here
-                                                                        state:"inactive" },
-                                                                type : 'POST',
-                                                                complete:function(){
-                                                                        location.reload();
-                                                                }
-                                                         });
-                                                },
-                                                "Remove": function () {
-                                                        delta = parseInt($("#numOfSlivers").val());
-                                                        $(this).dialog("close");
-                                                        $.ajax({
-                                                                url : '/tenantaddorremsliver/',
-                                                                dataType : 'json',
-                                                                data: {
-                                                                        count : delta,
-                                                                        slice : $("#tenantSliceDropDown").val(),
-                                                                        actionToDo: "rem",
-                                                                        csrfmiddlewaretoken: "{{ csrf_token }}",   // < here
-                                                                        state:"inactive" },
-                                                                type : 'POST',
-                                                                complete:function(){
-                                                                        location.reload();
-                                                                }
-                                                         });
-                                                },
-                                               Cancel: function () {
-                                                       $(this).dialog("close");
+                                               "Add": function () {
+                                                       $.ajax({
+                                                               url: '/tenantaddorremsliver/',
+                                                               dataType: 'json',
+                                                               data: {
+                                                                       count: parseInt($("#numOfSlivers").val()),
+                                                                       slice: $("#tenantSliceDropDown").val(),
+                                                                       actionToDo: "add",
+                                                                       csrfmiddlewaretoken: "{{ csrf_token }}", // < here 
+                                                                       state: "inactive"
+                                                               },
+                                                               type: 'POST',
+                                                               beforeSend: function () {
+                                                                       if (!$("#numOfSlivers").val()) {
+                                                                               $("#basic-tooltip").css("display", "block");
+                                                                               return false;
+                                                                       } else {
+                                                                               return true;
+                                                                       }
+                                                               },
+                                                               complete: function () {
+                                                                       location.reload();
+                                                               }
+                                                       });
+                                               },
+                                               Remove: function () {
+                                                       $.ajax({
+                                                               url: '/tenantaddorremsliver/',
+                                                               dataType: 'json',
+                                                               data: {
+                                                                       count: parseInt($("#numOfSlivers").val()),
+                                                                       slice: $("#tenantSliceDropDown").val(),
+                                                                       actionToDo: "rem",
+                                                                       csrfmiddlewaretoken: "{{ csrf_token }}", // < here
+                                                                       state: "inactive"
+                                                               },
+                                                               type: 'POST',
+                                                               beforeSend: function () {
+                                                                       if (!$("#numOfSlivers").val()) {
+                                                                               $("#basic-tooltip").css("display", "block");
+                                                                               return false;
+                                                                       } else {
+                                                                               return true;
+                                                                       }
+                                                               },
+                                                               complete: function () {
+                                                                       location.reload();
+                                                               }
+                                                       });
                                                }
                                        }
                                });
                                $("#dialog-form").dialog("open");
                        });
-                       $("#create-slice-btn").click(function () {
+                       $("#create-slice-btn").unbind().click(function () {
                                var serviceLevelData = data['sliceServiceClass']['rows'];
                                var imageData = data['image']['rows'];
+                               var dataSet = data['mountDataSets']['rows'];
+                               var networkData = data['network']['rows'];
+                               $("#new-service-class").empty();
+                               $("#new-image").empty();
+                               $("#mount-data-sets").empty();
+                               $("#new-network").empty();
                                for (row in serviceLevelData) {
                                        $("#new-service-class").append("<option>" + serviceLevelData[row]['serviceClass'] + "</option>");
                                }
                                for (row in imageData) {
                                        $("#new-image").append("<option>" + imageData[row]['Image'] + "</option>");
                                }
+                               for (row in dataSet) {
+                                        $("#mount-data-sets").append("<option>" + dataSet[row]['DataSet'] + "</option>");
+                                }
+                               for (row in networkData) {
+                                        $("#new-network").append("<option>" + networkData[row]['Network'] + "</option>");
+                                }
                                var nameOfSlice = $("#new-slice-name").val();
                                var nameOfServiceClass = $("#new-service-class").val();
                                var nameOfImage = $("#new-image").val();
                                $("#create-slice-form").dialog({
                                        autoOpen: false,
-                                       height: 300,
-                                       width: 350,
+                                       height: 400,
+                                       width: 400,
                                        modal: true,
+                                       dialogClass: "tenantDialog",
                                        buttons: {
                                                "Submit": function () {
                                                        $.ajax({
@@ -368,11 +494,14 @@ $(document).ready(function () {
                                                                data: {
                                                                        sliceName: $("#new-slice-name").val(),
                                                                        serviceClass: nameOfServiceClass,
-                                                                       imageName: nameOfImage,
+                                                                       imageName: $("#new-image").val(),
+                                                                       network: $("#new-network").val(),
+                                                                       mountDataSets: $("#mount-data-sets").val(),
                                                                        actionToDo: "add",
                                                                        csrfmiddlewaretoken: "{{ csrf_token }}", // < here 
                                                                        state: "inactive"
                                                                },
+                                                               async: false,
                                                                type: 'POST',
                                                                beforeSend: function () {
                                                                        if (!$("#new-slice-name").val()) {
@@ -387,6 +516,23 @@ $(document).ready(function () {
                                                                        location.reload();
                                                                }
                                                        });
+                                                  $.ajax({
+                                                                url: '/tenantaddorremsliver/',
+                                                                dataType: 'json',
+                                                                data: {
+                                                                        count: parseInt($("#number-of-slivers").val()),
+                                                                        slice: $("#new-slice-name").val(),
+                                                                        actionToDo: "add",
+                                                                        csrfmiddlewaretoken: "{{ csrf_token }}", // < here
+                                                                        state: "inactive"
+                                                                },
+                                                               async: false,
+                                                                type: 'POST',
+                                                                complete: function () {
+                                                                        location.reload();
+                                                                }
+                                                        });
+
                                                },
                                                Cancel: function () {
                                                        $(this).dialog("close");
@@ -395,8 +541,61 @@ $(document).ready(function () {
                                });
                                $("#create-slice-form").dialog("open");
                        });
+                       $("#delete-slice-btn").unbind().click(function () {
+                               var rows = data['userSliceInfo']['rows'];
+                               $("#delete-slice").empty();
+                               for (row in rows) {
+                                       $("#delete-slice").append("<option>" + rows[row]['sliceName'] + "</option>");
+                               }
+                               $("#delete-slice-form").dialog({
+                                       autoOpen: false,
+                                       height: 200,
+                                       width: 350,
+                                       modal: true,
+                                       dialogClass: "tenantDialog",
+                                       buttons: {
+                                               "Delete": function () {
+                                                       $.ajax({
+                                                               url: '/tenantdeleteslice/',
+                                                               dataType: 'json',
+                                                               data: {
+                                                                       sliceName: $("#delete-slice").val(),
+                                                                       csrfmiddlewaretoken: "{{ csrf_token }}", // < here 
+                                                                       state: "inactive"
+                                                               },
+                                                               type: 'POST',
+                                                               success: function (response) {},
+                                                               complete: function () {
+                                                                       location.reload();
+                                                               }
+                                                       });
+                                               },
+                                               Cancel: function () {
+                                                       $(this).dialog("close");
+                                               }
+                                       }
+                               });
+                               $("#delete-slice-form").dialog("open");
+                       });
                }
+
+
+       function initTenant() {
+               jQuery.ajax({
+                       url: '/tenantview',
+                       dataType: 'json',
+                       success: function (data) {
+                               UserSliceTable(data);
+                               var value = $("#tenantSliceDropDown").val();
+                               checkForBasicAdvView(value, data);
+                               $("#tooltip").css("display", "none");
+                               $("#basic-tooltip").css("display", "none");
+                               $("#adv-tooltip").css("display", "none");
+                       },
+                       complete: function () {}
+               });
        }
+               
        initTenant();
 });
 </script>