Adding usage and quota entry to chrome://settings/cookies.

chrome/browser/resources/options/cookies_list.js

Index: chrome/browser/resources/options/cookies_list.js
diff --git a/chrome/browser/resources/options/cookies_list.js b/chrome/browser/resources/options/cookies_list.js
index 37a93ff445c665ab526387aa2b846b067f68d715..0597467e9ccfdc4c8fefe80bd85d26986a2a3b2d 100644
--- a/chrome/browser/resources/options/cookies_list.js
+++ b/chrome/browser/resources/options/cookies_list.js
@@ -101,6 +101,8 @@ cr.define('options', function() {
       this.siteChild.className = 'cookie-site';
       this.dataChild = this.ownerDocument.createElement('div');
       this.dataChild.className = 'cookie-data';
+      this.sizeChild = this.ownerDocument.createElement('div');
+      this.sizeChild.className = 'cookie-size';
       this.itemsChild = this.ownerDocument.createElement('div');
       this.itemsChild.className = 'cookie-items';
       this.infoChild = this.ownerDocument.createElement('div');
@@ -113,6 +115,7 @@ cr.define('options', function() {
       var content = this.contentElement;
       content.appendChild(this.siteChild);
       content.appendChild(this.dataChild);
+      content.appendChild(this.sizeChild);
       content.appendChild(this.itemsChild);
       this.itemsChild.appendChild(this.infoChild);
       if (this.origin && this.origin.data) {
@@ -232,6 +235,10 @@ cr.define('options', function() {
         else
           text = list[i];
       this.dataChild.textContent = text;
+      if (info.quota && info.quota.totalUsage) {
+        this.sizeChild.textContent = info.quota.totalUsage;

[Mike Mammarella, 2011/07/26 21:46:31]

It looks odd to only have the size column filled in when there is a size, since
apparently cookies don't have a size. So most of the rows don't have anything
here. Could we get a string for that, something like "N/A" or "negligible" so it
doesn't look broken?

[tzik, 2011/07/27 03:51:47]

Done.

+      }
+
       if (this.expanded)
         this.updateItems_();
     },
@@ -424,6 +431,13 @@ cr.define('options', function() {
           info.indexedDb = true;
         else if (this.data.type == 'file_system')
           info.fileSystem = true;
+        else if (this.data.type == 'quota')
+          info.quota = {

[Mike Mammarella, 2011/07/26 21:46:31]

For a multiline statement like this, you'd need to add {} to this else, and
therefore also to all the other cases as well. Why not just info.quota =
this.data; though?

[tzik, 2011/07/27 03:51:47]

Done.

+            totalUsage: this.data.totalUsage,
+            temporaryUsage: this.data.temporaryUsage,
+            persistentUsage: this.data.persistentUsage,
+            persistentQuota: this.data.persistentQuota,
+          };
       }
     },
 
@@ -456,6 +470,8 @@ cr.define('options', function() {
             text = localStrings.getString('cookie_file_system');
             break;
         }
+        if (!text)

[Mike Mammarella, 2011/07/26 21:46:31]

What is this for?

[tzik, 2011/07/27 03:51:47]

I want not to allocate bubble for quota since quota is not a storage, so I
didn't allocate label for quota and skip unlabeled bubble in this line.

+          return;
         var div = item.ownerDocument.createElement('div');
         div.className = 'cookie-item';
         // Help out screen readers and such: this is a clickable thing.