etan39
/
cloudstack
mirror of https://github.com/apache/cloudstack.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

new UI - resources page - implement Add Zone action.

This commit is contained in:
Jessica Wang 2010-10-15 10:06:19 -07:00
parent 84d2a0c842
commit 2fd8c769dc
10 changed files with 190 additions and 120 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
ui/new/index.jsp
View File

@ -176,40 +176,48 @@ long milliseconds = new Date().getTime();
<div class="actionpanel_button">
<div class="actionpanel_button_icons">
<img src="images/addvm_actionicon.png" alt="Add" /></div>
<div class="actionpanel_button_links">
<div class="actionpanel_button_links" id="label">
<%=t.t("add")%></div>
</div>
</div>
<div class="actionpanel_button_wrapper" id="midmenu_add_link" style="display: none;">
<div class="actionpanel_button_wrapper" id="midmenu_add2_link" style="display: none;">
<div class="actionpanel_button">
<div class="actionpanel_button_icons">
<img src="images/startvm_actionicon.png" alt="Start" /></div>
<div class="actionpanel_button_links">
Start</div>
<img src="images/addvm_actionicon.png" alt="Add" /></div>
<div class="actionpanel_button_links" id="label">
<%=t.t("add")%></div>
</div>
</div>
<div class="actionpanel_button_wrapper" id="midmenu_add_link" style="display: none;">
<div class="actionpanel_button_wrapper" id="midmenu_startvm_link" style="display: none;">
<div class="actionpanel_button">
<div class="actionpanel_button_icons">
<img src="images/stopvm_actionicon.png" alt="Stop" /></div>
<img src="images/startvm_actionicon.png" alt="Start VM" /></div>
<div class="actionpanel_button_links">
Stop</div>
Start VM</div>
</div>
</div>
<div class="actionpanel_button_wrapper" id="midmenu_add_link" style="display: none;">
<div class="actionpanel_button_wrapper" id="midmenu_stopvm_link" style="display: none;">
<div class="actionpanel_button">
<div class="actionpanel_button_icons">
<img src="images/rebootvm_actionicon.png" alt="Reboot" /></div>
<img src="images/stopvm_actionicon.png" alt="Stop VM" /></div>
<div class="actionpanel_button_links">
Reboot</div>
Stop VM</div>
</div>
</div>
<div class="actionpanel_button_wrapper" id="midmenu_add_link" style="display: none;">
<div class="actionpanel_button_wrapper" id="midmenu_rebootvm_link" style="display: none;">
<div class="actionpanel_button">
<div class="actionpanel_button_icons">
<img src="images/destroyvm_actionicon.png" alt="Destroy" /></div>
<img src="images/rebootvm_actionicon.png" alt="Reboot VM" /></div>
<div class="actionpanel_button_links">
Destroy</div>
Reboot VM</div>
</div>
</div>
<div class="actionpanel_button_wrapper" id="midmenu_destoryvm_link" style="display: none;">
<div class="actionpanel_button">
<div class="actionpanel_button_icons">
<img src="images/destroyvm_actionicon.png" alt="Destroy VM" /></div>
<div class="actionpanel_button_links">
Destroy VM</div>
</div>
</div>
<div class="actionpanel_button_wrapper" id="add_link" style="display: block; float: right;

149
ui/new/jsp/resource.jsp
View File

@ -625,6 +625,57 @@
</div>
</div>
<!-- domain detail panel (end) -->
<!-- Add Zone Dialog -->
<div id="dialog_add_zone" title="Add Zone" style="display:none">
<p>Please enter the following info to add a new zone:</p>
<div class="dialog_formcontent">
<form action="#" method="post" id="form_acquire">
<ol>
<li>
<label>Name:</label>
<input class="text" type="text" name="add_zone_name" id="add_zone_name"/>
<div id="add_zone_name_errormsg" class="dialog_formcontent_errormsg" style="display:none;" ></div>
</li>
<li>
<label>DNS 1:</label>
<input class="text" type="text" name="add_zone_dns1" id="add_zone_dns1"/>
<div id="add_zone_dns1_errormsg" class="dialog_formcontent_errormsg" style="display:none;" ></div>
</li>
<li>
<label>DNS 2:</label>
<input class="text" type="text" name="add_zone_dns2" id="add_zone_dns2"/>
<div id="add_zone_dns2_errormsg" class="dialog_formcontent_errormsg" style="display:none;" ></div>
</li>
<li>
<label>Internal DNS 1:</label>
<input class="text" type="text" id="add_zone_internaldns1"/>
<div id="add_zone_internaldns1_errormsg" class="dialog_formcontent_errormsg" style="display:none;" ></div>
</li>
<li>
<label>Internal DNS 2:</label>
<input class="text" type="text" id="add_zone_internaldns2"/>
<div id="add_zone_internaldns2_errormsg" class="dialog_formcontent_errormsg" style="display:none;" ></div>
</li>
<li id="add_zone_container">
<label>Zone VLAN Range:</label>
<input class="text" style="width:67px" type="text" name="add_zone_startvlan" id="add_zone_startvlan"/><span>-</span>
<input class="text" style="width:67px" type="text" name="add_zone_endvlan" id="add_zone_endvlan"/>
<div id="add_zone_startvlan_errormsg" class="dialog_formcontent_errormsg" style="display:none;" ></div>
<div id="add_zone_endvlan_errormsg" class="dialog_formcontent_errormsg" style="display:none;" ></div>
</li>
<li>
<label for="add_zone_guestcidraddress">Guest CIDR:</label>
<input class="text" type="text" id="add_zone_guestcidraddress" value="10.1.1.0/24"/>
<div id="add_zone_guestcidraddress_errormsg" class="dialog_formcontent_errormsg" style="display:none;" ></div>
</li>
</ol>
</form>
</div>
</div>
<!-- END Add Zone Dialog -->
<!-- treenode template (begin) -->
<div id="treenode_template" class="tree_levelspanel" style="display: none">
<div class="tree_levelsbox" style="margin-left: 20px;">
@ -639,104 +690,6 @@
</div>
</div>
<!-- treenode template (end) -->
<!-- admin account tab template (begin) -->
<div class="grid_container" id="admin_account_tab_template" style="display: none">
<div class="grid_header">
<div class="grid_header_title" id="title">
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("ID")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="id">
</div>
</div>
</div>
<div class="grid_rows odd">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("Role")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="role">
</div>
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("Account")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="account">
</div>
</div>
</div>
<div class="grid_rows odd">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("Domain")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="domain">
</div>
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("VMs")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="vm_total">
</div>
</div>
</div>
<div class="grid_rows odd">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("IPs")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="ip_total">
</div>
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("Bytes.Received")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="bytes_received">
</div>
</div>
</div>
<div class="grid_rows odd">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("Bytes.Sent")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="bytes_sent">
</div>
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 20%;">
<div class="row_celltitles">
<%=t.t("State")%>:</div>
</div>
<div class="grid_row_cell" style="width: 79%;">
<div class="row_celltitles" id="state">
</div>
</div>
</div>
</div>
<!-- admin account tab template (end) -->
<!-- Zonetree Template (begin) -->
<div class="zonetree_contentbox" id="zonetree" style="display: none">
<div id="zones_container">

1
ui/new/scripts/cloud.core2.diskoffering.js
View File

