| OLD | NEW |
| 1 // Copyright (c) 2010 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2010 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.passwordManager', function() { | 5 cr.define('options.passwordManager', function() { |
| 6 const ArrayDataModel = cr.ui.ArrayDataModel; | 6 const ArrayDataModel = cr.ui.ArrayDataModel; |
| 7 const DeletableItemList = options.DeletableItemList; | 7 const DeletableItemList = options.DeletableItemList; |
| 8 const DeletableItem = options.DeletableItem; | 8 const DeletableItem = options.DeletableItem; |
| 9 const List = cr.ui.List; | 9 const List = cr.ui.List; |
| 10 | 10 |
| 11 /** | 11 /** |
| 12 * Creates a new passwords list item. | 12 * Creates a new passwords list item. |
| 13 * @param {Array} entry An array of the form [url, username, password]. | 13 * @param {Array} entry An array of the form [url, username, password]. |
| 14 * @constructor | 14 * @constructor |
| 15 * @extends {cr.ui.ListItem} | 15 * @extends {cr.ui.ListItem} |
| 16 */ | 16 */ |
| 17 function PasswordListItem(entry) { | 17 function PasswordListItem(entry, showPassword) { |
| 18 var el = cr.doc.createElement('div'); | 18 var el = cr.doc.createElement('div'); |
| 19 el.dataItem = entry; | 19 el.dataItem = entry; |
| 20 el.__proto__ = PasswordListItem.prototype; | 20 el.__proto__ = PasswordListItem.prototype; |
| 21 el.showPassword = showPassword; |
| 21 el.decorate(); | 22 el.decorate(); |
| 22 | 23 |
| 23 return el; | 24 return el; |
| 24 } | 25 } |
| 25 | 26 |
| 26 PasswordListItem.prototype = { | 27 PasswordListItem.prototype = { |
| 27 __proto__: DeletableItem.prototype, | 28 __proto__: DeletableItem.prototype, |
| 28 | 29 |
| 29 /** @inheritDoc */ | 30 /** @inheritDoc */ |
| 30 decorate: function() { | 31 decorate: function() { |
| (...skipping 19 matching lines...) Expand all Loading... |
| 50 | 51 |
| 51 // The password input field. | 52 // The password input field. |
| 52 var passwordInput = this.ownerDocument.createElement('input'); | 53 var passwordInput = this.ownerDocument.createElement('input'); |
| 53 passwordInput.type = 'password'; | 54 passwordInput.type = 'password'; |
| 54 passwordInput.className = 'inactive-password'; | 55 passwordInput.className = 'inactive-password'; |
| 55 passwordInput.readOnly = true; | 56 passwordInput.readOnly = true; |
| 56 passwordInput.value = this.password; | 57 passwordInput.value = this.password; |
| 57 passwordInputDiv.appendChild(passwordInput); | 58 passwordInputDiv.appendChild(passwordInput); |
| 58 | 59 |
| 59 // The show/hide button. | 60 // The show/hide button. |
| 60 var button = this.ownerDocument.createElement('button'); | 61 if (this.showPassword) { |
| 61 button.classList.add('hidden'); | 62 var button = this.ownerDocument.createElement('button'); |
| 62 button.classList.add('password-button'); | 63 button.classList.add('hidden'); |
| 63 button.textContent = localStrings.getString('passwordShowButton'); | 64 button.classList.add('password-button'); |
| 64 button.addEventListener('click', this.onClick_, true); | 65 button.textContent = localStrings.getString('passwordShowButton'); |
| 65 passwordInputDiv.appendChild(button); | 66 button.addEventListener('click', this.onClick_, true); |
| 67 passwordInputDiv.appendChild(button); |
| 68 } |
| 66 | 69 |
| 67 this.contentElement.appendChild(passwordInputDiv); | 70 this.contentElement.appendChild(passwordInputDiv); |
| 68 }, | 71 }, |
| 69 | 72 |
| 70 /** @inheritDoc */ | 73 /** @inheritDoc */ |
| 71 selectionChanged: function() { | 74 selectionChanged: function() { |
| 75 if (!this.showPassword) |
| 76 return; |
| 77 |
| 72 var passwordInput = this.querySelector('input[type=password]'); | 78 var passwordInput = this.querySelector('input[type=password]'); |
| 73 var textInput = this.querySelector('input[type=text]'); | 79 var textInput = this.querySelector('input[type=text]'); |
| 74 var input = passwordInput || textInput; | 80 var input = passwordInput || textInput; |
| 75 var button = input.nextSibling; | 81 var button = input.nextSibling; |
| 76 if (this.selected) { | 82 if (this.selected) { |
| 77 input.classList.remove('inactive-password'); | 83 input.classList.remove('inactive-password'); |
| 78 button.classList.remove('hidden'); | 84 button.classList.remove('hidden'); |
| 79 } else { | 85 } else { |
| 80 input.classList.add('inactive-password'); | 86 input.classList.add('inactive-password'); |
| 81 button.classList.add('hidden'); | 87 button.classList.add('hidden'); |
| (...skipping 102 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 184 * @constructor | 190 * @constructor |
| 185 * @extends {cr.ui.List} | 191 * @extends {cr.ui.List} |
| 186 */ | 192 */ |
| 187 var PasswordsList = cr.ui.define('list'); | 193 var PasswordsList = cr.ui.define('list'); |
| 188 | 194 |
| 189 PasswordsList.prototype = { | 195 PasswordsList.prototype = { |
| 190 __proto__: DeletableItemList.prototype, | 196 __proto__: DeletableItemList.prototype, |
| 191 | 197 |
| 192 /** @inheritDoc */ | 198 /** @inheritDoc */ |
| 193 createItem: function(entry) { | 199 createItem: function(entry) { |
| 194 return new PasswordListItem(entry); | 200 return new PasswordListItem(entry, this.showPasswords); |
| 195 }, | 201 }, |
| 196 | 202 |
| 197 /** @inheritDoc */ | 203 /** @inheritDoc */ |
| 198 deleteItemAtIndex: function(index) { | 204 deleteItemAtIndex: function(index) { |
| 199 PasswordManager.removeSavedPassword(index); | 205 PasswordManager.removeSavedPassword(index); |
| 200 }, | 206 }, |
| 201 | 207 |
| 202 /** | 208 /** |
| 203 * The length of the list. | 209 * The length of the list. |
| 204 */ | 210 */ |
| 205 get length() { | 211 get length() { |
| 206 return this.dataModel.length; | 212 return this.dataModel.length; |
| 207 }, | 213 }, |
| 214 |
| 215 /** |
| 216 * Whether passwords can be displayed in clear text or not. |
| 217 * @type {boolean} |
| 218 */ |
| 219 showPasswords: true, |
| 208 }; | 220 }; |
| 209 | 221 |
| 210 /** | 222 /** |
| 211 * Create a new passwords list. | 223 * Create a new passwords list. |
| 212 * @constructor | 224 * @constructor |
| 213 * @extends {cr.ui.List} | 225 * @extends {cr.ui.List} |
| 214 */ | 226 */ |
| 215 var PasswordExceptionsList = cr.ui.define('list'); | 227 var PasswordExceptionsList = cr.ui.define('list'); |
| 216 | 228 |
| 217 PasswordExceptionsList.prototype = { | 229 PasswordExceptionsList.prototype = { |
| (...skipping 17 matching lines...) Expand all Loading... |
| 235 }, | 247 }, |
| 236 }; | 248 }; |
| 237 | 249 |
| 238 return { | 250 return { |
| 239 PasswordListItem: PasswordListItem, | 251 PasswordListItem: PasswordListItem, |
| 240 PasswordExceptionsListItem: PasswordExceptionsListItem, | 252 PasswordExceptionsListItem: PasswordExceptionsListItem, |
| 241 PasswordsList: PasswordsList, | 253 PasswordsList: PasswordsList, |
| 242 PasswordExceptionsList: PasswordExceptionsList, | 254 PasswordExceptionsList: PasswordExceptionsList, |
| 243 }; | 255 }; |
| 244 }); | 256 }); |
| OLD | NEW |