[Author Prev][Author Next][Thread Prev][Thread Next][Author Index][Thread Index]

[tor-commits] [torbutton/master] Bug 24309: Fix identity popup dimensions



commit 8057989d2d37edcce8cc3bf04e6a145d19440be6
Author: Arthur Edelstein <arthuredelstein@xxxxxxxxx>
Date:   Tue May 22 10:04:37 2018 -0700

    Bug 24309: Fix identity popup dimensions
    
    On some OSes relay lines are wrapping and the doorhanger is sometimes
    rendering too small to show everything inside. We avoid the line
    wrapping and resize the identity popup where needed.
---
 src/chrome/content/tor-circuit-display.js | 43 +++++++++++++++++++++++++++++++
 src/chrome/skin/tor-circuit-display.css   |  1 +
 2 files changed, 44 insertions(+)

diff --git a/src/chrome/content/tor-circuit-display.js b/src/chrome/content/tor-circuit-display.js
index cbea569..5bd02bc 100644
--- a/src/chrome/content/tor-circuit-display.js
+++ b/src/chrome/content/tor-circuit-display.js
@@ -392,6 +392,44 @@ let setupGuardNote = function () {
                learnMoreString]]);
 };
 
+// __ensureCorrectPopupDimensions()__.
+// Make sure the identity popup always displays with the correct height.
+let ensureCorrectPopupDimensions = function () {
+  let setDimensions = () => {
+    setTimeout(() => {
+      let view = document.querySelector("#identity-popup-multiView .panel-viewcontainer");
+      let stack = document.querySelector("#identity-popup-multiView .panel-viewstack");
+      let view2 = document.getElementById("identity-popup-mainView");
+      if (view && stack && view2) {
+        let newWidth = Math.max(...[...view2.children].map(el => el.clientWidth)) + 10;
+        let newHeight = stack.clientHeight;
+        stack.setAttribute("width", newWidth);
+        view2.style.minWidth = view2.style.maxWidth = newWidth + "px";
+        view.setAttribute("width", newWidth);
+        view.setAttribute("height", newHeight);
+      }
+    }, 0);
+  };
+  let removeDimensions = () => {
+    let view = document.querySelector("#identity-popup-multiView .panel-viewcontainer");
+    let stack = document.querySelector("#identity-popup-multiView .panel-viewstack");
+    let view2 = document.getElementById("identity-popup-mainView");
+    if (view && stack && view2) {
+      view.removeAttribute("width");
+      view.removeAttribute("height");
+      stack.removeAttribute("width");
+      view2.style.minWidth = view2.style.maxWidth = "";
+    }
+  };
+  let popupMenu = document.getElementById("identity-popup");
+  popupMenu.addEventListener("popupshowing", setDimensions);
+  popupMenu.addEventListener("popuphiding", removeDimensions);
+  return () => {
+    popupMenu.removeEventListener("popupshowing", setDimensions);
+    popupMenu.removeEventListener("popuphiding", removeDimensions);
+  };
+};
+
 // ## Main function
 
 // __setupDisplay(ipcFile, host, port, password, enablePrefName)__.
@@ -403,6 +441,7 @@ let setupDisplay = function (ipcFile, host, port, password, enablePrefName) {
   let myController = null,
       stopCollectingIsolationData = null,
       stopCollectingBrowserCredentials = null,
+      stopEnsuringCorrectPopupDimensions = null,
       stop = function() {
         syncDisplayWithSelectedTab(false);
         if (myController) {
@@ -412,6 +451,9 @@ let setupDisplay = function (ipcFile, host, port, password, enablePrefName) {
           if (stopCollectingBrowserCredentials) {
             stopCollectingBrowserCredentials();
           }
+          if (stopEnsuringCorrectPopupDimensions) {
+            stopEnsuringCorrectPopupDimensions();
+          }
           myController = null;
         }
       },
@@ -428,6 +470,7 @@ let setupDisplay = function (ipcFile, host, port, password, enablePrefName) {
           syncDisplayWithSelectedTab(true);
           stopCollectingIsolationData = collectIsolationData(myController, updateCircuitDisplay);
           stopCollectingBrowserCredentials = collectBrowserCredentials();
+          stopEnsuringCorrectPopupDimensions = ensureCorrectPopupDimensions();
        }
      };
   try {
diff --git a/src/chrome/skin/tor-circuit-display.css b/src/chrome/skin/tor-circuit-display.css
index 71c283c..640d595 100644
--- a/src/chrome/skin/tor-circuit-display.css
+++ b/src/chrome/skin/tor-circuit-display.css
@@ -62,6 +62,7 @@ ul#circuit-display-nodes li {
   background-repeat: no-repeat;
   list-style: none;
   padding-inline-start: 1.5em;
+  white-space: nowrap;
 }
 
 ul#circuit-display-nodes li:-moz-locale-dir(rtl) {

_______________________________________________
tor-commits mailing list
tor-commits@xxxxxxxxxxxxxxxxxxxx
https://lists.torproject.org/cgi-bin/mailman/listinfo/tor-commits