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

chrome/browser/resources/options/cookies_list.js

 // Copyright (c) 2011 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 cr.define('options', function() {
   const DeletableItemList = options.DeletableItemList;
   const DeletableItem = options.DeletableItem;
   const ArrayDataModel = cr.ui.ArrayDataModel;
   const ListSingleSelectionModel = cr.ui.ListSingleSelectionModel;
 
@@ skipping 83 matching lines @@
 
   CookieListItem.prototype = {
     __proto__: DeletableItem.prototype,
 
     /** @inheritDoc */
     decorate: function() {
       this.siteChild = this.ownerDocument.createElement('div');
       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');
       this.infoChild.className = 'cookie-details';
       this.infoChild.hidden = true;
       var remove = this.ownerDocument.createElement('button');
       remove.textContent = localStrings.getString('remove_cookie');
       remove.onclick = this.removeCookie_.bind(this);
       this.infoChild.appendChild(remove);
       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) {
         this.siteChild.textContent = this.origin.data.title;
         this.siteChild.setAttribute('title', this.origin.data.title);
       }
       this.itemList_ = [];
     },
 
     /** @type {boolean} */
@@ skipping 99 matching lines @@
         list.push(localStrings.getString('cookie_app_cache'));
       if (info.fileSystem)
         list.push(localStrings.getString('cookie_file_system'));
       var text = '';
       for (var i = 0; i < list.length; ++i)
         if (text.length > 0)
           text += ', ' + list[i];
         else
           text = list[i];
       this.dataChild.textContent = text;
+      if (info.quota && info.quota.totalUsage) {
+        this.sizeChild.textContent = info.quota.totalUsage;
+      } else {
+        this.sizeChild.textContent =
+            localStrings.getString('usage_unavailable');

[Mike Mammarella, 2011/07/29 17:59:26]

Without the header it might be better to leave this off, actually. But thanks
for adding it so we could see how it looks!

[tzik, 2011/08/01 02:46:26]

Done.

+      }
+
       if (this.expanded)
         this.updateItems_();
     },
 
     /**
      * Updates the items section to reflect changes, animating to the new state.
      * Removes existing contents and calls @{code CookieTreeNode.createItems}.
      * @private
      */
     updateItems_: function() {
@@ skipping 160 matching lines @@
     /**
      * Summarize the information in this node and update @{code info}.
      * This will recurse into child nodes to summarize all descendants.
      * @param {Object} info The info object from @{code updateOrigin}.
      */
     collectSummaryInfo: function(info) {
       if (this.children.length > 0) {
         for (var i = 0; i < this.children.length; ++i)
           this.children[i].collectSummaryInfo(info);
       } else if (this.data && !this.data.hasChildren) {
-        if (this.data.type == 'cookie')
+        if (this.data.type == 'cookie') {
           info.cookies++;
-        else if (this.data.type == 'database')
+        } else if (this.data.type == 'database') {
           info.database = true;
-        else if (this.data.type == 'local_storage')
+        } else if (this.data.type == 'local_storage') {
           info.localStorage = true;
-        else if (this.data.type == 'app_cache')
+        } else if (this.data.type == 'app_cache') {
           info.appCache = true;
-        else if (this.data.type == 'indexed_db')
+        } else if (this.data.type == 'indexed_db') {
           info.indexedDb = true;
-        else if (this.data.type == 'file_system')
+        } else if (this.data.type == 'file_system') {
           info.fileSystem = true;
+        } else if (this.data.type == 'quota') {
+          info.quota = {
+            totalUsage: this.data.totalUsage,
+            temporaryUsage: this.data.temporaryUsage,
+            persistentUsage: this.data.persistentUsage,
+            persistentQuota: this.data.persistentQuota,
+          };
+        }
       }
     },
 
     /**
      * Create the cookie "bubbles" for this node, recursing into children
      * if there are any. Append the cookie bubbles to @{code item}.
      * @param {CookieListItem} item The cookie list item to create items in.
      */
     createItems: function(item) {
       if (this.children.length > 0) {
@@ skipping 12 matching lines @@
           case 'app_cache':
             text = localStrings.getString('cookie_app_cache');
             break;
           case 'indexed_db':
             text = localStrings.getString('cookie_indexed_db');
             break;
           case 'file_system':
             text = localStrings.getString('cookie_file_system');
             break;
         }
+        if (!text)
+          return;
         var div = item.ownerDocument.createElement('div');
         div.className = 'cookie-item';
         // Help out screen readers and such: this is a clickable thing.
         div.setAttribute('role', 'button');
         div.textContent = text;
         var index = item.appendItem(this, div);
         div.onclick = function() {
           if (item.selectedIndex == index)
             item.selectedIndex = -1;
           else
@@ skipping 352 matching lines @@
       parent.clear();
       this.addByParent_(parent, 0, children);
       parent.endBatchUpdates();
     },
   };
 
   return {
     CookiesList: CookiesList
   };
 });