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() { | 28 get label() { return this.textContent; }, |
29 return this.textContent; | 29 set label(label) { this.textContent = label; }, |
30 }, | |
31 set label(label) { | |
32 this.textContent = label; | |
33 }, | |
34 | 30 |
35 /** | 31 /** |
36 * This item's index in the containing list. | 32 * This item's index in the containing list. |
37 * @type {number} | 33 * @type {number} |
38 */ | 34 */ |
39 listIndex_: -1, | 35 listIndex_: -1, |
40 | 36 |
41 /** | 37 /** |
42 * Called when an element is decorated as a list item. | 38 * Called when an element is decorated as a list item. |
43 */ | 39 */ |
44 decorate: function() { | 40 decorate: function() { |
45 this.setAttribute('role', 'listitem'); | 41 this.setAttribute('role', 'listitem'); |
46 if (!this.id) | 42 if (!this.id) |
47 this.id = 'listitem-' + ListItem.nextUniqueIdSuffix_++; | 43 this.id = 'listitem-' + ListItem.nextUniqueIdSuffix_++; |
48 }, | 44 }, |
49 | 45 |
50 /** | 46 /** |
51 * Called when the selection state of this element changes. | 47 * Called when the selection state of this element changes. |
52 */ | 48 */ |
53 selectionChanged: function() { | 49 selectionChanged: function() {}, |
54 }, | |
55 }; | 50 }; |
56 | 51 |
57 /** | 52 /** |
58 * Whether the item is selected. Setting this does not update the underlying | 53 * Whether the item is selected. Setting this does not update the underlying |
59 * selection model. This is only used for display purpose. | 54 * selection model. This is only used for display purpose. |
60 */ | 55 */ |
61 cr.defineProperty(ListItem, 'selected', cr.PropertyKind.BOOL_ATTR, | 56 cr.defineProperty( |
62 function() { | 57 ListItem, 'selected', cr.PropertyKind.BOOL_ATTR, |
63 this.selectionChanged(); | 58 function() { this.selectionChanged(); }); |
64 }); | |
65 | 59 |
66 /** | 60 /** |
67 * Whether the item is the lead in a selection. Setting this does not update | 61 * Whether the item is the lead in a selection. Setting this does not update |
68 * the underlying selection model. This is only used for display purpose. | 62 * the underlying selection model. This is only used for display purpose. |
69 */ | 63 */ |
70 cr.defineProperty(ListItem, 'lead', cr.PropertyKind.BOOL_ATTR); | 64 cr.defineProperty(ListItem, 'lead', cr.PropertyKind.BOOL_ATTR); |
71 | 65 |
72 /** | 66 /** |
73 * This item's index in the containing list. | 67 * This item's index in the containing list. |
74 * type {number} | 68 * type {number} |
75 */ | 69 */ |
76 cr.defineProperty(ListItem, 'listIndex'); | 70 cr.defineProperty(ListItem, 'listIndex'); |
77 | 71 |
78 return { | 72 return {ListItem: ListItem}; |
79 ListItem: ListItem | |
80 }; | |
81 }); | 73 }); |
OLD | NEW |