mirror of https://github.com/apache/cloudstack.git
bug 7448: zone tree - network - public network - add "Firewall" tab, "Load Balancer" tab.
This commit is contained in:
Jessica Wang
parent
f497e8eab3
commit
fa45669a8a
|
|
@ -18,7 +18,185 @@
|
|||
<div class="info_detailbox errorbox" id="after_action_info_container_on_top" style="display: none">
|
||||
<p id="after_action_info">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ***** Public Network Page (begin) ***** -->
|
||||
<div id="public_network_page" style="display:none">
|
||||
<div class="tabbox" style="margin-top: 15px;">
|
||||
<div class="content_tabs on" id="tab_details">
|
||||
<%=t.t("details")%></div>
|
||||
<div class="content_tabs off" id="tab_ipallocation">
|
||||
<%=t.t("IP.allocation")%></div>
|
||||
<div class="content_tabs off" id="tab_firewall">
|
||||
<%=t.t("firewall")%></div>
|
||||
<div class="content_tabs off" id="tab_loadbalancer">
|
||||
<%=t.t("load.balancer")%></div>
|
||||
</div>
|
||||
<!-- Details tab (end)-->
|
||||
<div id="tab_content_details">
|
||||
<div id="tab_spinning_wheel" class="rightpanel_mainloader_panel" style="display: none;">
|
||||
<div class="rightpanel_mainloaderbox">
|
||||
<div class="rightpanel_mainloader_animatedicon">
|
||||
</div>
|
||||
<p>
|
||||
Loading …</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tab_container">
|
||||
<div class="grid_container">
|
||||
<div class="grid_header">
|
||||
<div class="grid_header_title">Title</div>
|
||||
<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><%=t.t("no.available.actions")%></li>
|
||||
</ul>
|
||||
</div>
|
||||
</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">
|
||||
Waiting …</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<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 even">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("Name")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="name">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("displaytext")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="displaytext">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("vlan")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="vlan">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("gateway")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="gateway">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("netmask")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="netmask">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("iprange")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="iprange">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
<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 odd">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Details tab (end)-->
|
||||
|
||||
<!-- IP Allocation tab (start)-->
|
||||
<div style="display: none;" id="tab_content_ipallocation">
|
||||
<div id="tab_spinning_wheel" class="rightpanel_mainloader_panel" style="display:none;">
|
||||
<div class="rightpanel_mainloaderbox">
|
||||
<div class="rightpanel_mainloader_animatedicon"></div>
|
||||
<p>Loading …</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tab_container">
|
||||
</div>
|
||||
</div>
|
||||
<!-- IP Allocation tab (end)-->
|
||||
|
||||
<!-- Firewall tab (start)-->
|
||||
<div style="display: none;" id="tab_content_firewall">
|
||||
<div id="tab_spinning_wheel" class="rightpanel_mainloader_panel" style="display:none;">
|
||||
<div class="rightpanel_mainloaderbox">
|
||||
<div class="rightpanel_mainloader_animatedicon"></div>
|
||||
<p>Loading …</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tab_container">
|
||||
</div>
|
||||
</div>
|
||||
<!-- Firewall tab (end)-->
|
||||
|
||||
<!-- Load Balancer tab (start)-->
|
||||
<div style="display: none;" id="tab_content_loadbalancer">
|
||||
<div id="tab_spinning_wheel" class="rightpanel_mainloader_panel" style="display:none;">
|
||||
<div class="rightpanel_mainloaderbox">
|
||||
<div class="rightpanel_mainloader_animatedicon"></div>
|
||||
<p>Loading …</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tab_container">
|
||||
</div>
|
||||
</div>
|
||||
<!-- Load Balancer tab (end)-->
|
||||
</div>
|
||||
<!-- ***** Public Network Page (end) ***** -->
|
||||
|
||||
<!-- ***** Direct Network Page (begin) ***** -->
|
||||
<div id="direct_network_page" style="display:none">
|
||||
<div class="tabbox" style="margin-top: 15px;">
|
||||
|
|
@ -166,154 +344,6 @@
|
|||
|
||||
</div>
|
||||
<!-- ***** Direct Network Page (end) ***** -->
|
||||
|
||||
<!-- ***** Public Network Page (begin) ***** -->
|
||||
<div id="public_network_page" style="display:none">
|
||||
<div class="tabbox" style="margin-top: 15px;">
|
||||
<div class="content_tabs on" id="tab_details">
|
||||
<%=t.t("Details")%></div>
|
||||
<div class="content_tabs off" id="tab_ipallocation">
|
||||
<%=t.t("IP Allocation")%></div>
|
||||
</div>
|
||||
<!-- Details tab (end)-->
|
||||
<div id="tab_content_details">
|
||||
<div id="tab_spinning_wheel" class="rightpanel_mainloader_panel" style="display: none;">
|
||||
<div class="rightpanel_mainloaderbox">
|
||||
<div class="rightpanel_mainloader_animatedicon">
|
||||
</div>
|
||||
<p>
|
||||
Loading …</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tab_container">
|
||||
<div class="grid_container">
|
||||
<div class="grid_header">
|
||||
<div class="grid_header_title">Title</div>
|
||||
<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><%=t.t("no.available.actions")%></li>
|
||||
</ul>
|
||||
</div>
|
||||
</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">
|
||||
Waiting …</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<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 even">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("Name")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="name">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("displaytext")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="displaytext">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("vlan")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="vlan">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("gateway")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="gateway">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("netmask")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="netmask">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("iprange")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="iprange">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
<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 odd">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Details tab (end)-->
|
||||
|
||||
<!-- IP Allocation tab (start)-->
|
||||
<div style="display: none;" id="tab_content_ipallocation">
|
||||
<div id="tab_spinning_wheel" class="rightpanel_mainloader_panel" style="display:none;">
|
||||
<div class="rightpanel_mainloaderbox">
|
||||
<div class="rightpanel_mainloader_animatedicon"></div>
|
||||
<p>Loading …</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tab_container">
|
||||
</div>
|
||||
</div>
|
||||
<!-- IP Allocation tab (end)-->
|
||||
|
||||
</div>
|
||||
<!-- ***** Public Network Page (end) ***** -->
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -24,23 +24,24 @@ function afterLoadNetworkJSP($leftmenuItem1) {
|
|||
showMiddleMenu();
|
||||
disableMultipleSelectionInMidMenu();
|
||||
|
||||
//switch between different tabs - Public Network page
|
||||
var $publicNetworkPage = $("#public_network_page");
|
||||
var tabArray = [$publicNetworkPage.find("#tab_details"), $publicNetworkPage.find("#tab_ipallocation"), $publicNetworkPage.find("#tab_firewall"), $publicNetworkPage.find("#tab_loadbalancer")];
|
||||
var tabContentArray = [$publicNetworkPage.find("#tab_content_details"), $publicNetworkPage.find("#tab_content_ipallocation"), $publicNetworkPage.find("#tab_content_firewall"), $publicNetworkPage.find("#tab_content_loadbalancer")];
|
||||
var afterSwitchFnArray = [publicNetworkJsonToDetailsTab, publicNetworkJsonToIpAllocationTab, publicNetworkJsonToFirewallTab, publicNetworkJsonToLoadBalancerTab];
|
||||
switchBetweenDifferentTabs(tabArray, tabContentArray, afterSwitchFnArray);
|
||||
|
||||
//switch between different tabs - Direct Network page
|
||||
var $directNetworkPage = $("#direct_network_page");
|
||||
var tabArray = [$directNetworkPage.find("#tab_details"), $directNetworkPage.find("#tab_ipallocation")];
|
||||
var tabContentArray = [$directNetworkPage.find("#tab_content_details"), $directNetworkPage.find("#tab_content_ipallocation")];
|
||||
var afterSwitchFnArray = [directNetworkJsonToDetailsTab, directNetworkJsonToIpAllocationTab];
|
||||
switchBetweenDifferentTabs(tabArray, tabContentArray, afterSwitchFnArray);
|
||||
|
||||
//switch between different tabs - Public Network page
|
||||
var $publicNetworkPage = $("#public_network_page");
|
||||
var tabArray = [$publicNetworkPage.find("#tab_details"), $publicNetworkPage.find("#tab_ipallocation")];
|
||||
var tabContentArray = [$publicNetworkPage.find("#tab_content_details"), $publicNetworkPage.find("#tab_content_ipallocation")];
|
||||
var afterSwitchFnArray = [publicNetworkJsonToDetailsTab, publicNetworkJsonToIpAllocationTab];
|
||||
switchBetweenDifferentTabs(tabArray, tabContentArray, afterSwitchFnArray);
|
||||
switchBetweenDifferentTabs(tabArray, tabContentArray, afterSwitchFnArray);
|
||||
|
||||
//populate items into middle menu
|
||||
var $midmenuContainer = $("#midmenu_container").empty();
|
||||
|
||||
|
||||
//public network
|
||||
if(zoneObj.networktype == "Advanced") {
|
||||
$.ajax({
|
||||
data: createURL("command=listNetworks&isSystem=true&zoneId="+zoneObj.id),
|
||||
|
|
@ -61,6 +62,7 @@ function afterLoadNetworkJSP($leftmenuItem1) {
|
|||
});
|
||||
}
|
||||
|
||||
//direct network
|
||||
$.ajax({
|
||||
data: createURL("command=listNetworks&type=Direct&zoneId="+zoneObj.id),
|
||||
dataType: "json",
|
||||
|
|
@ -79,6 +81,150 @@ function afterLoadNetworkJSP($leftmenuItem1) {
|
|||
});
|
||||
}
|
||||
|
||||
//***** Public Network (begin) ******************************************************************************************************
|
||||
function publicNetworkGetMidmenuId(jsonObj) {
|
||||
return "midmenuItem_publicnetework_" + jsonObj.id;
|
||||
}
|
||||
|
||||
function publicNetworkToMidmenu(jsonObj, $midmenuItem1) {
|
||||
$midmenuItem1.attr("id", publicNetworkGetMidmenuId(jsonObj));
|
||||
$midmenuItem1.data("jsonObj", jsonObj);
|
||||
|
||||
/*
|
||||
var $iconContainer = $midmenuItem1.find("#icon_container").show();
|
||||
$iconContainer.find("#icon").attr("src", "images/midmenuicon_storage_snapshots.png");
|
||||
*/
|
||||
|
||||
$midmenuItem1.find("#first_row").text("Public Network");
|
||||
$midmenuItem1.find("#second_row").text("Network ID: " + fromdb(jsonObj.id));
|
||||
}
|
||||
|
||||
function publicNetworkToRightPanel($midmenuItem1) {
|
||||
copyActionInfoFromMidMenuToRightPanel($midmenuItem1);
|
||||
$("#right_panel_content").data("$midmenuItem1", $midmenuItem1);
|
||||
|
||||
$("#public_network_page").show();
|
||||
$("#direct_network_page").hide();
|
||||
|
||||
$("#public_network_page").find("#tab_details").click();
|
||||
}
|
||||
|
||||
function publicNetworkJsonToDetailsTab() {
|
||||
var $midmenuItem1 = $("#right_panel_content").data("$midmenuItem1");
|
||||
if($midmenuItem1 == null)
|
||||
return;
|
||||
|
||||
var jsonObj = $midmenuItem1.data("jsonObj");
|
||||
if(jsonObj == null)
|
||||
return;
|
||||
|
||||
var $thisTab = $("#right_panel_content #public_network_page #tab_content_details");
|
||||
$thisTab.find("#tab_container").hide();
|
||||
$thisTab.find("#tab_spinning_wheel").show();
|
||||
|
||||
$thisTab.find("#grid_header_title").text(fromdb(jsonObj.name));
|
||||
|
||||
$thisTab.find("#id").text(fromdb(jsonObj.id));
|
||||
$thisTab.find("#name").text(fromdb(jsonObj.name));
|
||||
$thisTab.find("#displaytext").text(fromdb(jsonObj.displaytext));
|
||||
|
||||
$thisTab.find("#vlan").text(fromdb(jsonObj.vlan));
|
||||
$thisTab.find("#gateway").text(fromdb(jsonObj.gateway));
|
||||
$thisTab.find("#netmask").text(fromdb(jsonObj.netmask));
|
||||
var ipRange = getIpRange(fromdb(jsonObj.startip), fromdb(jsonObj.endip));
|
||||
$thisTab.find("#iprange").text(ipRange);
|
||||
|
||||
$thisTab.find("#domain").text(fromdb(jsonObj.domain)); //might be null
|
||||
$thisTab.find("#account").text(fromdb(jsonObj.account)); //might be null
|
||||
|
||||
$thisTab.find("#tab_container").show();
|
||||
$thisTab.find("#tab_spinning_wheel").hide();
|
||||
}
|
||||
|
||||
function publicNetworkJsonToIpAllocationTab() {
|
||||
var $midmenuItem1 = $("#right_panel_content").data("$midmenuItem1");
|
||||
if($midmenuItem1 == null)
|
||||
return;
|
||||
|
||||
var jsonObj = $midmenuItem1.data("jsonObj");
|
||||
if(jsonObj == null)
|
||||
return;
|
||||
|
||||
var $thisTab = $("#right_panel_content #public_network_page #tab_content_ipallocation");
|
||||
$thisTab.find("#tab_container").hide();
|
||||
$thisTab.find("#tab_spinning_wheel").show();
|
||||
|
||||
$.ajax({
|
||||
data: createURL("command=listVlanIpRanges&zoneid="+ jsonObj.zoneid + "&networkid="+jsonObj.id),
|
||||
dataType: "json",
|
||||
success: function(json) {
|
||||
var items = json.listvlaniprangesresponse.vlaniprange;
|
||||
var $container = $thisTab.find("#tab_container").empty();
|
||||
var $template = $("#directnetwork_iprange_template");
|
||||
if(items != null && items.length > 0) {
|
||||
for(var i=0; i<items.length; i++) {
|
||||
var $newTemplate = $template.clone();
|
||||
publicNetworkIprangeJsonToTemplate(items[i], $newTemplate);
|
||||
$container.append($newTemplate.show());
|
||||
}
|
||||
}
|
||||
$thisTab.find("#tab_container").show();
|
||||
$thisTab.find("#tab_spinning_wheel").hide();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function publicNetworkIprangeJsonToTemplate(jsonObj, $template) {
|
||||
$template.attr("id", "publicNetworkIprange_" + jsonObj.id);
|
||||
|
||||
var ipRange = getIpRange(fromdb(jsonObj.startip), fromdb(jsonObj.endip));
|
||||
$template.find("#grid_header_title").text(ipRange);
|
||||
|
||||
$template.find("#vlan").text(jsonObj.vlan)
|
||||
$template.find("#startip").text(fromdb(jsonObj.startip));
|
||||
$template.find("#endip").text(fromdb(jsonObj.endip));
|
||||
}
|
||||
|
||||
function publicNetworkJsonToFirewallTab() {
|
||||
var $midmenuItem1 = $("#right_panel_content").data("$midmenuItem1");
|
||||
if($midmenuItem1 == null)
|
||||
return;
|
||||
|
||||
var jsonObj = $midmenuItem1.data("jsonObj");
|
||||
if(jsonObj == null)
|
||||
return;
|
||||
|
||||
var $thisTab = $("#right_panel_content #public_network_page #tab_content_firewall");
|
||||
$thisTab.find("#tab_container").hide();
|
||||
$thisTab.find("#tab_spinning_wheel").show();
|
||||
|
||||
|
||||
|
||||
$thisTab.find("#tab_container").show();
|
||||
$thisTab.find("#tab_spinning_wheel").hide();
|
||||
}
|
||||
|
||||
function publicNetworkJsonToLoadBalancerTab() {
|
||||
var $midmenuItem1 = $("#right_panel_content").data("$midmenuItem1");
|
||||
if($midmenuItem1 == null)
|
||||
return;
|
||||
|
||||
var jsonObj = $midmenuItem1.data("jsonObj");
|
||||
if(jsonObj == null)
|
||||
return;
|
||||
|
||||
var $thisTab = $("#right_panel_content #public_network_page #tab_content_loadbalancer");
|
||||
$thisTab.find("#tab_container").hide();
|
||||
$thisTab.find("#tab_spinning_wheel").show();
|
||||
|
||||
|
||||
|
||||
$thisTab.find("#tab_container").show();
|
||||
$thisTab.find("#tab_spinning_wheel").hide();
|
||||
}
|
||||
//***** Public Network (end) ******************************************************************************************************
|
||||
|
||||
|
||||
//***** Direct Network (begin) ******************************************************************************************************
|
||||
function directNetworkGetMidmenuId(jsonObj) {
|
||||
return "midmenuItem_directnetework_" + jsonObj.id;
|
||||
|
|
@ -184,108 +330,3 @@ function directNetworkIprangeJsonToTemplate(jsonObj, $template) {
|
|||
}
|
||||
//***** Direct Network (end) ******************************************************************************************************
|
||||
|
||||
|
||||
//***** Public Network (begin) ******************************************************************************************************
|
||||
function publicNetworkGetMidmenuId(jsonObj) {
|
||||
return "midmenuItem_publicnetework_" + jsonObj.id;
|
||||
}
|
||||
|
||||
function publicNetworkToMidmenu(jsonObj, $midmenuItem1) {
|
||||
$midmenuItem1.attr("id", publicNetworkGetMidmenuId(jsonObj));
|
||||
$midmenuItem1.data("jsonObj", jsonObj);
|
||||
|
||||
/*
|
||||
var $iconContainer = $midmenuItem1.find("#icon_container").show();
|
||||
$iconContainer.find("#icon").attr("src", "images/midmenuicon_storage_snapshots.png");
|
||||
*/
|
||||
|
||||
$midmenuItem1.find("#first_row").text("Public Network");
|
||||
$midmenuItem1.find("#second_row").text("Network ID: " + fromdb(jsonObj.id));
|
||||
}
|
||||
|
||||
function publicNetworkToRightPanel($midmenuItem1) {
|
||||
copyActionInfoFromMidMenuToRightPanel($midmenuItem1);
|
||||
$("#right_panel_content").data("$midmenuItem1", $midmenuItem1);
|
||||
|
||||
$("#public_network_page").show();
|
||||
$("#direct_network_page").hide();
|
||||
|
||||
$("#public_network_page").find("#tab_details").click();
|
||||
}
|
||||
|
||||
function publicNetworkJsonToDetailsTab() {
|
||||
var $midmenuItem1 = $("#right_panel_content").data("$midmenuItem1");
|
||||
if($midmenuItem1 == null)
|
||||
return;
|
||||
|
||||
var jsonObj = $midmenuItem1.data("jsonObj");
|
||||
if(jsonObj == null)
|
||||
return;
|
||||
|
||||
var $thisTab = $("#right_panel_content #public_network_page #tab_content_details");
|
||||
$thisTab.find("#tab_container").hide();
|
||||
$thisTab.find("#tab_spinning_wheel").show();
|
||||
|
||||
$thisTab.find("#grid_header_title").text(fromdb(jsonObj.name));
|
||||
|
||||
$thisTab.find("#id").text(fromdb(jsonObj.id));
|
||||
$thisTab.find("#name").text(fromdb(jsonObj.name));
|
||||
$thisTab.find("#displaytext").text(fromdb(jsonObj.displaytext));
|
||||
|
||||
$thisTab.find("#vlan").text(fromdb(jsonObj.vlan));
|
||||
$thisTab.find("#gateway").text(fromdb(jsonObj.gateway));
|
||||
$thisTab.find("#netmask").text(fromdb(jsonObj.netmask));
|
||||
var ipRange = getIpRange(fromdb(jsonObj.startip), fromdb(jsonObj.endip));
|
||||
$thisTab.find("#iprange").text(ipRange);
|
||||
|
||||
$thisTab.find("#domain").text(fromdb(jsonObj.domain)); //might be null
|
||||
$thisTab.find("#account").text(fromdb(jsonObj.account)); //might be null
|
||||
|
||||
$thisTab.find("#tab_container").show();
|
||||
$thisTab.find("#tab_spinning_wheel").hide();
|
||||
}
|
||||
|
||||
function publicNetworkJsonToIpAllocationTab() {
|
||||
var $midmenuItem1 = $("#right_panel_content").data("$midmenuItem1");
|
||||
if($midmenuItem1 == null)
|
||||
return;
|
||||
|
||||
var jsonObj = $midmenuItem1.data("jsonObj");
|
||||
if(jsonObj == null)
|
||||
return;
|
||||
|
||||
var $thisTab = $("#right_panel_content #public_network_page #tab_content_ipallocation");
|
||||
$thisTab.find("#tab_container").hide();
|
||||
$thisTab.find("#tab_spinning_wheel").show();
|
||||
|
||||
$.ajax({
|
||||
data: createURL("command=listVlanIpRanges&zoneid="+ jsonObj.zoneid + "&networkid="+jsonObj.id),
|
||||
dataType: "json",
|
||||
success: function(json) {
|
||||
var items = json.listvlaniprangesresponse.vlaniprange;
|
||||
var $container = $thisTab.find("#tab_container").empty();
|
||||
var $template = $("#directnetwork_iprange_template");
|
||||
if(items != null && items.length > 0) {
|
||||
for(var i=0; i<items.length; i++) {
|
||||
var $newTemplate = $template.clone();
|
||||
publicNetworkIprangeJsonToTemplate(items[i], $newTemplate);
|
||||
$container.append($newTemplate.show());
|
||||
}
|
||||
}
|
||||
$thisTab.find("#tab_container").show();
|
||||
$thisTab.find("#tab_spinning_wheel").hide();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function publicNetworkIprangeJsonToTemplate(jsonObj, $template) {
|
||||
$template.attr("id", "publicNetworkIprange_" + jsonObj.id);
|
||||
|
||||
var ipRange = getIpRange(fromdb(jsonObj.startip), fromdb(jsonObj.endip));
|
||||
$template.find("#grid_header_title").text(ipRange);
|
||||
|
||||
$template.find("#vlan").text(jsonObj.vlan)
|
||||
$template.find("#startip").text(fromdb(jsonObj.startip));
|
||||
$template.find("#endip").text(fromdb(jsonObj.endip));
|
||||
}
|
||||
//***** Public Network (end) ******************************************************************************************************
|
||||
Loading…
Reference in New Issue