Skip to content

GitLab

emulab-devel
emulab-devel
Commit ecea5c3b authored by Leigh B Stoller's avatar Leigh B Stoller
Browse files
Options

Lots of UI changes.

parent e90268d3
Hide whitespace changes
Inline Side-by-side
Showing with 114 additions and 31 deletions
www/aptui/js/status.js
View file @ ecea5c3b
window.APT_OPTIONS.config();
require(['jquery', 'js/quickvm_sup',
require(['jquery', 'js/quickvm_sup',
'tablesorter', 'tablesorterwidgets', 'bootstrap'],
function ($, sup)
{
'use strict';
var CurrentTopo = null;
function initialize()
{
......@@ -62,6 +63,7 @@ function ($, sup)
// This is considered the home page, for now.
window.location.replace('instantiate.php');
}
sup.ShowModal("#waitwait");
var $xmlthing = sup.CallMethod("terminate", null,
window.APT_OPTIONS.uuid, null);
......@@ -118,6 +120,7 @@ function ($, sup)
$("#terminate_button").prop("disabled", false);
$("#extend_button").prop("disabled", false);
ShowTopo(uuid);
StartResizeWatchdog()
}
else if (status == 'failed') {
bgtype = "bg-danger";
......@@ -134,9 +137,11 @@ function ($, sup)
}
else if (status == 'terminating' || status == 'terminated') {
status_html = "<font color=red>" + status + "</font>";
bgtype = "bg-danger";
statustext = "Your experiment has been terminated!";
$("#terminate_button").prop("disabled", true);
$("#extend_button").prop("disabled", true);
StartCountdownClock.stop = 0;
StartCountdownClock.stop = 1;
}
$("#statusmessage").html(statustext);
$("#statusmessage-container")
......@@ -153,7 +158,7 @@ function ($, sup)
//
// Install a window resize handler to redraw the topomap.
//
function StartResizeWatchdog(uuid)
function StartResizeWatchdog()
{
var resizeTimer;
......@@ -165,7 +170,7 @@ function ($, sup)
// Must clear the div for the D3 library.
$("#showtopo_statuspage").html("<div></div>");
$("#showtopo_statuspage").removeClass("invisible");
ShowTopo(uuid);
ReDrawTopoMap();
}
//
......@@ -208,6 +213,9 @@ function ($, sup)
// variables for time units
var days, hours, minutes, seconds;
// text color.
var color = "";
// update the tag with id "countdown" every 1 second
var updater = setInterval(function () {
......@@ -244,7 +252,7 @@ function ($, sup)
clearInterval(updater);
return;
}
// do some time calculations
days = parseInt(seconds_left / 86400);
seconds_left = seconds_left % 86400;
......@@ -265,9 +273,40 @@ function ($, sup)
seconds = "0" + seconds;
var countdown =
days + ":" + hours + ":" + minutes + ":" + seconds;
days + ":" + hours + ":" + minutes + ":" + seconds;
var newcolor = "";
var statusbg = "";
var statustext = "Your experiment is ready";
$("#quickvm_countdown").html(countdown);
seconds_left = (target_date - current_date) / 1000;
if (seconds_left < 3600) {
newcolor = "text-danger";
statusbg = "bg-danger";
statustext = "Extend your experiment before it expires!";
}
else if (seconds_left < 2 * 3600) {
newcolor = "text-warning";
statusbg = "bg-warning";
statustext = "Your experiment is going to expire soon!";
}
else {
newcolor = "";
statusbg = "hidden";
}
if (newcolor != color) {
$("#quickvm_countdown")
.removeClass("text-warning text-danger")
.addClass(newcolor);
$("#statusmessage").html(statustext);
$("#statusmessage-container")
.removeClass('bg-success bg-danger hidden')
.addClass(statusbg);
color = newcolor;
}
}, 1000);
}
......@@ -284,16 +323,20 @@ function ($, sup)
return;
}
var callback = function(json) {
sup.HideModal("#waitwait");
console.info(json.value);
var message;
if (json.code) {
if (json.code < 0) {
alert("Could not extend experiment. " +
"Please try again later");
message = "Could not extend experiment. " +
"Please try again later";
}
else {
alert("Could not extend experiment: " + json.value);
message = "Could not extend experiment: " + json.value;
}
sup.SpitOops("oops", message);
return;
}
$("#quickvm_expires").html(json.value);
......@@ -301,8 +344,9 @@ function ($, sup)
// Reset the countdown clock.
StartCountdownClock.reset = json.value;
}
var $xmlthing = sup.CallMethod("request_extension", null, uuid, reason);
sup.HideModal('#extend_modal');
sup.ShowModal("#waitwait");
var $xmlthing = sup.CallMethod("request_extension", null, uuid, reason);
$xmlthing.done(callback);
}
......@@ -321,7 +365,7 @@ function ($, sup)
var url = jsonauth.baseurl + ':' + port + '/' + '#' +
encodeURIComponent(document.location.href) + ',' + session;
console.info(url);
var iwidth = $('#' + id).width();
var iwidth = "100%";
var iheight = 400;
$('#' + id).html('<iframe id="' + id + '_iframe" ' +
......@@ -457,11 +501,19 @@ function ($, sup)
// Stick the text in
$('#instructions_text').html(marked(text));
// Make the div visible.
$('#instructions_panel').removeClass("invisible");
$('#instructions_panel').removeClass("hidden");
});
});
// Find all of the nodes, and put them into the list tab.
// Clear current table.
//
// Special case for a topology of a single node; start the
// ssh tab right away.
//
var nodecount = 0;
var nodehostport = null;
var nodename = null;
$('#listview_table > tbody').html("");
$(xml).find("node").each(function() {
var node = $(this).attr("client_id");
......@@ -484,8 +536,11 @@ function ($, sup)
" <span class='glyphicon glyphicon-log-in'><span>" +
" </button>";
console.info(ssh);
// Use this to attach handlers to things that do not exist.
nodehostport = hostport;
nodename = node;
// Use this to attach handlers to things that do not
// exist in the dom yet.
$('#listview_table').off('click', '#sshbutton_' + node);
$('#listview_table').on('click',
'#sshbutton_' + node, function () {
......@@ -496,19 +551,35 @@ function ($, sup)
'<tr><td>' + node + '</td><td>' + ssh + '</td><td>' +
href + '</td></tr>'
);
nodecount++;
});
// Stash this for resize watchdog redraw.
CurrentTopo = topo;
ReDrawTopoMap();
$("#showtopo_container").removeClass("invisible");
// Subtract -2 cause of the border.
sup.maketopmap("#showtopo_statuspage",
$("#showtopo_statuspage").outerWidth() - 2,
300, topo,
// Callback for ssh.
function(arg1, arg2) { NewSSHTab(arg1, arg2); });
// And start up ssh for single node topologies.
if (nodecount == 1 && nodehostport) {
NewSSHTab(nodehostport, nodename);
}
}
var $xmlthing = sup.CallMethod("manifest", null, uuid, null);
$xmlthing.done(callback);
}
function ReDrawTopoMap()
{
// Activate the "profile" tab or else the map has no size.
$('#quicktabs a[href="#profile"]').tab('show');
// Subtract -2 cause of the border.
sup.maketopmap("#showtopo_statuspage",
$("#showtopo_statuspage").outerWidth() - 2,
300, CurrentTopo,
// Callback for ssh.
function(arg1, arg2) { NewSSHTab(arg1, arg2); });
}
$(document).ready(initialize);
});
www/aptui/manage_profile.php
View file @ ecea5c3b
......@@ -481,7 +481,7 @@ if (! isset($create)) {
"You do not appear to be a member of any projects in which ".
"you have permission to create new profiles";
}
if ($action == "edit" || $action == "delete") {
if ($action == "edit" || $action == "delete" || "snapshot") {
if (!isset($idx)) {
$errors["error"] = "No profile specified for edit/delete!";
}
......@@ -499,6 +499,9 @@ if (! isset($create)) {
header("Location: $APTBASE/myprofiles.php");
return;
}
else if ($action == "snapshot") {
$defaults["profile_rspec"] = $profile->rspec();
}
else {
$defaults["profile_uuid"] = $profile->uuid();
$defaults["profile_pid"] = $profile->pid();
......
www/aptui/status.php
View file @ ecea5c3b
......@@ -147,7 +147,8 @@ if (isset($ajax_request)) {
}
# Only extend for 24 hours. More later.
$expires_time = strtotime($slice->expires());
if ($expires_time > time() + (3600 * 36)) {
if ($expires_time > time() + (3600 * 24)) {
sleep(2);
SPITAJAX_ERROR(1, "You still have lots of time left!");
return;
}
......@@ -169,9 +170,13 @@ if (isset($ajax_request)) {
"A request to extend your APT experiment was made and ".
"granted.\n".
"Your reason was:\n\n". $ajax_argument . "\n\n".
"Your experiment will now expire at $new_expires\n",
"Your experiment will now expire at $new_expires.\n\n".
"You can request another extension tomorrow.\n",
"CC: $TBMAIL_OPS");
}
elseif ($retval > 0) {
SPITAJAX_ERROR(1, $suexec_output);
}
else {
SPITAJAX_ERROR(-1, "Internal Error. Please try again later");
}
......@@ -223,11 +228,11 @@ elseif ($instance_status == "provisioned") {
echo "<div class='row'>
<div class='col-lg-6 col-lg-offset-3
col-md-8 col-md-offset-2
col-sm-8 col-sm-offset-2
col-sm-10 col-sm-offset-1
col-xs-12 col-xs-offset-0'>\n";
echo "<div class='panel panel-default'>\n";
echo "<div class='panel-body'>\n";
echo "<table class='table table-condensed' $style>\n";
echo "<table class='table table-condensed nospaceafter' $style>\n";
echo "<tr>\n";
echo "<td id='statusmessage-container' colspan=2 $style class='$bgtype'>\n";
echo "<h4 id='statusmessage'>$statustext</h4>\n";
......@@ -253,9 +258,10 @@ echo "<td class='uk-width-4-5' $style>$slice_urn</td>\n";
echo "</tr>\n";
echo "<tr>\n";
echo "<td class='uk-width-1-5' $style>State:</td>\n";
echo "<td id='quickvm_status'
class='uk-width-4-5' $style>
<font $color>$instance_status</font>\n";
echo "<td class='uk-width-4-5' $style>
<span id='quickvm_status'>
<font $color>$instance_status</font>
</span>\n";
echo "</td>\n";
echo "</tr>\n";
echo "<tr>\n";
......@@ -270,11 +276,11 @@ echo "<td class='uk-width-4-5' $style>
echo "</tr>\n";
echo "</table>\n";
echo "<div class='pull-right'>\n";
echo " <button class='btn btn-success' $disabled
echo " <button class='btn btn-xs btn-success' $disabled
id='extend_button' type=button
data-toggle='modal' data-target='#extend_modal'>
Extend</button>\n";
echo " <button class='btn btn-danger' $disabled
echo " <button class='btn btn-xs btn-danger' $disabled
id='terminate_button' type=button
data-toggle='modal' data-target='#terminate_modal'>
Terminate</button>\n";
......@@ -289,7 +295,7 @@ echo "</div>\n";
# will actually fill in the div though, since it is markdown and that
# is more easily done on the client side for now.
#
echo "<div class='row invisible' id='instructions_panel'>
echo "<div class='row hidden' id='instructions_panel'>
<div class='col-lg-6 col-lg-offset-3
col-md-8 col-md-offset-2
col-sm-8 col-sm-offset-2
......@@ -468,5 +474,8 @@ echo "<!-- This is a modal -->
</div>
</div>\n";
SpitWaitModal("waitwait");
SpitOopsModal("oops");
SPITFOOTER();
?>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment