| 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 26 matching lines...) Expand all Loading... |
| 37 * @private | 37 * @private |
| 38 */ | 38 */ |
| 39 deletable_: true, | 39 deletable_: true, |
| 40 | 40 |
| 41 /** @override */ | 41 /** @override */ |
| 42 decorate: function() { | 42 decorate: function() { |
| 43 ListItem.prototype.decorate.call(this); | 43 ListItem.prototype.decorate.call(this); |
| 44 | 44 |
| 45 this.classList.add('deletable-item'); | 45 this.classList.add('deletable-item'); |
| 46 | 46 |
| 47 this.contentElement_ = this.ownerDocument.createElement('div'); | 47 this.contentElement_ = /** @type {HTMLElement} */( |
| 48 this.ownerDocument.createElement('div')); |
| 48 this.appendChild(this.contentElement_); | 49 this.appendChild(this.contentElement_); |
| 49 | 50 |
| 50 this.closeButtonElement_ = this.ownerDocument.createElement('button'); | 51 this.closeButtonElement_ = /** @type {HTMLElement} */( |
| 52 this.ownerDocument.createElement('button')); |
| 51 this.closeButtonElement_.className = | 53 this.closeButtonElement_.className = |
| 52 'raw-button row-delete-button custom-appearance'; | 54 'raw-button row-delete-button custom-appearance'; |
| 53 this.closeButtonElement_.addEventListener('mousedown', | 55 this.closeButtonElement_.addEventListener('mousedown', |
| 54 this.handleMouseDownUpOnClose_); | 56 this.handleMouseDownUpOnClose_); |
| 55 this.closeButtonElement_.addEventListener('mouseup', | 57 this.closeButtonElement_.addEventListener('mouseup', |
| 56 this.handleMouseDownUpOnClose_); | 58 this.handleMouseDownUpOnClose_); |
| 57 this.closeButtonElement_.addEventListener('focus', | 59 this.closeButtonElement_.addEventListener('focus', |
| 58 this.handleFocus_.bind(this)); | 60 this.handleFocus_.bind(this)); |
| 59 this.closeButtonElement_.tabIndex = -1; | 61 this.closeButtonElement_.tabIndex = -1; |
| 60 this.closeButtonElement_.title = | 62 this.closeButtonElement_.title = |
| (...skipping 55 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 116 * @private | 118 * @private |
| 117 */ | 119 */ |
| 118 handleMouseDownUpOnClose_: function(e) { | 120 handleMouseDownUpOnClose_: function(e) { |
| 119 if (e.target.disabled) | 121 if (e.target.disabled) |
| 120 return; | 122 return; |
| 121 e.stopPropagation(); | 123 e.stopPropagation(); |
| 122 e.preventDefault(); | 124 e.preventDefault(); |
| 123 }, | 125 }, |
| 124 }; | 126 }; |
| 125 | 127 |
| 128 /** |
| 129 * @constructor |
| 130 * @extends {cr.ui.List} |
| 131 */ |
| 126 var DeletableItemList = cr.ui.define('list'); | 132 var DeletableItemList = cr.ui.define('list'); |
| 127 | 133 |
| 128 DeletableItemList.prototype = { | 134 DeletableItemList.prototype = { |
| 129 __proto__: List.prototype, | 135 __proto__: List.prototype, |
| 130 | 136 |
| 131 /** @override */ | 137 /** @override */ |
| 132 decorate: function() { | 138 decorate: function() { |
| 133 List.prototype.decorate.call(this); | 139 List.prototype.decorate.call(this); |
| 134 this.addEventListener('click', this.handleClick_); | 140 this.addEventListener('click', this.handleClick); |
| 135 this.addEventListener('keydown', this.handleKeyDown_); | 141 this.addEventListener('keydown', this.handleKeyDown_); |
| 136 }, | 142 }, |
| 137 | 143 |
| 138 /** | 144 /** |
| 139 * Callback for onclick events. | 145 * Callback for onclick events. |
| 140 * @param {Event} e The click event object. | 146 * @param {Event} e The click event object. |
| 141 * @private | 147 * @override |
| 142 */ | 148 */ |
| 143 handleClick_: function(e) { | 149 handleClick: function(e) { |
| 144 if (this.disabled) | 150 if (this.disabled) |
| 145 return; | 151 return; |
| 146 | 152 |
| 147 var target = e.target; | 153 var target = e.target; |
| 148 if (target.classList.contains('row-delete-button')) { | 154 if (target.classList.contains('row-delete-button')) { |
| 149 var listItem = this.getListItemAncestor(target); | 155 var listItem = this.getListItemAncestor(target); |
| 150 var idx = this.getIndexOfListItem(listItem); | 156 var idx = this.getIndexOfListItem(listItem); |
| 151 this.deleteItemAtIndex(idx); | 157 this.deleteItemAtIndex(idx); |
| 152 } | 158 } |
| 153 }, | 159 }, |
| (...skipping 36 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 190 */ | 196 */ |
| 191 deleteItemAtIndex: function(index) { | 197 deleteItemAtIndex: function(index) { |
| 192 }, | 198 }, |
| 193 }; | 199 }; |
| 194 | 200 |
| 195 return { | 201 return { |
| 196 DeletableItemList: DeletableItemList, | 202 DeletableItemList: DeletableItemList, |
| 197 DeletableItem: DeletableItem, | 203 DeletableItem: DeletableItem, |
| 198 }; | 204 }; |
| 199 }); | 205 }); |
| OLD | NEW |