mirror of
https://github.com/apache/cloudstack.git
synced 2025-10-26 08:42:29 +01:00
new UI - add action message box to actions for subgrid items.
This commit is contained in:
Jessica Wang
parent
64c45588b2
commit
c3144e0d76
@ -1,26 +1,23 @@
|
||||
<!--
|
||||
<script type="text/javascript" src="scripts/cloud.core.instance.js"></script>
|
||||
-->
|
||||
|
||||
<%@ page import="java.util.*" %>
|
||||
|
||||
<%@ page import="com.cloud.utils.*" %>
|
||||
|
||||
<%
|
||||
|
||||
Locale browserLocale = request.getLocale();
|
||||
CloudResourceBundle t = CloudResourceBundle.getBundle("resources/resource", browserLocale);
|
||||
%>
|
||||
|
||||
<!-- VM detail panel (begin) -->
|
||||
<div class="main_title" id="right_panel_header">
|
||||
<div class="main_titleicon">
|
||||
<img src="images/title_instanceicons.gif" alt="Instance" /></div>
|
||||
<h1 id="vm_name">Instance
|
||||
<h1 id="vm_name">
|
||||
Instance
|
||||
</h1>
|
||||
</div>
|
||||
<div class="contentbox" id="right_panel_content">
|
||||
<div class="info_detailbox errorbox" id="after_action_info_container" style="display: none">
|
||||
<p id="after_action_info"></p>
|
||||
<p id="after_action_info">
|
||||
</p>
|
||||
</div>
|
||||
<div class="tabbox" style="margin-top: 15px;">
|
||||
<div class="content_tabs on" id="tab_details">
|
||||
@ -30,7 +27,6 @@
|
||||
<div class="content_tabs off" id="tab_statistics">
|
||||
<%=t.t("Statistics")%></div>
|
||||
</div>
|
||||
|
||||
<!--Details tab (start)-->
|
||||
<div class="grid_container" style="display: block;" id="tab_content_details">
|
||||
<div class="grid_rows odd">
|
||||
@ -152,13 +148,12 @@
|
||||
</div>
|
||||
</div>
|
||||
<!--Details tab (end)-->
|
||||
|
||||
<!--Volume tab (start)-->
|
||||
<div style="display: none;" id="tab_content_volume">
|
||||
|
||||
<div class="grid_container" id="volume_tab_template" style="display: block">
|
||||
<div class="grid_header">
|
||||
<div class="grid_header_title" id="name"></div>
|
||||
<div class="grid_header_title" id="name">
|
||||
</div>
|
||||
<div class="grid_actionbox" id="volume_action_link" style="display: block;">
|
||||
<div class="grid_actionsdropdown_box" id="volume_action_menu" style="display: none;">
|
||||
<ul class="actionsdropdown_boxlist" id="action_list">
|
||||
@ -168,8 +163,11 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="gridheader_loaderbox" style="height: 18px;">
|
||||
<div class="gridheader_loader"></div>
|
||||
<p> Creating Template … </p>
|
||||
<div class="gridheader_loader">
|
||||
</div>
|
||||
<p>
|
||||
Creating Template …
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
@ -178,7 +176,8 @@
|
||||
ID:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="id"></div>
|
||||
<div class="row_celltitles" id="id">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
@ -187,7 +186,8 @@
|
||||
Type:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="type"></div>
|
||||
<div class="row_celltitles" id="type">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
@ -196,7 +196,8 @@
|
||||
Size:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="size"></div>
|
||||
<div class="row_celltitles" id="size">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
@ -205,15 +206,13 @@
|
||||
Created:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="created"></div>
|
||||
<div class="row_celltitles" id="created">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<!--Volume tab (end)-->
|
||||
|
||||
<!--Statistics tab (start)-->
|
||||
<div class="grid_container" style="display: none;" id="tab_content_statistics">
|
||||
statistics....
|
||||
@ -237,7 +236,8 @@
|
||||
Step 5</div>
|
||||
<div class="vmpopup_steps" style="background: url(images/laststep_bg.gif) no-repeat top left">
|
||||
</div>
|
||||
<div class="vmpopup_container_closebutton" id="close_button"></div>
|
||||
<div class="vmpopup_container_closebutton" id="close_button">
|
||||
</div>
|
||||
</div>
|
||||
<div class="vmpopup_container_mid">
|
||||
<div class="vmpopup_maincontentarea">
|
||||
@ -349,19 +349,24 @@
|
||||
Step 5</div>
|
||||
<div class="vmpopup_steps" style="background: url(images/laststep_bg.gif) no-repeat top left">
|
||||
</div>
|
||||
<div class="vmpopup_container_closebutton" id="close_button"></div>
|
||||
<div class="vmpopup_container_closebutton" id="close_button">
|
||||
</div>
|
||||
</div>
|
||||
<div class="vmpopup_container_mid">
|
||||
<div class="vmpopup_maincontentarea">
|
||||
<div class="vmpopup_titlebox">
|
||||
<h2>
|
||||
Step 2: <strong>Service Offering</strong></h2>
|
||||
<p><!--
|
||||
<p>
|
||||
<!--
|
||||
Please select the CPU, Memory and Storage requirement you need for your new Virtual
|
||||
Instance--></p>
|
||||
Instance-->
|
||||
</p>
|
||||
</div>
|
||||
<div class="vmpopup_contentpanel">
|
||||
<h3><!--Service Offering--></h3>
|
||||
<h3>
|
||||
<!--Service Offering-->
|
||||
</h3>
|
||||
<div class="vmpopup_offeringpanel" id="service_offering_container">
|
||||
<!--
|
||||
<div class="vmpopup_offeringbox">
|
||||
@ -444,17 +449,20 @@
|
||||
Step 5</div>
|
||||
<div class="vmpopup_steps" style="background: url(images/laststep_bg.gif) no-repeat top left">
|
||||
</div>
|
||||
<div class="vmpopup_container_closebutton" id="close_button"></div>
|
||||
<div class="vmpopup_container_closebutton" id="close_button">
|
||||
</div>
|
||||
</div>
|
||||
<div class="vmpopup_container_mid">
|
||||
<div class="vmpopup_maincontentarea">
|
||||
<div class="vmpopup_titlebox">
|
||||
<h2>
|
||||
Step 3: <strong id="step3_label">Select a Disk Offering</strong></h2>
|
||||
<p></p>
|
||||
<p>
|
||||
</p>
|
||||
</div>
|
||||
<div class="vmpopup_contentpanel">
|
||||
<h3></h3>
|
||||
<h3>
|
||||
</h3>
|
||||
<div class="vmpopup_offeringpanel" id="data_disk_offering_container" style="display: none">
|
||||
</div>
|
||||
<div class="vmpopup_offeringpanel" id="root_disk_offering_container" style="display: none">
|
||||
@ -485,17 +493,20 @@
|
||||
Step 5</div>
|
||||
<div class="vmpopup_steps" style="background: url(images/laststep_bg.gif) no-repeat top left">
|
||||
</div>
|
||||
<div class="vmpopup_container_closebutton" id="close_button"></div>
|
||||
<div class="vmpopup_container_closebutton" id="close_button">
|
||||
</div>
|
||||
</div>
|
||||
<div class="vmpopup_container_mid">
|
||||
<div class="vmpopup_maincontentarea">
|
||||
<div class="vmpopup_titlebox">
|
||||
<h2>
|
||||
Step 4: <strong>Network</strong></h2>
|
||||
<p></p>
|
||||
<p>
|
||||
</p>
|
||||
</div>
|
||||
<div class="vmpopup_contentpanel">
|
||||
<h3></h3>
|
||||
<h3>
|
||||
</h3>
|
||||
<div class="vmpopup_offeringpanel">
|
||||
<div class="vmpopup_offeringbox">
|
||||
<input type="radio" name="radiogroup" class="radio" />
|
||||
@ -559,17 +570,20 @@
|
||||
Step 5</div>
|
||||
<div class="vmpopup_steps" style="background: url(images/laststep_slectedbg.gif) no-repeat top left">
|
||||
</div>
|
||||
<div class="vmpopup_container_closebutton" id="close_button"></div>
|
||||
<div class="vmpopup_container_closebutton" id="close_button">
|
||||
</div>
|
||||
</div>
|
||||
<div class="vmpopup_container_mid">
|
||||
<div class="vmpopup_maincontentarea">
|
||||
<div class="vmpopup_titlebox">
|
||||
<h2>
|
||||
Step 5: <strong>Last Step</strong></h2>
|
||||
<p></p>
|
||||
<p>
|
||||
</p>
|
||||
</div>
|
||||
<div class="vmpopup_contentpanel">
|
||||
<h3></h3>
|
||||
<h3>
|
||||
</h3>
|
||||
<div class="vmpopup_offeringpanel" style="margin-top: 10px;">
|
||||
<div class="vmpopup_reviewbox_odd">
|
||||
<div class="vmopopup_reviewtextbox">
|
||||
@ -626,7 +640,8 @@
|
||||
Name (optional):
|
||||
</div>
|
||||
<input class="text" type="text" id="wizard_vm_name" />
|
||||
<div id="wizard_vm_name_errormsg" class="dialog_formcontent_errormsg" style="display: none;"></div>
|
||||
<div id="wizard_vm_name_errormsg" class="dialog_formcontent_errormsg" style="display: none;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="vmpopup_reviewbox_odd">
|
||||
@ -636,7 +651,8 @@
|
||||
<div class="vmopopup_review_label">
|
||||
Group (optional):</div>
|
||||
<input class="text" type="text" id="wizard_vm_group" />
|
||||
<div id="wizard_vm_group_errormsg" class="dialog_formcontent_errormsg" style="display: none;"></div>
|
||||
<div id="wizard_vm_group_errormsg" class="dialog_formcontent_errormsg" style="display: none;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -685,6 +701,7 @@
|
||||
<span>MB</span>
|
||||
<div id="custom_disk_size_errormsg" class="dialog_formcontent_errormsg" style="display: none;">
|
||||
</div>
|
||||
</div>
|
||||
<div class="vmpopup_offeringbox" id="vm_popup_disk_offering_template_existing" style="display: none">
|
||||
<input type="radio" class="radio" checked />
|
||||
<label class="label" id="name">
|
||||
@ -699,7 +716,6 @@
|
||||
</div>
|
||||
</div>
|
||||
<!-- VM Wizard - disk Offering template (end)-->
|
||||
|
||||
<!-- Attach ISO Dialog -->
|
||||
<div id="dialog_attach_iso" title="Attach ISO" style="display: none">
|
||||
<p>
|
||||
@ -719,7 +735,6 @@
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Change Name Dialog -->
|
||||
<div id="dialog_change_name" title="Change Name" style="display: none">
|
||||
<p>
|
||||
@ -739,11 +754,11 @@
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Change Service Offering Dialog -->
|
||||
<div id="dialog_change_service_offering" title="Change Service Offering" style="display: none">
|
||||
<p>
|
||||
After changing service offering, you must restart virtual instance for the new service offering to take effect.
|
||||
After changing service offering, you must restart virtual instance for the new service
|
||||
offering to take effect.
|
||||
</p>
|
||||
<div class="dialog_formcontent">
|
||||
<form action="#" method="post" id="form_acquire">
|
||||
@ -758,12 +773,11 @@
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Change Group Dialog -->
|
||||
<div id="dialog_change_group" title="Change Group" style="display: none">
|
||||
<p>
|
||||
Please specify the new group you want to assign to your Virtual Instance. If no such group exists, a new one will be created
|
||||
for you.</p>
|
||||
Please specify the new group you want to assign to your Virtual Instance. If no
|
||||
such group exists, a new one will be created for you.</p>
|
||||
<div class="dialog_formcontent">
|
||||
<form action="#" method="post" id="form_acquire">
|
||||
<ol>
|
||||
@ -778,11 +792,11 @@
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- volume tab template -->
|
||||
<div class="grid_container" id="volume_tab_template" style="display: none">
|
||||
<div class="grid_header">
|
||||
<div class="grid_header_title" id="name"></div>
|
||||
<div class="grid_header_title" id="name">
|
||||
</div>
|
||||
<div class="grid_actionbox" id="volume_action_link">
|
||||
<div class="grid_actionsdropdown_box" id="volume_action_menu" style="display: none;">
|
||||
<ul class="actionsdropdown_boxlist" id="action_list">
|
||||
@ -790,8 +804,16 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="gridheader_loaderbox" id="spinning_wheel" style="display: none; height: 18px;">
|
||||
<div class="gridheader_loader" id="icon"></div>
|
||||
<p id="description"> Waiting … </p>
|
||||
<div class="gridheader_loader" id="icon">
|
||||
</div>
|
||||
<p id="description">
|
||||
Waiting …
|
||||
</p>
|
||||
</div>
|
||||
<div class="gridheader_message" id="action_message_box" style="border: 1px solid #999; display: none;">
|
||||
<p id="description"></p>
|
||||
<div class="close_button" id="close_button">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
@ -800,7 +822,8 @@
|
||||
ID:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="id"></div>
|
||||
<div class="row_celltitles" id="id">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
@ -809,7 +832,8 @@
|
||||
Type:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="type"></div>
|
||||
<div class="row_celltitles" id="type">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
@ -818,7 +842,8 @@
|
||||
Size:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="size"></div>
|
||||
<div class="row_celltitles" id="size">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
@ -827,11 +852,11 @@
|
||||
Created:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="created"></div>
|
||||
<div class="row_celltitles" id="created">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Create Template Dialog -->
|
||||
<div id="dialog_create_template" title="Create Template" style="display: none">
|
||||
<p>
|
||||
|
||||
@ -433,7 +433,7 @@ function clickInstanceGroupHeader($arrowIcon) {
|
||||
"Create Template": {
|
||||
isAsyncJob: true,
|
||||
asyncJobResponse: "createtemplateresponse",
|
||||
dialogBeforeActionFn : doCreateTemplate,
|
||||
dialogBeforeActionFn : doCreateTemplateFromVmVolume,
|
||||
inProcessText: "Creating template....",
|
||||
afterActionSeccessFn: function(){}
|
||||
}
|
||||
@ -473,6 +473,10 @@ function clickInstanceGroupHeader($arrowIcon) {
|
||||
buildActionLinkForSubgridItem("Detach Disk", vmVolumeActionMap, $actionMenu, volumeListAPIMap, template);
|
||||
}
|
||||
|
||||
template.find("#action_message_box #close_button").bind("click", function(event){
|
||||
$(this).parent().hide();
|
||||
return false;
|
||||
});
|
||||
}
|
||||
//***** declaration for volume tab (end) *********************************************************
|
||||
|
||||
@ -1256,5 +1260,37 @@ function clickInstanceGroupHeader($arrowIcon) {
|
||||
});
|
||||
}
|
||||
|
||||
function doCreateTemplateFromVmVolume($actionLink, listAPIMap, $subgridItem) {
|
||||
var jsonObj = $subgridItem.data("jsonObj");
|
||||
$("#dialog_create_template").find("#volume_name").text(jsonObj.name);
|
||||
|
||||
$("#dialog_create_template")
|
||||
.dialog('option', 'buttons', {
|
||||
"Create": function() {
|
||||
//debugger;
|
||||
var thisDialog = $(this);
|
||||
thisDialog.dialog("close");
|
||||
|
||||
// validate values
|
||||
var isValid = true;
|
||||
isValid &= validateString("Name", thisDialog.find("#create_template_name"), thisDialog.find("#create_template_name_errormsg"));
|
||||
isValid &= validateString("Display Text", thisDialog.find("#create_template_desc"), thisDialog.find("#create_template_desc_errormsg"));
|
||||
if (!isValid) return;
|
||||
|
||||
var name = trim(thisDialog.find("#create_template_name").val());
|
||||
var desc = trim(thisDialog.find("#create_template_desc").val());
|
||||
var osType = thisDialog.find("#create_template_os_type").val();
|
||||
var isPublic = thisDialog.find("#create_template_public").val();
|
||||
var password = thisDialog.find("#create_template_password").val();
|
||||
|
||||
var id = $subgridItem.data("jsonObj").id;
|
||||
var apiCommand = "command=createTemplate&volumeId="+id+"&name="+encodeURIComponent(name)+"&displayText="+encodeURIComponent(desc)+"&osTypeId="+osType+"&isPublic="+isPublic+"&passwordEnabled="+password;
|
||||
doActionToSubgridItem(id, $actionLink, apiCommand, listAPIMap, $subgridItem);
|
||||
},
|
||||
"Cancel": function() {
|
||||
$(this).dialog("close");
|
||||
}
|
||||
}).dialog("open");
|
||||
}
|
||||
|
||||
|
||||
@ -407,7 +407,8 @@ function doActionToSubgridItem(id, $actionLink, apiCommand, listAPIMap, $subgrid
|
||||
$("body").stopTime(timerKey);
|
||||
$spinningWheel.hide();
|
||||
if (result.jobstatus == 1) { // Succeeded
|
||||
$subgridItem.data("afterActionInfo", (label + " action succeeded."));
|
||||
$subgridItem.find("#action_message_box #description").text(label + " action succeeded.");
|
||||
$subgridItem.find("#action_message_box").removeClass("error").show();
|
||||
|
||||
//DestroyVirtualMachine API doesn't return an embedded object on success (Bug 6041)
|
||||
//Before Bug 6041 get fixed, use the temporary solution below.
|
||||
@ -423,7 +424,8 @@ function doActionToSubgridItem(id, $actionLink, apiCommand, listAPIMap, $subgrid
|
||||
//afterActionSeccessFn(json[listAPIResponse][listAPIResponseObj][0], $subgridItem);
|
||||
|
||||
} else if (result.jobstatus == 2) { // Failed
|
||||
$subgridItem.data("afterActionInfo", (label + " action failed. Reason: " + sanitizeXSS(result.jobresult)));
|
||||
$subgridItem.find("#action_message_box #description").text(label + " action failed. Reason: " + sanitizeXSS(result.jobresult));
|
||||
$subgridItem.find("#action_message_box").addClass("error").show();
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -460,7 +462,8 @@ function doActionToSubgridItem(id, $actionLink, apiCommand, listAPIMap, $subgrid
|
||||
dataType: "json",
|
||||
async: false,
|
||||
success: function(json) {
|
||||
$subgridItem.data("afterActionInfo", (label + " action succeeded."));
|
||||
$subgridItem.find("#action_message_box #description").text(label + " action succeeded.");
|
||||
$subgridItem.find("#action_message_box").removeClass("error").show();
|
||||
afterActionSeccessFn(json[listAPIResponse][listAPIResponseObj][0], $subgridItem);
|
||||
}
|
||||
});
|
||||
@ -485,9 +488,10 @@ function handleErrorInSubgridItem(XMLHttpResponse, $subgridItem, label) {
|
||||
errorMsg = XMLHttpResponse.responseText.substring(start, end);
|
||||
}
|
||||
if(errorMsg.length > 0)
|
||||
$subgridItem.data("afterActionInfo", ((label + " action failed. Reason: " + sanitizeXSS(unescape(errorMsg)))));
|
||||
$subgridItem.find("#action_message_box #description").text(label + " action failed. Reason: " + sanitizeXSS(unescape(errorMsg)));
|
||||
else
|
||||
$subgridItem.data("afterActionInfo", (label + " action failed."));
|
||||
$subgridItem.find("#action_message_box #description").text(label + " action failed.");
|
||||
$subgridItem.find("#action_message_box").addClass("error").show();
|
||||
}
|
||||
//***** actions for a subgrid item in right panel (end) **************************************************************************
|
||||
|
||||
|
||||
@ -107,14 +107,14 @@ var volumeActionMap = {
|
||||
"Create Template": {
|
||||
isAsyncJob: true,
|
||||
asyncJobResponse: "createtemplateresponse",
|
||||
dialogBeforeActionFn : doCreateTemplate,
|
||||
dialogBeforeActionFn : doCreateTemplateFromVolume,
|
||||
inProcessText: "Creating template....",
|
||||
afterActionSeccessFn: function(){}
|
||||
}
|
||||
}
|
||||
|
||||
function doCreateTemplate($actionLink, listAPIMap, $singleObject) {
|
||||
var jsonObj = $singleObject.data("jsonObj");
|
||||
function doCreateTemplateFromVolume($actionLink, listAPIMap, $detailsTab) {
|
||||
var jsonObj = $detailsTab.data("jsonObj");
|
||||
$("#dialog_create_template").find("#volume_name").text(jsonObj.name);
|
||||
|
||||
$("#dialog_create_template")
|
||||
@ -136,7 +136,7 @@ function doCreateTemplate($actionLink, listAPIMap, $singleObject) {
|
||||
var isPublic = thisDialog.find("#create_template_public").val();
|
||||
var password = thisDialog.find("#create_template_password").val();
|
||||
|
||||
var id = $singleObject.data("jsonObj").id;
|
||||
var id = $detailsTab.data("jsonObj").id;
|
||||
var apiCommand = "command=createTemplate&volumeId="+id+"&name="+encodeURIComponent(name)+"&displayText="+encodeURIComponent(desc)+"&osTypeId="+osType+"&isPublic="+isPublic+"&passwordEnabled="+password;
|
||||
doActionToDetailsTab(id, $actionLink, apiCommand, listAPIMap);
|
||||
},
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user