new UI - error handling when adding VM fails.

This commit is contained in:
Jessica Wang 2010-09-16 18:52:02 -07:00
parent a5430ffd5f
commit 28f7548e4a
4 changed files with 206 additions and 64 deletions

View File

@ -259,3 +259,82 @@
</div>
</div>
<!-- Create VM from template (end) -->
<!-- Add Template Dialog (begin) -->
<div id="dialog_add_template" title="Add Template" style="display:none">
<p>Please enter the following data to create your new template</p>
<div class="dialog_formcontent">
<form action="#" method="post" id="form_acquire">
<ol>
<li>
<label for="user_name">Name:</label>
<input class="text" type="text" name="add_template_name" id="add_template_name" style="width:250px"/>
<div id="add_template_name_errormsg" class="dialog_formcontent_errormsg" style="display:none;"></div>
</li>
<li>
<label for="user_name">Display Text:</label>
<input class="text" type="text" name="add_template_display_text" id="add_template_display_text" style="width:250px"/>
<div id="add_template_display_text_errormsg" class="dialog_formcontent_errormsg" style="display:none;"></div>
</li>
<li>
<label for="user_name">URL:</label>
<input class="text" type="text" name="add_template_url" id="add_template_url" style="width:250px"/>
<div id="add_template_url_errormsg" class="dialog_formcontent_errormsg" style="display:none;"></div>
</li>
<li>
<label>Zone:</label>
<select class="select" id="add_template_zone">
</select>
</li>
<li>
<label for="add_template_os_type">OS Type:</label>
<select class="select" name="add_template_os_type" id="add_template_os_type">
</select>
</li>
<li>
<label for="add_template_format">Format:</label>
<select class="select" name="add_template_format" id="add_template_format">
</select>
</li>
<!--
<li>
<label for="user_name">Require HVM?:</label>
<select class="select" name="add_template_hvm" id="add_template_hvm">
<option value="true">Yes</option>
<option value="false">No</option>
</select>
</li>
<li>
<label for="user_name">OS Arch:</label>
<select class="select" name="add_template_os" id="add_template_os">
<option value="64">64 Bit</option>
<option value="32">32 Bit</option>
</select>
</li>
!-->
<li>
<label>Password Enabled?:</label>
<select class="select" id="add_template_password">
<option value="false">No</option>
<option value="true">Yes</option>
</select>
</li>
<li>
<label>Public?:</label>
<select class="select" id="add_template_public">
<option value="false">No</option>
<option value="true">Yes</option>
</select>
</li>
<li id="add_template_featured_container" style="display:none">
<label>Featured?:</label>
<select class="select" id="add_template_featured">
<option value="false">No</option>
<option value="true">Yes</option>
</select>
</li>
</ol>
</form>
</div>
</div>
<!-- Add Template Dialog (end) -->

View File

