Bug 489433: larry UI is cut off in portrait mode, r=gavin

This commit is contained in:
Mark Finkle 2009-06-08 14:09:18 -04:00
parent c5c7db3ea8
commit 166b678d88
7 changed files with 133 additions and 210 deletions

View File

@ -102,7 +102,7 @@ var BrowserUI = {
},
_linkAdded : function(aEvent) {
var link = aEvent.originalTarget;
let link = aEvent.originalTarget;
if (!link || !link.href)
return;
@ -226,6 +226,9 @@ var BrowserUI = {
// findbar
document.getElementById("findbar-container").width = windowW;
// identity
document.getElementById("identity-container").width = windowW;
// sidebars
let sideBarHeight = windowH - this.toolbarH;
controls.height = sideBarHeight;

View File

@ -605,13 +605,13 @@ function IdentityHandler() {
this._stringBundle = document.getElementById("bundle_browser");
this._staticStrings = {};
this._staticStrings[this.IDENTITY_MODE_DOMAIN_VERIFIED] = {
encryption_label: this._stringBundle.getString("identity.encrypted")
encryption_label: this._stringBundle.getString("identity.encrypted2")
};
this._staticStrings[this.IDENTITY_MODE_IDENTIFIED] = {
encryption_label: this._stringBundle.getString("identity.encrypted")
encryption_label: this._stringBundle.getString("identity.encrypted2")
};
this._staticStrings[this.IDENTITY_MODE_UNKNOWN] = {
encryption_label: this._stringBundle.getString("identity.unencrypted")
encryption_label: this._stringBundle.getString("identity.unencrypted2")
};
this._cacheElements();
@ -632,8 +632,8 @@ IdentityHandler.prototype = {
* Build out a cache of the elements that we need frequently.
*/
_cacheElements: function() {
this._identityPopup = document.getElementById("identity-popup");
this._identityBox = document.getElementById("identity-box");
this._identityPopup = document.getElementById("identity-container");
this._identityPopupContentBox = document.getElementById("identity-popup-content-box");
this._identityPopupContentHost = document.getElementById("identity-popup-content-host");
this._identityPopupContentOwner = document.getElementById("identity-popup-content-owner");
@ -642,15 +642,6 @@ IdentityHandler.prototype = {
this._identityPopupEncLabel = document.getElementById("identity-popup-encryption-label");
},
/**
* Handler for mouseclicks on the "More Information" button in the
* "identity-popup" panel.
*/
handleMoreInfoClick: function(event) {
displaySecurityInfo();
event.stopPropagation();
},
/**
* Helper to parse out the important parts of _lastStatus (of the SSL cert in
* particular) for use in constructing identity UI strings
@ -730,17 +721,11 @@ IdentityHandler.prototype = {
* IDENTITY_MODE_* constants.
*/
setMode: function(newMode) {
if (!this._identityBox) {
// No identity box means the identity box is not visible, in which
// case there's nothing to do.
return;
}
this._identityBox.className = newMode;
this._identityBox.setAttribute("mode", newMode);
this.setIdentityMessages(newMode);
// Update the popup too, if it's open
if (this._identityPopup.state == "open")
if (!this._identityPopup.hidden)
this.setPopupMessages(newMode);
},
@ -800,8 +785,7 @@ IdentityHandler.prototype = {
* @param newMode The newly set identity mode. Should be one of the IDENTITY_MODE_* constants.
*/
setPopupMessages: function(newMode) {
this._identityPopup.className = newMode;
this._identityPopup.setAttribute("mode", newMode);
this._identityPopupContentBox.className = newMode;
// Set the static strings up front
@ -849,15 +833,26 @@ IdentityHandler.prototype = {
this._identityPopupContentVerif.textContent = verifier;
},
hideIdentityPopup: function() {
this._identityPopup.hidePopup();
show: function ih_show() {
this._identityPopup.hidden = false;
this._identityPopup.top = BrowserUI.toolbarH;
this._identityPopup.focus();
// Update the popup strings
this.setPopupMessages(this._identityBox.getAttribute("mode") || this.IDENTITY_MODE_UNKNOWN);
window.addEventListener("blur", this, true);
},
hide: function ih_hide() {
window.removeEventListener("blur", this, true);
this._identityPopup.hidden = true;
},
/**
* Click handler for the identity-box element in primary chrome.
*/
handleIdentityButtonEvent: function(event) {
event.stopPropagation();
if ((event.type == "click" && event.button != 0) ||
@ -865,20 +860,15 @@ IdentityHandler.prototype = {
event.keyCode != KeyEvent.DOM_VK_RETURN))
return; // Left click, space or enter only
// Make sure that the display:none style we set in xul is removed now that
// the popup is actually needed
this._identityPopup.hidden = false;
if (this._identityPopup.hidden)
this.show();
else
this.hide();
},
// Tell the popup to consume dismiss clicks, to avoid bug 395314
this._identityPopup.popupBoxObject
.setConsumeRollupEvent(Ci.nsIPopupBoxObject.ROLLUP_CONSUME);
// Update the popup strings
this.setPopupMessages(this._identityBox.className ||
this.IDENTITY_MODE_UNKNOWN);
// Now open the popup, anchored off the primary chrome element
this._identityPopup.openPopup(this._identityBox, 'after_start');
handleEvent: function(event) {
// Watch for blur events so we can close the panel
this.hide();
}
};

View File

@ -171,29 +171,6 @@
</keyset>
<popupset id="mainPopupSet">
<!-- popup for site identity information -->
<panel id="identity-popup" position="after_start" hidden="true" noautofocus="true"
norestorefocus="true">
<hbox id="identity-popup-container" align="top">
<image id="identity-popup-icon"/>
<vbox id="identity-popup-content-box">
<label id="identity-popup-connectedToLabel" value="&identity.connectedTo;"/>
<label id="identity-popup-connectedToLabel2" value="&identity.unverifiedsite2;"/>
<description id="identity-popup-content-host"/>
<label id="identity-popup-runByLabel" value="&identity.runBy;"/>
<description id="identity-popup-content-owner"/>
<description id="identity-popup-content-supplemental"/>
<description id="identity-popup-content-verifier"/>
<hbox id="identity-popup-encryption" flex="1">
<vbox>
<image id="identity-popup-encryption-icon"/>
<spacer flex="1"/>
</vbox>
<description id="identity-popup-encryption-label" flex="1"/>
</hbox>
</vbox>
</hbox>
</panel>
</popupset>
<!-- stupid stack needs to be in a box. not sure why -->
@ -284,10 +261,33 @@
<notificationbox id="notifications" style="-moz-stack-sizing: ignore;" top="0" left="0"/>
<!-- popup for find toolbar -->
<hbox id="findbar-container" hidden="true" style="-moz-stack-sizing: ignore;" top="0" left="0">
<findbar id="findbar" flex="1"/>
</hbox>
<!-- popup for site identity information -->
<hbox id="identity-container" hidden="true" class="panel-dark" style="-moz-stack-sizing: ignore;" top="0" left="0" align="top" mode="unknownIdentity">
<image id="identity-popup-icon"/>
<vbox id="identity-popup-content-box" flex="1">
<hbox flex="1">
<label id="identity-popup-connectedToLabel" value="&identity.connectedTo2;"/>
<label id="identity-popup-connectedToLabel2" flex="1">&identity.unverifiedsite2;</label>
<description id="identity-popup-content-host" flex="1"/>
</hbox>
<hbox flex="1">
<label id="identity-popup-runByLabel" value="&identity.runBy2;"/>
<description id="identity-popup-content-owner"/>
<description id="identity-popup-content-supplemental"/>
</hbox>
<description id="identity-popup-content-verifier"/>
</vbox>
<vbox align="center" pack="start">
<image id="identity-popup-encryption-icon"/>
<description id="identity-popup-encryption-label"/>
</vbox>
</hbox>
<vbox id="bookmark-container" hidden="true" class="panel-dark" style="-moz-stack-sizing: ignore;" top="0" left="0">
<hbox id="bookmark-form" align="start">
<image id="bookmark-image" src="chrome://browser/skin/images/starred48.png"/>

View File

@ -82,16 +82,10 @@
<!ENTITY noResults.label "No results">
<!ENTITY identity.unverifiedsite2 "This web site does not supply identity information.">
<!ENTITY identity.connectedTo "You are connected to">
<!-- Localization note (identity.runBy) : This string appears between a
domain name (above) and an organization name (below). E.g.
example.com
which is run by
Example Enterprises, Inc.
The layout of the identity dialog prevents combining this into a single string with
substitution variables. If it is difficult to translate the sense of the string
with that structure, consider a translation which ignores the preceding domain and
just addresses the organization to follow, e.g. "This site is run by " -->
<!ENTITY identity.runBy "which is run by">
<!ENTITY identity.connectedTo2 "Connected to">
<!-- Localization note (identity.runBy2)
The layout of the identity dialog prevents combining this into a single string with
substitution variables. If it is difficult to translate the sense of the string
with that structure, consider a translation which ignores the preceding domain and
just addresses the organization to follow, e.g. "This site is run by " -->
<!ENTITY identity.runBy2 "run by">

View File

@ -55,8 +55,8 @@ identity.identified.verifier=Verified by: %S
identity.identified.verified_by_you=You have added a security exception for this site
identity.identified.state_and_country=%S, %S
identity.identified.title_with_country=%S (%S)
identity.encrypted=Your connection to this web site is encrypted to prevent eavesdropping.
identity.unencrypted=Your connection to this web site is not encrypted.
identity.encrypted2=Encrypted
identity.unencrypted2=Not encrypted
identity.unknown.tooltip=This web site does not supply identity information.
identity.ownerUnknown2=(unknown)

View File

@ -117,20 +117,20 @@ toolbarbutton.urlbar-cap-button {
}
/* add special color */
#identity-box.verifiedIdentity {
#identity-box[mode="verifiedIdentity"] {
background: url("images/leftcapEV-default-64.png");
}
#identity-box.verifiedIdentity:hover:active {
#identity-box[mode="verifiedIdentity"]:hover:active {
background: url("images/leftcapEV-active-64.png");
}
/* add special color */
#identity-box.verifiedDomain {
#identity-box[mode="verifiedDomain"] {
background: url("images/leftcapSSL-default-64.png");
}
#identity-box.verifiedDomain:hover:active {
#identity-box[mode="verifiedDomain"]:hover:active {
background: url("images/leftcapSSL-active-64.png");
}
@ -493,95 +493,63 @@ findbar {
}
/* Identity popup -------------------------------------------------------- */
#identity-container {
padding: 2.2mm; /* core spacing */
}
/* Popup Icons */
#identity-popup-icon {
padding: 0;
list-style-image: url("chrome://browser/skin/images/identity-64.png");
}
#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
#identity-container[mode="verifiedDomain"] > #identity-popup-icon {
list-style-image: url("chrome://browser/skin/images/identitySSL-64.png");
}
#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
#identity-container[mode="verifiedIdentity"] > #identity-popup-icon {
list-style-image: url("chrome://browser/skin/images/identityEV-64.png");
}
/* Popup Body Text */
#identity-popup-content-box.unknownIdentity > #identity-popup-connectedToLabel ,
#identity-popup-content-box.unknownIdentity > #identity-popup-runByLabel ,
#identity-popup-content-box.unknownIdentity > #identity-popup-content-host ,
#identity-popup-content-box.unknownIdentity > #identity-popup-content-owner ,
#identity-popup-content-box.verifiedIdentity > #identity-popup-connectedToLabel2 ,
#identity-popup-content-box.verifiedDomain > #identity-popup-connectedToLabel2 {
#identity-popup-content-box {
-moz-padding-start: 2.2mm; /* core spacing */
}
#identity-popup-content-box.unknownIdentity > hbox > #identity-popup-connectedToLabel,
#identity-popup-content-box.unknownIdentity > hbox > #identity-popup-runByLabel,
#identity-popup-content-box.unknownIdentity > hbox > #identity-popup-content-host,
#identity-popup-content-box.unknownIdentity > hbox > #identity-popup-content-owner,
#identity-popup-content-box.verifiedIdentity > hbox > #identity-popup-connectedToLabel2,
#identity-popup-content-box.verifiedDomain > hbox > #identity-popup-connectedToLabel2 {
display: none;
}
#identity-popup-content-box > description {
font-size: 9pt !important;
#identity-popup-content-box > hbox > description,
#identity-popup-content-box > hbox > label {
font-size: 11pt !important;
white-space: pre-wrap;
-moz-padding-start: 15px;
margin: 2px 0 4px;
}
#identity-popup-content-box > label {
font-size: 9pt !important;
white-space: pre-wrap;
-moz-padding-start: 15px;
margin: 0;
}
#identity-popup-content-host {
margin-top: 3px;
margin-bottom: 5px;
font-weight: bold;
max-width: 240px;
}
#identity-popup-content-owner {
margin-top: 4px;
margin-bottom: 0 !important;
font-weight: bold;
max-width: 240px;
}
.verifiedDomain > #identity-popup-content-owner {
font-weight: normal;
}
#identity-popup-encryption-label,
#identity-popup-content-verifier {
margin: 4px 0 2px;
font-size: 8pt !important;
}
#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption ,
#identity-popup-content-box.verifiedDomain > #identity-popup-encryption {
margin-top: 10px;
margin-left: -24px;
#identity-popup-content-host,
#identity-popup-content-owner {
font-weight: bold;
}
#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
#identity-popup-encryption-icon {
list-style-image: url("chrome://browser/skin/images/unlock-40.png");
}
#identity-container[mode="verifiedIdentity"] > vbox > #identity-popup-encryption-icon ,
#identity-container[mode="verifiedDomain"] > vbox > #identity-popup-encryption-icon {
list-style-image: url("chrome://browser/skin/images/lock-40.png");
}
#identity-popup-more-info-button {
margin-top: 6px;
-moz-margin-end: 1px;
}
/* Popup Bounding Box */
#identity-popup {
-moz-appearance: none;
background-color: rgb(90,89,90);
border: 1px solid rgb(90,89,90);
-moz-border-radius: 0px 0px 8px 8px;
padding: 10px 8px 6px 8px;
margin-top: 3px;
-moz-margin-start: 11px;
color: #ffffff;
min-width: 280px;
}
/* Preferences window ---------------------------------------------------- */
/* XXX should be a richlistitem */
richpref {

View File

@ -140,13 +140,13 @@ toolbarbutton.urlbar-cap-button {
}
/* add special color and extra width */
#identity-box.verifiedIdentity {
#identity-box[mode="verifiedIdentity"] {
min-width: 50px;
background-color: #77c494;
}
/* add special color and extra width */
#identity-box.verifiedDomain {
#identity-box[mode="verifiedDomain"] {
min-width: 50px;
background-color: #6ca0c9;
}
@ -474,96 +474,64 @@ findbar {
}
/* Identity popup -------------------------------------------------------- */
#identity-container {
padding: 8px;
}
/* Popup Icons */
#identity-popup-icon {
height: 32px;
width: 32px;
#identity-icon {
height: 48px;
width: 48px;
padding: 0;
list-style-image: url("chrome://browser/skin/images/identity.png");
-moz-image-region: rect(0px, 64px, 64px, 0px);
}
#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
#identity-container[mode="verifiedDomain"] > #identity-icon {
-moz-image-region: rect(64px, 64px, 128px, 0px);
}
#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
#identity-container[mode="verifiedIdentity"] > #identity-icon {
-moz-image-region: rect(128px, 64px, 192px, 0px);
}
/* Popup Body Text */
#identity-popup-content-box.unknownIdentity > #identity-popup-connectedToLabel ,
#identity-popup-content-box.unknownIdentity > #identity-popup-runByLabel ,
#identity-popup-content-box.unknownIdentity > #identity-popup-content-host ,
#identity-popup-content-box.unknownIdentity > #identity-popup-content-owner ,
#identity-popup-content-box.verifiedIdentity > #identity-popup-connectedToLabel2 ,
#identity-popup-content-box.verifiedDomain > #identity-popup-connectedToLabel2 {
#identity-content-box {
-moz-padding-start: 8px;
}
#identity-content-box.unknownIdentity > hbox > #identity-connectedToLabel,
#identity-content-box.unknownIdentity > hbox > #identity-runByLabel,
#identity-content-box.unknownIdentity > hbox > #identity-content-host,
#identity-content-box.unknownIdentity > hbox > #identity-content-owner,
#identity-content-box.verifiedIdentity > hbox > #identity-connectedToLabel2,
#identity-content-box.verifiedDomain > hbox > #identity-connectedToLabel2 {
display: none;
}
#identity-popup-content-box > description {
font-size: 9pt !important;
#identity-content-box > hbox > description,
#identity-content-box > hbox > label {
font-size: 11pt !important;
white-space: pre-wrap;
-moz-padding-start: 15px;
margin: 2px 0 4px;
}
#identity-popup-content-box > label {
font-size: 9pt !important;
white-space: pre-wrap;
-moz-padding-start: 15px;
margin: 0;
#identity-encryption-label,
#identity-content-verifier {
font-size: 8pt !important;
}
#identity-popup-content-host {
margin-top: 3px;
margin-bottom: 5px;
#identity-content-host,
#identity-content-owner {
font-weight: bold;
max-width: 240px;
}
#identity-popup-content-owner {
margin-top: 4px;
margin-bottom: 0 !important;
font-weight: bold;
max-width: 240px;
#identity-encryption-icon {
list-style-image: url("chrome://browser/skin/images/downloads-24.png");
}
.verifiedDomain > #identity-popup-content-owner {
font-weight: normal;
}
#identity-popup-content-verifier {
margin: 4px 0 2px;
}
#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption ,
#identity-popup-content-box.verifiedDomain > #identity-popup-encryption {
margin-top: 10px;
margin-left: -24px;
}
#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
list-style-image: url("chrome://browser/skin/images/secure24.png");
}
#identity-popup-more-info-button {
margin-top: 6px;
-moz-margin-end: 1px;
}
/* Popup Bounding Box */
#identity-popup {
-moz-appearance: none;
background-color: rgb(90,89,90);
border: 1px solid rgb(90,89,90);
-moz-border-radius: 0px 0px 8px 8px;
padding: 10px 8px 6px 8px;
margin-top: 3px;
-moz-margin-start: 11px;
color: #ffffff;
min-width: 280px;
#identity-container.verifiedIdentity > vbox > #identity-encryption-icon ,
#identity-container.verifiedDomain > vbox > #identity-encryption-icon {
list-style-image: url("chrome://browser/skin/images/addons-24.png");
}
/* Preferences window ---------------------------------------------------- */