From 6f8cac8c8e9bc76e8dd229a11859643fb05d606a Mon Sep 17 00:00:00 2001
From: Chris <chris@chrismatic.io>
Date: Wed, 25 Mar 2015 21:26:49 -0500
Subject: [PATCH] dfPanel JS

---
 src/js/popup.js | 34 +++++++++++++++++++++++++---------
 1 file changed, 25 insertions(+), 9 deletions(-)

diff --git a/src/js/popup.js b/src/js/popup.js
index 5dc7aa042..e3929b882 100644
--- a/src/js/popup.js
+++ b/src/js/popup.js
@@ -47,9 +47,15 @@ document.querySelector('#panes > div:nth-of-type(2)').style.setProperty(
 
 // The padlock must be manually positioned:
 // - It's vertical position depends on the height on the title bar.
+var gotoPrefsBottom = document.getElementById('gotoPrefs').getBoundingClientRect().bottom;
 document.getElementById('saveRules').style.setProperty(
     'top',
-    (document.getElementById('gotoPrefs').getBoundingClientRect().bottom + 4) + 'px'
+    (gotoPrefsBottom + 4) + 'px'
+);
+// The scope icons as well.
+document.getElementById('scopeIcons').style.setProperty(
+    'top',
+    (gotoPrefsBottom) + 'px'
 );
 
 // https://github.com/gorhill/uBlock/issues/996
@@ -306,7 +312,7 @@ var buildAllFirewallRows = function() {
 
     // Remove and reuse all rows: the order may have changed, we can't just
     // reuse them in-place.
-    rowsToRecycle = uDom('#firewallContainer > div:nth-of-type(7) ~ div').detach();
+    rowsToRecycle = uDom('#firewallContainer > div:nth-of-type(8) ~ div').detach();
 
     var n = allHostnameRows.length;
     for ( var i = 0; i < n; i++ ) {
@@ -320,13 +326,7 @@ var buildAllFirewallRows = function() {
             .on('mouseleave', '[data-src]', mouseleaveCellHandler);
         dfPaneBuilt = true;
     }
-
-    // The padlock must be manually positioned:
-    // - Its horizontal position depends on whether there is a vertical
-    //   scrollbar.
-    var rect = document.getElementById('firewallContainer').getBoundingClientRect();
-    document.getElementById('saveRules').style.setProperty('left', (rect.left + 4) + 'px');
-
+    setTimeout(positionDfPaneFloaters, 50);
     updateAllFirewallCells();
 };
 
@@ -382,6 +382,22 @@ var renderPrivacyExposure = function() {
 
 /******************************************************************************/
 
+var positionDfPaneFloaters = function() {
+    // The padlock must be manually positioned:
+    // - Its horizontal position depends on whether there is a vertical
+    //   scrollbar.
+    var firewallContainer = document.getElementById('firewallContainer'),
+        scopeIcons = document.getElementById('scopeIcons'),
+        rect = firewallContainer.getBoundingClientRect(),
+        rectLeft = rect.left,
+        rectWidth = rect.width;
+    document.getElementById('saveRules').style.setProperty('left', (rectLeft + 4) + 'px');
+    // So must be the scope icons.
+    // - They need to match up with the table
+    scopeIcons.style.setProperty('left', rectLeft + 'px');
+    scopeIcons.style.setProperty('width', rectWidth + 'px');
+};
+
 // Assume everything has to be done incrementally.
 
 var renderPopup = function() {