mirror of https://github.com/apache/cloudstack.git
Add Network Offering page.
This commit is contained in:
parent
b79cc43a6e
commit
6e8a64d38a
12
ui/index.jsp
12
ui/index.jsp
|
|
@ -41,6 +41,7 @@
|
|||
<script type="text/javascript" src="scripts/cloud.core.domain.js?t=<%=now%>"></script>
|
||||
<script type="text/javascript" src="scripts/cloud.core.serviceoffering.js?t=<%=now%>"></script>
|
||||
<script type="text/javascript" src="scripts/cloud.core.diskoffering.js?t=<%=now%>"></script>
|
||||
<script type="text/javascript" src="scripts/cloud.core.networkoffering.js?t=<%=now%>"></script>
|
||||
<script type="text/javascript" src="scripts/cloud.core.globalsetting.js?t=<%=now%>"></script>
|
||||
<script type="text/javascript" src="scripts/cloud.core.resource.js?t=<%=now%>"></script>
|
||||
<script type="text/javascript" src="scripts/cloud.core.zone.js?t=<%=now%>"></script>
|
||||
|
|
@ -846,6 +847,17 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="leftmenu_expandedlist">
|
||||
<div class="leftmenu_content" id="leftmenu_network_offering">
|
||||
<div class="leftmenu_secondindent">
|
||||
<div class="leftmenu_arrows white_nonexpanded_close" id="arrowIcon">
|
||||
</div>
|
||||
Network Offering
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="leftmenu_expandedlist">
|
||||
<div class="leftmenu_content" id="leftmenu_global_setting">
|
||||
<div class="leftmenu_secondindent">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,174 @@
|
|||
<%@ page import="java.util.*" %>
|
||||
|
||||
<%@ page import="com.cloud.utils.*" %>
|
||||
|
||||
<%
|
||||
Locale browserLocale = request.getLocale();
|
||||
CloudResourceBundle t = CloudResourceBundle.getBundle("resources/resource", browserLocale);
|
||||
%>
|
||||
|
||||
|
||||
|
||||
<div class="main_title" id="right_panel_header">
|
||||
|
||||
<div class="main_titleicon">
|
||||
<img src="images/title_diskofferingicon.gif" alt="Disk Offering" /></div>
|
||||
|
||||
<h1>
|
||||
Network Offering
|
||||
</h1>
|
||||
</div>
|
||||
<div class="contentbox" id="right_panel_content">
|
||||
<div class="info_detailbox errorbox" id="after_action_info_container_on_top" style="display: none">
|
||||
<p id="after_action_info">
|
||||
</p>
|
||||
</div>
|
||||
<div class="tabbox" style="margin-top: 15px;">
|
||||
<div class="content_tabs on">
|
||||
<%=t.t("details")%></div>
|
||||
</div>
|
||||
<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 id="grid_header_title" class="grid_header_title">(title)</div>
|
||||
<div id="action_link" class="grid_actionbox" id="account_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="Div1">
|
||||
</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>
|
||||
<input class="text" id="name_edit" style="width: 200px; display: none;" type="text" />
|
||||
<div id="name_edit_errormsg" style="display:none"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("display.text")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="displaytext">
|
||||
</div>
|
||||
<input class="text" id="displaytext_edit" style="width: 200px; display: none;" type="text" />
|
||||
<div id="displaytext_edit_errormsg" style="display:none"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
Type:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="type">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
Traffic Type:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="traffictype">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
Is Default:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="isdefault">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
Specify VLAN:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="specifyvlan">
|
||||
</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>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- advanced search template (begin) -->
|
||||
<div id="advanced_search_template" class="adv_searchpopup" style="display: none;">
|
||||
<div class="adv_searchformbox">
|
||||
<h3>
|
||||
Advance Search</h3>
|
||||
<a id="advanced_search_close" href="#">Close </a>
|
||||
<form action="#" method="post">
|
||||
<ol>
|
||||
<li>
|
||||
<label>
|
||||
Name:</label>
|
||||
<input class="text" type="text" id="adv_search_name" />
|
||||
</li>
|
||||
<li id="adv_search_domain_li" style="display: none;">
|
||||
<label>
|
||||
Domain:</label>
|
||||
<select class="select" id="adv_search_domain">
|
||||
</select>
|
||||
</li>
|
||||
</ol>
|
||||
</form>
|
||||
<div class="adv_search_actionbox">
|
||||
<div class="adv_searchpopup_button" id="adv_search_button">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- advanced search template (end) -->
|
||||
|
|
@ -118,6 +118,7 @@ $(document).ready(function() {
|
|||
|
||||
bindAndListMidMenuItems($("#leftmenu_service_offering"), "listServiceOfferings", serviceOfferingGetSearchParams, "listserviceofferingsresponse", "serviceoffering", "jsp/serviceoffering.jsp", afterLoadServiceOfferingJSP, serviceOfferingToMidmenu, serviceOfferingToRightPanel, getMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_disk_offering"), "listDiskOfferings", diskOfferingGetSearchParams, "listdiskofferingsresponse", "diskoffering", "jsp/diskoffering.jsp", afterLoadDiskOfferingJSP, diskOfferingToMidmenu, diskOfferingToRightPanel, getMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_network_offering"), "listNetworkOfferings", networkOfferingGetSearchParams, "listnetworkofferingsresponse", "networkoffering", "jsp/networkoffering.jsp", afterLoadNetworkOfferingJSP, networkOfferingToMidmenu, networkOfferingToRightPanel, getMidmenuId, false);
|
||||
|
||||
bindAndListMidMenuItems($("#leftmenu_submenu_virtual_router"), "listRouters", routerGetSearchParams, "listroutersresponse", "router", "jsp/router.jsp", afterLoadRouterJSP, routerToMidmenu, routerToRightPanel, getMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_submenu_systemvm"), "listSystemVms", systemVmGetSearchParams, "listsystemvmsresponse", "systemvm", "jsp/systemvm.jsp", afterLoadSystemVmJSP, systemvmToMidmenu, systemvmToRightPanel, getMidmenuId, false);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,205 @@
|
|||
/**
|
||||
* Copyright (C) 2010 Cloud.com, Inc. All rights reserved.
|
||||
*
|
||||
* This software is licensed under the GNU General Public License v3 or later.
|
||||
*
|
||||
* It is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU General Public License as published by
|
||||
* the Free Software Foundation, either version 3 of the License, or any later version.
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU General Public License
|
||||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
*/
|
||||
|
||||
function networkOfferingGetSearchParams() {
|
||||
var moreCriteria = [];
|
||||
|
||||
var $advancedSearchPopup = $("#advanced_search_popup");
|
||||
if (lastSearchType == "advanced_search" && $advancedSearchPopup.length > 0) {
|
||||
var name = $advancedSearchPopup.find("#adv_search_name").val();
|
||||
if (name!=null && trim(name).length > 0)
|
||||
moreCriteria.push("&name="+todb(name));
|
||||
|
||||
if ($advancedSearchPopup.find("#adv_search_domain_li").css("display") != "none") {
|
||||
var domainId = $advancedSearchPopup.find("#adv_search_domain").val();
|
||||
if (domainId!=null && domainId.length > 0)
|
||||
moreCriteria.push("&domainid="+domainId);
|
||||
}
|
||||
}
|
||||
else {
|
||||
var searchInput = $("#basic_search").find("#search_input").val();
|
||||
if (lastSearchType == "basic_search" && searchInput != null && searchInput.length > 0) {
|
||||
moreCriteria.push("&keyword="+todb(searchInput));
|
||||
}
|
||||
}
|
||||
|
||||
return moreCriteria.join("");
|
||||
}
|
||||
|
||||
function afterLoadNetworkOfferingJSP() {
|
||||
|
||||
}
|
||||
|
||||
function doEditNetworkOffering($actionLink, $detailsTab, $midmenuItem1) {
|
||||
var $readonlyFields = $detailsTab.find("#name, #displaytext, #tags, #domain");
|
||||
var $editFields = $detailsTab.find("#name_edit, #displaytext_edit, #domain_edit");
|
||||
|
||||
$readonlyFields.hide();
|
||||
$editFields.show();
|
||||
$detailsTab.find("#cancel_button, #save_button").show();
|
||||
|
||||
$detailsTab.find("#cancel_button").unbind("click").bind("click", function(event){
|
||||
$editFields.hide();
|
||||
$readonlyFields.show();
|
||||
$("#save_button, #cancel_button").hide();
|
||||
return false;
|
||||
});
|
||||
$detailsTab.find("#save_button").unbind("click").bind("click", function(event){
|
||||
doEditNetworkOffering2($actionLink, $detailsTab, $midmenuItem1, $readonlyFields, $editFields);
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
function doEditNetworkOffering2($actionLink, $detailsTab, $midmenuItem1, $readonlyFields, $editFields) {
|
||||
var jsonObj = $midmenuItem1.data("jsonObj");
|
||||
var id = jsonObj.id;
|
||||
|
||||
// validate values
|
||||
var isValid = true;
|
||||
isValid &= validateString("Name", $detailsTab.find("#name_edit"), $detailsTab.find("#name_edit_errormsg"), true);
|
||||
isValid &= validateString("Display Text", $detailsTab.find("#displaytext_edit"), $detailsTab.find("#displaytext_edit_errormsg"), true);
|
||||
if (!isValid)
|
||||
return;
|
||||
|
||||
var array1 = [];
|
||||
var name = $detailsTab.find("#name_edit").val();
|
||||
array1.push("&name="+todb(name));
|
||||
|
||||
var displaytext = $detailsTab.find("#displaytext_edit").val();
|
||||
array1.push("&displayText="+todb(displaytext));
|
||||
|
||||
var tags = $detailsTab.find("#tags_edit").val();
|
||||
array1.push("&tags="+todb(tags));
|
||||
|
||||
var domainid = $detailsTab.find("#domain_edit").val();
|
||||
array1.push("&domainid="+todb(domainid));
|
||||
|
||||
$.ajax({
|
||||
data: createURL("command=updateNetworkOffering&id="+id+array1.join("")),
|
||||
dataType: "json",
|
||||
success: function(json) {
|
||||
var jsonObj = json.updateNetworkOfferingresponse.NetworkOffering;
|
||||
networkOfferingToMidmenu(jsonObj, $midmenuItem1);
|
||||
networkOfferingToRightPanel($midmenuItem1);
|
||||
|
||||
$editFields.hide();
|
||||
$readonlyFields.show();
|
||||
$("#save_button, #cancel_button").hide();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function networkOfferingToMidmenu(jsonObj, $midmenuItem1) {
|
||||
$midmenuItem1.attr("id", getMidmenuId(jsonObj));
|
||||
$midmenuItem1.data("jsonObj", jsonObj);
|
||||
|
||||
/*
|
||||
var $iconContainer = $midmenuItem1.find("#icon_container").show();
|
||||
$iconContainer.find("#icon").attr("src", "images/midmenuicon_system_networkOffering.png");
|
||||
*/
|
||||
|
||||
$midmenuItem1.find("#first_row").text(fromdb(jsonObj.name).substring(0,25));
|
||||
$midmenuItem1.find("#second_row").text(fromdb(jsonObj.type).substring(0,25));
|
||||
}
|
||||
|
||||
function networkOfferingToRightPanel($midmenuItem1) {
|
||||
copyActionInfoFromMidMenuToRightPanel($midmenuItem1);
|
||||
$("#right_panel_content").data("$midmenuItem1", $midmenuItem1);
|
||||
networkOfferingJsonToDetailsTab();
|
||||
}
|
||||
|
||||
function networkOfferingJsonToDetailsTab() {
|
||||
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 #tab_content_details");
|
||||
$thisTab.find("#tab_container").hide();
|
||||
$thisTab.find("#tab_spinning_wheel").show();
|
||||
|
||||
var id = jsonObj.id;
|
||||
|
||||
var jsonObj;
|
||||
$.ajax({
|
||||
data: createURL("command=listNetworkOfferings&id="+id),
|
||||
dataType: "json",
|
||||
async: false,
|
||||
success: function(json) {
|
||||
var items = json.listNetworkOfferingsresponse.NetworkOffering;
|
||||
if(items != null && items.length > 0) {
|
||||
jsonObj = items[0];
|
||||
$midmenuItem1.data("jsonObj", jsonObj);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$thisTab.find("#id").text(fromdb(jsonObj.id));
|
||||
|
||||
$thisTab.find("#grid_header_title").text(fromdb(jsonObj.name));
|
||||
$thisTab.find("#name").text(fromdb(jsonObj.name));
|
||||
//$thisTab.find("#name_edit").val(fromdb(jsonObj.name));
|
||||
|
||||
$thisTab.find("#displaytext").text(fromdb(jsonObj.displaytext));
|
||||
//$thisTab.find("#displaytext_edit").val(fromdb(jsonObj.displaytext));
|
||||
|
||||
$thisTab.find("#type").text(fromdb(jsonObj.type));
|
||||
$thisTab.find("#traffictype").text(fromdb(jsonObj.traffictype));
|
||||
|
||||
setBooleanReadField(jsonObj.isdefault, $thisTab.find("#isdefault"));
|
||||
setBooleanReadField(jsonObj.specifyvlan, $thisTab.find("#specifyvlan"));
|
||||
|
||||
|
||||
//actions ***
|
||||
var $actionMenu = $("#right_panel_content #tab_content_details #action_link #action_menu");
|
||||
$actionMenu.find("#action_list").empty();
|
||||
buildActionLinkForTab("Edit Network Offering", networkOfferingActionMap, $actionMenu, $midmenuItem1, $thisTab);
|
||||
|
||||
$thisTab.find("#tab_spinning_wheel").hide();
|
||||
$thisTab.find("#tab_container").show();
|
||||
}
|
||||
|
||||
function networkOfferingClearRightPanel() {
|
||||
networkOfferingClearDetailsTab();
|
||||
}
|
||||
|
||||
function networkOfferingClearDetailsTab() {
|
||||
var $thisTab = $("#right_panel_content").find("#tab_content_details");
|
||||
$thisTab.find("#id").text("");
|
||||
$thisTab.find("#grid_header_title").text("");
|
||||
$thisTab.find("#name").text("");
|
||||
$thisTab.find("#name_edit").val("");
|
||||
$thisTab.find("#displaytext").text("");
|
||||
$thisTab.find("#displaytext_edit").val("");
|
||||
$thisTab.find("#disksize").text("");
|
||||
$thisTab.find("#tags").text("");
|
||||
$thisTab.find("#domain").text("");
|
||||
|
||||
var $actionMenu = $("#right_panel_content #tab_content_details #action_link #action_menu");
|
||||
$actionMenu.find("#action_list").empty();
|
||||
$actionMenu.find("#action_list").append($("#no_available_actions").clone().show());
|
||||
}
|
||||
|
||||
var networkOfferingActionMap = {
|
||||
"Edit Network Offering": {
|
||||
dialogBeforeActionFn: doEditNetworkOffering
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue