chrome/browser/resources/options/autofill_options.js

   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 /**
   6  * @typedef {{
   7  *   creditCardNumber: string,
   8  *   expirationMonth: string,
   9  *   expirationYear: string,
  10  *   guid: string,
  11  *   nameOnCard: string
  12  * }}
  13  * @see chrome/browser/ui/webui/options/autofill_options_handler.cc
  14  */
  15 var CreditCardData;
  16
  17 cr.define('options', function() {
  18   var Page = cr.ui.pageManager.Page;
  19   var PageManager = cr.ui.pageManager.PageManager;
  20   var ArrayDataModel = cr.ui.ArrayDataModel;
  21
  22   /////////////////////////////////////////////////////////////////////////////
  23   // AutofillOptions class:
  24
  25   /**
  26    * Encapsulated handling of Autofill options page.
  27    * @constructor
  28    * @extends {cr.ui.pageManager.Page}
  29    */
  30   function AutofillOptions() {
  31     Page.call(this, 'autofill',
  32               loadTimeData.getString('autofillOptionsPageTabTitle'),
  33               'autofill-options');
  34   }
  35
  36   cr.addSingletonGetter(AutofillOptions);
  37
  38   AutofillOptions.prototype = {
  39     __proto__: Page.prototype,
  40
  41     /**
  42      * The address list.
  43      * @type {options.DeletableItemList}
  44      * @private
  45      */
  46     addressList_: null,
  47
  48     /**
  49      * The credit card list.
  50      * @type {options.DeletableItemList}
  51      * @private
  52      */
  53     creditCardList_: null,
  54
  55     /** @override */
  56     initializePage: function() {
  57       Page.prototype.initializePage.call(this);
  58
  59       this.createAddressList_();
  60       this.createCreditCardList_();
  61
  62       var self = this;
  63       $('autofill-add-address').onclick = function(event) {
  64         self.showAddAddressOverlay_();
  65       };
  66       $('autofill-add-creditcard').onclick = function(event) {
  67         self.showAddCreditCardOverlay_();
  68       };
  69       $('autofill-options-confirm').onclick = function(event) {
  70         PageManager.closeOverlay();
  71       };
  72 <if expr="is_macosx">
  73       $('autofill-use-mac-address-book-checkbox').onchange = function(event) {
  74         if (this.checked) {
  75           setTimeout(function() {
  76             // Prompt the user to give Chrome access to the user's Address
  77             // Book, if the user was not previously prompted. The dialog that
  78             // appears blocks the Chrome process, so wait for a small period of
  79             // time to allow the checkbox to appear filled in.
  80             chrome.send('accessAddressBook');
  81           }, 10);
  82         }
  83       };
  84 </if>
  85
  86       $('autofill-help').onclick = function(event) {
  87         chrome.send('coreOptionsUserMetricsAction',
  88                     ['Options_AutofillShowAbout']);
  89         return true;  // Always follow the href
  90       };
  91
  92       this.walletIntegrationAvailableStateChanged_(
  93           loadTimeData.getBoolean('autofillWalletIntegrationAvailable'));
  94
  95       // TODO(jhawkins): What happens when Autofill is disabled whilst on the
  96       // Autofill options page?
  97     },
  98
  99     /**
 100      * Creates, decorates and initializes the address list.
 101      * @private
 102      */
 103     createAddressList_: function() {
 104       var addressList = $('address-list');
 105       options.autofillOptions.AutofillAddressList.decorate(addressList);
 106       this.addressList_ = assertInstanceof(addressList,
 107                                            options.DeletableItemList);
 108       this.addressList_.autoExpands = true;
 109     },
 110
 111     /**
 112      * Creates, decorates and initializes the credit card list.
 113      * @private
 114      */
 115     createCreditCardList_: function() {
 116       var creditCardList = $('creditcard-list');
 117       options.autofillOptions.AutofillCreditCardList.decorate(creditCardList);
 118       this.creditCardList_ = assertInstanceof(creditCardList,
 119                                               options.DeletableItemList);
 120       this.creditCardList_.autoExpands = true;
 121     },
 122
 123     /**
 124      * Shows the 'Add address' overlay, specifically by loading the
 125      * 'Edit address' overlay and modifying the overlay title.
 126      * @private
 127      */
 128     showAddAddressOverlay_: function() {
 129       var title = loadTimeData.getString('addAddressTitle');
 130       AutofillEditAddressOverlay.setTitle(title);
 131       PageManager.showPageByName('autofillEditAddress');
 132       AutofillEditAddressOverlay.prepForNewAddress();
 133     },
 134
 135     /**
 136      * Shows the 'Add credit card' overlay, specifically by loading the
 137      * 'Edit credit card' overlay and modifying the overlay title.
 138      * @private
 139      */
 140     showAddCreditCardOverlay_: function() {
 141       var title = loadTimeData.getString('addCreditCardTitle');
 142       AutofillEditCreditCardOverlay.setTitle(title);
 143       PageManager.showPageByName('autofillEditCreditCard');
 144       AutofillEditCreditCardOverlay.prepForNewCard();
 145     },
 146
 147     /**
 148      * Updates the data model for the address list with the values from
 149      * |entries|.
 150      * @param {!Array} entries The list of addresses.
 151      */
 152     setAddressList_: function(entries) {
 153       this.addressList_.dataModel = new ArrayDataModel(entries);
 154     },
 155
 156     /**
 157      * Updates the data model for the credit card list with the values from
 158      * |entries|.
 159      * @param {!Array} entries The list of credit cards.
 160      */
 161     setCreditCardList_: function(entries) {
 162       this.creditCardList_.dataModel = new ArrayDataModel(entries);
 163     },
 164
 165     /**
 166      * Removes the Autofill address or credit card represented by |guid|.
 167      * @param {string} guid The GUID of the address to remove.
 168      * @param {string=} metricsAction The name of the action to log for metrics.
 169      * @private
 170      */
 171     removeData_: function(guid, metricsAction) {
 172       chrome.send('removeData', [guid]);
 173       if (metricsAction)
 174         chrome.send('coreOptionsUserMetricsAction', [metricsAction]);
 175     },
 176
 177     /**
 178      * Shows the 'Edit address' overlay, using the data in |address| to fill the
 179      * input fields. |address| is a list with one item, an associative array
 180      * that contains the address data.
 181      * @private
 182      */
 183     showEditAddressOverlay_: function(address) {
 184       var title = loadTimeData.getString('editAddressTitle');
 185       AutofillEditAddressOverlay.setTitle(title);
 186       AutofillEditAddressOverlay.loadAddress(address);
 187       PageManager.showPageByName('autofillEditAddress');
 188     },
 189
 190     /**
 191      * Shows the 'Edit credit card' overlay, using the data in |credit_card| to
 192      * fill the input fields. |creditCard| is a list with one item, an
 193      * associative array that contains the credit card data.
 194      * @param {CreditCardData} creditCard
 195      * @private
 196      */
 197     showEditCreditCardOverlay_: function(creditCard) {
 198       var title = loadTimeData.getString('editCreditCardTitle');
 199       AutofillEditCreditCardOverlay.setTitle(title);
 200       AutofillEditCreditCardOverlay.loadCreditCard(creditCard);
 201       PageManager.showPageByName('autofillEditCreditCard');
 202     },
 203
 204     /**
 205      * Toggles the visibility of the Wallet integration checkbox.
 206      * @param {boolean} available Whether the user has the option of using
 207      *     Wallet data.
 208      * @private
 209      */
 210     walletIntegrationAvailableStateChanged_: function(available) {
 211       $('autofill-wallet-setting-area').hidden = !available;
 212     },
 213   };
 214
 215   AutofillOptions.setAddressList = function(entries) {
 216     AutofillOptions.getInstance().setAddressList_(entries);
 217   };
 218
 219   AutofillOptions.setCreditCardList = function(entries) {
 220     AutofillOptions.getInstance().setCreditCardList_(entries);
 221   };
 222
 223   AutofillOptions.removeData = function(guid, metricsAction) {
 224     AutofillOptions.getInstance().removeData_(guid, metricsAction);
 225   };
 226
 227   AutofillOptions.editAddress = function(address) {
 228     AutofillOptions.getInstance().showEditAddressOverlay_(address);
 229   };
 230
 231   AutofillOptions.walletIntegrationAvailableStateChanged = function(available) {
 232     AutofillOptions.getInstance().
 233         walletIntegrationAvailableStateChanged_(available);
 234   };
 235
 236   /**
 237    * @param {CreditCardData} creditCard
 238    */
 239   AutofillOptions.editCreditCard = function(creditCard) {
 240     AutofillOptions.getInstance().showEditCreditCardOverlay_(creditCard);
 241   };
 242
 243   // Export
 244   return {
 245     AutofillOptions: AutofillOptions
 246   };
 247
 248 });
 249