| 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('options', function() { | 5 cr.define('options', function() { |
| 6 /** @const */ var List = cr.ui.List; | 6 /** @const */ var List = cr.ui.List; |
| 7 /** @const */ var ListItem = cr.ui.ListItem; | 7 /** @const */ var ListItem = cr.ui.ListItem; |
| 8 | 8 |
| 9 /** | 9 /** |
| 10 * Creates a deletable list item, which has a button that will trigger a call | 10 * Creates a deletable list item, which has a button that will trigger a call |
| (...skipping 20 matching lines...) Expand all Loading... |
| 31 */ | 31 */ |
| 32 closeButtonElement_: null, | 32 closeButtonElement_: null, |
| 33 | 33 |
| 34 /** | 34 /** |
| 35 * Whether or not this item can be deleted. | 35 * Whether or not this item can be deleted. |
| 36 * @type {boolean} | 36 * @type {boolean} |
| 37 * @private | 37 * @private |
| 38 */ | 38 */ |
| 39 deletable_: true, | 39 deletable_: true, |
| 40 | 40 |
| 41 /** |
| 42 * Whether or not the close button can ever be navigated to using the |
| 43 * keyboard. |
| 44 * @type {boolean} |
| 45 * @protected |
| 46 */ |
| 47 closeButtonFocusAllowed: false, |
| 48 |
| 41 /** @override */ | 49 /** @override */ |
| 42 decorate: function() { | 50 decorate: function() { |
| 43 ListItem.prototype.decorate.call(this); | 51 ListItem.prototype.decorate.call(this); |
| 44 | 52 |
| 45 this.classList.add('deletable-item'); | 53 this.classList.add('deletable-item'); |
| 46 | 54 |
| 47 this.contentElement_ = /** @type {HTMLElement} */( | 55 this.contentElement_ = /** @type {HTMLElement} */( |
| 48 this.ownerDocument.createElement('div')); | 56 this.ownerDocument.createElement('div')); |
| 49 this.appendChild(this.contentElement_); | 57 this.appendChild(this.contentElement_); |
| 50 | 58 |
| 51 this.closeButtonElement_ = /** @type {HTMLElement} */( | 59 this.closeButtonElement_ = /** @type {HTMLElement} */( |
| 52 this.ownerDocument.createElement('button')); | 60 this.ownerDocument.createElement('button')); |
| 53 this.closeButtonElement_.className = | 61 this.closeButtonElement_.className = |
| 54 'raw-button row-delete-button custom-appearance'; | 62 'raw-button row-delete-button custom-appearance'; |
| 55 this.closeButtonElement_.addEventListener('mousedown', | 63 this.closeButtonElement_.addEventListener('mousedown', |
| 56 this.handleMouseDownUpOnClose_); | 64 this.handleMouseDownUpOnClose_); |
| 57 this.closeButtonElement_.addEventListener('mouseup', | 65 this.closeButtonElement_.addEventListener('mouseup', |
| 58 this.handleMouseDownUpOnClose_); | 66 this.handleMouseDownUpOnClose_); |
| 59 this.closeButtonElement_.addEventListener('focus', | 67 this.closeButtonElement_.addEventListener('focus', |
| 60 this.handleFocus_.bind(this)); | 68 this.handleFocus.bind(this)); |
| 61 this.closeButtonElement_.tabIndex = -1; | 69 this.closeButtonElement_.tabIndex = -1; |
| 62 this.closeButtonElement_.title = | 70 this.closeButtonElement_.title = |
| 63 loadTimeData.getString('deletableItemDeleteButtonTitle'); | 71 loadTimeData.getString('deletableItemDeleteButtonTitle'); |
| 64 this.appendChild(this.closeButtonElement_); | 72 this.appendChild(this.closeButtonElement_); |
| 65 }, | 73 }, |
| 66 | 74 |
| 67 /** | 75 /** |
| 68 * Returns the element subclasses should add content to. | 76 * Returns the element subclasses should add content to. |
| 69 * @return {HTMLElement} The element subclasses should popuplate. | 77 * @return {HTMLElement} The element subclasses should popuplate. |
| 70 */ | 78 */ |
| (...skipping 16 matching lines...) Expand all Loading... |
| 87 return this.deletable_; | 95 return this.deletable_; |
| 88 }, | 96 }, |
| 89 set deletable(value) { | 97 set deletable(value) { |
| 90 this.deletable_ = value; | 98 this.deletable_ = value; |
| 91 this.closeButtonElement_.disabled = !value; | 99 this.closeButtonElement_.disabled = !value; |
| 92 }, | 100 }, |
| 93 | 101 |
| 94 /** | 102 /** |
| 95 * Called when a focusable child element receives focus. Selects this item | 103 * Called when a focusable child element receives focus. Selects this item |
| 96 * in the list selection model. | 104 * in the list selection model. |
| 97 * @private | 105 * @protected |
| 98 */ | 106 */ |
| 99 handleFocus_: function() { | 107 handleFocus: function() { |
| 100 // This handler is also fired when the child receives focus as a result of | 108 // This handler is also fired when the child receives focus as a result of |
| 101 // the item getting selected by the customized mouse/keyboard handling in | 109 // the item getting selected by the customized mouse/keyboard handling in |
| 102 // SelectionController. Take care not to destroy a potential multiple | 110 // SelectionController. Take care not to destroy a potential multiple |
| 103 // selection in this case. | 111 // selection in this case. |
| 104 if (this.selected) | 112 if (this.selected) |
| 105 return; | 113 return; |
| 106 | 114 |
| 107 var list = this.parentNode; | 115 var list = this.parentNode; |
| 108 var index = list.getIndexOfListItem(this); | 116 var index = list.getIndexOfListItem(this); |
| 109 list.selectionModel.selectedIndex = index; | 117 list.selectionModel.selectedIndex = index; |
| (...skipping 87 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 197 */ | 205 */ |
| 198 deleteItemAtIndex: function(index) { | 206 deleteItemAtIndex: function(index) { |
| 199 }, | 207 }, |
| 200 }; | 208 }; |
| 201 | 209 |
| 202 return { | 210 return { |
| 203 DeletableItemList: DeletableItemList, | 211 DeletableItemList: DeletableItemList, |
| 204 DeletableItem: DeletableItem, | 212 DeletableItem: DeletableItem, |
| 205 }; | 213 }; |
| 206 }); | 214 }); |
| OLD | NEW |