etan39
/
cloudstack
mirror of https://github.com/apache/cloudstack.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

new UI - zonetree in left menu - clicking cluster node will populate hosts to middle menu.

This commit is contained in:
Jessica Wang 2010-10-16 11:36:18 -07:00
parent e41729cc43
commit cd367de19f
3 changed files with 68 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
ui/new/scripts/cloud.core2.init.js
View File

@ -27,60 +27,7 @@ $(document).ready(function() {
return false;
});
$("#leftmenu_container").show();
var $midmenuItem = $("#midmenu_item");
function listMidMenuItems(leftmenuId, commandString, jsonResponse1, jsonResponse2, rightPanelJSP, afterLoadRightPanelJSPFn, toMidmenuFn, toRightPanelFn, getMidmenuIdFn) {
$("#"+leftmenuId).bind("click", function(event) {
selectLeftMenu($(this));
showMiddleMenu();
disableMultipleSelectionInMidMenu();
clearLeftMenu();
clearMiddleMenu();
$("#right_panel").load(rightPanelJSP, function(){
$("#right_panel_content #tab_content_details #action_message_box #close_button").bind("click", function(event){
$(this).parent().hide();
return false;
});
var $actionLink = $("#right_panel_content #tab_content_details #action_link");
$actionLink.bind("mouseover", function(event) {
$(this).find("#action_menu").show();
return false;
});
$actionLink.bind("mouseout", function(event) {
$(this).find("#action_menu").hide();
return false;
});
afterLoadRightPanelJSPFn();
$.ajax({
cache: false,
data: createURL("command="+commandString+"&pagesize="+midmenuItemCount),
dataType: "json",
success: function(json) {
selectedItemsInMidMenu = {};
var items = json[jsonResponse1][jsonResponse2];
if(items != null && items.length > 0) {
for(var i=0; i<items.length;i++) {
var $midmenuItem1 = $midmenuItem.clone();
$midmenuItem1.data("toRightPanelFn", toRightPanelFn);
toMidmenuFn(items[i], $midmenuItem1);
bindClickToMidMenu($midmenuItem1, toRightPanelFn, getMidmenuIdFn);
$("#midmenu_container").append($midmenuItem1.show());
if(i == 0) //click the 1st item in middle menu as default
$midmenuItem1.click();
}
}
}
});
});
return false;
});
}
listMidMenuItems("leftmenu_event", "listEvents", "listeventsresponse", "event", "jsp/event.jsp", afterLoadEventJSP, eventToMidmenu, eventToRigntPanel, getMidmenuId);
listMidMenuItems("leftmenu_alert", "listAlerts", "listalertsresponse", "alert", "jsp/alert.jsp", afterLoadAlertJSP, alertToMidmenu, alertToRigntPanel, getMidmenuId);
listMidMenuItems("leftmenu_account", "listAccounts", "listaccountsresponse", "account", "jsp/account.jsp", afterLoadAccountJSP, accountToMidmenu, accountToRigntPanel, getMidmenuId);

49
ui/new/scripts/cloud.core2.js
View File

@ -739,7 +739,56 @@ function getMidmenuId(jsonObj) {
return "midmenuItem_" + jsonObj.id;
}
function listItemsInMidmenu(commandString, jsonResponse1, jsonResponse2, toMidmenuFn, toRightPanelFn, getMidmenuIdFn) {
$.ajax({
cache: false,
data: createURL("command="+commandString+"&pagesize="+midmenuItemCount),
dataType: "json",
success: function(json) {
selectedItemsInMidMenu = {};
var items = json[jsonResponse1][jsonResponse2];
if(items != null && items.length > 0) {
for(var i=0; i<items.length;i++) {
var $midmenuItem1 = $("#midmenu_item").clone();
$midmenuItem1.data("toRightPanelFn", toRightPanelFn);
toMidmenuFn(items[i], $midmenuItem1);
bindClickToMidMenu($midmenuItem1, toRightPanelFn, getMidmenuIdFn);
$("#midmenu_container").append($midmenuItem1.show());
if(i == 0) //click the 1st item in middle menu as default
$midmenuItem1.click();
}
}
}
});
}
function listMidMenuItems(leftmenuId, commandString, jsonResponse1, jsonResponse2, rightPanelJSP, afterLoadRightPanelJSPFn, toMidmenuFn, toRightPanelFn, getMidmenuIdFn) {
$("#"+leftmenuId).bind("click", function(event) {
selectLeftMenu($(this));
showMiddleMenu();
disableMultipleSelectionInMidMenu();
clearLeftMenu();
clearMiddleMenu();
$("#right_panel").load(rightPanelJSP, function(){
var $actionLink = $("#right_panel_content #tab_content_details #action_link");
$actionLink.bind("mouseover", function(event) {
$(this).find("#action_menu").show();
return false;
});
$actionLink.bind("mouseout", function(event) {
$(this).find("#action_menu").hide();
return false;
});
afterLoadRightPanelJSPFn();
listItemsInMidmenu(commandString, jsonResponse1, jsonResponse2, toMidmenuFn, toRightPanelFn, getMidmenuIdFn);
});
return false;
});
}

19
ui/new/scripts/cloud.core2.resource.js
View File

@ -209,7 +209,10 @@ function buildZoneTree() {
selectLeftMenu(target.parent().parent().parent());
var jsonObj = target.data("jsonObj");
showPage($("#cluster_page"), jsonObj);
clusterJsonToDetailsTab(jsonObj);
clusterJsonToDetailsTab(jsonObj);
var clusterId = jsonObj.id;
$("#midmenu_container").empty();
listItemsInMidmenu(("listHosts&clusterid="+clusterId), "listhostsresponse", "host", hostToMidmenu, hostToRigntPanel, getMidmenuId);
break;
case "systemvm_name" :
@ -449,6 +452,20 @@ function clusterJsonToDetailsTab(jsonObj) {
//***** cluster page (end) ****************************************************************************************************
//***** host page (bgein) *****************************************************************************************************
function hostToMidmenu(jsonObj, $midmenuItem1) {
$midmenuItem1.attr("id", getMidmenuId(jsonObj));
$midmenuItem1.data("jsonObj", jsonObj);
//$iconContainer.find("#icon").attr("src", "images/midmenuicon_host.png");
$midmenuItem1.find("#first_row").text(jsonObj.name.substring(0,25));
$midmenuItem1.find("#second_row").text(jsonObj.ipaddress.substring(0,25));
updateStateInMidMenu(jsonObj, $midmenuItem1);
}
function hostToRigntPanel($midmenuItem) {
var jsonObj = $midmenuItem.data("jsonObj");
hostJsonToDetailsTab(jsonObj);
}
function hostJsonToDetailsTab(jsonObj) {
var $detailsTab = $("#host_page").find("#tab_content_details");
$detailsTab.data("jsonObj", jsonObj);