apache/cloudstack
1
0
Fork 0
mirror of https://github.com/apache/cloudstack.git synced 2025-11-02 11:52:28 +01:00
Code Issues Packages Projects Releases Wiki Activity

new UI - domain page - implement update resource limits. Make right panel editable when clicking edit button instead of pop up dialog box.

Browse Source
This commit is contained in:
Jessica Wang 2010-09-28 19:03:23 -07:00
parent 319d4f1aa0
commit 7c247b2fa8
4 changed files with 200 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

110
ui/new/jsp/domain.jsp
View File

@ -22,31 +22,12 @@
</p>
</div>
<div class="tabbox" style="margin-top: 15px;">
<div class="content_tabs on">
<div class="content_tabs on" id="tab_details">
<%=t.t("Details")%></div>
</div>
<div class="content_tabs off" id="tab_resource_limits">
<%=t.t("Resource.Limits")%></div>
</div>
<div id="tab_content_details">
<div class="grid_actionpanel">
<div class="grid_actionbox" id="action_link">
<div class="grid_actionsdropdown_box" id="action_menu" style="display: none;">
<ul class="actionsdropdown_boxlist" id="action_list">
<!--
<li> <a href="#"> Delete </a> </li>
<li> <a href="#"> Attach Disk </a> </li>
-->
</ul>
</div>
</div>
<div class="grid_editbox">
</div>
<div class="gridheader_loaderbox" id="spinning_wheel" style="border: 1px solid #999;
display: none;">
<div class="gridheader_loader" id="icon">
</div>
<p id="description">
Detaching Disk &hellip;</p>
</div>
</div>
<div class="grid_container">
<div class="grid_rows odd">
<div class="grid_row_cell" style="width: 20%;">
@ -99,7 +80,88 @@
</div>
</div>
</div>
</div>
</div>
<div id="tab_content_resource_limits" style="display:none">
<div class="grid_actionpanel">
<div class="grid_editbox" id="edit_button">
</div>
<div class="gridheader_loaderbox" id="spinning_wheel" style="border: 1px solid #999;
display: none;">
<div class="gridheader_loader" id="Div1">
</div>
<p id="description">
Updating Resource Limits.... &hellip;</p>
</div>
</div>
<div class="grid_container">
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("Instance.Limit")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="limits_vm">
</div>
<input class="text" id="limits_vm_edit" value="-1" style="width: 200px; display: none;" type="text" />
<div id="limits_vm_edit_errormsg" style="display:none"></div>
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("Public.IP.Limit")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="limits_ip">
</div>
<input class="text" id="limits_ip_edit" value="-1" style="width: 200px; display: none;" type="text" />
<div id="limits_ip_edit_errormsg" style="display:none"></div>
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("Disk.Volume.Limit")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="limits_volume">
</div>
<input class="text" id="limits_volume_edit" value="-1" style="width: 200px; display: none;" type="text" />
<div id="limits_volume_edit_errormsg" style="display:none"></div>
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("Snapshot.Limit")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="limits_snapshot">
</div>
<input class="text" id="limits_snapshot_edit" value="-1" style="width: 200px; display: none;" type="text" />
<div id="limits_snapshot_edit_errormsg" style="display:none"></div>
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("Template.Limit")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="limits_template">
</div>
<input class="text" id="limits_template_edit" value="-1" style="width: 200px; display: none;" type="text" />
<div id="limits_template_edit_errormsg" style="display:none"></div>
</div>
</div>
</div>
<div class="grid_botactionpanel">
<div class="gridbot_buttons" id="save_button" style="display:none;">Save</div>
<div class="gridbot_buttons" id="cancel_button" style="display:none;">Cancel</div>
</div>
</div>
</div>
<!-- domain detail panel (end) -->

108
ui/new/scripts/cloud.core2.domain.js
View File

