| 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 /** @const */ var EventTarget = cr.EventTarget; | 6 /** @const */ var EventTarget = cr.EventTarget; |
| 7 | 7 |
| 8 /** | 8 /** |
| 9 * Creates a new selection model that is to be used with lists. This only | 9 * Creates a new selection model that is to be used with lists. This only |
| 10 * allows a single index to be selected. | 10 * allows a single index to be selected. |
| (...skipping 11 matching lines...) Expand all Loading... |
| 22 this.independentLeadItem_ = !cr.isMac && !cr.isChromeOS; | 22 this.independentLeadItem_ = !cr.isMac && !cr.isChromeOS; |
| 23 } | 23 } |
| 24 | 24 |
| 25 ListSingleSelectionModel.prototype = { | 25 ListSingleSelectionModel.prototype = { |
| 26 __proto__: EventTarget.prototype, | 26 __proto__: EventTarget.prototype, |
| 27 | 27 |
| 28 /** | 28 /** |
| 29 * The number of items in the model. | 29 * The number of items in the model. |
| 30 * @type {number} | 30 * @type {number} |
| 31 */ | 31 */ |
| 32 get length() { return this.length_; }, | 32 get length() { |
| 33 return this.length_; |
| 34 }, |
| 33 | 35 |
| 34 /** | 36 /** |
| 35 * @type {!Array} The selected indexes. | 37 * @type {!Array} The selected indexes. |
| 36 */ | 38 */ |
| 37 get selectedIndexes() { | 39 get selectedIndexes() { |
| 38 var i = this.selectedIndex; | 40 var i = this.selectedIndex; |
| 39 return i != -1 ? [this.selectedIndex] : []; | 41 return i != -1 ? [this.selectedIndex] : []; |
| 40 }, | 42 }, |
| 41 set selectedIndexes(indexes) { | 43 set selectedIndexes(indexes) { |
| 42 this.selectedIndex = indexes.length ? indexes[0] : -1; | 44 this.selectedIndex = indexes.length ? indexes[0] : -1; |
| 43 }, | 45 }, |
| 44 | 46 |
| 45 /** | 47 /** |
| 46 * Convenience getter which returns the first selected index. | 48 * Convenience getter which returns the first selected index. |
| 47 * Setter also changes lead and anchor indexes if value is nonegative. | 49 * Setter also changes lead and anchor indexes if value is nonegative. |
| 48 * @type {number} | 50 * @type {number} |
| 49 */ | 51 */ |
| 50 get selectedIndex() { return this.selectedIndex_; }, | 52 get selectedIndex() { |
| 53 return this.selectedIndex_; |
| 54 }, |
| 51 set selectedIndex(selectedIndex) { | 55 set selectedIndex(selectedIndex) { |
| 52 var oldSelectedIndex = this.selectedIndex; | 56 var oldSelectedIndex = this.selectedIndex; |
| 53 var i = Math.max(-1, Math.min(this.length_ - 1, selectedIndex)); | 57 var i = Math.max(-1, Math.min(this.length_ - 1, selectedIndex)); |
| 54 | 58 |
| 55 if (i != oldSelectedIndex) { | 59 if (i != oldSelectedIndex) { |
| 56 this.beginChange(); | 60 this.beginChange(); |
| 57 this.selectedIndex_ = i; | 61 this.selectedIndex_ = i; |
| 58 this.leadIndex = i >= 0 ? i : this.leadIndex; | 62 this.leadIndex = i >= 0 ? i : this.leadIndex; |
| 59 this.endChange(); | 63 this.endChange(); |
| 60 } | 64 } |
| (...skipping 23 matching lines...) Expand all Loading... |
| 84 clear: function() { | 88 clear: function() { |
| 85 this.beginChange(); | 89 this.beginChange(); |
| 86 this.length_ = 0; | 90 this.length_ = 0; |
| 87 this.selectedIndex = this.anchorIndex = this.leadIndex = -1; | 91 this.selectedIndex = this.anchorIndex = this.leadIndex = -1; |
| 88 this.endChange(); | 92 this.endChange(); |
| 89 }, | 93 }, |
| 90 | 94 |
| 91 /** | 95 /** |
| 92 * Unselects all selected items. | 96 * Unselects all selected items. |
| 93 */ | 97 */ |
| 94 unselectAll: function() { this.selectedIndex = -1; }, | 98 unselectAll: function() { |
| 99 this.selectedIndex = -1; |
| 100 }, |
| 95 | 101 |
| 96 /** | 102 /** |
| 97 * Sets the selected state for an index. | 103 * Sets the selected state for an index. |
| 98 * @param {number} index The index to set the selected state for. | 104 * @param {number} index The index to set the selected state for. |
| 99 * @param {boolean} b Whether to select the index or not. | 105 * @param {boolean} b Whether to select the index or not. |
| 100 */ | 106 */ |
| 101 setIndexSelected: function(index, b) { | 107 setIndexSelected: function(index, b) { |
| 102 // Only allow selection | 108 // Only allow selection |
| 103 var oldSelected = index == this.selectedIndex_; | 109 var oldSelected = index == this.selectedIndex_; |
| 104 if (oldSelected == b) | 110 if (oldSelected == b) |
| 105 return; | 111 return; |
| 106 | 112 |
| 107 if (b) | 113 if (b) |
| 108 this.selectedIndex = index; | 114 this.selectedIndex = index; |
| 109 else if (index == this.selectedIndex_) | 115 else if (index == this.selectedIndex_) |
| 110 this.selectedIndex = -1; | 116 this.selectedIndex = -1; |
| 111 }, | 117 }, |
| 112 | 118 |
| 113 /** | 119 /** |
| 114 * Whether a given index is selected or not. | 120 * Whether a given index is selected or not. |
| 115 * @param {number} index The index to check. | 121 * @param {number} index The index to check. |
| 116 * @return {boolean} Whether an index is selected. | 122 * @return {boolean} Whether an index is selected. |
| 117 */ | 123 */ |
| 118 getIndexSelected: function(index) { return index == this.selectedIndex_; }, | 124 getIndexSelected: function(index) { |
| 125 return index == this.selectedIndex_; |
| 126 }, |
| 119 | 127 |
| 120 /** | 128 /** |
| 121 * This is used to begin batching changes. Call {@code endChange} when you | 129 * This is used to begin batching changes. Call {@code endChange} when you |
| 122 * are done making changes. | 130 * are done making changes. |
| 123 */ | 131 */ |
| 124 beginChange: function() { | 132 beginChange: function() { |
| 125 if (!this.changeCount_) { | 133 if (!this.changeCount_) { |
| 126 this.changeCount_ = 0; | 134 this.changeCount_ = 0; |
| 127 this.selectedIndexBefore_ = this.selectedIndex_; | 135 this.selectedIndexBefore_ = this.selectedIndex_; |
| 128 } | 136 } |
| (...skipping 18 matching lines...) Expand all Loading... |
| 147 }, | 155 }, |
| 148 | 156 |
| 149 /** | 157 /** |
| 150 * Creates event with specified name and fills its {changes} property. | 158 * Creates event with specified name and fills its {changes} property. |
| 151 * @param {string} eventName Event name. | 159 * @param {string} eventName Event name. |
| 152 */ | 160 */ |
| 153 createChangeEvent: function(eventName) { | 161 createChangeEvent: function(eventName) { |
| 154 var e = new Event(eventName); | 162 var e = new Event(eventName); |
| 155 var indexes = [this.selectedIndexBefore_, this.selectedIndex_]; | 163 var indexes = [this.selectedIndexBefore_, this.selectedIndex_]; |
| 156 e.changes = | 164 e.changes = |
| 157 indexes.filter(function(index) { return index != -1; }) | 165 indexes |
| 166 .filter(function(index) { |
| 167 return index != -1; |
| 168 }) |
| 158 .map(function(index) { | 169 .map(function(index) { |
| 159 return {index: index, selected: index == this.selectedIndex_}; | 170 return {index: index, selected: index == this.selectedIndex_}; |
| 160 }, this); | 171 }, this); |
| 161 | 172 |
| 162 return e; | 173 return e; |
| 163 }, | 174 }, |
| 164 | 175 |
| 165 leadIndex_: -1, | 176 leadIndex_: -1, |
| 166 | 177 |
| 167 /** | 178 /** |
| 168 * The leadIndex is used with multiple selection and it is the index that | 179 * The leadIndex is used with multiple selection and it is the index that |
| 169 * the user is moving using the arrow keys. | 180 * the user is moving using the arrow keys. |
| 170 * @type {number} | 181 * @type {number} |
| 171 */ | 182 */ |
| 172 get leadIndex() { return this.leadIndex_; }, | 183 get leadIndex() { |
| 184 return this.leadIndex_; |
| 185 }, |
| 173 set leadIndex(leadIndex) { | 186 set leadIndex(leadIndex) { |
| 174 var li = this.adjustIndex_(leadIndex); | 187 var li = this.adjustIndex_(leadIndex); |
| 175 if (li != this.leadIndex_) { | 188 if (li != this.leadIndex_) { |
| 176 var oldLeadIndex = this.leadIndex_; | 189 var oldLeadIndex = this.leadIndex_; |
| 177 this.leadIndex_ = li; | 190 this.leadIndex_ = li; |
| 178 cr.dispatchPropertyChange(this, 'leadIndex', li, oldLeadIndex); | 191 cr.dispatchPropertyChange(this, 'leadIndex', li, oldLeadIndex); |
| 179 cr.dispatchPropertyChange(this, 'anchorIndex', li, oldLeadIndex); | 192 cr.dispatchPropertyChange(this, 'anchorIndex', li, oldLeadIndex); |
| 180 } | 193 } |
| 181 }, | 194 }, |
| 182 | 195 |
| 183 adjustIndex_: function(index) { | 196 adjustIndex_: function(index) { |
| 184 index = Math.max(-1, Math.min(this.length_ - 1, index)); | 197 index = Math.max(-1, Math.min(this.length_ - 1, index)); |
| 185 if (!this.independentLeadItem_) | 198 if (!this.independentLeadItem_) |
| 186 index = this.selectedIndex; | 199 index = this.selectedIndex; |
| 187 return index; | 200 return index; |
| 188 }, | 201 }, |
| 189 | 202 |
| 190 /** | 203 /** |
| 191 * The anchorIndex is used with multiple selection. | 204 * The anchorIndex is used with multiple selection. |
| 192 * @type {number} | 205 * @type {number} |
| 193 */ | 206 */ |
| 194 get anchorIndex() { return this.leadIndex; }, | 207 get anchorIndex() { |
| 195 set anchorIndex(anchorIndex) { this.leadIndex = anchorIndex; }, | 208 return this.leadIndex; |
| 209 }, |
| 210 set anchorIndex(anchorIndex) { |
| 211 this.leadIndex = anchorIndex; |
| 212 }, |
| 196 | 213 |
| 197 /** | 214 /** |
| 198 * Whether the selection model supports multiple selected items. | 215 * Whether the selection model supports multiple selected items. |
| 199 * @type {boolean} | 216 * @type {boolean} |
| 200 */ | 217 */ |
| 201 get multiple() { return false; }, | 218 get multiple() { |
| 219 return false; |
| 220 }, |
| 202 | 221 |
| 203 /** | 222 /** |
| 204 * Adjusts the selection after reordering of items in the table. | 223 * Adjusts the selection after reordering of items in the table. |
| 205 * @param {!Array<number>} permutation The reordering permutation. | 224 * @param {!Array<number>} permutation The reordering permutation. |
| 206 */ | 225 */ |
| 207 adjustToReordering: function(permutation) { | 226 adjustToReordering: function(permutation) { |
| 208 if (this.leadIndex != -1) | 227 if (this.leadIndex != -1) |
| 209 this.leadIndex = permutation[this.leadIndex]; | 228 this.leadIndex = permutation[this.leadIndex]; |
| 210 | 229 |
| 211 var oldSelectedIndex = this.selectedIndex; | 230 var oldSelectedIndex = this.selectedIndex; |
| 212 if (oldSelectedIndex != -1) { | 231 if (oldSelectedIndex != -1) { |
| 213 this.selectedIndex = permutation[oldSelectedIndex]; | 232 this.selectedIndex = permutation[oldSelectedIndex]; |
| 214 } | 233 } |
| 215 }, | 234 }, |
| 216 | 235 |
| 217 /** | 236 /** |
| 218 * Adjusts selection model length. | 237 * Adjusts selection model length. |
| 219 * @param {number} length New selection model length. | 238 * @param {number} length New selection model length. |
| 220 */ | 239 */ |
| 221 adjustLength: function(length) { this.length_ = length; } | 240 adjustLength: function(length) { |
| 241 this.length_ = length; |
| 242 } |
| 222 }; | 243 }; |
| 223 | 244 |
| 224 return {ListSingleSelectionModel: ListSingleSelectionModel}; | 245 return {ListSingleSelectionModel: ListSingleSelectionModel}; |
| 225 }); | 246 }); |
| OLD | NEW |