diff --git a/assets/js/machines/history.js b/assets/js/machines/history.js index dcfe3357..365b0484 100644 --- a/assets/js/machines/history.js +++ b/assets/js/machines/history.js @@ -1,31 +1,35 @@ -$(function() { - createVMlist(); +$(function () { + drawHistory(); }); - -var offset = 0; -var numvms = 0; -var pagesize = 5; - var MONTHS = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]; function formatDate(timestamp) { - if (timestamp === 0) { - return "-"; - } - var date = new Date(timestamp*1000); var datestring = ""; - datestring += date.getUTCDate() + " "; + datestring += ("0" + date.getUTCDate()).slice(-2) + " "; datestring += MONTHS[date.getUTCMonth()] + " "; datestring += date.getUTCFullYear() + " "; - datestring += ("0" + date.getUTCHours()).slice (-2) + ":"; - datestring += ("0" + date.getUTCMinutes()).slice (-2) + ":"; - datestring += ("0" + date.getUTCSeconds()).slice (-2); + datestring += ("0" + date.getUTCHours()).slice(-2) + ":"; + datestring += ("0" + date.getUTCMinutes()).slice(-2) + ":"; + datestring += ("0" + date.getUTCSeconds()).slice(-2); return datestring; } -function createVMlist() +var vmhistory = $('#vm-history').DataTable( { + "columns": [ + { data: 'name'}, + { data: 'hostname'}, + { data: 'state'}, + { data: 'type'}, + { data: 'stime'}, + { data: 'etime'}, + { data: 'cpu'}, + { data: 'memory'}, + ] +}); +$.fn.dataTable.ext.errMode = 'throw'; +function drawHistory() { $.ajax({ type: "GET", @@ -42,14 +46,15 @@ function createVMlist() $("#error").show(); } } - }).done(function(json) { - var html = ""; + }).done(function(data) { + vmhistory.clear(); - $.each(json, function(index, vm) { - state = vm['state']; + for (row of data["data"]) { + state = row['state']; + // var state_val; disabled = (state != "RUNNING" ? "disabled" : ""); - if (state === "POWERED OFF") { + if (state === "POWERED OFF" || state === "DONE") { state_val = 0; } else if (state === "PENDING" || state === "DELETING") { @@ -64,24 +69,82 @@ function createVMlist() else if (state === "RUNNING") { state_val = 4; } - else { - state_val = 0; - } - html += ''; - html += '' + vm['name'] + ''; - html += '' + vm['hostname'] + ''; - html += ''+state+''; - html += '' + vm['type'] + ''; - html += '' + formatDate(vm['stime']) + ''; - html += '' + formatDate(vm['etime']) + ''; - html += '' + vm['cpu'] + ''; - html += '' + (vm['memory']/1024) + "GB" + ''; - html += ''; - }); - if (html !== "") { - $("#vms").empty(); - $("#vms").append(html); + + row['memory'] = row['memory']/1024 + "GB"; + + row['state'] = ''+state+''; + + row['stime'] = formatDate(row['stime']); + + row['etime'] = formatDate(row['etime']); + + delete row['id']; + + delete row['token']; + + vmhistory.row.add(row); } - $("#error").hide(); + vmhistory.draw(false); // 'false' saves the paging position }); } + +// function createVMlist() +// { +// $.ajax({ +// type: "GET", +// url: "/api/vm?history=1&size=999", +// statusCode: { +// 403: function() { +// Cookie.remove('session', {path : '/'}); +// Cookie.remove('name', {path : '/'}); +// Cookie.remove('fedid', {path : '/'}); +// window.location.replace("/login"); +// }, +// 500: function() { +// $("#errormessage").html("The cloud may be experiencing problems. Please try again later."); +// $("#error").show(); +// } +// } +// }).done(function(json) { +// var html = ""; +// +// $.each(json, function(index, vm) { +// state = vm['state']; +// disabled = (state != "RUNNING" ? "disabled" : ""); +// +// if (state === "POWERED OFF") { +// state_val = 0; +// } +// else if (state === "PENDING" || state === "DELETING") { +// state_val = 1; +// } +// else if (state === "TRANSFER") { +// state_val = 2; +// } +// else if (state === "BUILDING" || state === "EPILOG") { +// state_val = 3; +// } +// else if (state === "RUNNING") { +// state_val = 4; +// } +// else { +// state_val = 0; +// } +// html += ''; +// html += '' + vm['name'] + ''; +// html += '' + vm['hostname'] + ''; +// html += ''+state+''; +// html += '' + vm['type'] + ''; +// html += '' + formatDate(vm['stime']) + ''; +// html += '' + formatDate(vm['etime']) + ''; +// html += '' + vm['cpu'] + ''; +// html += '' + (vm['memory']/1024) + "GB" + ''; +// html += ''; +// }); +// if (html !== "") { +// $("#vms").empty(); +// $("#vms").append(html); +// } +// $("#error").hide(); +// }); +// } diff --git a/assets/js/machines/listmachines.js b/assets/js/machines/listmachines.js index 51b46ff4..6ece6dd0 100644 --- a/assets/js/machines/listmachines.js +++ b/assets/js/machines/listmachines.js @@ -17,13 +17,33 @@ function formatDate(timestamp) return datestring; } +var vmlist = $('#vm-list').DataTable( { + "columns": [ + { data: 'name'}, + { data: 'hostname'}, + { data: 'state'}, + { data: 'stime'}, + { data: 'cpu'}, + { data: 'memory'}, + { data: 'type'}, + { data: 'token'}, + { data: 'id'}, + ], + "columnDefs": [ + { + "orderable": false, + "targets": [7, 8] + } + ] +}); +$.fn.dataTable.ext.errMode = 'throw'; function drawTable() { var show = $('#show-all').prop('checked'); Cookies.get("showall", show, {path : '/'}); $.ajax({ type: "GET", - url: "/api/vm?size=" + pagesize + "&offset=" + offset, + url: "/api/vm", statusCode: { 403: function() { Cookie.remove('session', {path : '/'}); @@ -36,11 +56,11 @@ function drawTable() $("#error").show(); } } - }).done(function(json) { - var html = ""; + }).done(function(data) { + vmlist.clear(); - $.each(json, function(index, vm) { - state = vm['state']; + for (row of data["data"]) { + state = row['state']; disabled = (state != "RUNNING" ? "disabled" : ""); if (state === "POWERED OFF") { @@ -59,34 +79,25 @@ function drawTable() state_val = 4; } if (state === "POWERED OFF") { - button = ''; + row['id'] = ''; } else { - button = ''; + row['id'] = ''; } - html += ''; - html += '' + vm['name'] + ''; - html += '' + vm['hostname'] + ''; - html += ''+state+''; - html += '' + vm['type'] + ''; - html += '' + formatDate(vm['stime']) + ''; // move date formattion into own function - html += '' + vm['cpu'] + ''; - html += '' + (vm['memory']/1024) + "GB" + ''; - html += ''; - html += ''; - html += ''; - html += button; - html += ''; - }); + row['token'] = ''; - if (html !== "") { - $("#vms").empty(); - $("#vms").append(html); - } + row['memory'] = row['memory']/1024 + "GB"; + + row['state'] = ''+state+''; - $("#error").hide(); + row['stime'] = formatDate(row['stime']); + + row['etime'] = row['etime']; + + delete row['etime']; + vmlist.row.add(row); + } + vmlist.draw(false); // 'false' saves the paging position }); } diff --git a/views/machines/history.html b/views/machines/history.html index ad055ce8..7f8a0941 100644 --- a/views/machines/history.html +++ b/views/machines/history.html @@ -4,11 +4,16 @@ {% extends "layout.html" %} {% block css %} - + + + {% endblock %} {% block javascript %} - + + + + {% endblock %} @@ -20,30 +25,21 @@

History

-
- - - - - - - - - - - - - - + +
NameHostnameStateTypeStartEndCPURAM
+ - + + + + + + + + - -

Loading ...

NameHostnameStateTypeStartEndCPURAM
-
-
- -
+ + {% endblock %} diff --git a/views/machines/index.html b/views/machines/index.html index 8f620388..0b973dfa 100644 --- a/views/machines/index.html +++ b/views/machines/index.html @@ -5,6 +5,7 @@ {% block css %} + {% endblock %} @@ -22,21 +23,23 @@ quota.update(); setInterval(function () { quota.update(); - }, 5000); - $('#show-all').change(function() { drawTable(); - }); + }, 5000); + // $('#show-all').change(function() { + // drawTable(); + // }); }); - + + + - @@ -66,28 +69,21 @@

Machines Show Group VMs? -
- - - - - - - - - - - - - - - - - - - -
NameHostnameStateTypeCreatedCPURAM

It looks like you do not have any Virtual Machines. Why don't you create one?

-
+ + + + + + + + + + + + + + +
VM nameHostnameStateCreatedCPURAMType
{% include "machines/resources.html" %}