Update browserAction.setIcon and pageAction.setIcon for hidpi

chrome/renderer/resources/extensions/set_icon.js

Index: chrome/renderer/resources/extensions/set_icon.js
diff --git a/chrome/renderer/resources/extensions/set_icon.js b/chrome/renderer/resources/extensions/set_icon.js
index f9f2371fe83befca510a118e9c564b343203a2a5..071fecb140995b1649cb2941050df231a152a036 100644
--- a/chrome/renderer/resources/extensions/set_icon.js
+++ b/chrome/renderer/resources/extensions/set_icon.js
@@ -5,57 +5,101 @@
 var SetIconCommon = requireNative('setIcon').SetIconCommon;
 var sendRequest = require('sendRequest').sendRequest;
 
+function loadImagePath(path, iconSize, actionType, callback) {
+  var img = new Image();
+  img.onerror = function() {
+    console.error("Could not load " + actionType + " icon '" +

[Jeffrey Yasskin, 2012/08/17 23:20:28]

I see "prefer single quotes" in the JS style guide:
http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml?showone...

[tbarzic, 2012/08/21 00:22:07]

yeah, I was a bit too lazy to change those..

+                  path + "'.");
+  };
+  img.onload = function() {
+    var canvas = document.createElement("canvas");
+    canvas.width = img.width > iconSize ? iconSize : img.width;
+    canvas.height = img.height > iconSize ? iconSize : img.height;
+
+    var canvas_context = canvas.getContext('2d');
+    canvas_context.clearRect(0, 0, canvas.width, canvas.height);
+    canvas_context.drawImage(img, 0, 0, canvas.width, canvas.height);
+    var imageData = canvas_context.getImageData(0, 0, canvas.width,

[Jeffrey Yasskin, 2012/08/17 23:20:28]

Should this be getImageData or getImageDataHD? Are there any cases where drawing
an image onto a canvas of the same logical size will cause scaling in both
directions, which could cause display artifacts?

+                                                canvas.height);
+    callback(imageData);
+  };
+  img.src = path;
+}
+
+function verifyImageData(imageData, iconSize) {
+  // Verify that this at least looks like an ImageData element.
+  // Unfortunately, we cannot use instanceof because the ImageData
+  // constructor is not public.
+  //
+  // We do this manually instead of using JSONSchema to avoid having these
+  // properties show up in the doc.
+  if (!("width" in imageData) ||
+      !("height" in imageData) ||
+      !("data" in imageData)) {
+    throw new Error(
+        "The imageData property must contain an ImageData object.");
+  }
+
+  if (imageData.width > iconSize ||
+      imageData.height > iconSize) {
+    throw new Error(
+        "The imageData property must contain an ImageData object that " +
+        "is no larger than " + iconSize + " pixels square.");
+  }
+}
+
 function setIcon(details, callback, name, parameters, actionType) {
-  var iconSize = 19;
+  var iconSizes = [19, 38];
   if ("iconIndex" in details) {
     sendRequest(name, [details, callback], parameters);
-  } else if ("imageData" in details) {
-    // Verify that this at least looks like an ImageData element.
-    // Unfortunately, we cannot use instanceof because the ImageData
-    // constructor is not public.
-    //
-    // We do this manually instead of using JSONSchema to avoid having these
-    // properties show up in the doc.
-    if (!("width" in details.imageData) ||
-        !("height" in details.imageData) ||
-        !("data" in details.imageData)) {
-      throw new Error(
-          "The imageData property must contain an ImageData object.");
-    }
-
-    if (details.imageData.width > iconSize ||
-        details.imageData.height > iconSize) {
-      throw new Error(
-          "The imageData property must contain an ImageData object that " +
-          "is no larger than " + iconSize + " pixels square.");
+  } else if ("imageDataSet" in details) {
+    for (var i = 0; i < iconSizes.length; i++) {
+      var sizeKey = iconSizes[i].toString();
+      verifyImageData(details.imageDataSet[sizeKey], iconSizes[i]);
     }
 
     sendRequest(name, [details, callback], parameters,
                 {noStringify: true, nativeFunction: SetIconCommon});
+  } else if ("imageData" in details) {

[Jeffrey Yasskin, 2012/08/17 23:20:28]

Does it make sense to detect the type of the 'imageData' argument, and do the
right thing depending on whether it's an ImageData or a dictionary of
size->ImageData?

[tbarzic, 2012/08/21 00:22:07]

yeah, it would.. I just had to remember how to declare this in api json
definition :)

+    var sizeKey = iconSizes[0].toString();
+    details.imageDataSet = {};
+    verifyImageData(details.imageData, iconSizes[0]);
+    details.imageDataSet[sizeKey] = details.imageData;
+    delete details.imageData;
+    sendRequest(name, [details, callback], parameters,
+                {noStringify: true, nativeFunction: SetIconCommon});
+  } else if ("pathSet" in details) {
+    details.imageDataSet = {};
+
+    function processIconSize(index) {
+      if (index == iconSizes.length) {
+        delete details.pathSet;
+        sendRequest(name, [details, callback], parameters,
+                    {noStringify: true, nativeFunction: SetIconCommon});
+        return;
+      }
+      var sizeKey = iconSizes[index].toString();
+      loadImagePath(details.pathSet[sizeKey], iconSizes[index], actionType,
+        function(imageData) {
+          details.imageDataSet[sizeKey] = imageData;
+          processIconSize(index + 1);
+        });
+    }
+
+    processIconSize(0);
   } else if ("path" in details) {
-    var img = new Image();
-    img.onerror = function() {
-      console.error("Could not load " + actionType + " icon '" +
-                    details.path + "'.");
-    };
-    img.onload = function() {
-      var canvas = document.createElement("canvas");
-      canvas.width = img.width > iconSize ? iconSize : img.width;
-      canvas.height = img.height > iconSize ? iconSize : img.height;
-
-      var canvas_context = canvas.getContext('2d');
-      canvas_context.clearRect(0, 0, canvas.width, canvas.height);
-      canvas_context.drawImage(img, 0, 0, canvas.width, canvas.height);
+    var sizeKey = iconSizes[0].toString();
+    details.imageDataSet = {};
+    loadImagePath(details.path, iconSizes[0], actionType, function(imageData) {
+      details.imageDataSet[sizeKey] = imageData;
       delete details.path;
-      details.imageData = canvas_context.getImageData(0, 0, canvas.width,
-                                                      canvas.height);
       sendRequest(name, [details, callback], parameters,
                   {noStringify: true, nativeFunction: SetIconCommon});
-    };
-    img.src = details.path;
+    });
   } else {
     throw new Error(
-        "Either the path or imageData property must be specified.");
+        "Either the path, imageData, pathSet or imageDataSet property must be" +
+        "specified.");
   }
 }