| OLD | NEW |
| 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 cr.define('cr.ui', function() { | 5 cr.define('cr.ui', function() { |
| 6 | 6 |
| 7 /** | 7 /** |
| 8 * Creates a new list item element. | 8 * Creates a new list item element. |
| 9 * @constructor | 9 * @constructor |
| 10 * @extends {HTMLLIElement} | 10 * @extends {HTMLLIElement} |
| 11 */ | 11 */ |
| 12 var ListItem = cr.ui.define('li'); | 12 var ListItem = cr.ui.define('li'); |
| 13 | 13 |
| 14 /** | 14 /** |
| 15 * The next id suffix to use when giving each item an unique id. | 15 * The next id suffix to use when giving each item an unique id. |
| 16 * @type {number} | 16 * @type {number} |
| 17 * @private | 17 * @private |
| 18 */ | 18 */ |
| 19 ListItem.nextUniqueIdSuffix_ = 0; | 19 ListItem.nextUniqueIdSuffix_ = 0; |
| 20 | 20 |
| 21 ListItem.prototype = { | 21 ListItem.prototype = { |
| 22 __proto__: HTMLLIElement.prototype, | 22 __proto__: HTMLLIElement.prototype, |
| 23 | 23 |
| 24 /** | 24 /** |
| 25 * Plain text label. | 25 * Plain text label. |
| 26 * @type {string} | 26 * @type {string} |
| 27 */ | 27 */ |
| 28 get label() { return this.textContent; }, | 28 get label() { |
| 29 set label(label) { this.textContent = label; }, | 29 return this.textContent; |
| 30 }, |
| 31 set label(label) { |
| 32 this.textContent = label; |
| 33 }, |
| 30 | 34 |
| 31 /** | 35 /** |
| 32 * This item's index in the containing list. | 36 * This item's index in the containing list. |
| 33 * @type {number} | 37 * @type {number} |
| 34 */ | 38 */ |
| 35 listIndex_: -1, | 39 listIndex_: -1, |
| 36 | 40 |
| 37 /** | 41 /** |
| 38 * Called when an element is decorated as a list item. | 42 * Called when an element is decorated as a list item. |
| 39 */ | 43 */ |
| 40 decorate: function() { | 44 decorate: function() { |
| 41 this.setAttribute('role', 'listitem'); | 45 this.setAttribute('role', 'listitem'); |
| 42 if (!this.id) | 46 if (!this.id) |
| 43 this.id = 'listitem-' + ListItem.nextUniqueIdSuffix_++; | 47 this.id = 'listitem-' + ListItem.nextUniqueIdSuffix_++; |
| 44 }, | 48 }, |
| 45 | 49 |
| 46 /** | 50 /** |
| 47 * Called when the selection state of this element changes. | 51 * Called when the selection state of this element changes. |
| 48 */ | 52 */ |
| 49 selectionChanged: function() {}, | 53 selectionChanged: function() {}, |
| 50 }; | 54 }; |
| 51 | 55 |
| 52 /** | 56 /** |
| 53 * Whether the item is selected. Setting this does not update the underlying | 57 * Whether the item is selected. Setting this does not update the underlying |
| 54 * selection model. This is only used for display purpose. | 58 * selection model. This is only used for display purpose. |
| 55 */ | 59 */ |
| 56 cr.defineProperty( | 60 cr.defineProperty( |
| 57 ListItem, 'selected', cr.PropertyKind.BOOL_ATTR, | 61 ListItem, 'selected', cr.PropertyKind.BOOL_ATTR, function() { |
| 58 function() { this.selectionChanged(); }); | 62 this.selectionChanged(); |
| 63 }); |
| 59 | 64 |
| 60 /** | 65 /** |
| 61 * Whether the item is the lead in a selection. Setting this does not update | 66 * Whether the item is the lead in a selection. Setting this does not update |
| 62 * the underlying selection model. This is only used for display purpose. | 67 * the underlying selection model. This is only used for display purpose. |
| 63 */ | 68 */ |
| 64 cr.defineProperty(ListItem, 'lead', cr.PropertyKind.BOOL_ATTR); | 69 cr.defineProperty(ListItem, 'lead', cr.PropertyKind.BOOL_ATTR); |
| 65 | 70 |
| 66 /** | 71 /** |
| 67 * This item's index in the containing list. | 72 * This item's index in the containing list. |
| 68 * type {number} | 73 * type {number} |
| 69 */ | 74 */ |
| 70 cr.defineProperty(ListItem, 'listIndex'); | 75 cr.defineProperty(ListItem, 'listIndex'); |
| 71 | 76 |
| 72 return {ListItem: ListItem}; | 77 return {ListItem: ListItem}; |
| 73 }); | 78 }); |
| OLD | NEW |