@ -21,6 +21,9 @@ function afterLoadDomainJSP() {
//var breadcrumbPieceTemplate = $("#breadcrumb_piece_template");
var childParentMap = {}; //map childDomainId to parentDomainId
var domainIdNameMap = {}; //map domainId to domainName
var $detailsTab = $("#right_panel_content #tab_content_details");
var $resourceLimitsTab = $("#right_panel_content #tab_content_resource_limits");
/*
activateDialog($("#dialog_resource_limits").dialog({
@ -87,11 +90,12 @@ function afterLoadDomainJSP() {
template.find("#grid_row_cell2").text(json.name);
}
function updateResourceLimit(domainId, type, max) {
function updateResourceLimit(domainId, type, max, $readonlyField) {
$.ajax({
data: createURL("command=updateResourceLimit&domainid="+domainId+"&resourceType="+type+"&max="+max),
dataType: "json",
success: function(json) {
success: function(json) {
$readonlyField.text(max);
}
});
}
@ -135,7 +139,6 @@ function afterLoadDomainJSP() {
clickExpandIcon(domainId);
}
else if(action.indexOf("domain_name")!=-1) {
var $detailsTab = $("#right_panel_content #tab_content_details");
$detailsTab.data("jsonObj", jsonObj);
$detailsTab.find("#id").text(domainId);
$detailsTab.find("#name").text(domainName);
@ -204,13 +207,14 @@ function afterLoadDomainJSP() {
});
if (isAdmin() || (isDomainAdmin() && (g_domainid != domainId))) {
$("#limits_container").show();
/*
$("#account_resource_limits").data("domainId", domainId).unbind("click").bind("click", function() {
var domainId = $(this).data("domainId");
$("#tab_resource_limits").show();
//???
//$("#account_resource_limits").data("domainId", domainId).unbind("click").bind("click", function() {
//debugger;
$.ajax({
cache: false,
data: createURL("command=listResourceLimits&domainid="+domainId+"&response=json"),
data: createURL("command=listResourceLimits&domainid="+domainId+"&response=json"),
dataType: "json",
success: function(json) {
var limits = json.listresourcelimitsresponse.resourcelimit;
@ -221,27 +225,34 @@ function afterLoadDomainJSP() {
switch (limit.resourcetype) {
case "0":
preInstanceLimit = limit.max;
$("#dialog_resource_limits #limits_vm").val(limit.max);
$resourceLimitsTab.find("#limits_vm").text(preInstanceLimit);
$resourceLimitsTab.find("#limits_vm_edit").val(preInstanceLimit);
break;
case "1":
preIpLimit = limit.max;
$("#dialog_resource_limits #limits_ip").val(limit.max);
$resourceLimitsTab.find("#limits_ip").text(preIpLimit);
$resourceLimitsTab.find("#limits_ip_edit").val(preIpLimit);
break;
case "2":
preDiskLimit = limit.max;
$("#dialog_resource_limits #limits_volume").val(limit.max);
$resourceLimitsTab.find("#limits_volume").text(preDiskLimit);
$resourceLimitsTab.find("#limits_volume_edit").val(preDiskLimit);
break;
case "3":
preSnapshotLimit = limit.max;
$("#dialog_resource_limits #limits_snapshot").val(limit.max);
$resourceLimitsTab.find("#limits_snapshot").text(preSnapshotLimit);
$resourceLimitsTab.find("#limits_snapshot_edit").val(preSnapshotLimit);
break;
case "4":
preTemplateLimit = limit.max;
$("#dialog_resource_limits #limits_template").val(limit.max);
$resourceLimitsTab.find("#limits_template").text(preTemplateLimit);
$resourceLimitsTab.find("#limits_template_edit").val(preTemplateLimit);
break;
}
}
}
/*
$("#dialog_resource_limits")
.dialog('option', 'buttons', {
"Save": function() {
@ -281,13 +292,18 @@ function afterLoadDomainJSP() {
$(this).dialog("close");
}
}).dialog("open");
*/
}
});
return false;
});
*/
//return false;
//});
//???
} else {
$("#limits_container").hide();
$("#tab_resource_limits").hide();
}
rightPanelDetailContent.show();
@ -401,4 +417,62 @@ function afterLoadDomainJSP() {
}
refreshWholeTree(defaultRootDomainId, defaultRootLevel);
//***** switch to different tab (begin) ********************************************************************
$("#tab_details").bind("click", function(event){
$(this).removeClass("off").addClass("on");
$("#tab_resource_limits").removeClass("on").addClass("off");
$("#tab_content_details").show();
$("#tab_content_resource_limits").hide();
return false;
});
$("#tab_resource_limits").bind("click", function(event){
$(this).removeClass("off").addClass("on");
$("#tab_details").removeClass("on").addClass("off");
$("#tab_content_resource_limits").show();
$("#tab_content_details").hide();
return false;
});
//***** switch to different tab (end) **********************************************************************
//edit button ***
var $readonlyFields = $resourceLimitsTab.find("#limits_vm, #limits_ip, #limits_volume, #limits_snapshot, #limits_template");
var $editFields = $resourceLimitsTab.find("#limits_vm_edit, #limits_ip_edit, #limits_volume_edit, #limits_snapshot_edit, #limits_template_edit");
initializeEditFunction($readonlyFields, $editFields, doUpdateResourceLimits);
function doUpdateResourceLimits() {
var isValid = true;
isValid &= validateNumber("Instance Limit", $resourceLimitsTab.find("#limits_vm_edit"), $resourceLimitsTab.find("#limits_vm_edit_errormsg"), -1, 32000, false);
isValid &= validateNumber("Public IP Limit", $resourceLimitsTab.find("#limits_ip_edit"), $resourceLimitsTab.find("#limits_ip_edit_errormsg"), -1, 32000, false);
isValid &= validateNumber("Disk Volume Limit", $resourceLimitsTab.find("#limits_volume_edit"), $resourceLimitsTab.find("#limits_volume_edit_errormsg"), -1, 32000, false);
isValid &= validateNumber("Snapshot Limit", $resourceLimitsTab.find("#limits_snapshot_edit"), $resourceLimitsTab.find("#limits_snapshot_edit_errormsg"), -1, 32000, false);
isValid &= validateNumber("Template Limit", $resourceLimitsTab.find("#limits_template_edit"), $resourceLimitsTab.find("#limits_template_edit_errormsg"), -1, 32000, false);
if (!isValid) return;
var jsonObj = $detailsTab.data("jsonObj");
var domainId = jsonObj.id;
var instanceLimit = trim($resourceLimitsTab.find("#limits_vm_edit").val());
var ipLimit = trim($resourceLimitsTab.find("#limits_ip_edit").val());
var diskLimit = trim($resourceLimitsTab.find("#limits_volume_edit").val());
var snapshotLimit = trim($resourceLimitsTab.find("#limits_snapshot_edit").val());
var templateLimit = trim($resourceLimitsTab.find("#limits_template_edit").val());
if (instanceLimit != $resourceLimitsTab.find("#limits_vm").text()) {
updateResourceLimit(domainId, 0, instanceLimit, $resourceLimitsTab.find("#limits_vm"));
}
if (ipLimit != $resourceLimitsTab.find("#limits_ip").text()) {
updateResourceLimit(domainId, 1, ipLimit, $resourceLimitsTab.find("#limits_ip"));
}
if (diskLimit != $resourceLimitsTab.find("#limits_volume").text()) {
updateResourceLimit(domainId, 2, diskLimit, $resourceLimitsTab.find("#limits_volume"));
}
if (snapshotLimit != $resourceLimitsTab.find("#limits_snapshot").text()) {
updateResourceLimit(domainId, 3, snapshotLimit, $resourceLimitsTab.find("#limits_snapshot"));
}
if (templateLimit != $resourceLimitsTab.find("#limits_template").text()) {
updateResourceLimit(domainId, 4, templateLimit, $resourceLimitsTab.find("#limits_template"));
}
}
}

