mirror of
https://github.com/apache/cloudstack.git
synced 2025-11-02 11:52:28 +01:00
new UI - instance page - refactor submenu.
This commit is contained in:
Jessica Wang
parent
4326070a88
commit
e9d56d473d
@ -335,22 +335,10 @@ long milliseconds = new Date().getTime();
|
||||
<%=t.t("instance")%>
|
||||
</div>
|
||||
</div>
|
||||
<div class="leftmenu_expandedbox" style="display: none">
|
||||
<div id="leftmenu_instance_group">
|
||||
<div class="leftmenu_expandedlist">
|
||||
<div class="leftmenu_content" id="leftmenu_instance_group_header">
|
||||
<div class="leftmenu_secondindent">
|
||||
<div class="leftmenu_arrows expanded_close" id="arrow_icon">
|
||||
</div>
|
||||
|
||||
<%=t.t("instance")%>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="leftmenu_instance_group_container">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="leftmenu_instance_expandedbox" class="leftmenu_expandedbox" style="display: none">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="leftmenu_list">
|
||||
<div class="leftmenu_content_flevel" id="leftmenu_storage">
|
||||
@ -671,6 +659,16 @@ long milliseconds = new Date().getTime();
|
||||
</p>
|
||||
</div>
|
||||
<!-- ***** templates (begin) *************************************************************************************************-->
|
||||
<div id="leftmenu_secondindent_template" class="leftmenu_expandedlist">
|
||||
<div class="leftmenu_content">
|
||||
<div class="leftmenu_secondindent">
|
||||
<div class="leftmenu_arrows white_nonexpanded_close" id="arrowIcon">
|
||||
</div>
|
||||
<span id="label"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="leftmenu_content" id="leftmenu_submenu_template" style="display: none">
|
||||
<div class="leftmenu_thirdindent">
|
||||
<div class="leftmenu_list_icons">
|
||||
|
||||
@ -36,11 +36,7 @@ $(document).ready(function() {
|
||||
afterLoadDashboardJSP();
|
||||
});
|
||||
return false;
|
||||
});
|
||||
$("#leftmenu_instances").bind("click", function(event) {
|
||||
selectLeftMenu($(this), true);
|
||||
return false;
|
||||
});
|
||||
});
|
||||
$("#leftmenu_storage").bind("click", function(event) {
|
||||
selectLeftMenu($(this), true);
|
||||
return false;
|
||||
@ -69,24 +65,38 @@ $(document).ready(function() {
|
||||
|
||||
// Setup 2nd level navigation
|
||||
|
||||
bindAndListMidMenuItems("leftmenu_event", "listEvents", "listeventsresponse", "event", "jsp/event.jsp", afterLoadEventJSP, eventToMidmenu, eventToRigntPanel, getMidmenuId);
|
||||
bindAndListMidMenuItems("leftmenu_alert", "listAlerts", "listalertsresponse", "alert", "jsp/alert.jsp", afterLoadAlertJSP, alertToMidmenu, alertToRigntPanel, getMidmenuId);
|
||||
bindAndListMidMenuItems("leftmenu_volume", "listVolumes", "listvolumesresponse", "volume", "jsp/volume.jsp", afterLoadVolumeJSP, volumeToMidmenu, volumeToRigntPanel, getMidmenuId);
|
||||
bindAndListMidMenuItems("leftmenu_snapshot", "listSnapshots", "listsnapshotsresponse", "snapshot", "jsp/snapshot.jsp", afterLoadSnapshotJSP, snapshotToMidmenu, snapshotToRigntPanel, getMidmenuId);
|
||||
bindAndListMidMenuItems("leftmenu_ip", "listPublicIpAddresses", "listpublicipaddressesresponse", "publicipaddress", "jsp/ipaddress.jsp", afterLoadIpJSP, ipToMidmenu, ipToRigntPanel, ipGetMidmenuId);
|
||||
//bindAndListMidMenuItems("leftmenu_router", "listRouters", "listroutersresponse", "router", "jsp/router.jsp", afterLoadRouterJSP, routerToMidmenu, routerToRigntPanel, getMidmenuId);
|
||||
bindAndListMidMenuItems($("#leftmenu_event"), "listEvents", "listeventsresponse", "event", "jsp/event.jsp", afterLoadEventJSP, eventToMidmenu, eventToRigntPanel, getMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_alert"), "listAlerts", "listalertsresponse", "alert", "jsp/alert.jsp", afterLoadAlertJSP, alertToMidmenu, alertToRigntPanel, getMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_volume"), "listVolumes", "listvolumesresponse", "volume", "jsp/volume.jsp", afterLoadVolumeJSP, volumeToMidmenu, volumeToRigntPanel, getMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_snapshot"), "listSnapshots", "listsnapshotsresponse", "snapshot", "jsp/snapshot.jsp", afterLoadSnapshotJSP, snapshotToMidmenu, snapshotToRigntPanel, getMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_ip"), "listPublicIpAddresses", "listpublicipaddressesresponse", "publicipaddress", "jsp/ipaddress.jsp", afterLoadIpJSP, ipToMidmenu, ipToRigntPanel, ipGetMidmenuId, false);
|
||||
//bindAndListMidMenuItems("leftmenu_router", "listRouters", "listroutersresponse", "router", "jsp/router.jsp", afterLoadRouterJSP, routerToMidmenu, routerToRigntPanel, getMidmenuId, false);
|
||||
|
||||
bindAndListMidMenuItems("leftmenu_submenu_my_template", "listTemplates&templatefilter=self", "listtemplatesresponse", "template", "jsp/template.jsp", afterLoadTemplateJSP, templateToMidmenu, templateToRigntPanel, templateGetMidmenuId);
|
||||
bindAndListMidMenuItems("leftmenu_submenu_featured_template", "listTemplates&templatefilter=featured", "listtemplatesresponse", "template", "jsp/template.jsp", afterLoadTemplateJSP, templateToMidmenu, templateToRigntPanel, templateGetMidmenuId);
|
||||
bindAndListMidMenuItems("leftmenu_submenu_community_template", "listTemplates&templatefilter=community", "listtemplatesresponse", "template", "jsp/template.jsp", afterLoadTemplateJSP, templateToMidmenu, templateToRigntPanel, templateGetMidmenuId);
|
||||
bindAndListMidMenuItems($("#leftmenu_submenu_my_template"), "listTemplates&templatefilter=self", "listtemplatesresponse", "template", "jsp/template.jsp", afterLoadTemplateJSP, templateToMidmenu, templateToRigntPanel, templateGetMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_submenu_featured_template"), "listTemplates&templatefilter=featured", "listtemplatesresponse", "template", "jsp/template.jsp", afterLoadTemplateJSP, templateToMidmenu, templateToRigntPanel, templateGetMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_submenu_community_template"), "listTemplates&templatefilter=community", "listtemplatesresponse", "template", "jsp/template.jsp", afterLoadTemplateJSP, templateToMidmenu, templateToRigntPanel, templateGetMidmenuId, false);
|
||||
|
||||
bindAndListMidMenuItems("leftmenu_submenu_my_iso", "listIsos&isofilter=self", "listisosresponse", "iso", "jsp/iso.jsp", afterLoadIsoJSP, isoToMidmenu, isoToRigntPanel, isoGetMidmenuId);
|
||||
bindAndListMidMenuItems("leftmenu_submenu_featured_iso", "listIsos&isofilter=featured", "listisosresponse", "iso", "jsp/iso.jsp", afterLoadIsoJSP, isoToMidmenu, isoToRigntPanel, isoGetMidmenuId);
|
||||
bindAndListMidMenuItems("leftmenu_submenu_community_iso", "listIsos&isofilter=community", "listisosresponse", "iso", "jsp/iso.jsp", afterLoadIsoJSP, isoToMidmenu, isoToRigntPanel, isoGetMidmenuId);
|
||||
bindAndListMidMenuItems($("#leftmenu_submenu_my_iso"), "listIsos&isofilter=self", "listisosresponse", "iso", "jsp/iso.jsp", afterLoadIsoJSP, isoToMidmenu, isoToRigntPanel, isoGetMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_submenu_featured_iso"), "listIsos&isofilter=featured", "listisosresponse", "iso", "jsp/iso.jsp", afterLoadIsoJSP, isoToMidmenu, isoToRigntPanel, isoGetMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_submenu_community_iso"), "listIsos&isofilter=community", "listisosresponse", "iso", "jsp/iso.jsp", afterLoadIsoJSP, isoToMidmenu, isoToRigntPanel, isoGetMidmenuId, false);
|
||||
|
||||
bindAndListMidMenuItems("leftmenu_service_offering", "listServiceOfferings", "listserviceofferingsresponse", "serviceoffering", "jsp/serviceoffering.jsp", afterLoadServiceOfferingJSP, serviceOfferingToMidmenu, serviceOfferingToRigntPanel, getMidmenuId);
|
||||
bindAndListMidMenuItems("leftmenu_disk_offering", "listDiskOfferings", "listdiskofferingsresponse", "diskoffering", "jsp/diskoffering.jsp", afterLoadDiskOfferingJSP, diskOfferingToMidmenu, diskOfferingToRigntPanel, getMidmenuId);
|
||||
bindAndListMidMenuItems("leftmenu_global_setting", "listConfigurations", "listconfigurationsresponse", "configuration", "jsp/globalsetting.jsp", afterLoadGlobalSettingJSP, globalSettingToMidmenu, globalSettingToRigntPanel, globalSettingGetMidmenuId, getMidmenuId);
|
||||
bindAndListMidMenuItems($("#leftmenu_service_offering"), "listServiceOfferings", "listserviceofferingsresponse", "serviceoffering", "jsp/serviceoffering.jsp", afterLoadServiceOfferingJSP, serviceOfferingToMidmenu, serviceOfferingToRigntPanel, getMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_disk_offering"), "listDiskOfferings", "listdiskofferingsresponse", "diskoffering", "jsp/diskoffering.jsp", afterLoadDiskOfferingJSP, diskOfferingToMidmenu, diskOfferingToRigntPanel, getMidmenuId, false);
|
||||
bindAndListMidMenuItems($("#leftmenu_global_setting"), "listConfigurations", "listconfigurationsresponse", "configuration", "jsp/globalsetting.jsp", afterLoadGlobalSettingJSP, globalSettingToMidmenu, globalSettingToRigntPanel, globalSettingGetMidmenuId, getMidmenuId, false);
|
||||
|
||||
$("#leftmenu_instances").bind("click", function(event) {
|
||||
selectLeftMenu($(this), true);
|
||||
instanceBuildSubMenu();
|
||||
return false;
|
||||
});
|
||||
$("#leftmenu_instance_group_header").bind("click", function(event) {
|
||||
showMiddleMenu();
|
||||
clearMiddleMenu();
|
||||
enableMultipleSelectionInMidMenu(); //multiple-selection is needeed for actions like start VM, stop VM, reboot VM.
|
||||
var $arrowIcon = $(this).find("#arrow_icon");
|
||||
clickInstanceGroupHeader($arrowIcon);
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#leftmenu_domain").bind("click", function(event) {
|
||||
selectLeftMenu($(this), true);
|
||||
@ -118,14 +128,8 @@ $(document).ready(function() {
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#leftmenu_instance_group_header").bind("click", function(event) {
|
||||
showMiddleMenu();
|
||||
clearMiddleMenu();
|
||||
enableMultipleSelectionInMiddleMenu(); //multiple-selection is needeed for actions like start VM, stop VM, reboot VM.
|
||||
var $arrowIcon = $(this).find("#arrow_icon");
|
||||
clickInstanceGroupHeader($arrowIcon);
|
||||
return false;
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -727,10 +727,10 @@ function initDialogWithOK(elementId, width1) {
|
||||
}
|
||||
}
|
||||
|
||||
function disableMultipleSelectionInMidMenu() {
|
||||
function disableMultipleSelectionInMidMenu() {
|
||||
$("#midmenu_container").selectable("destroy"); //Most pages don't need multiple selection in middle menu.
|
||||
}
|
||||
function enableMultipleSelectionInMiddleMenu() {
|
||||
function enableMultipleSelectionInMidMenu() {
|
||||
$("#midmenu_container").selectable({
|
||||
selecting: function(event, ui) {
|
||||
if(ui.selecting.id.indexOf("midmenuItem") != -1) {
|
||||
@ -762,7 +762,7 @@ function getMidmenuId(jsonObj) {
|
||||
return "midmenuItem_" + jsonObj.id;
|
||||
}
|
||||
|
||||
function listMidMenuItems2(commandString, jsonResponse1, jsonResponse2, toMidmenuFn, toRightPanelFn, getMidmenuIdFn, clickFirstItem) {
|
||||
function listMidMenuItems2(commandString, jsonResponse1, jsonResponse2, toMidmenuFn, toRightPanelFn, getMidmenuIdFn, clickFirstItem, isMultipleSelectionInMidMenu) {
|
||||
$.ajax({
|
||||
cache: false,
|
||||
data: createURL("command="+commandString+"&pagesize="+midmenuItemCount),
|
||||
@ -777,17 +777,21 @@ function listMidMenuItems2(commandString, jsonResponse1, jsonResponse2, toMidmen
|
||||
toMidmenuFn(items[i], $midmenuItem1);
|
||||
bindClickToMidMenu($midmenuItem1, toRightPanelFn, getMidmenuIdFn);
|
||||
$("#midmenu_container").append($midmenuItem1.show());
|
||||
if(clickFirstItem == true && i == 0) //click the 1st item in middle menu as default
|
||||
$midmenuItem1.click();
|
||||
if(clickFirstItem == true && i == 0) { //click the 1st item in middle menu as default
|
||||
$midmenuItem1.click();
|
||||
if(isMultipleSelectionInMidMenu == true) {
|
||||
$midmenuItem1.addClass("ui-selected"); //because instance page is using JQuery selectable widget to do multiple-selection
|
||||
selectedItemsInMidMenu[items[i].id] = $midmenuItem1; //because instance page is using JQuery selectable widget to do multiple-selection
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function listMidMenuItems(commandString, jsonResponse1, jsonResponse2, rightPanelJSP, afterLoadRightPanelJSPFn, toMidmenuFn, toRightPanelFn, getMidmenuIdFn) {
|
||||
showMiddleMenu();
|
||||
disableMultipleSelectionInMidMenu();
|
||||
function listMidMenuItems(commandString, jsonResponse1, jsonResponse2, rightPanelJSP, afterLoadRightPanelJSPFn, toMidmenuFn, toRightPanelFn, getMidmenuIdFn, isMultipleSelectionInMidMenu) {
|
||||
showMiddleMenu();
|
||||
clearMiddleMenu();
|
||||
|
||||
$("#right_panel").load(rightPanelJSP, function(){
|
||||
@ -802,15 +806,20 @@ function listMidMenuItems(commandString, jsonResponse1, jsonResponse2, rightPane
|
||||
});
|
||||
|
||||
afterLoadRightPanelJSPFn();
|
||||
listMidMenuItems2(commandString, jsonResponse1, jsonResponse2, toMidmenuFn, toRightPanelFn, getMidmenuIdFn, true);
|
||||
listMidMenuItems2(commandString, jsonResponse1, jsonResponse2, toMidmenuFn, toRightPanelFn, getMidmenuIdFn, true, isMultipleSelectionInMidMenu);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function bindAndListMidMenuItems(leftmenuId, commandString, jsonResponse1, jsonResponse2, rightPanelJSP, afterLoadRightPanelJSPFn, toMidmenuFn, toRightPanelFn, getMidmenuIdFn) {
|
||||
$("#"+leftmenuId).bind("click", function(event) {
|
||||
function bindAndListMidMenuItems($leftmenu, commandString, jsonResponse1, jsonResponse2, rightPanelJSP, afterLoadRightPanelJSPFn, toMidmenuFn, toRightPanelFn, getMidmenuIdFn, isMultipleSelectionInMidMenu) {
|
||||
if(isMultipleSelectionInMidMenu == true)
|
||||
enableMultipleSelectionInMidMenu();
|
||||
else
|
||||
disableMultipleSelectionInMidMenu();
|
||||
|
||||
$leftmenu.bind("click", function(event) {
|
||||
selectLeftSubMenu($(this));
|
||||
listMidMenuItems(commandString, jsonResponse1, jsonResponse2, rightPanelJSP, afterLoadRightPanelJSPFn, toMidmenuFn, toRightPanelFn, getMidmenuIdFn);
|
||||
listMidMenuItems(commandString, jsonResponse1, jsonResponse2, rightPanelJSP, afterLoadRightPanelJSPFn, toMidmenuFn, toRightPanelFn, getMidmenuIdFn, isMultipleSelectionInMidMenu);
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user