@ -1186,19 +1186,14 @@ function clickInstanceGroupHeader($arrowIcon) {
moreCriteria.push("&group="+todb(group));
vmWizardClose();
var $t = $("#midmenu_item").clone();
$t.find("#first_row").text("Adding....");
$t.find("#content").addClass("inaction");
$t.find("#spinning_wheel").show();
$("#midmenu_container").append($t.show());
var $midmenuItem1 = beforeAddingMidMenuItem() ;
$.ajax({
data: createURL("command=deployVirtualMachine"+moreCriteria.join("")),
dataType: "json",
success: function(json) {
var jobId = json.deployvirtualmachineresponse.jobid;
$t.attr("id","vmNew"+jobId).data("jobId", jobId);
var jobId = json.deployvirtualmachineresponse.jobid;
var timerKey = "vmNew"+jobId;
// Process the async job
@ -1214,35 +1209,23 @@ function clickInstanceGroupHeader($arrowIcon) {
if (result.jobstatus == 0) {
return; //Job has not completed
} else {
$("body").stopTime(timerKey);
$t.find("#content").removeClass("inaction");
$t.find("#spinning_wheel").hide();
$("body").stopTime(timerKey);
if (result.jobstatus == 1) {
// Succeeded
$t.find("#info_icon").removeClass("error").show();
$t.data("afterActionInfo", ("Adding succeeded."));
afterAddingMidMenuItem($midmenuItem1, true);
if("virtualmachine" in result)
vmToMidmenu(result.virtualmachine[0], $t);
} else if (result.jobstatus == 2) {
// Failed
$t.find("#first_row").text("Adding failed");
$t.find("#info_icon").addClass("error").show();
$t.data("afterActionInfo", ("Adding failed. Reason: " + fromdb(result.jobresult)));
$t.bind("click", function(event) {
$rightPanelContent.find("#after_action_info").text($(this).data("afterActionInfo"));
$rightPanelContent.find("#after_action_info_container").addClass("errorbox");
$rightPanelContent.find("#after_action_info_container").show();
vmClearRightPanel();
return false;
});
afterAddingMidMenuItem($midmenuItem1, false);
$("#dialog_error").html("<p><b>Adding Instance failed</b></p><br/><p>"+fromdb(result.jobresult)+"</p>").dialog("open");
}
}
},
error: function(XMLHttpResponse) {
$("body").stopTime(timerKey);
$t.find("#info_icon").addClass("error").show();
$t.find("#first_row").text("Adding failed");
$("body").stopTime(timerKey);
afterAddingMidMenuItem($midmenuItem1, false);
handleError(XMLHttpResponse);
}
});
@ -1250,9 +1233,8 @@ function clickInstanceGroupHeader($arrowIcon) {
0
);
},
error: function(XMLHttpResponse) {
$t.find("#info_icon").addClass("error").show();
$t.find("#first_row").text("Adding failed");
error: function(XMLHttpResponse) {
afterAddingMidMenuItem($midmenuItem1, false);
handleError(XMLHttpResponse);
}
});
@ -1312,8 +1294,7 @@ function doCreateTemplateFromVmVolume($actionLink, listAPIMap, $subgridItem) {
$("#dialog_create_template")
.dialog('option', 'buttons', {
"Create": function() {
//debugger;
"Create": function() {
var thisDialog = $(this);
thisDialog.dialog("close");

View File

@ -548,14 +548,34 @@ function hideMiddleMenu() {
$("#middle_menu, #search_panel, #middle_menu_pagination").hide();
$("#right_panel").removeClass("main_contentarea").addClass("main_contentarea_dashboard");
}
function showMiddleMenu() {
$("#middle_menu, #search_panel, #middle_menu_pagination").show();
$("#right_panel").removeClass("main_contentarea_dashboard").addClass("main_contentarea");
}
// adding middle menu item ***
function beforeAddingMidMenuItem() {
var $midmenuItem1 = $("#midmenu_item").clone();
$midmenuItem1.find("#first_row").text("Adding....");
$midmenuItem1.find("#content").addClass("inaction");
$midmenuItem1.find("#spinning_wheel").show();
$("#midmenu_container").append($midmenuItem1.show());
return $midmenuItem1;
}
function afterAddingMidMenuItem($midmenuItem1, isSuccessful) {
$midmenuItem1.find("#content").removeClass("inaction");
$midmenuItem1.find("#spinning_wheel").hide();
if(isSuccessful == true) {
$midmenuItem1.find("#info_icon").removeClass("error").show();
$midmenuItem1.data("afterActionInfo", ("Adding succeeded."));
}
else {
$midmenuItem1.find("#info_icon").addClass("error").show();
$midmenuItem1.find("#first_row").text("Adding failed");
}
}

View File

@ -1,8 +1,63 @@
var g_zoneIds = [];
var g_zoneNames = [];
function afterLoadTemplateJSP() {
var $detailsTab = $("#right_panel_content #tab_content_details");
function afterLoadTemplateJSP() {
var $detailsTab = $("#right_panel_content #tab_content_details");
//add button ***
$("#midmenu_add_link").show();
$("#midmenu_add_link").bind("click", function(event) {
$("#dialog_add_template")
.dialog('option', 'buttons', {
"Create": function() {
var thisDialog = $(this);
thisDialog.dialog("close");
debugger;
// validate values
var isValid = true;
isValid &= validateString("Name", thisDialog.find("#add_template_name"), thisDialog.find("#add_template_name_errormsg"));
isValid &= validateString("Display Text", thisDialog.find("#add_template_display_text"), thisDialog.find("#add_template_display_text_errormsg"));
isValid &= validateString("URL", thisDialog.find("#add_template_url"), thisDialog.find("#add_template_url_errormsg"));
if (!isValid) return;
var name = trim(thisDialog.find("#add_template_name").val());
var desc = trim(thisDialog.find("#add_template_display_text").val());
var url = trim(thisDialog.find("#add_template_url").val());
var zoneId = thisDialog.find("#add_template_zone").val();
var format = thisDialog.find("#add_template_format").val();
var password = thisDialog.find("#add_template_password").val();
var isPublic = thisDialog.find("#add_template_public").val();
var osType = thisDialog.find("#add_template_os_type").val();
var moreCriteria = [];
if(thisDialog.find("#add_template_featured_container").css("display")!="none") {
var isFeatured = thisDialog.find("#add_template_featured").val();
moreCriteria.push("&isfeatured="+isFeatured);
}
//middle menu spinning wheel....
$.ajax({
data: createURL("command=registerTemplate&name="+encodeURIComponent(name)+"&displayText="+encodeURIComponent(desc)+"&url="+encodeURIComponent(url)+"&zoneid="+zoneId+"&ispublic="+isPublic+moreCriteria.join("")+"&format="+format+"&passwordEnabled="+password+"&osTypeId="+osType+"&response=json"),
dataType: "json",
success: function(json) {
var result = json.registertemplateresponse;
debugger;
//spinning wheel disappear
},
error: function(XMLHttpResponse) {
debugger;
}
});
},
"Cancel": function() {
$(this).dialog("close");
}
}).dialog("open");
return false;
});
//edit button ***
var $readonlyFields = $detailsTab.find("#name, #displaytext, #passwordenabled, #ispublic, #isfeatured, #ostypename");
@ -28,17 +83,39 @@ function afterLoadTemplateJSP() {
});
//populate dropdown ***
//populate dropdown ***
var addTemplateZoneField = $("#dialog_add_template #add_template_zone");
if (isAdmin())
addTemplateZoneField.append("<option value='-1'>All Zones</option>");
$.ajax({
data: createURL("command=listZones&available=true"+maxPageSize),
dataType: "json",
success: function(json) {
var zones = json.listzonesresponse.zone;
if (zones != null && zones.length > 0) {
for (var i = 0; i < zones.length; i++) {
addTemplateZoneField.append("<option value='" + zones[i].id + "'>" + sanitizeXSS(zones[i].name) + "</option>");
g_zoneIds.push(zones[i].id);
g_zoneNames.push(zones[i].name);
}
}
}
});
$.ajax({
data: createURL("command=listOsTypes&response=json"+maxPageSize),
dataType: "json",
success: function(json) {
types = json.listostypesresponse.ostype;
if (types != null && types.length > 0) {
var osTypeDropdown = $detailsTab.find("#ostypename_edit").empty();
for (var i = 0; i < types.length; i++) {
var html = "<option value='" + types[i].id + "'>" + types[i].description + "</option>";
osTypeDropdown.append(html);
if (types != null && types.length > 0) {
var osTypeDropdownAdd = $("#dialog_add_template #add_template_os_type");
var osTypeDropdownEdit = $detailsTab.find("#ostypename_edit").empty();
if(types != null && types.length > 0) {
for(var i = 0; i < types.length; i++) {
var html = "<option value='" + types[i].id + "'>" + types[i].description + "</option>";
osTypeDropdownAdd.append(html);
osTypeDropdownEdit.append(html);
}
}
}
}
@ -72,6 +149,13 @@ function afterLoadTemplateJSP() {
});
//initialize dialog box ***
activateDialog($("#dialog_add_template").dialog({
width:450,
autoOpen: false,
modal: true,
zIndex: 2000
}));
activateDialog($("#dialog_copy_template").dialog({
width:300,
autoOpen: false,
@ -85,28 +169,6 @@ function afterLoadTemplateJSP() {
modal: true,
zIndex: 2000
}));
//populate zone dropdown excluding source zone ***
var addTemplateZoneField = $("#dialog_add_template #add_template_zone");
// Add default zone
if (isAdmin()) {
addTemplateZoneField.append("<option value='-1'>All Zones</option>");
}
$.ajax({
data: createURL("command=listZones&available=true"+maxPageSize),
dataType: "json",
success: function(json) {
var zones = json.listzonesresponse.zone;
if (zones != null && zones.length > 0) {
for (var i = 0; i < zones.length; i++) {
addTemplateZoneField.append("<option value='" + zones[i].id + "'>" + sanitizeXSS(zones[i].name) + "</option>");
g_zoneIds.push(zones[i].id);
g_zoneNames.push(zones[i].name);
}
}
}
});
}
function templateToMidmenu(jsonObj, $midmenuItem1) {