22
ui/new/scripts/cloud.core2.js
View File

@ -642,7 +642,27 @@ function bindClickToMidMenu($midmenuItem1, toRightPanel, getMidmenuId) {
});
}
function initializeEditFunction($readonlyFields, $editFields, doUpdateFn) {
$("#edit_button").bind("click", function(event){
$readonlyFields.hide();
$editFields.show();
$("#cancel_button, #save_button").show()
return false;
});
$("#cancel_button").bind("click", function(event){
$editFields.hide();
$readonlyFields.show();
$("#save_button, #cancel_button").hide();
return false;
});
$("#save_button").bind("click", function(event){
doUpdateFn();
$editFields.hide();
$readonlyFields.show();
$("#save_button, #cancel_button").hide();
return false;
});
}

23
ui/new/scripts/cloud.core2.template.js
View File

@ -82,27 +82,8 @@ function afterLoadTemplateJSP() {
//edit button ***
var $readonlyFields = $detailsTab.find("#name, #displaytext, #passwordenabled, #ispublic, #isfeatured, #ostypename");
var $editFields = $detailsTab.find("#name_edit, #displaytext_edit, #passwordenabled_edit, #ispublic_edit, #isfeatured_edit, #ostypename_edit");
$("#edit_button").bind("click", function(event){
$readonlyFields.hide();
$editFields.show();
$("#cancel_button, #save_button").show()
return false;
});
$("#cancel_button").bind("click", function(event){
$editFields.hide();
$readonlyFields.show();
$("#save_button, #cancel_button").hide();
return false;
});
$("#save_button").bind("click", function(event){
doUpdateTemplate();
$editFields.hide();
$readonlyFields.show();
$("#save_button, #cancel_button").hide();
return false;
});
var $editFields = $detailsTab.find("#name_edit, #displaytext_edit, #passwordenabled_edit, #ispublic_edit, #isfeatured_edit, #ostypename_edit");
initializeEditFunction($readonlyFields, $editFields, doUpdateTemplate);
//populate dropdown ***
var addTemplateZoneField = $("#dialog_add_template #add_template_zone");