Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(40)

Side by Side Diff: chrome/browser/resources/shared/js/cr/ui/table/table_splitter.js

Issue 11280253: Fixing column widths in tables. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Code review fixes. Created 8 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 /** 5 /**
6 * @fileoverview This implements a splitter element which can be used to resize 6 * @fileoverview This implements a splitter element which can be used to resize
7 * table columns. 7 * table columns.
8 * 8 *
9 * Each splitter is associated with certain column and resizes it when dragged. 9 * Each splitter is associated with certain column and resizes it when dragged.
10 * It is column model responsibility to resize other columns accordingly. 10 * It is column model responsibility to resize other columns accordingly.
(...skipping 37 matching lines...) Expand 10 before | Expand all | Expand 10 after
48 48
49 this.columnWidth_ = cm.getWidth(this.columnIndex); 49 this.columnWidth_ = cm.getWidth(this.columnIndex);
50 this.nextColumnWidth_ = cm.getWidth(this.columnIndex + 1); 50 this.nextColumnWidth_ = cm.getWidth(this.columnIndex + 1);
51 }, 51 },
52 52
53 /** 53 /**
54 * Handles spliter moves. Sets new width of the column. 54 * Handles spliter moves. Sets new width of the column.
55 * @param {Event} e Splitter event. 55 * @param {Event} e Splitter event.
56 */ 56 */
57 handleSplitterDragMove: function(deltaX) { 57 handleSplitterDragMove: function(deltaX) {
58 var cm = this.table_.columnModel; 58 this.table_.columnModel.setWidth(this.columnIndex,
59 59 this.columnWidth_ + deltaX);
60 var clientWidth = this.table_.querySelector('list').clientWidth;
61 var percentChange = deltaX * 100 / clientWidth;
62 var newColumnWidth = this.columnWidth_ + percentChange;
63
64 cm.setWidth(this.columnIndex, newColumnWidth);
65 }, 60 },
66 61
67 /** 62 /**
68 * Handles end of the splitter dragging. Restores cursor. 63 * Handles end of the splitter dragging. Restores cursor.
69 * @param {Event} e Splitter event. 64 * @param {Event} e Splitter event.
70 */ 65 */
71 handleSplitterDragEnd: function() { 66 handleSplitterDragEnd: function() {
72 this.ownerDocument.documentElement.classList.remove('col-resize'); 67 this.ownerDocument.documentElement.classList.remove('col-resize');
73 }, 68 },
74 }; 69 };
75 70
76 /** 71 /**
77 * The column index. 72 * The column index.
78 * @type {number} 73 * @type {number}
79 */ 74 */
80 cr.defineProperty(TableSplitter, 'columnIndex'); 75 cr.defineProperty(TableSplitter, 'columnIndex');
81 76
82 /** 77 /**
83 * The table associated with the splitter. 78 * The table associated with the splitter.
84 * @type {cr.ui.Table} 79 * @type {cr.ui.Table}
85 */ 80 */
86 cr.defineProperty(TableSplitter, 'table'); 81 cr.defineProperty(TableSplitter, 'table');
87 82
88 return { 83 return {
89 TableSplitter: TableSplitter 84 TableSplitter: TableSplitter
90 }; 85 };
91 }); 86 });
OLDNEW
« no previous file with comments | « chrome/browser/resources/shared/js/cr/ui/table/table_list.js ('k') | chrome/browser/resources/task_manager/main.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698