Fixing column widths in tables.

chrome/browser/resources/shared/js/cr/ui/table.js

Index: chrome/browser/resources/shared/js/cr/ui/table.js
diff --git a/chrome/browser/resources/shared/js/cr/ui/table.js b/chrome/browser/resources/shared/js/cr/ui/table.js
index 43a012590fed2b64c3ea24b7ea287ac9e6b60603..6407b6c2cebe78dae50d1eb1f7e19009604c99a4 100644
--- a/chrome/browser/resources/shared/js/cr/ui/table.js
+++ b/chrome/browser/resources/shared/js/cr/ui/table.js
@@ -166,13 +166,12 @@ cr.define('cr.ui', function() {
       TableList.decorate(this.list_);
       this.list_.selectionModel = new ListSelectionModel(this);
       this.list_.table = this;
+      this.list_.addEventListener('scroll', this.handleScroll_.bind(this));
 
       TableHeader.decorate(this.header_);
       this.header_.table = this;
 
       this.classList.add('table');
-      this.ownerDocument.defaultView.addEventListener(

[arv (Not doing code reviews), 2012/11/30 19:05:52]

Why is this removed? If the table is using a size relative to the window size it
needs to be updated.

[SeRya, 2012/12/01 20:14:37]

A moved it to Task Manager. File manager has already have this logic. Why I
think it's a wrong place to handle window resize:
1. List only need to be resized if its size is relative to window size.
2. Not only window resizing could cause resiling list. In case of Task Manager
is is the only reason but in Fine Manager there are a lot of other reasons:
dragging vertical splitter, showing/hidding the bottom panel and so on.

So this code is not competent enough to make decision when list must be updated.
Handling it here partially blures responsibility.

-          'resize', this.header_.updateWidth.bind(this.header_));
 
       this.boundResize_ = this.resize.bind(this);
       this.boundHandleSorted_ = this.handleSorted_.bind(this);
@@ -253,6 +252,14 @@ cr.define('cr.ui', function() {
     },
 
     /**
+     * This handles list 'scroll' events. Scrolls the header accordingly.
+     * @param {Event} e Scroll event.
+     */
+    handleScroll_: function(e) {
+      this.header_.style.marginLeft = (-this.list_.scrollLeft) + 'px';
+    },
+
+    /**
      * Sort data by the given column.
      * @param {number} index The index of the column to sort by.
      */
@@ -313,10 +320,7 @@ cr.define('cr.ui', function() {
      */
     fitColumn: function(index) {
       var list = this.list_;
-      var listWidth = list.clientWidth;
       var listHeight = list.clientHeight;
-      if (listWidth == 0)
-        return;  // Ensure won't be division by 0.
 
       var cm = this.columnModel_;
       var dm = this.dataModel;
@@ -352,8 +356,12 @@ cr.define('cr.ui', function() {
         list.appendChild(container);
         var width = parseFloat(getComputedStyle(container).width);
         list.removeChild(container);
-        cm.setWidth(index, width * 100 / listWidth);
+        cm.setWidth(index, width);
       });
+    },
+
+    normalizeColumns: function() {
+      this.columnModel.normalizeWidths(this.clientWidth);
     }
   };