@ -10,6 +10,7 @@ function afterLoadDiskOfferingJSP() {
initDialog("dialog_add_disk");
//add button ***
$("#midmenu_add_link").find("#label").text("Add Disk Offering");
$("#midmenu_add_link").show();
$("#midmenu_add_link").unbind("click").bind("click", function(event) {
var dialogAddDisk = $("#dialog_add_disk");

1
ui/new/scripts/cloud.core2.instance.js
View File

@ -1,4 +1,5 @@
function clickInstanceGroupHeader($arrowIcon) {
$("#midmenu_add_link").find("#label").text("Add VM");
$("#midmenu_add_link").show();
if($arrowIcon.hasClass("expanded_close") == true) {

2
ui/new/scripts/cloud.core2.ipaddress.js
View File

@ -25,7 +25,7 @@ function afterLoadIpJSP() {
}
});
$("#midmenu_add_link").find("#label").text("Acquire New IP");
$("#midmenu_add_link").show();
$("#midmenu_add_link").unbind("click").bind("click", function(event) {
var submenuContent = $("#submenu_content_network");

1
ui/new/scripts/cloud.core2.iso.js
View File

@ -5,6 +5,7 @@ function afterLoadIsoJSP() {
var $detailsTab = $("#right_panel_content #tab_content_details");
//add button ***
$("#midmenu_add_link").find("#label").text("Add ISO");
$("#midmenu_add_link").show();
$("#midmenu_add_link").unbind("click").bind("click", function(event) {
$("#dialog_add_iso")

117
ui/new/scripts/cloud.core2.resource.js
View File

@ -37,7 +37,7 @@ function afterLoadResourceJSP() {
var container = $("#zonetree1").find("#zones_container").empty();
if (items != null && items.length > 0) {
for (var i = 0; i < items.length; i++) {
var template = $("#zone_template").clone(true).attr("id", "zone_"+items[i].id);
var template = $("#zone_template").clone(true);
zoneJSONToTreeNode(items[i], template);
container.append(template.show());
}
@ -60,7 +60,7 @@ function afterLoadResourceJSP() {
var container = template.find("#pods_container").empty();
if (items != null && items.length > 0) {
for (var i = 0; i < items.length; i++) {
var podTemplate = $("#pod_template").clone(true).attr("id", "pod_"+items[i].id);
var podTemplate = $("#pod_template").clone(true);
podJSONToTreeNode(items[i], podTemplate);
container.append(podTemplate.show());
forceLogout = false; // We don't force a logout if pod(s) exit.
@ -77,7 +77,7 @@ function afterLoadResourceJSP() {
var container = template.find("#systemvms_container").empty();
if (items != null && items.length > 0) {
for (var i = 0; i < items.length; i++) {
var systemvmTemplate = $("#systemvm_template").clone(true).attr("id", "systemvm_"+items[i].id);
var systemvmTemplate = $("#systemvm_template").clone(true);
systemvmJSONToTreeNode(items[i], systemvmTemplate);
container.append(systemvmTemplate.show());
}
@ -104,7 +104,7 @@ function afterLoadResourceJSP() {
var container = template.find("#clusters_container").empty();
if (items != null && items.length > 0) {
for (var i = 0; i < items.length; i++) {
var clusterTemplate = $("#cluster_template").clone(true).attr("id", "cluster_"+items[i].id);
var clusterTemplate = $("#cluster_template").clone(true);
clusterJSONToTreeNode(items[i], clusterTemplate);
container.append(clusterTemplate.show());
}
@ -122,6 +122,7 @@ function afterLoadResourceJSP() {
}
function clusterJSONToTreeNode(json, template) {
template.attr("id", "cluster_"+json.id);
template.data("id", json.id).data("name", fromdb(json.name));
var clusterName = template.find("#cluster_name").text(fromdb(json.name));
clusterName.data("jsonObj", json);
@ -134,7 +135,7 @@ function afterLoadResourceJSP() {
var container = template.find("#hosts_container").empty();
if (items != null && items.length > 0) {
for (var i = 0; i < items.length; i++) {
var hostTemplate = $("#host_template").clone(true).attr("id", "host_"+items[i].id);
var hostTemplate = $("#host_template").clone(true);
hostJSONToTreeNode(items[i], hostTemplate);
container.append(hostTemplate.show());
}
@ -150,7 +151,7 @@ function afterLoadResourceJSP() {
var container = template.find("#primarystorages_container").empty();
if (items != null && items.length > 0) {
for (var i = 0; i < items.length; i++) {
var primaryStorageTemplate = $("#primarystorage_template").clone(true).attr("id", "primary_storage_"+items[i].id);
var primaryStorageTemplate = $("#primarystorage_template").clone(true);
primaryStorageJSONToTreeNode(items[i], primaryStorageTemplate);
container.append(primaryStorageTemplate.show());
}
@ -160,12 +161,14 @@ function afterLoadResourceJSP() {
}
function hostJSONToTreeNode(json, template) {
template.attr("id", "host_"+json.id);
template.data("id", json.id).data("name", fromdb(json.name));
var hostName = template.find("#host_name").text(fromdb(json.name));
hostName.data("jsonObj", json);
}
function primaryStorageJSONToTreeNode(json, template) {
template.attr("id", "primary_storage_"+json.id);
template.data("id", json.id).data("name", fromdb(json.name));
var primaryStorageName = template.find("#primarystorage_name").text(fromdb(json.name));
primaryStorageName.data("jsonObj", json);
@ -321,7 +324,7 @@ function afterLoadResourceJSP() {
function zoneJsonToNetworkTab(jsonObj) {
var $networkTab = $zonePage.find("#tab_content_network");
$networkTab.find("#zone_cloud").find("#zone_name").text(jsonObj.name);
$networkTab.find("#zone_cloud").find("#zone_name").text(fromdb(jsonObj.name));
$networkTab.find("#zone_vlan").text(jsonObj.vlan);
$.ajax({
@ -444,5 +447,105 @@ function afterLoadResourceJSP() {
return text;
}
//***** systemVM page (end) ***************************************************************************************************
//dialogs
initDialog("dialog_add_zone");
//add button ***
$("#midmenu_add_link").find("#label").text("Add Zone");
$("#midmenu_add_link").show();
$("#midmenu_add_link").unbind("click").bind("click", function(event) {
$("#dialog_add_zone")
.dialog('option', 'buttons', {
"Add": function() {
var thisDialog = $(this);
// validate values
var isValid = true;
isValid &= validateString("Name", thisDialog.find("#add_zone_name"), thisDialog.find("#add_zone_name_errormsg"));
isValid &= validateIp("DNS 1", thisDialog.find("#add_zone_dns1"), thisDialog.find("#add_zone_dns1_errormsg"), false); //required
isValid &= validateIp("DNS 2", thisDialog.find("#add_zone_dns2"), thisDialog.find("#add_zone_dns2_errormsg"), true); //optional
isValid &= validateIp("Internal DNS 1", thisDialog.find("#add_zone_internaldns1"), thisDialog.find("#add_zone_internaldns1_errormsg"), false); //required
isValid &= validateIp("Internal DNS 2", thisDialog.find("#add_zone_internaldns2"), thisDialog.find("#add_zone_internaldns2_errormsg"), true); //optional
if (getNetworkType() != "vnet") {
isValid &= validateString("Zone - Start VLAN Range", thisDialog.find("#add_zone_startvlan"), thisDialog.find("#add_zone_startvlan_errormsg"), false); //required
isValid &= validateString("Zone - End VLAN Range", thisDialog.find("#add_zone_endvlan"), thisDialog.find("#add_zone_endvlan_errormsg"), true); //optional
}
isValid &= validateCIDR("Guest CIDR", thisDialog.find("#add_zone_guestcidraddress"), thisDialog.find("#add_zone_guestcidraddress_errormsg"), false); //required
if (!isValid)
return;
thisDialog.dialog("close");
var moreCriteria = [];
var name = trim(thisDialog.find("#add_zone_name").val());
moreCriteria.push("&name="+todb(name));
var dns1 = trim(thisDialog.find("#add_zone_dns1").val());
moreCriteria.push("&dns1="+encodeURIComponent(dns1));
var dns2 = trim(thisDialog.find("#add_zone_dns2").val());
if (dns2 != null && dns2.length > 0)
moreCriteria.push("&dns2="+encodeURIComponent(dns2));
var internaldns1 = trim(thisDialog.find("#add_zone_internaldns1").val());
moreCriteria.push("&internaldns1="+encodeURIComponent(internaldns1));
var internaldns2 = trim(thisDialog.find("#add_zone_internaldns2").val());
if (internaldns2 != null && internaldns2.length > 0)
moreCriteria.push("&internaldns2="+encodeURIComponent(internaldns2));
if (getNetworkType() != "vnet") {
var vlanStart = trim(thisDialog.find("#add_zone_startvlan").val());
var vlanEnd = trim(thisDialog.find("#add_zone_endvlan").val());
if (vlanEnd != null && vlanEnd.length > 0)
moreCriteria.push("&vlan=" + encodeURIComponent(vlanStart + "-" + vlanEnd));
else
moreCriteria.push("&vlan=" + encodeURIComponent(vlanStart));
}
var guestcidraddress = trim(thisDialog.find("#add_zone_guestcidraddress").val());
moreCriteria.push("&guestcidraddress="+encodeURIComponent(guestcidraddress));
var template = $("#zone_template").clone(true);
var loadingImg = template.find(".adding_loading");
var row_container = template.find("#row_container");
$("#zonetree1").find("#zones_container").prepend(template);
loadingImg.show();
row_container.hide();
template.fadeIn("slow");
$.ajax({
data: createURL("command=createZone"+moreCriteria.join("")),
dataType: "json",
success: function(json) {
var item = json.createzoneresponse;
zoneJSONToTreeNode(item, template);
loadingImg.hide();
row_container.show();
},
error: function(XMLHttpResponse) {
handleError(XMLHttpResponse);
template.slideUp("slow", function() {
$(this).remove();
});
}
});
},
"Cancel": function() {
var thisDialog = $(this);
thisDialog.dialog("close");
cleanErrMsg(thisDialog.find("#add_zone_name"), thisDialog.find("#add_zone_name_errormsg"));
cleanErrMsg(thisDialog.find("#add_zone_dns1"), thisDialog.find("#add_zone_dns1_errormsg"));
cleanErrMsg(thisDialog.find("#add_zone_dns2"), thisDialog.find("#add_zone_dns2_errormsg"));
cleanErrMsg(thisDialog.find("#add_zone_internaldns1"), thisDialog.find("#add_zone_internaldns1_errormsg"));
cleanErrMsg(thisDialog.find("#add_zone_internaldns2"), thisDialog.find("#add_zone_internaldns2_errormsg"));
cleanErrMsg(thisDialog.find("#add_zone_startvlan"), thisDialog.find("#add_zone_startvlan_errormsg"));
cleanErrMsg(thisDialog.find("#add_zone_guestcidraddress"), thisDialog.find("#add_zone_guestcidraddress_errormsg"));
}
}).dialog("open");
return false;
});
}

1
ui/new/scripts/cloud.core2.serviceoffering.js
View File

@ -10,6 +10,7 @@ function afterLoadServiceOfferingJSP() {
initDialog("dialog_add_service");
//add button ***
$("#midmenu_add_link").find("#label").text("Add Service Offering");
$("#midmenu_add_link").show();
$("#midmenu_add_link").unbind("click").bind("click", function(event) {
var dialogAddService = $("#dialog_add_service");

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

@ -34,6 +34,7 @@ function afterLoadTemplateJSP() {
$("#dialog_add_template #add_template_featured_container, #dialog_edit_template #edit_template_featured_container").hide();
//add button ***
$("#midmenu_add_link").find("#label").text("Add Template");
$("#midmenu_add_link").show();
$("#midmenu_add_link").unbind("click").bind("click", function(event) {
$("#dialog_add_template")

1
ui/new/scripts/cloud.core2.volume.js
View File

@ -84,6 +84,7 @@ function afterLoadVolumeJSP() {
});
//add button ***
$("#midmenu_add_link").find("#label").text("Add Volume");
$("#midmenu_add_link").show();
$("#midmenu_add_link").unbind("click").bind("click", function(event) {
$("#dialog_add_volume")