bug 10583: cloudStack - middle menu items - clip text and add add ellipsis if text is too long.

This commit is contained in:
Jessica Wang 2011-09-12 12:22:22 -07:00
parent 8fdc770cbc
commit 014603e3e9
21 changed files with 50 additions and 44 deletions

View File

@ -353,11 +353,11 @@ function accountToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_account_domain.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.domain);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -46,11 +46,11 @@ function alertToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_alerts.png");
var firstRowText = fromdb(jsonObj.description);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = toAlertType(jsonObj.type);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -261,11 +261,11 @@ function diskOfferingToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_system_diskoffering.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.displaytext);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -93,11 +93,11 @@ function eventToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_events_warning.png");
var firstRowText = fromdb(jsonObj.description);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.type);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -96,11 +96,11 @@ function hostToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_host.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.ipaddress);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
updateHostStateInMidMenu(jsonObj, $midmenuItem1);

View File

@ -1796,11 +1796,11 @@ function vmToMidmenu(jsonObj, $midmenuItem1) {
$midmenuItem1.attr("id", getMidmenuId(jsonObj));
var firstRowText = getVmName(jsonObj.name, jsonObj.displayname);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.templatename);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
updateVmStateInMidMenu(jsonObj, $midmenuItem1);

View File

@ -802,11 +802,11 @@ function ipToMidmenu(jsonObj, $midmenuItem1) {
var firstRowText = fromdb(jsonObj.ipaddress);
if (jsonObj.issourcenat == true)
firstRowText += "[source nat]";
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = "owned by: "+fromdb(jsonObj.account);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -308,11 +308,11 @@ function isoToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_iso.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.zonename);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -849,7 +849,7 @@ function afterAddingMidMenuItem($midmenuItem1, isSuccessful, secondRowText) {
$midmenuItem1.find("#first_row").text(g_dictionary["label.adding.failed"]);
if(secondRowText != null)
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#close_icon").show().bind("click", function(event) {
$midmenuItem1.slideUp("slow", function() {
@ -860,7 +860,7 @@ function afterAddingMidMenuItem($midmenuItem1, isSuccessful, secondRowText) {
}
if(secondRowText != null) {
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
}
}
@ -2037,6 +2037,12 @@ function sanitizeXSS(val) {
var midMenuFirstRowLength = 26;
var midMenuSecondRowLength = 33;
function clippedText(text, maxLength) {
if(text.length <= maxLength)
return text;
else
return text.substring(0,maxLength-3)+"...";
}
function getVmName(p_vmName, p_vmDisplayname) {
if(p_vmDisplayname == null)

View File

@ -188,11 +188,11 @@ function publicNetworkToMidmenu(jsonObj, $midmenuItem1) {
*/
var firstRowText = "Public Network";
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = "VLAN: Multiple";
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}
@ -1034,11 +1034,11 @@ function directNetworkToMidmenu(jsonObj, $midmenuItem1) {
*/
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = "VLAN : " + fromdb(jsonObj.vlan);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -102,11 +102,11 @@ function networkOfferingToMidmenu(jsonObj, $midmenuItem1) {
*/
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.availability);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -49,11 +49,11 @@ function primarystorageToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_primarystorage.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.ipaddress);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
updateHostStateInMidMenu(jsonObj, $midmenuItem1);

View File

@ -84,11 +84,11 @@ function routerToMidmenu(jsonObj, $midmenuItem1) {
$midmenuItem1.data("jsonObj", jsonObj);
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.publicip);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
updateVmStateInMidMenu(jsonObj, $midmenuItem1);

View File

@ -65,11 +65,11 @@ function secondaryStorageToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_host.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.id).toString();
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -383,11 +383,11 @@ function securityGroupToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_securityGroup.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.account);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -274,11 +274,11 @@ function serviceOfferingToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_system_serviceoffering.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = jsonObj.cpunumber + " x " + convertHz(jsonObj.cpuspeed);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -124,11 +124,11 @@ function snapshotToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_storage_snapshots.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.volumename);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -274,11 +274,11 @@ function systemServiceOfferingToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_system_serviceoffering.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = jsonObj.cpunumber + " x " + convertHz(jsonObj.cpuspeed);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -56,11 +56,11 @@ function systemvmToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_resource_systemvm.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.publicip);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
updateVmStateInMidMenu(jsonObj, $midmenuItem1);

View File

@ -336,11 +336,11 @@ function templateToMidmenu(jsonObj, $midmenuItem1) {
setIconByOsType(jsonObj.ostypename, $iconContainer.find("#icon"));
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.zonename);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}

View File

@ -372,11 +372,11 @@ function volumeToMidmenu(jsonObj, $midmenuItem1) {
$iconContainer.find("#icon").attr("src", "images/midmenuicon_storage_volume.png");
var firstRowText = fromdb(jsonObj.name);
$midmenuItem1.find("#first_row").text(firstRowText.substring(0,midMenuFirstRowLength));
$midmenuItem1.find("#first_row").text(clippedText(firstRowText, midMenuFirstRowLength));
$midmenuItem1.find("#first_row_container").attr("title", firstRowText);
var secondRowText = fromdb(jsonObj.type);
$midmenuItem1.find("#second_row").text(secondRowText.substring(0,midMenuSecondRowLength));
$midmenuItem1.find("#second_row").text(clippedText(secondRowText, midMenuSecondRowLength));
$midmenuItem1.find("#second_row_container").attr("title", secondRowText);
}