mirror of https://github.com/apache/cloudstack.git
new UI - add Service Offerings page.
This commit is contained in:
Jessica Wang
parent
8daf888f83
commit
7e108fd187
|
|
@ -35,6 +35,7 @@ secondary.storage = Secondary Storage
|
|||
|
||||
no.available.actions = No available actions
|
||||
|
||||
ID = ID
|
||||
name = Name
|
||||
display.text = Display Text
|
||||
os.type = OS Type
|
||||
|
|
@ -52,6 +53,12 @@ URL = URL
|
|||
zone = Zone
|
||||
bootable = Bootable
|
||||
group = Group
|
||||
storage.type = Storage Type
|
||||
CPU = CPU
|
||||
memory = Memory
|
||||
offer.HA = Offer HA
|
||||
network.type = Network Type
|
||||
created = Created
|
||||
|
||||
disk.offering = Disk Offering
|
||||
copy.ISO.to = Copy ISO to
|
||||
|
|
|
|||
|
|
@ -69,6 +69,8 @@ long milliseconds = new Date().getTime();
|
|||
|
||||
<script type="text/javascript" src="scripts/cloud.core2.resource.js?t=<%=milliseconds%>"></script>
|
||||
|
||||
<script type="text/javascript" src="scripts/cloud.core2.serviceoffering.js?t=<%=milliseconds%>"></script>
|
||||
|
||||
<title>Cloud.com CloudStack</title>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,263 @@
|
|||
<%@ page import="java.util.*" %>
|
||||
|
||||
<%@ page import="com.cloud.utils.*" %>
|
||||
|
||||
<%
|
||||
Locale browserLocale = request.getLocale();
|
||||
CloudResourceBundle t = CloudResourceBundle.getBundle("resources/resource", browserLocale);
|
||||
%>
|
||||
<!-- ISO detail panel (begin) -->
|
||||
<div class="main_title" id="right_panel_header">
|
||||
<!--
|
||||
<div class="main_titleicon">
|
||||
<img src="images/title_isoicon.gif" alt="ISO" /></div>
|
||||
-->
|
||||
<h1>
|
||||
Service Offering
|
||||
</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>
|
||||
</div>
|
||||
<div class="tabbox" style="margin-top: 15px;">
|
||||
<div class="content_tabs on">
|
||||
<%=t.t("details")%></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><%=t.t("no.available.actions")%></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<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">
|
||||
Waiting …</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_container">
|
||||
<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("display.text")%>:</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("storage.type")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="storagetype">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("CPU")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="cpu">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("memory")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="memory">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("offer.HA")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="offerha">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("network.type")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="networktype">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows odd">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("tags")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="tags">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid_rows even">
|
||||
<div class="grid_row_cell" style="width: 20%;">
|
||||
<div class="row_celltitles">
|
||||
<%=t.t("created")%>:</div>
|
||||
</div>
|
||||
<div class="grid_row_cell" style="width: 79%;">
|
||||
<div class="row_celltitles" id="created">
|
||||
</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>
|
||||
<!-- ISO detail panel (end) -->
|
||||
|
||||
<!-- Add ISO Dialog (begin) -->
|
||||
<div id="dialog_add_iso" title="Add ISO" style="display:none">
|
||||
<div class="dialog_formcontent">
|
||||
<form action="#" method="post" id="form2">
|
||||
<ol>
|
||||
<li>
|
||||
<label><%=t.t("name")%>:</label>
|
||||
<input class="text" type="text" name="add_iso_name" id="add_iso_name" style="width:250px"/>
|
||||
<div id="add_iso_name_errormsg" class="dialog_formcontent_errormsg" style="display:none;"></div>
|
||||
</li>
|
||||
<li>
|
||||
<label><%=t.t("display.text")%>:</label>
|
||||
<input class="text" type="text" name="add_iso_display_text" id="add_iso_display_text" style="width:250px"/>
|
||||
<div id="add_iso_display_text_errormsg" class="dialog_formcontent_errormsg" style="display:none;"></div>
|
||||
</li>
|
||||
<li>
|
||||
<label><%=t.t("URL")%>:</label>
|
||||
<input class="text" type="text" name="add_iso_url" id="add_iso_url" style="width:250px"/>
|
||||
<div id="add_iso_url_errormsg" class="dialog_formcontent_errormsg" style="display:none;"></div>
|
||||
</li>
|
||||
<li>
|
||||
<label><%=t.t("zone")%>:</label>
|
||||
<select class="select" id="add_iso_zone">
|
||||
</select>
|
||||
</li>
|
||||
<li>
|
||||
<label for="add_iso_public"><%=t.t("bootable")%>:</label>
|
||||
<select class="select" name="add_iso_bootable" id="add_iso_bootable">
|
||||
<option value="true">Yes</option>
|
||||
<option value="false">No</option>
|
||||
</select>
|
||||
</li>
|
||||
<li>
|
||||
<label for="add_iso_os_type"><%=t.t("os.type")%>:</label>
|
||||
<select class="select" name="add_iso_os_type" id="add_iso_os_type">
|
||||
</select>
|
||||
</li>
|
||||
</ol>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Add ISO Dialog (end) -->
|
||||
|
||||
<!-- Copy ISO Dialog (begin) -->
|
||||
<div id="dialog_copy_iso" title="Copy ISO" style="display:none">
|
||||
<p>
|
||||
<%=t.t("copy.ISO.to")%>:
|
||||
</p>
|
||||
<div class="dialog_formcontent">
|
||||
<form action="#" method="post" id="form4">
|
||||
<ol>
|
||||
<li>
|
||||
<label><%=t.t("zone")%>:</label>
|
||||
<select class="select" id="copy_iso_zone">
|
||||
<option value=""></option>
|
||||
</select>
|
||||
</li>
|
||||
<div id="copy_iso_zone_errormsg" class="dialog_formcontent_errormsg" style="display:none;"></div>
|
||||
</ol>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Copy ISO Dialog (end) -->
|
||||
|
||||
<!-- Create VM from ISO (begin) -->
|
||||
<div id="dialog_create_vm_from_iso" title="Create VM from ISO" style="display:none">
|
||||
<div class="dialog_formcontent">
|
||||
<form action="#" method="post" id="form5">
|
||||
<ol>
|
||||
<li>
|
||||
<label><%=t.t("name")%>:</label>
|
||||
<input class="text" type="text" id="name"/>
|
||||
<div id="name_errormsg" class="dialog_formcontent_errormsg" style="display:none;"></div>
|
||||
</li>
|
||||
<li>
|
||||
<label><%=t.t("group")%>:</label>
|
||||
<input class="text" type="text" id="group"/>
|
||||
<div id="group_errormsg" class="dialog_formcontent_errormsg" style="display:none;"></div>
|
||||
</li>
|
||||
<li>
|
||||
<label><%=t.t("service.offering")%>:</label>
|
||||
<select class="select" id="service_offering">
|
||||
</select>
|
||||
</li>
|
||||
<li>
|
||||
<label><%=t.t("disk.offering")%>:</label>
|
||||
<select class="select" id="disk_offering">
|
||||
</select>
|
||||
</li>
|
||||
</ol>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Create VM from template/ISO (end) -->
|
||||
|
||||
<div id="dialog_confirmation_delete_iso_all_zones" title="Confirmation" style="display:none">
|
||||
<p>
|
||||
<%=t.t("the.ISO.is.used.by.all.zones.please.confirm.you.want.to.delete.it.from.all.zones")%>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div id="dialog_confirmation_delete_iso" title="Confirmation" style="display:none">
|
||||
<p>
|
||||
<%=t.t("please.confirm.you.want.to.delete.the.ISO")%>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
|
@ -85,6 +85,8 @@ $(document).ready(function() {
|
|||
listMidMenuItems("leftmenu_submenu_my_iso", "listIsos&isofilter=self", "listisosresponse", "iso", "jsp/iso.jsp", afterLoadIsoJSP, isoToMidmenu, isoToRigntPanel, isoGetMidmenuId);
|
||||
listMidMenuItems("leftmenu_submenu_featured_iso", "listIsos&isofilter=featured", "listisosresponse", "iso", "jsp/iso.jsp", afterLoadIsoJSP, isoToMidmenu, isoToRigntPanel, isoGetMidmenuId);
|
||||
listMidMenuItems("leftmenu_submenu_community_iso", "listIsos&isofilter=community", "listisosresponse", "iso", "jsp/iso.jsp", afterLoadIsoJSP, isoToMidmenu, isoToRigntPanel, isoGetMidmenuId);
|
||||
|
||||
listMidMenuItems("leftmenu_service_offering", "listServiceOfferings", "listserviceofferingsresponse", "serviceoffering", "jsp/serviceoffering.jsp", afterLoadServiceOfferingJSP, serviceOfferingToMidmenu, serviceOfferingToRigntPanel);
|
||||
|
||||
$("#leftmenu_instance_group_header").bind("click", function(event) {
|
||||
showMiddleMenu();
|
||||
|
|
|
|||
|
|
@ -0,0 +1,34 @@
|
|||
function afterLoadServiceOfferingJSP() {
|
||||
|
||||
}
|
||||
|
||||
function serviceOfferingToMidmenu(jsonObj, $midmenuItem1) {
|
||||
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
|
||||
$midmenuItem1.data("jsonObj", jsonObj);
|
||||
|
||||
//var $iconContainer = $midmenuItem1.find("#icon_container").show();
|
||||
//$iconContainer.find("#icon").attr("src", "images/midmenuicon_storage_volume.png");
|
||||
|
||||
$midmenuItem1.find("#first_row").text(fromdb(jsonObj.name).substring(0,25));
|
||||
$midmenuItem1.find("#second_row").text(jsonObj.cpunumber + " x " + convertHz(jsonObj.cpuspeed));
|
||||
}
|
||||
|
||||
function serviceOfferingToRigntPanel($midmenuItem) {
|
||||
var jsonObj = $midmenuItem.data("jsonObj");
|
||||
serviceOfferingJsonToDetailsTab(jsonObj);
|
||||
}
|
||||
|
||||
function serviceOfferingJsonToDetailsTab(jsonObj) {
|
||||
var $detailsTab = $("#right_panel_content #tab_content_details");
|
||||
$detailsTab.data("jsonObj", jsonObj);
|
||||
$detailsTab.find("#id").text(jsonObj.id);
|
||||
$detailsTab.find("#name").text(fromdb(jsonObj.name));
|
||||
$detailsTab.find("#displaytext").text(fromdb(jsonObj.displaytext));
|
||||
$detailsTab.find("#storagetype").text(jsonObj.storagetype);
|
||||
$detailsTab.find("#cpu").text(jsonObj.cpunumber + " x " + convertHz(jsonObj.cpuspeed));
|
||||
$detailsTab.find("#memory").text(convertBytes(parseInt(jsonObj.memory)*1024*1024));
|
||||
$detailsTab.find("#offerha").text(toBooleanText(jsonObj.offerha));
|
||||
$detailsTab.find("#networktype").text(toNetworkType(jsonObj.usevirtualnetwork));
|
||||
$detailsTab.find("#tags").text(fromdb(jsonObj.tags));
|
||||
setDateField(jsonObj.created, $detailsTab.find("#created"));
|
||||
}
|
||||
Loading…
Reference in New Issue