chrome/browser/resources/options/import_data_overlay.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 cr.define('options', function() {
   6   var OptionsPage = options.OptionsPage;
   7
   8   /**
   9    * ImportDataOverlay class
  10    * Encapsulated handling of the 'Import Data' overlay page.
  11    * @class
  12    */
  13   function ImportDataOverlay() {
  14     OptionsPage.call(this,
  15                      'importData',
  16                      loadTimeData.getString('importDataOverlayTabTitle'),
  17                      'import-data-overlay');
  18   }
  19
  20   cr.addSingletonGetter(ImportDataOverlay);
  21
  22   ImportDataOverlay.prototype = {
  23     // Inherit from OptionsPage.
  24     __proto__: OptionsPage.prototype,
  25
  26     /**
  27      * Initialize the page.
  28      */
  29     initializePage: function() {
  30       // Call base class implementation to start preference initialization.
  31       OptionsPage.prototype.initializePage.call(this);
  32
  33       var self = this;
  34       var checkboxes =
  35           document.querySelectorAll('#import-checkboxes input[type=checkbox]');
  36       for (var i = 0; i < checkboxes.length; i++) {
  37         checkboxes[i].onchange = function() {
  38           self.validateCommitButton_();
  39         };
  40       }
  41
  42       $('import-browsers').onchange = function() {
  43         self.updateCheckboxes_();
  44         self.validateCommitButton_();
  45         self.updateBottomBar_();
  46       };
  47
  48       $('import-data-commit').onclick = function() {
  49         chrome.send('importData', [
  50             String($('import-browsers').selectedIndex),
  51             String($('import-history').checked),
  52             String($('import-favorites').checked),
  53             String($('import-passwords').checked),
  54             String($('import-search').checked)]);
  55       };
  56
  57       $('import-data-cancel').onclick = function() {
  58         ImportDataOverlay.dismiss();
  59       };
  60
  61       $('import-choose-file').onclick = function() {
  62         chrome.send('chooseBookmarksFile');
  63       };
  64
  65       $('import-data-show-bookmarks-bar').onchange = function() {
  66         // Note: The callback 'toggleShowBookmarksBar' is handled within the
  67         // browser options handler -- rather than the import data handler --
  68         // as the implementation is shared by several clients.
  69         chrome.send('toggleShowBookmarksBar');
  70       }
  71
  72       $('import-data-confirm').onclick = function() {
  73         ImportDataOverlay.dismiss();
  74       };
  75
  76       // Form controls are disabled until the profile list has been loaded.
  77       self.setAllControlsEnabled_(false);
  78     },
  79
  80     /**
  81      * Sets the enabled and checked state of the commit button.
  82      * @private
  83      */
  84     validateCommitButton_: function() {
  85       var somethingToImport =
  86           $('import-history').checked || $('import-favorites').checked ||
  87           $('import-passwords').checked || $('import-search').checked;
  88       $('import-data-commit').disabled = !somethingToImport;
  89       $('import-choose-file').disabled = !$('import-favorites').checked;
  90     },
  91
  92     /**
  93      * Sets the enabled state of all the checkboxes and the commit button.
  94      * @private
  95      */
  96     setAllControlsEnabled_: function(enabled) {
  97       var checkboxes =
  98           document.querySelectorAll('#import-checkboxes input[type=checkbox]');
  99       for (var i = 0; i < checkboxes.length; i++)
 100         this.setUpCheckboxState_(checkboxes[i], enabled);
 101       $('import-data-commit').disabled = !enabled;
 102       $('import-choose-file').hidden = !enabled;
 103       $('mac-password-keychain').hidden = !enabled;
 104     },
 105
 106     /**
 107      * Sets the enabled state of a checkbox element.
 108      * @param {Object} checkbox A checkbox element.
 109      * @param {boolean} enabled The enabled state of the checkbox. If false,
 110      *     the checkbox is disabled. If true, the checkbox is enabled.
 111      * @private
 112      */
 113     setUpCheckboxState_: function(checkbox, enabled) {
 114       checkbox.setDisabled('noProfileData', !enabled);
 115     },
 116
 117     /**
 118      * Update the enabled and visible states of all the checkboxes.
 119      * @private
 120      */
 121     updateCheckboxes_: function() {
 122       var index = $('import-browsers').selectedIndex;
 123       var bookmarksFileSelected = index == this.browserProfiles.length - 1;
 124       $('import-choose-file').hidden = !bookmarksFileSelected;
 125       $('import-data-commit').hidden = bookmarksFileSelected;
 126
 127       var browserProfile;
 128       if (this.browserProfiles.length > index)
 129         browserProfile = this.browserProfiles[index];
 130       var importOptions = ['history', 'favorites', 'passwords', 'search'];
 131       for (var i = 0; i < importOptions.length; i++) {
 132         var checkbox = $('import-' + importOptions[i]);
 133         var enable = browserProfile && browserProfile[importOptions[i]];
 134         this.setUpCheckboxState_(checkbox, enable);
 135         var checkboxWithLabel = $('import-' + importOptions[i] + '-with-label');
 136         checkboxWithLabel.style.display = enable ? '' : 'none';
 137       }
 138     },
 139
 140     /**
 141      * Show or hide gray message at the bottom.
 142      * @private
 143      */
 144     updateBottomBar_: function() {
 145       var index = $('import-browsers').selectedIndex;
 146       var browserProfile;
 147       if (this.browserProfiles.length > index)
 148         browserProfile = this.browserProfiles[index];
 149       var enable = browserProfile && browserProfile['show_bottom_bar'];
 150       $('mac-password-keychain').hidden = !enable;
 151     },
 152
 153     /**
 154      * Update the supported browsers popup with given entries.
 155      * @param {array} browsers List of supported browsers name.
 156      * @private
 157      */
 158     updateSupportedBrowsers_: function(browsers) {
 159       this.browserProfiles = browsers;
 160       var browserSelect = $('import-browsers');
 161       browserSelect.remove(0);  // Remove the 'Loading...' option.
 162       browserSelect.textContent = '';
 163       var browserCount = browsers.length;
 164
 165       if (browserCount == 0) {
 166         var option = new Option(loadTimeData.getString('noProfileFound'), 0);
 167         browserSelect.appendChild(option);
 168
 169         this.setAllControlsEnabled_(false);
 170       } else {
 171         this.setAllControlsEnabled_(true);
 172         for (var i = 0; i < browserCount; i++) {
 173           var browser = browsers[i];
 174           var option = new Option(browser.name, browser.index);
 175           browserSelect.appendChild(option);
 176         }
 177
 178         this.updateCheckboxes_();
 179         this.validateCommitButton_();
 180         this.updateBottomBar_();
 181       }
 182     },
 183
 184     /**
 185      * Clear import prefs set when user checks/unchecks a checkbox so that each
 186      * checkbox goes back to the default "checked" state (or alternatively, to
 187      * the state set by a recommended policy).
 188      * @private
 189      */
 190     clearUserPrefs_: function() {
 191       var importPrefs = ['import_history',
 192                          'import_bookmarks',
 193                          'import_saved_passwords',
 194                          'import_search_engine'];
 195       for (var i = 0; i < importPrefs.length; i++)
 196         Preferences.clearPref(importPrefs[i], true);
 197     },
 198
 199     /**
 200      * Update the dialog layout to reflect success state.
 201      * @param {boolean} success If true, show success dialog elements.
 202      * @private
 203      */
 204     updateSuccessState_: function(success) {
 205       var sections = document.querySelectorAll('.import-data-configure');
 206       for (var i = 0; i < sections.length; i++)
 207         sections[i].hidden = success;
 208
 209       sections = document.querySelectorAll('.import-data-success');
 210       for (var i = 0; i < sections.length; i++)
 211         sections[i].hidden = !success;
 212     },
 213   };
 214
 215   ImportDataOverlay.clearUserPrefs = function() {
 216     ImportDataOverlay.getInstance().clearUserPrefs_();
 217   };
 218
 219   /**
 220    * Update the supported browsers popup with given entries.
 221    * @param {array} list of supported browsers name.
 222    */
 223   ImportDataOverlay.updateSupportedBrowsers = function(browsers) {
 224     ImportDataOverlay.getInstance().updateSupportedBrowsers_(browsers);
 225   };
 226
 227   /**
 228    * Update the UI to reflect whether an import operation is in progress.
 229    * @param {boolean} importing True if an import operation is in progress.
 230    */
 231   ImportDataOverlay.setImportingState = function(importing) {
 232     var checkboxes =
 233         document.querySelectorAll('#import-checkboxes input[type=checkbox]');
 234     for (var i = 0; i < checkboxes.length; i++)
 235         checkboxes[i].setDisabled('Importing', importing);
 236     if (!importing)
 237       ImportDataOverlay.getInstance().updateCheckboxes_();
 238     $('import-browsers').disabled = importing;
 239     $('import-throbber').style.visibility = importing ? 'visible' : 'hidden';
 240     ImportDataOverlay.getInstance().validateCommitButton_();
 241   };
 242
 243   /**
 244    * Remove the import overlay from display.
 245    */
 246   ImportDataOverlay.dismiss = function() {
 247     ImportDataOverlay.clearUserPrefs();
 248     OptionsPage.closeOverlay();
 249   };
 250
 251   /**
 252    * Show a message confirming the success of the import operation.
 253    */
 254   ImportDataOverlay.confirmSuccess = function() {
 255     var showBookmarksMessage = $('import-favorites').checked;
 256     ImportDataOverlay.setImportingState(false);
 257     $('import-find-your-bookmarks').hidden = !showBookmarksMessage;
 258     ImportDataOverlay.getInstance().updateSuccessState_(true);
 259   };
 260
 261   /**
 262    * Show the import data overlay.
 263    */
 264   ImportDataOverlay.show = function() {
 265     // Make sure that any previous import success message is hidden, and
 266     // we're showing the UI to import further data.
 267     ImportDataOverlay.getInstance().updateSuccessState_(false);
 268     ImportDataOverlay.getInstance().validateCommitButton_();
 269
 270     OptionsPage.navigateToPage('importData');
 271   };
 272
 273   // Export
 274   return {
 275     ImportDataOverlay: ImportDataOverlay
 276   };
 277 });