// Copyright 2016 The Chromium Authors. All rights reserved. // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. /** * @fileoverview 'settings-credit-card-edit-dialog' is the dialog that allows * editing or creating a credit card entry. */ (function() { 'use strict'; Polymer({ is: 'settings-credit-card-edit-dialog', properties: { /** * The credit card being edited. * @type {!chrome.autofillPrivate.CreditCardEntry} */ creditCard: Object, /** * The actual title that's used for this dialog. Will be context sensitive * based on if |creditCard| is being created or edited. * @private */ title_: String, /** * The list of months to show in the dropdown. * @private {!Array} */ monthList_: { type: Array, value: [ '01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12' ], }, /** * The list of years to show in the dropdown. * @private {!Array} */ yearList_: Array, /** @private */ expirationYear_: String, /** @private {string|undefined} */ expirationMonth_: String, }, behaviors: [ I18nBehavior, ], /** * @return {boolean} True iff the provided expiration date is passed. * @private */ checkIfCardExpired_: function(expirationMonth_, expirationYear_) { const now = new Date(); return ( expirationYear_ < now.getFullYear() || (expirationYear_ == now.getFullYear() && expirationMonth_ <= now.getMonth())); }, /** @override */ attached: function() { this.title_ = this.i18n( this.creditCard.guid ? 'editCreditCardTitle' : 'addCreditCardTitle'); // Needed to initialize the disabled state of the Save button. this.onCreditCardNameOrNumberChanged_(); // Add a leading '0' if a month is 1 char. if (this.creditCard.expirationMonth.length == 1) { this.creditCard.expirationMonth = '0' + this.creditCard.expirationMonth; } const date = new Date(); let firstYear = date.getFullYear(); let lastYear = firstYear + 19; // Show next 19 years (20 total). let selectedYear = parseInt(this.creditCard.expirationYear, 10); // |selectedYear| must be valid and between first and last years. if (!selectedYear) { selectedYear = firstYear; } else if (selectedYear < firstYear) { firstYear = selectedYear; } else if (selectedYear > lastYear) { lastYear = selectedYear; } const yearList = []; for (let i = firstYear; i <= lastYear; ++i) { yearList.push(i.toString()); } this.yearList_ = yearList; this.async(() => { this.expirationYear_ = selectedYear.toString(); this.expirationMonth_ = this.creditCard.expirationMonth; this.$.dialog.showModal(); }); }, /** Closes the dialog. */ close: function() { this.$.dialog.close(); }, /** * Handler for tapping the 'cancel' button. Should just dismiss the dialog. * @private */ onCancelButtonTap_: function() { this.$.dialog.cancel(); }, /** * Handler for tapping the save button. * @private */ onSaveButtonTap_: function() { if (!this.saveEnabled_()) { return; } // If the card is expired, reflect the error to the user. // Otherwise, update the card, save and close the dialog. if (!this.checkIfCardExpired_( this.expirationMonth_, this.expirationYear_)) { this.creditCard.expirationYear = this.expirationYear_; this.creditCard.expirationMonth = this.expirationMonth_; this.fire('save-credit-card', this.creditCard); this.close(); } }, /** @private */ onMonthChange_: function() { this.expirationMonth_ = this.monthList_[this.$.month.selectedIndex]; }, /** @private */ onYearChange_: function() { this.expirationYear_ = this.yearList_[this.$.year.selectedIndex]; }, /** @private */ onCreditCardNameOrNumberChanged_: function() { this.$.saveButton.disabled = !this.saveEnabled_(); }, /** @private */ saveEnabled_: function() { return (this.creditCard.name && this.creditCard.name.trim()) || (this.creditCard.cardNumber && this.creditCard.cardNumber.trim()); }, }); })();