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

Side by Side Diff: chrome/browser/resources/options2/autofill_edit_creditcard_overlay.js

Issue 10809005: Options: Rename chrome/browser/resources/options2 -> chrome/browser/resources/options. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Fix. Created 8 years, 4 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) 2012 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', function() {
6 /** @const */ var OptionsPage = options.OptionsPage;
7
8 // The GUID of the loaded credit card.
9 var guid_;
10
11 /**
12 * AutofillEditCreditCardOverlay class
13 * Encapsulated handling of the 'Add Page' overlay page.
14 * @class
15 */
16 function AutofillEditCreditCardOverlay() {
17 OptionsPage.call(this, 'autofillEditCreditCard',
18 loadTimeData.getString('autofillEditCreditCardTitle'),
19 'autofill-edit-credit-card-overlay');
20 }
21
22 cr.addSingletonGetter(AutofillEditCreditCardOverlay);
23
24 AutofillEditCreditCardOverlay.prototype = {
25 __proto__: OptionsPage.prototype,
26
27 /**
28 * Initializes the page.
29 */
30 initializePage: function() {
31 OptionsPage.prototype.initializePage.call(this);
32
33 var self = this;
34 $('autofill-edit-credit-card-cancel-button').onclick = function(event) {
35 self.dismissOverlay_();
36 };
37 $('autofill-edit-credit-card-apply-button').onclick = function(event) {
38 self.saveCreditCard_();
39 self.dismissOverlay_();
40 };
41
42 self.guid_ = '';
43 self.hasEditedNumber_ = false;
44 self.clearInputFields_();
45 self.connectInputEvents_();
46 self.setDefaultSelectOptions_();
47 },
48
49 /**
50 * Clears any uncommitted input, and dismisses the overlay.
51 * @private
52 */
53 dismissOverlay_: function() {
54 this.clearInputFields_();
55 this.guid_ = '';
56 this.hasEditedNumber_ = false;
57 OptionsPage.closeOverlay();
58 },
59
60 /**
61 * Aggregates the values in the input fields into an array and sends the
62 * array to the Autofill handler.
63 * @private
64 */
65 saveCreditCard_: function() {
66 var creditCard = new Array(5);
67 creditCard[0] = this.guid_;
68 creditCard[1] = $('name-on-card').value;
69 creditCard[2] = $('credit-card-number').value;
70 creditCard[3] = $('expiration-month').value;
71 creditCard[4] = $('expiration-year').value;
72 chrome.send('setCreditCard', creditCard);
73 },
74
75 /**
76 * Connects each input field to the inputFieldChanged_() method that enables
77 * or disables the 'Ok' button based on whether all the fields are empty or
78 * not.
79 * @private
80 */
81 connectInputEvents_: function() {
82 var ccNumber = $('credit-card-number');
83 $('name-on-card').oninput = ccNumber.oninput =
84 $('expiration-month').onchange = $('expiration-year').onchange =
85 this.inputFieldChanged_.bind(this);
86 },
87
88 /**
89 * Checks the values of each of the input fields and disables the 'Ok'
90 * button if all of the fields are empty.
91 * @param {Event} opt_event Optional data for the 'input' event.
92 * @private
93 */
94 inputFieldChanged_: function(opt_event) {
95 var disabled = !$('name-on-card').value && !$('credit-card-number').value;
96 $('autofill-edit-credit-card-apply-button').disabled = disabled;
97 },
98
99 /**
100 * Sets the default values of the options in the 'Expiration date' select
101 * controls.
102 * @private
103 */
104 setDefaultSelectOptions_: function() {
105 // Set the 'Expiration month' default options.
106 var expirationMonth = $('expiration-month');
107 expirationMonth.options.length = 0;
108 for (var i = 1; i <= 12; ++i) {
109 var text;
110 if (i < 10)
111 text = '0' + i;
112 else
113 text = i;
114
115 var option = document.createElement('option');
116 option.text = text;
117 option.value = text;
118 expirationMonth.add(option, null);
119 }
120
121 // Set the 'Expiration year' default options.
122 var expirationYear = $('expiration-year');
123 expirationYear.options.length = 0;
124
125 var date = new Date();
126 var year = parseInt(date.getFullYear());
127 for (var i = 0; i < 10; ++i) {
128 var text = year + i;
129 var option = document.createElement('option');
130 option.text = text;
131 option.value = text;
132 expirationYear.add(option, null);
133 }
134 },
135
136 /**
137 * Clears the value of each input field.
138 * @private
139 */
140 clearInputFields_: function() {
141 $('name-on-card').value = '';
142 $('credit-card-number').value = '';
143 $('expiration-month').selectedIndex = 0;
144 $('expiration-year').selectedIndex = 0;
145
146 // Reset the enabled status of the 'Ok' button.
147 this.inputFieldChanged_();
148 },
149
150 /**
151 * Sets the value of each input field according to |creditCard|
152 * @private
153 */
154 setInputFields_: function(creditCard) {
155 $('name-on-card').value = creditCard['nameOnCard'];
156 $('credit-card-number').value = creditCard['creditCardNumber'];
157
158 // The options for the year select control may be out-dated at this point,
159 // e.g. the user opened the options page before midnight on New Year's Eve
160 // and then loaded a credit card profile to edit in the new year, so
161 // reload the select options just to be safe.
162 this.setDefaultSelectOptions_();
163
164 var idx = parseInt(creditCard['expirationMonth'], 10);
165 $('expiration-month').selectedIndex = idx - 1;
166
167 expYear = creditCard['expirationYear'];
168 var date = new Date();
169 var year = parseInt(date.getFullYear());
170 for (var i = 0; i < 10; ++i) {
171 var text = year + i;
172 if (expYear == String(text))
173 $('expiration-year').selectedIndex = i;
174 }
175 },
176
177 /**
178 * Loads the credit card data from |creditCard|, sets the input fields based
179 * on this data and stores the GUID of the credit card.
180 * @private
181 */
182 loadCreditCard_: function(creditCard) {
183 this.setInputFields_(creditCard);
184 this.inputFieldChanged_();
185 this.guid_ = creditCard['guid'];
186 },
187 };
188
189 AutofillEditCreditCardOverlay.clearInputFields = function(title) {
190 AutofillEditCreditCardOverlay.getInstance().clearInputFields_();
191 };
192
193 AutofillEditCreditCardOverlay.loadCreditCard = function(creditCard) {
194 AutofillEditCreditCardOverlay.getInstance().loadCreditCard_(creditCard);
195 };
196
197 AutofillEditCreditCardOverlay.setTitle = function(title) {
198 $('autofill-credit-card-title').textContent = title;
199 };
200
201 // Export
202 return {
203 AutofillEditCreditCardOverlay: AutofillEditCreditCardOverlay
204 };
205 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698