[NTP4] Track the position of each app that's launched.

chrome/browser/resources/ntp4/apps_page.js

Index: chrome/browser/resources/ntp4/apps_page.js
diff --git a/chrome/browser/resources/ntp4/apps_page.js b/chrome/browser/resources/ntp4/apps_page.js
index 8cbf35c8935756adc73781988fb0f03800d87ce9..73e67ec9cdf7ad735a929ccc5a7da987668ff6e1 100644
--- a/chrome/browser/resources/ntp4/apps_page.js
+++ b/chrome/browser/resources/ntp4/apps_page.js
@@ -475,6 +475,7 @@ cr.define('ntp4', function() {
                                  'utm_source',
                                  'chrome-ntp-icon');
 
+      this.recordAppClickIndex_(e.clientX, e.clientY);
       chrome.send('launchApp',
                   [this.appId, APP_LAUNCH.NTP_APPS_MAXIMIZED, url,
                    e.button, e.altKey, e.ctrlKey, e.metaKey, e.shiftKey]);
@@ -490,6 +491,9 @@ cr.define('ntp4', function() {
      */
     onKeydown_: function(e) {
       if (e.keyIdentifier == 'Enter') {
+        var rect = this.getBoundingClientRect();
+        this.recordAppClickIndex_(rect.left + rect.width/2,

[Evan Stade, 2012/01/21 00:44:23]

spaces around operators

[Dan Beam, 2012/01/21 01:49:50]

Done.

+                                  rect.top + rect.height/2);
         chrome.send('launchApp',
                     [this.appId, APP_LAUNCH.NTP_APPS_MAXIMIZED, '',
                      0, e.altKey, e.ctrlKey, e.metaKey, e.shiftKey]);
@@ -499,6 +503,33 @@ cr.define('ntp4', function() {
     },
 
     /**
+     * Record app position "clicked" (or when a user presses 'Enter' on an app
+     * using keyboard nav).
+     * @param {number} x The client X at which the app was clicked.

[Evan Stade, 2012/01/21 00:44:23]

you don't specify what units x is in, but it looks like pixels. Why are you
tracking pixels?

[Dan Beam, 2012/01/21 01:49:24]

Done.
So we're able to track where people click more accurately than just which tile. 
The goal is to understand how position affects the NTP's CTR, so it didn't seem
to hurt (nor add much code complexity, as we'd still have to do these tricks
with app indices to get % x/y measurements).

+     * @param {number} y The client Y at which the app was clicked.
+     * @private
+     */
+    recordAppClickIndex_: function(x, y) {
+      var tilePage = this.tile.tilePage;
+      var gridRect = tilePage.tileGrid.getBoundingClientRect();
+
+      var maxWidth = gridRect.width;
+      if (tilePage.tileCount < tilePage.layoutValues.numRowTiles) {
+          var lastTile = tilePage.tiles[tilePage.tiles.length - 1];
+          maxWidth =
+              lastTile.firstChild.getBoundingClientRect().right - gridRect.left;
+      }
+
+      var lastApp = tilePage.tiles[tilePage.tiles.length - 1].firstChild;
+      var maxHeight = lastApp.getBoundingClientRect().bottom - gridRect.top;
+
+      chrome.send('metricsHandler:recordInHistogram',
+          ['NewTabPage.AppClick_X', (x - gridRect.left) / maxWidth * 100, 100]);
+      chrome.send('metricsHandler:recordInHistogram',
+          ['NewTabPage.AppClick_Y', (y - gridRect.top) / maxHeight * 100, 100]);
+    },
+
+    /**
      * Adds a node to the list of targets that will launch the app. This list
      * is also used in onMousedown to determine whether the app contents should
      * be shown as active (if we don't do this, then clicking anywhere in