new UI - add different icons to middle menu item

This commit is contained in:
Jessica Wang 2010-09-10 16:27:07 -07:00
parent d933f19d35
commit 3867285af8
7 changed files with 105 additions and 34 deletions

View File

@ -1,5 +1,24 @@
function loadAccountToRigntPanelFn($rightPanelContent) {
var jsonObj = $rightPanelContent.data("jsonObj");
function accountToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
$midmenuItem1.data("id", jsonObj.id);
$midmenuItem1.data("jsonObj", jsonObj);
var iconContainer = $midmenuItem1.find("#icon_container").show();
if (jsonObj.accounttype == roleTypeUser)
iconContainer.find("#icon").attr("src", "images/midmenuicon_account_user.png");
else if (jsonObj.accounttype == roleTypeAdmin)
iconContainer.find("#icon").attr("src", "images/midmenuicon_account_admin.png");
else if (jsonObj.accounttype == roleTypeDomainAdmin)
iconContainer.find("#icon").attr("src", "images/midmenuicon_account_domain.png");
$midmenuItem1.find("#first_row").text(jsonObj.name.substring(0,25));
$midmenuItem1.find("#second_row").text(jsonObj.domain.substring(0,25));
$midmenuItem1.data("toRightPanelFn", toRightPanelFn);
}
function accountToRigntPanel($midmenuItem) {
var jsonObj = $midmenuItem.data("jsonObj");
var $rightPanelContent = $("#right_panel_content");
$rightPanelContent.find("#role").text(toRole(jsonObj.accounttype));
$rightPanelContent.find("#account").text(fromdb(jsonObj.name));

View File

@ -1,10 +1,17 @@
function loadAlertToRigntPanelFn($rightPanelContent) {
var jsonObj = $rightPanelContent.data("jsonObj");
function alertToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
$midmenuItem1.data("id", jsonObj.id);
$midmenuItem1.data("jsonObj", jsonObj);
$midmenuItem1.find("#first_row").text(jsonObj.description.substring(0,25));
$midmenuItem1.find("#second_row").text(jsonObj.type.substring(0,25));
$midmenuItem1.data("toRightPanelFn", toRightPanelFn);
}
function alertToRigntPanel($midmenuItem) {
var jsonObj = $midmenuItem.data("jsonObj");
var $rightPanelContent = $("#right_panel_content");
$rightPanelContent.find("#type").text(jsonObj.type);
$rightPanelContent.find("#description").text(jsonObj.description);
setDateField(jsonObj.sent, $rightPanelContent.find("#sent"));
}

View File

@ -1,5 +1,24 @@
function loadEventToRigntPanelFn($rightPanelContent) {
var jsonObj = $rightPanelContent.data("jsonObj");
function eventToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
$midmenuItem1.data("id", jsonObj.id);
$midmenuItem1.data("jsonObj", jsonObj);
var iconContainer = $midmenuItem1.find("#icon_container").show();
if(jsonObj.level == "INFO")
iconContainer.find("#icon").attr("src", "images/midmenuicon_events_info.png");
else if(jsonObj.level == "ERROR")
iconContainer.find("#icon").attr("src", "images/midmenuicon_events_error.png");
else if(jsonObj.level == "WARN")
iconContainer.find("#icon").attr("src", "images/midmenuicon_events_warning.png");
$midmenuItem1.find("#first_row").text(jsonObj.description.substring(0,25));
$midmenuItem1.find("#second_row").text(jsonObj.type.substring(0,25));
$midmenuItem1.data("toRightPanelFn", toRightPanelFn);
}
function eventToRigntPanel($midmenuItem) {
var jsonObj = $midmenuItem.data("jsonObj");
var $rightPanelContent = $("#right_panel_content");
$rightPanelContent.find("#username").text(fromdb(jsonObj.username));
$rightPanelContent.find("#account").text(fromdb(jsonObj.account));

View File

@ -58,7 +58,7 @@ $(document).ready(function() {
}
var $midmenuItem = $("#midmenu_item");
function listMidMenuItems(leftmenuId, apiName, jsonResponse1, jsonResponse2, propertyForFirstRow, propertyForSecondRow, rightPanelJSP, toRightPanelFn) {
function listMidMenuItems(leftmenuId, apiName, jsonResponse1, jsonResponse2, rightPanelJSP, toMidmenu, toRightPanel) {
$("#"+leftmenuId).bind("click", function(event) {
$("#right_panel").load(rightPanelJSP);
@ -73,9 +73,8 @@ $(document).ready(function() {
var items = json[jsonResponse1][jsonResponse2];
if(items != null && items.length > 0) {
for(var i=0; i<items.length;i++) {
var item = items[i];
var $midmenuItem1 = $midmenuItem.clone();
jsonToMidmenu(item, $midmenuItem1, propertyForFirstRow, propertyForSecondRow, toRightPanelFn);
toMidmenu(items[i], $midmenuItem1, toRightPanel);
$("#midmenu_container").append($midmenuItem1.show());
}
}
@ -85,12 +84,12 @@ $(document).ready(function() {
return false;
});
}
listMidMenuItems("leftmenu_event", "listEvents", "listeventsresponse", "event", "description", "type", "jsp/event.jsp", loadEventToRigntPanelFn);
listMidMenuItems("leftmenu_alert", "listAlerts", "listalertsresponse", "alert", "description", "type", "jsp/alert.jsp", loadAlertToRigntPanelFn);
listMidMenuItems("leftmenu_account", "listAccounts", "listaccountsresponse", "account", "name", "domain", "jsp/account.jsp", loadAccountToRigntPanelFn);
listMidMenuItems("leftmenu_volume", "listVolumes", "listvolumesresponse", "volume", "name", "type", "jsp/volume.jsp", loadVolumeToRigntPanelFn);
listMidMenuItems("leftmenu_snapshot", "listSnapshots", "listsnapshotsresponse", "snapshot", "name", "volumename", "jsp/snapshot.jsp", loadSnapshotToRigntPanelFn);
listMidMenuItems("leftmenu_ip", "listPublicIpAddresses", "listpublicipaddressesresponse", "publicipaddress", "ipaddress", "account", "jsp/ip_address.jsp", loadIpToRigntPanelFn);
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);
$("#action_link").bind("mouseover", function(event) {

View File

@ -1,8 +1,20 @@
function loadIpToRigntPanelFn($rightPanelContent) {
var jsonObj = $rightPanelContent.data("jsonObj");
function ipToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
$midmenuItem1.data("id", jsonObj.id);
$midmenuItem1.data("jsonObj", jsonObj);
var iconContainer = $midmenuItem1.find("#icon_container").show();
iconContainer.find("#icon").attr("src", "images/midmenuicon_network_networkgroup.png");
$midmenuItem1.find("#first_row").text(jsonObj.ipaddress.substring(0,25));
$midmenuItem1.find("#second_row").text(jsonObj.account.substring(0,25));
$midmenuItem1.data("toRightPanelFn", toRightPanelFn);
}
function ipToRigntPanel($midmenuItem) {
var jsonObj = $midmenuItem.data("jsonObj");
var $rightPanelContent = $("#right_panel_content");
//$rightPanelContent.find("#type").text(jsonObj.type);
//$rightPanelContent.find("#description").text(jsonObj.description);
//setDateField(jsonObj.sent, $rightPanelContent.find("#sent"));

View File

@ -1,14 +1,21 @@
function loadSnapshotToRigntPanelFn($rightPanelContent) {
var jsonObj = $rightPanelContent.data("jsonObj");
function snapshotToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
$midmenuItem1.data("id", jsonObj.id);
$midmenuItem1.data("jsonObj", jsonObj);
$midmenuItem1.find("#first_row").text(jsonObj.name.substring(0,25));
$midmenuItem1.find("#second_row").text(jsonObj.volumename.substring(0,25));
$midmenuItem1.data("toRightPanelFn", toRightPanelFn);
}
function snapshotToRigntPanel($midmenuItem) {
var jsonObj = $midmenuItem.data("jsonObj");
var $rightPanelContent = $("#right_panel_content");
$rightPanelContent.find("#id").text(jsonObj.id);
$rightPanelContent.find("#name").text(fromdb(jsonObj.name));
$rightPanelContent.find("#volume_name").text(fromdb(jsonObj.volumename));
$rightPanelContent.find("#interval_type").text(jsonObj.intervaltype);
$rightPanelContent.find("#account").text(fromdb(jsonObj.account));
$rightPanelContent.find("#domain").text(fromdb(jsonObj.domain));
setDateField(jsonObj.created, $rightPanelContent.find("#created"));
}

View File

@ -1,8 +1,16 @@
function loadVolumeToRigntPanelFn($rightPanelContent) {
var jsonObj = $rightPanelContent.data("jsonObj");
function volumeToMidmenu(jsonObj, $midmenuItem1, toRightPanelFn) {
$midmenuItem1.attr("id", ("midmenuItem_"+jsonObj.id));
$midmenuItem1.data("id", jsonObj.id);
$midmenuItem1.data("jsonObj", jsonObj);
$midmenuItem1.find("#first_row").text(jsonObj.name.substring(0,25));
$midmenuItem1.find("#second_row").text(jsonObj.type.substring(0,25));
$midmenuItem1.data("toRightPanelFn", toRightPanelFn);
}
function volumeToRigntPanel($midmenuItem) {
var jsonObj = $midmenuItem.data("jsonObj");
var $rightPanelContent = $("#right_panel_content");
$rightPanelContent.find("#id").text(jsonObj.id);
$rightPanelContent.find("#name").text(fromdb(jsonObj.name));
$rightPanelContent.find("#zonename").text(fromdb(jsonObj.zonename));