mirror of https://github.com/apache/cloudstack.git
new UI - volume page - implement create template action.
This commit is contained in:
parent
ab66269038
commit
f75b17383a
|
|
@ -870,24 +870,4 @@
|
|||
</ol>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Detach Volume Dialog (begin) -->
|
||||
<div id="dialog_detach_volume" title="Detach Volume" style="display: none">
|
||||
<p>
|
||||
Please confirm you want to detach the volume</p>
|
||||
<div class="dialog_formcontent">
|
||||
<div class="selectable_errorbox" style="display: none; width: 250px">
|
||||
<p>
|
||||
<span style="font-style: bold; color: red"><strong>Error</strong>: </span><span id="apply_error_text">
|
||||
Error text will appear here</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="selectable_commentbox" style="display: none; width: 250px">
|
||||
<div class="selectable_loader">
|
||||
</div>
|
||||
<p>
|
||||
<strong>Please wait...</strong>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -165,5 +165,54 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- volume detail panel (end) -->
|
||||
|
||||
<!-- volume detail panel (end) -->
|
||||
<!-- Create Template Dialog -->
|
||||
<div id="dialog_create_template" title="Create Template" style="display:none">
|
||||
<p>
|
||||
Please specify the following information before creating a template of your disk
|
||||
volume: <b><span id="volume_name"></span></b>. Creating a template could take up
|
||||
to several hours depending on the size of your disk volume.</p>
|
||||
<div class="dialog_formcontent">
|
||||
<form action="#" method="post" id="form_acquire">
|
||||
<ol>
|
||||
<li>
|
||||
<label for="user_name">
|
||||
Name:</label>
|
||||
<input class="text" type="text" name="create_template_name" id="create_template_name" />
|
||||
<div id="create_template_name_errormsg" class="dialog_formcontent_errormsg" style="display: none;">
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<label for="user_name">
|
||||
Display Text:</label>
|
||||
<input class="text" type="text" name="create_template_desc" id="create_template_desc" />
|
||||
<div id="create_template_desc_errormsg" class="dialog_formcontent_errormsg" style="display: none;">
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<label for="create_template_os_type">
|
||||
OS Type:</label>
|
||||
<select class="select" name="create_template_os_type" id="create_template_os_type">
|
||||
</select>
|
||||
</li>
|
||||
<li>
|
||||
<label for="create_template_public">
|
||||
Public:</label>
|
||||
<select class="select" name="create_template_public" id="create_template_public">
|
||||
<option value="false">No</option>
|
||||
<option value="true">Yes</option>
|
||||
</select>
|
||||
</li>
|
||||
<li>
|
||||
<label for="user_name">
|
||||
Password Enabled?:</label>
|
||||
<select class="select" name="create_template_password" id="create_template_password">
|
||||
<option value="false">No</option>
|
||||
<option value="true">Yes</option>
|
||||
</select>
|
||||
</li>
|
||||
</ol>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,3 +1,7 @@
|
|||
function afterLoadAccountJSP() {
|
||||
|
||||
}
|
||||
|
||||
function accountToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
|
||||
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
|
||||
$midmenuItem1.data("id", jsonObj.id);
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
function afterLoadAlertJSP() {
|
||||
|
||||
}
|
||||
|
||||
function alertToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
|
||||
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
|
||||
$midmenuItem1.data("id", jsonObj.id);
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
function afterLoadEventJSP() {
|
||||
|
||||
}
|
||||
|
||||
function eventToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
|
||||
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
|
||||
$midmenuItem1.data("id", jsonObj.id);
|
||||
|
|
|
|||
|
|
@ -58,37 +58,38 @@ $(document).ready(function() {
|
|||
}
|
||||
|
||||
var $midmenuItem = $("#midmenu_item");
|
||||
function listMidMenuItems(leftmenuId, apiName, jsonResponse1, jsonResponse2, rightPanelJSP, toMidmenu, toRightPanel) {
|
||||
function listMidMenuItems(leftmenuId, apiName, jsonResponse1, jsonResponse2, rightPanelJSP, afterLoadRightPanelJSP, toMidmenu, toRightPanel) {
|
||||
$("#"+leftmenuId).bind("click", function(event) {
|
||||
$("#right_panel").load(rightPanelJSP);
|
||||
$.ajax({
|
||||
cache: false,
|
||||
data: createURL("command="+apiName+"&pagesize="+midmenuItemCount),
|
||||
dataType: "json",
|
||||
success: function(json) {
|
||||
$("#midmenu_container").empty();
|
||||
selectedItemsInMidMenu = {};
|
||||
|
||||
var items = json[jsonResponse1][jsonResponse2];
|
||||
if(items != null && items.length > 0) {
|
||||
for(var i=0; i<items.length;i++) {
|
||||
var $midmenuItem1 = $midmenuItem.clone();
|
||||
toMidmenu(items[i], $midmenuItem1, toRightPanel);
|
||||
$("#midmenu_container").append($midmenuItem1.show());
|
||||
$("#right_panel").load(rightPanelJSP, function(){
|
||||
afterLoadRightPanelJSP();
|
||||
$.ajax({
|
||||
cache: false,
|
||||
data: createURL("command="+apiName+"&pagesize="+midmenuItemCount),
|
||||
dataType: "json",
|
||||
success: function(json) {
|
||||
$("#midmenu_container").empty();
|
||||
selectedItemsInMidMenu = {};
|
||||
|
||||
var items = json[jsonResponse1][jsonResponse2];
|
||||
if(items != null && items.length > 0) {
|
||||
for(var i=0; i<items.length;i++) {
|
||||
var $midmenuItem1 = $midmenuItem.clone();
|
||||
toMidmenu(items[i], $midmenuItem1, toRightPanel);
|
||||
$("#midmenu_container").append($midmenuItem1.show());
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
});
|
||||
});
|
||||
return false;
|
||||
});
|
||||
}
|
||||
listMidMenuItems("leftmenu_event", "listEvents", "listeventsresponse", "event", "jsp/event.jsp", eventToMidmenu, eventToRigntPanel);
|
||||
listMidMenuItems("leftmenu_alert", "listAlerts", "listalertsresponse", "alert", "jsp/alert.jsp", alertToMidmenu, alertToRigntPanel);
|
||||
listMidMenuItems("leftmenu_account", "listAccounts", "listaccountsresponse", "account", "jsp/account.jsp", accountToMidmenu, accountToRigntPanel);
|
||||
listMidMenuItems("leftmenu_volume", "listVolumes", "listvolumesresponse", "volume", "jsp/volume.jsp", volumeToMidmenu, volumeToRigntPanel);
|
||||
listMidMenuItems("leftmenu_snapshot", "listSnapshots", "listsnapshotsresponse", "snapshot", "jsp/snapshot.jsp", snapshotToMidmenu, snapshotToRigntPanel);
|
||||
listMidMenuItems("leftmenu_ip", "listPublicIpAddresses", "listpublicipaddressesresponse", "publicipaddress", "jsp/ip_address.jsp", ipToMidmenu, ipToRigntPanel);
|
||||
listMidMenuItems("leftmenu_event", "listEvents", "listeventsresponse", "event", "jsp/event.jsp", afterLoadEventJSP, eventToMidmenu, eventToRigntPanel);
|
||||
listMidMenuItems("leftmenu_alert", "listAlerts", "listalertsresponse", "alert", "jsp/alert.jsp", afterLoadAlertJSP, alertToMidmenu, alertToRigntPanel);
|
||||
listMidMenuItems("leftmenu_account", "listAccounts", "listaccountsresponse", "account", "jsp/account.jsp", afterLoadAccountJSP, accountToMidmenu, accountToRigntPanel);
|
||||
listMidMenuItems("leftmenu_volume", "listVolumes", "listvolumesresponse", "volume", "jsp/volume.jsp", afterLoadVolumeJSP, volumeToMidmenu, volumeToRigntPanel);
|
||||
listMidMenuItems("leftmenu_snapshot", "listSnapshots", "listsnapshotsresponse", "snapshot", "jsp/snapshot.jsp", afterLoadSnapshotJSP, snapshotToMidmenu, snapshotToRigntPanel);
|
||||
listMidMenuItems("leftmenu_ip", "listPublicIpAddresses", "listpublicipaddressesresponse", "publicipaddress", afterLoadIpJSP, "jsp/ip_address.jsp", ipToMidmenu, ipToRigntPanel);
|
||||
|
||||
|
||||
$("#action_link").bind("mouseover", function(event) {
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
function afterLoadIpJSP() {
|
||||
|
||||
}
|
||||
|
||||
function ipToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
|
||||
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
|
||||
$midmenuItem1.data("id", jsonObj.id);
|
||||
|
|
|
|||
|
|
@ -213,8 +213,7 @@ function buildActionLinkForSingleObject(label, actionMap, $actionMenu, listAPIMa
|
|||
});
|
||||
}
|
||||
|
||||
function doActionToSingleObject(id, $actionLink, apiCommand, listAPIMap, $singleObject) {
|
||||
//debugger;
|
||||
function doActionToSingleObject(id, $actionLink, apiCommand, listAPIMap, $singleObject) {
|
||||
var label = $actionLink.data("label");
|
||||
var inProcessText = $actionLink.data("inProcessText");
|
||||
var isAsyncJob = $actionLink.data("isAsyncJob");
|
||||
|
|
@ -223,7 +222,8 @@ function doActionToSingleObject(id, $actionLink, apiCommand, listAPIMap, $single
|
|||
var listAPI = listAPIMap["listAPI"];
|
||||
var listAPIResponse = listAPIMap["listAPIResponse"];
|
||||
var listAPIResponseObj = listAPIMap["listAPIResponseObj"];
|
||||
|
||||
|
||||
//debugger;
|
||||
var $spinningWheel = $singleObject.find("#spinning_wheel");
|
||||
$spinningWheel.find("#description").text(inProcessText);
|
||||
$spinningWheel.show();
|
||||
|
|
@ -250,7 +250,7 @@ function doActionToSingleObject(id, $actionLink, apiCommand, listAPIMap, $single
|
|||
if (result.jobstatus == 0) {
|
||||
return; //Job has not completed
|
||||
} else {
|
||||
$("body").stopTime(timerKey);
|
||||
$("body").stopTime(timerKey);
|
||||
$spinningWheel.hide();
|
||||
if (result.jobstatus == 1) { // Succeeded
|
||||
$singleObject.data("afterActionInfo", (label + " action succeeded."));
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
function afterLoadSnapshotJSP() {
|
||||
|
||||
}
|
||||
|
||||
function snapshotToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
|
||||
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
|
||||
$midmenuItem1.data("id", jsonObj.id);
|
||||
|
|
|
|||
|
|
@ -1,3 +1,27 @@
|
|||
function afterLoadVolumeJSP() {
|
||||
activateDialog($("#dialog_create_template").dialog({
|
||||
width: 400,
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
zIndex: 2000
|
||||
}));
|
||||
|
||||
|
||||
$.ajax({
|
||||
data: createURL("command=listOsTypes&response=json"),
|
||||
dataType: "json",
|
||||
success: function(json) {
|
||||
types = json.listostypesresponse.ostype;
|
||||
if (types != null && types.length > 0) {
|
||||
var select = $("#dialog_create_template #create_template_os_type").empty();
|
||||
for (var i = 0; i < types.length; i++) {
|
||||
select.append("<option value='" + types[i].id + "'>" + types[i].description + "</option>");
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function volumeToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
|
||||
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
|
||||
$midmenuItem1.data("id", jsonObj.id);
|
||||
|
|
@ -101,11 +125,9 @@ function doCreateTemplate($actionLink, listAPIMap, $singleObject) {
|
|||
var isPublic = thisDialog.find("#create_template_public").val();
|
||||
var password = thisDialog.find("#create_template_password").val();
|
||||
|
||||
var id = $singleObject.data("id");
|
||||
//for(var id in selectedItemIds) {
|
||||
var apiCommand = "command=createTemplate&volumeId="+id+"&name="+encodeURIComponent(name)+"&displayText="+encodeURIComponent(desc)+"&osTypeId="+osType+"&isPublic="+isPublic+"&passwordEnabled="+password;
|
||||
doActionToSingleObject(id, $actionLink, apiCommand, listAPIMap, $singleObject);
|
||||
//}
|
||||
var id = $singleObject.data("jsonObj").id;
|
||||
var apiCommand = "command=createTemplate&volumeId="+id+"&name="+encodeURIComponent(name)+"&displayText="+encodeURIComponent(desc)+"&osTypeId="+osType+"&isPublic="+isPublic+"&passwordEnabled="+password;
|
||||
doActionToSingleObject(id, $actionLink, apiCommand, listAPIMap, $singleObject);
|
||||
},
|
||||
"Cancel": function() {
|
||||
$(this).dialog("close");
|
||||
|
|
|
|||
Loading…
Reference in New Issue