1// Copyright (c) 2011 The Chromium Authors. All rights reserved. 2// Use of this source code is governed by a BSD-style license that can be 3// found in the LICENSE file. 4 5/** 6 * @fileoverview This extends cr.ui.List for use in the table. 7 */ 8 9cr.define('cr.ui.table', function() { 10 const List = cr.ui.List; 11 const TableRow = cr.ui.table.TableRow; 12 const ListItem = cr.ui.ListItem; 13 14 /** 15 * Creates a new table list element. 16 * @param {Object=} opt_propertyBag Optional properties. 17 * @constructor 18 * @extends {cr.ui.List} 19 */ 20 var TableList = cr.ui.define('list'); 21 22 TableList.prototype = { 23 __proto__: List.prototype, 24 25 table_: null, 26 27 /** 28 * Initializes the element. 29 */ 30 decorate: function() { 31 List.prototype.decorate.apply(this); 32 this.className = 'list'; 33 }, 34 35 /** 36 * Resizes columns. 37 */ 38 resize: function() { 39 var cm = this.table_.columnModel; 40 41 var cells = this.querySelectorAll('.table-row-cell'); 42 if (cells.length % cm.size != 0) { 43 this.redraw(); 44 return; 45 } 46 var rowsCount = cells.length / cm.size; 47 48 for (var row = 0; row < rowsCount; row++) { 49 for (var i = 0; i < cm.size; i++) { 50 cells[row * cm.size + i].style.width = cm.getWidth(i) + '%'; 51 } 52 } 53 }, 54 55 /** 56 * Redraws the viewport. 57 */ 58 redraw: function() { 59 if (!this.table_.columnModel) 60 return; 61 List.prototype.redraw.call(this); 62 }, 63 64 /** 65 * Creates a new list item. 66 * @param {*} dataItem The value to use for the item. 67 * @return {!ListItem} The newly created list item. 68 */ 69 createItem: function(dataItem) { 70 var cm = this.table_.columnModel; 71 var listItem = new ListItem({label: ''}); 72 73 listItem.className = 'table-row'; 74 75 for (var i = 0; i < cm.size; i++) { 76 var cell = this.ownerDocument.createElement('div'); 77 cell.style.width = cm.getWidth(i) + '%'; 78 cell.className = 'table-row-cell'; 79 cell.appendChild( 80 cm.getRenderFunction(i).call(null, dataItem, cm.getId(i), this)); 81 82 listItem.appendChild(cell); 83 } 84 85 return listItem; 86 }, 87 }; 88 89 /** 90 * The table associated with the list. 91 * @type {cr.ui.Table} 92 */ 93 cr.defineProperty(TableList, 'table'); 94 95 return { 96 TableList: TableList 97 }; 98}); 99