Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(623)

Side by Side Diff: chrome/browser/resources/options/password_manager_list.js

Issue 9814030: get rid of old options pages (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: more fixes Created 8 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
(Empty)
1 // Copyright (c) 2011 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file.
4
5 cr.define('options.passwordManager', function() {
6 const ArrayDataModel = cr.ui.ArrayDataModel;
7 const DeletableItemList = options.DeletableItemList;
8 const DeletableItem = options.DeletableItem;
9 const List = cr.ui.List;
10
11 /**
12 * Creates a new passwords list item.
13 * @param {Array} entry An array of the form [url, username, password]. When
14 * the list has been filtered, a fourth element [index] may be present.
15 * @constructor
16 * @extends {cr.ui.ListItem}
17 */
18 function PasswordListItem(entry, showPasswords) {
19 var el = cr.doc.createElement('div');
20 el.dataItem = entry;
21 el.__proto__ = PasswordListItem.prototype;
22 el.decorate(showPasswords);
23
24 return el;
25 }
26
27 PasswordListItem.prototype = {
28 __proto__: DeletableItem.prototype,
29
30 /** @inheritDoc */
31 decorate: function(showPasswords) {
32 DeletableItem.prototype.decorate.call(this);
33
34 // The URL of the site.
35 var urlLabel = this.ownerDocument.createElement('div');
36 urlLabel.classList.add('favicon-cell');
37 urlLabel.classList.add('weakrtl');
38 urlLabel.classList.add('url');
39 urlLabel.setAttribute('title', this.url);
40 urlLabel.textContent = this.url;
41 urlLabel.style.backgroundImage = url('chrome://favicon/' + this.url);
42 this.contentElement.appendChild(urlLabel);
43
44 // The stored username.
45 var usernameLabel = this.ownerDocument.createElement('div');
46 usernameLabel.className = 'name';
47 usernameLabel.textContent = this.username;
48 this.contentElement.appendChild(usernameLabel);
49
50 // The stored password.
51 var passwordInputDiv = this.ownerDocument.createElement('div');
52 passwordInputDiv.className = 'password';
53
54 // The password input field.
55 var passwordInput = this.ownerDocument.createElement('input');
56 passwordInput.type = 'password';
57 passwordInput.className = 'inactive-password';
58 passwordInput.readOnly = true;
59 passwordInput.value = showPasswords ? this.password : '********';
60 passwordInputDiv.appendChild(passwordInput);
61
62 // The show/hide button.
63 if (showPasswords) {
64 var button = this.ownerDocument.createElement('button');
65 button.hidden = true;
66 button.classList.add('password-button');
67 button.textContent = localStrings.getString('passwordShowButton');
68 button.addEventListener('click', this.onClick_, true);
69 passwordInputDiv.appendChild(button);
70 }
71
72 this.contentElement.appendChild(passwordInputDiv);
73 },
74
75 /** @inheritDoc */
76 selectionChanged: function() {
77 var passwordInput = this.querySelector('input[type=password]');
78 var textInput = this.querySelector('input[type=text]');
79 var input = passwordInput || textInput;
80 var button = input.nextSibling;
81 // |button| doesn't exist when passwords can't be shown.
82 if (!button)
83 return;
84 if (this.selected) {
85 input.classList.remove('inactive-password');
86 button.hidden = false;
87 } else {
88 input.classList.add('inactive-password');
89 button.hidden = true;
90 }
91 },
92
93 /**
94 * On-click event handler. Swaps the type of the input field from password
95 * to text and back.
96 * @private
97 */
98 onClick_: function(event) {
99 // The password is the input element previous to the button.
100 var button = event.currentTarget;
101 var passwordInput = button.previousSibling;
102 if (passwordInput.type == 'password') {
103 passwordInput.type = 'text';
104 button.textContent = localStrings.getString('passwordHideButton');
105 } else {
106 passwordInput.type = 'password';
107 button.textContent = localStrings.getString('passwordShowButton');
108 }
109 },
110
111 /**
112 * Get and set the URL for the entry.
113 * @type {string}
114 */
115 get url() {
116 return this.dataItem[0];
117 },
118 set url(url) {
119 this.dataItem[0] = url;
120 },
121
122 /**
123 * Get and set the username for the entry.
124 * @type {string}
125 */
126 get username() {
127 return this.dataItem[1];
128 },
129 set username(username) {
130 this.dataItem[1] = username;
131 },
132
133 /**
134 * Get and set the password for the entry.
135 * @type {string}
136 */
137 get password() {
138 return this.dataItem[2];
139 },
140 set password(password) {
141 this.dataItem[2] = password;
142 },
143 };
144
145 /**
146 * Creates a new PasswordExceptions list item.
147 * @param {Array} entry A pair of the form [url, username].
148 * @constructor
149 * @extends {Deletable.ListItem}
150 */
151 function PasswordExceptionsListItem(entry) {
152 var el = cr.doc.createElement('div');
153 el.dataItem = entry;
154 el.__proto__ = PasswordExceptionsListItem.prototype;
155 el.decorate();
156
157 return el;
158 }
159
160 PasswordExceptionsListItem.prototype = {
161 __proto__: DeletableItem.prototype,
162
163 /**
164 * Call when an element is decorated as a list item.
165 */
166 decorate: function() {
167 DeletableItem.prototype.decorate.call(this);
168
169 // The URL of the site.
170 var urlLabel = this.ownerDocument.createElement('div');
171 urlLabel.className = 'url';
172 urlLabel.classList.add('favicon-cell');
173 urlLabel.classList.add('weakrtl');
174 urlLabel.textContent = this.url;
175 urlLabel.style.backgroundImage = url('chrome://favicon/' + this.url);
176 this.contentElement.appendChild(urlLabel);
177 },
178
179 /**
180 * Get the url for the entry.
181 * @type {string}
182 */
183 get url() {
184 return this.dataItem;
185 },
186 set url(url) {
187 this.dataItem = url;
188 },
189 };
190
191 /**
192 * Create a new passwords list.
193 * @constructor
194 * @extends {cr.ui.List}
195 */
196 var PasswordsList = cr.ui.define('list');
197
198 PasswordsList.prototype = {
199 __proto__: DeletableItemList.prototype,
200
201 /**
202 * Whether passwords can be revealed or not.
203 * @type {boolean}
204 * @private
205 */
206 showPasswords_: true,
207
208 /** @inheritDoc */
209 decorate: function() {
210 DeletableItemList.prototype.decorate.call(this);
211 Preferences.getInstance().addEventListener(
212 "profile.password_manager_allow_show_passwords",
213 this.onPreferenceChanged_.bind(this));
214 },
215
216 /**
217 * Listener for changes on the preference.
218 * @param {Event} event The preference update event.
219 * @private
220 */
221 onPreferenceChanged_: function(event) {
222 this.showPasswords_ = event.value.value;
223 this.redraw();
224 },
225
226 /** @inheritDoc */
227 createItem: function(entry) {
228 return new PasswordListItem(entry, this.showPasswords_);
229 },
230
231 /** @inheritDoc */
232 deleteItemAtIndex: function(index) {
233 var item = this.dataModel.item(index);
234 if (item && item.length > 3) {
235 // The fourth element, if present, is the original index to delete.
236 index = item[3];
237 }
238 PasswordManager.removeSavedPassword(index);
239 },
240
241 /**
242 * The length of the list.
243 */
244 get length() {
245 return this.dataModel.length;
246 },
247 };
248
249 /**
250 * Create a new passwords list.
251 * @constructor
252 * @extends {cr.ui.List}
253 */
254 var PasswordExceptionsList = cr.ui.define('list');
255
256 PasswordExceptionsList.prototype = {
257 __proto__: DeletableItemList.prototype,
258
259 /** @inheritDoc */
260 createItem: function(entry) {
261 return new PasswordExceptionsListItem(entry);
262 },
263
264 /** @inheritDoc */
265 deleteItemAtIndex: function(index) {
266 PasswordManager.removePasswordException(index);
267 },
268
269 /**
270 * The length of the list.
271 */
272 get length() {
273 return this.dataModel.length;
274 },
275 };
276
277 return {
278 PasswordListItem: PasswordListItem,
279 PasswordExceptionsListItem: PasswordExceptionsListItem,
280 PasswordsList: PasswordsList,
281 PasswordExceptionsList: PasswordExceptionsList,
282 };
283 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698