Issue 3258 - Blockable items: fix Size column

chrome/content/ui/sidebar.js

 /*
  * This file is part of Adblock Plus <https://adblockplus.org/>,
  * Copyright (C) 2006-2015 Eyeo GmbH
  *
  * Adblock Plus is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License version 3 as
  * published by the Free Software Foundation.
  *
  * Adblock Plus is distributed in the hope that it will be useful,
  * but WITHOUT ANY WARRANTY; without even the implied warranty of
@@ skipping 240 matching lines @@
   else
     item = treeView.getItemAt(e.clientX, e.clientY);
 
   if (!item)
   {
     e.preventDefault();
     return;
   }
 
   let filter = getFilter(item);
-  let size = ("tooltip" in item ? null : getItemSize(item));
   let subscriptions = (filter ? filter.subscriptions.filter(function(subscription) { return !subscription.disabled; }) : []);
 
   E("tooltipDummy").hidden = !("tooltip" in item);
   E("tooltipAddressRow").hidden = ("tooltip" in item);
   E("tooltipTypeRow").hidden = ("tooltip" in item);
-  E("tooltipSizeRow").hidden = !size;
   E("tooltipDocDomainRow").hidden = ("tooltip" in item || !item.docDomain);
   E("tooltipFilterRow").hidden = !filter;
   E("tooltipFilterSourceRow").hidden = !subscriptions.length;
 
   if ("tooltip" in item)
     E("tooltipDummy").setAttribute("value", item.tooltip);
   else
   {
     E("tooltipAddress").parentNode.hidden = (item.type == "ELEMHIDE");
     setMultilineContent(E("tooltipAddress"), item.location);
 
     var type = localizedTypes.get(item.type);
     if (filter && filter instanceof WhitelistFilter)
       type += " " + E("tooltipType").getAttribute("whitelisted");
     else if (filter && item.type != "ELEMHIDE")
       type += " " + E("tooltipType").getAttribute("filtered");
     E("tooltipType").setAttribute("value", type);
 
-    if (size)
-      E("tooltipSize").setAttribute("value", size.join(" x "));
-
     E("tooltipDocDomain").setAttribute("value", item.docDomain + " " + (item.thirdParty ? docDomainThirdParty : docDomainFirstParty));
   }
 
   if (filter)
   {
     let filterField = E("tooltipFilter");
     setMultilineContent(filterField, filter.text);
     if (filter.disabled)
     {
       let disabledText = document.createElement("description");
       disabledText.className = "disabledTextLabel";
       disabledText.textContent = filterField.getAttribute("disabledText");
       filterField.appendChild(disabledText);
     }
 
     if (subscriptions.length)
     {
       let sourceElement = E("tooltipFilterSource");
       while (sourceElement.firstChild)
         sourceElement.removeChild(sourceElement.firstChild);
       for (let i = 0; i < subscriptions.length; i++)
         setMultilineContent(sourceElement, subscriptions[i].title, true);
     }
   }
 
+  E("tooltipSizeRow").hidden = true;
+  if (!("tooltip" in item))
+  {
+    getItemSize(item, (size) =>
+    {
+      if (size)
+      {
+        E("tooltipSizeRow").hidden = false;
+        E("tooltipSize").setAttribute("value", size.join(" x "));
+      }
+    });
+  }
+
   var showPreview = Prefs.previewimages && !("tooltip" in item);
   showPreview = showPreview && item.type == "IMAGE";
   showPreview = showPreview && (!filter || filter.disabled || filter instanceof WhitelistFilter);
   E("tooltipPreviewBox").hidden = true;
   if (showPreview)
   {
     if (!cacheStorage)
     {
       let {Services} = Cu.import("resource://gre/modules/Services.jsm", null);
       // Cache v2 API is enabled by default starting with Gecko 32
@@ skipping 333 matching lines @@
   // Store variables locally, global variables will go away when we are closed
   let myPrefs = Prefs;
   let myMainWin = mainWin;
 
   // Close sidebar and open detached window
   myMainWin.document.getElementById("abp-command-sidebar").doCommand();
   myPrefs.detachsidebar = doDetach;
   myMainWin.document.getElementById("abp-command-sidebar").doCommand();
 }
 
-// Returns items size in the document if available
-function getItemSize(item)
+// Returns item's size if already known, otherwise undefined
+function getCachedItemSize(item)
 {
+  if ("size" in item)
+    return item.size;
+
   let filter = getFilter(item);
   if (filter && !filter.disabled && filter instanceof BlockingFilter)
     return null;
 
-  for (let node of item.nodes)
+  return undefined;
+}
+
+// Retrieves item's size in the document if available
+function getItemSize(item, callback)
+{
+  let size = getCachedItemSize(item);
+  if (typeof size != "undefined" || !requestNotifier)
   {
-    if (node instanceof HTMLImageElement && (node.naturalWidth || node.naturalHeight))
-      return [node.naturalWidth, node.naturalHeight];
-    else if (node instanceof HTMLElement && (node.offsetWidth || node.offsetHeight))
-      return [node.offsetWidth, node.offsetHeight];
+    callback(size);
+    return;
   }
-  return null;
+
+  requestNotifier.retrieveNodeSize(item.ids, function(size)
+  {
+    if (size)
+      item.size = size;
+    callback(size);
+  });
 }
 
 // Sort functions for the item list
 function sortByAddress(item1, item2) {
   if (item1.location < item2.location)
     return -1;
   else if (item1.location > item2.location)
     return 1;
   else
     return 0;
@@ skipping 29 matching lines @@
 
 function compareState(item1, item2)
 {
   let filter1 = getFilter(item1);
   let filter2 = getFilter(item2);
   let state1 = (!filter1 ? 0 : (filter1.disabled ? 1 : (filter1 instanceof WhitelistFilter ? 2 : 3)));
   let state2 = (!filter2 ? 0 : (filter2.disabled ? 1 : (filter2 instanceof WhitelistFilter ? 2 : 3)));
   return state1 - state2;
 }
 
-function compareSize(item1, item2) {
-  var size1 = getItemSize(item1);
+function compareSize(item1, item2)
+{
+  let size1 = getCachedItemSize(item1);
+  let size2 = getCachedItemSize(item2);
+
   size1 = size1 ? size1[0] * size1[1] : 0;
-
-  var size2 = getItemSize(item2);
   size2 = size2 ? size2[0] * size2[1] : 0;
   return size1 - size2;
 }
 
 function compareDocDomain(item1, item2)
 {
   if (item1.docDomain < item2.docDomain)
     return -1;
   else if (item1.docDomain > item2.docDomain)
     return 1;
@@ skipping 123 matching lines @@
       return "";
     if (this.data && this.data.length) {
       if (row >= this.data.length)
         return "";
       if (col == "type")
         return localizedTypes.get(this.data[row].type);
       else if (col == "filter")
         return (this.data[row].filter || "");
       else if (col == "size")
       {
-        let size = getItemSize(this.data[row]);
+        let size = getCachedItemSize(this.data[row]);
+        if (typeof size == "undefined")
+        {
+          getItemSize(this.data[row], (size) =>
+          {
+            if (size)
+              this.boxObject.invalidateRow(row)
+          });
+        }
         return (size ? size.join(" x ") : "");
       }
       else if (col == "docDomain")
         return this.data[row].docDomain + " " + (this.data[row].thirdParty ? docDomainThirdParty : docDomainFirstParty);
       else if (col == "filterSource")
       {
         let filter = getFilter(this.data[row])
         if (!filter)
           return "";
 
@@ skipping 388 matching lines @@
       return {tooltip: this.itemsDummyTooltip};
   },
 
   invalidateItem: function(item)
   {
     let row = this.data.indexOf(item);
     if (row >= 0)
       this.boxObject.invalidateRow(row);
   }
 }