import_data_overlay.js revision 21d179b334e59e9a3bfcaed4c4430bef1bc5759d
1// Copyright (c) 2010 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
5cr.define('options', function() {
6
7  var OptionsPage = options.OptionsPage;
8
9  /**
10   * ImportDataOverlay class
11   * Encapsulated handling of the 'Import Data' overlay page.
12   * @class
13   */
14  function ImportDataOverlay() {
15    OptionsPage.call(this,
16                     'importDataOverlay',
17                     templateData.import_data_title,
18                     'import-data-overlay');
19  }
20
21  ImportDataOverlay.throbIntervalId = 0;
22
23  cr.addSingletonGetter(ImportDataOverlay);
24
25  ImportDataOverlay.prototype = {
26    // Inherit from OptionsPage.
27    __proto__: OptionsPage.prototype,
28
29    /**
30     * Initialize the page.
31     */
32    initializePage: function() {
33      // Call base class implementation to start preference initialization.
34      OptionsPage.prototype.initializePage.call(this);
35
36      var self = this;
37      var checkboxes =
38          document.querySelectorAll('#import-checkboxes input[type=checkbox]');
39      for (var i = 0; i < checkboxes.length; i++) {
40        checkboxes[i].onchange = function() {
41          self.validateCommitButton_();
42        };
43      }
44
45      $('import-browsers').onchange = function() {
46        self.updateCheckboxes_();
47        self.validateCommitButton_();
48      };
49
50      $('import-data-commit').onclick = function() {
51        chrome.send('importData', [
52            String($('import-browsers').selectedIndex),
53            String($('import-history').checked),
54            String($('import-favorites').checked),
55            String($('import-passwords').checked),
56            String($('import-search').checked)]);
57      };
58
59      $('import-data-cancel').onclick = function() {
60        ImportDataOverlay.dismiss();
61      };
62
63      // Form controls are disabled until the profile list has been loaded.
64      self.setControlsSensitive_(false);
65    },
66
67    /**
68     * Set enabled and checked state of the commit button.
69     * @private
70     */
71    validateCommitButton_: function() {
72      var somethingToImport =
73          $('import-history').checked || $('import-favorites').checked ||
74          $('import-passwords').checked || $('import-search').checked;
75      $('import-data-commit').disabled = !somethingToImport;
76    },
77
78    /**
79     * Sets the sensitivity of all the checkboxes and the commit button.
80     * @private
81     */
82    setControlsSensitive_: function(sensitive) {
83      var checkboxes =
84          document.querySelectorAll('#import-checkboxes input[type=checkbox]');
85      for (var i = 0; i < checkboxes.length; i++)
86        this.setUpCheckboxState_(checkboxes[i], sensitive);
87      $('import-data-commit').disabled = !sensitive;
88    },
89
90    /**
91     * Set enabled and checked states a checkbox element.
92     * @param {Object} checkbox A checkbox element.
93     * @param {boolean} enabled The enabled state of the chekbox.
94     * @private
95     */
96    setUpCheckboxState_: function(checkbox, enabled) {
97      checkbox.disabled = !enabled;
98      checkbox.checked = enabled;
99    },
100
101    /**
102     * Update the enabled and checked states of all checkboxes.
103     * @private
104     */
105    updateCheckboxes_: function() {
106      var index = $('import-browsers').selectedIndex;
107      var browserProfile = ImportDataOverlay.browserProfiles[index];
108      var importOptions = ['history', 'favorites', 'passwords', 'search'];
109      for (var i = 0; i < importOptions.length; i++) {
110        var checkbox = $('import-' + importOptions[i]);
111        this.setUpCheckboxState_(checkbox, browserProfile[importOptions[i]]);
112      }
113    },
114
115    /**
116     * Update the supported browsers popup with given entries.
117     * @param {array} browsers List of supported browsers name.
118     * @private
119     */
120    updateSupportedBrowsers_: function(browsers) {
121      ImportDataOverlay.browserProfiles = browsers;
122      var browserSelect = $('import-browsers');
123      browserSelect.remove(0);  // Remove the 'Loading...' option.
124      browserSelect.textContent = '';
125      var browserCount = browsers.length;
126
127      if (browserCount == 0) {
128        var option = new Option(templateData.noProfileFound, 0);
129        browserSelect.appendChild(option);
130
131        this.setControlsSensitive_(false);
132      } else {
133        this.setControlsSensitive_(true);
134        for (var i = 0; i < browserCount; i++) {
135          var browser = browsers[i]
136          var option = new Option(browser['name'], browser['index']);
137          browserSelect.appendChild(option);
138        }
139
140        this.updateCheckboxes_();
141        this.validateCommitButton_();
142      }
143    },
144  };
145
146  /**
147   * Update the supported browsers popup with given entries.
148   * @param {array} list of supported browsers name.
149   */
150  ImportDataOverlay.updateSupportedBrowsers = function(browsers) {
151    ImportDataOverlay.getInstance().updateSupportedBrowsers_(browsers);
152  };
153
154  /**
155   * Update the UI to reflect whether an import operation is in progress.
156   * @param {boolean} state True if an import operation is in progress.
157   */
158  ImportDataOverlay.setImportingState = function(state) {
159    if (state) {
160      var checkboxes =
161          document.querySelectorAll('#import-checkboxes input[type=checkbox]');
162      for (var i = 0; i < checkboxes.length; i++) {
163        checkboxes[i].disabled = true;
164      }
165    } else {
166      ImportDataOverlay.getInstance().updateCheckboxes_();
167    }
168    $('import-browsers').disabled = state;
169    $('import-data-commit').disabled = state;
170    $('import-throbber').style.visibility = state ? "visible" : "hidden";
171
172    function advanceThrobber() {
173      var throbber = $('import-throbber');
174      throbber.style.backgroundPositionX =
175          ((parseInt(getComputedStyle(throbber).backgroundPositionX, 10) - 16)
176          % 576) + 'px';
177    }
178    if (state) {
179      ImportDataOverlay.throbIntervalId = setInterval(advanceThrobber, 30);
180    } else {
181      clearInterval(ImportDataOverlay.throbIntervalId);
182    }
183  };
184
185  /**
186   * Remove the import overlay from display.
187   */
188  ImportDataOverlay.dismiss = function() {
189    ImportDataOverlay.setImportingState(false);
190    OptionsPage.clearOverlays();
191  }
192
193  // Export
194  return {
195    ImportDataOverlay: ImportDataOverlay
196  };
197
198});
199