Creating options page and storing preferences.

chrome/browser/resources/chromeos/switch_access/options.js

+// Copyright 2017 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.
+
+/**
+ * Alias for document.getElementById.
+ *
+ * @param  {string} id
+ * @return {Element}
+ */
+let $ = function(id) {
+  let el = document.getElementById(id);

[David Tseng, 2017/03/24 18:53:11]

nit: return document.getElementById(id);

[elichtenberg, 2017/03/25 00:02:19]

Done.

+  return el;
+};
+
+/**
+ * Class to manage the options page.
+ *
+ * @constructor
+ */
+let SwitchAccessOptions = function() {
+  let background = chrome.extension.getBackgroundPage();
+
+  /**
+   * True if the page has already been initialized, meaning that initial values
+   * of all pref elements have been set.
+   *
+   * @private {boolean}
+   */
+  this.inited_ = false;
+
+  /**
+   * User preferences.
+   *
+   * @private
+   */
+  this.switchAccessPrefs_ = background.switchAccess.switchAccessPrefs;
+
+  document.addEventListener('DOMContentLoaded', this.init_.bind(this));

[David Tseng, 2017/03/24 18:53:11]

Perhaps do this in the top level scope (see last comment in this file).

[elichtenberg, 2017/03/25 00:02:19]

Done.

+  document.addEventListener('change', this.handleInputChange_.bind(this));
+  background.document.addEventListener(
+      'prefsUpdate', this.handlePrefsUpdate_.bind(this));
+};
+
+SwitchAccessOptions.prototype = {
+  /**
+   * Initialize the options page by setting all elements representing a user
+   * preference to show the correct value.
+   *
+   * @private
+   */
+  init_: function() {
+    let prefs = this.switchAccessPrefs_.getPrefs();
+    $('enableAutoScan').checked = prefs['enableAutoScan'];
+    $('autoScanTime').value = prefs['autoScanTime'];
+    this.inited_ = true;
+  },
+
+  /**
+   * Handle a change by the user to an element representing a user preference.
+   *
+   * @param {!Event} event
+   * @private
+   */
+  handleInputChange_: function(event) {
+    switch (event.target.id) {
+      case 'enableAutoScan':
+        this.switchAccessPrefs_.setPref(event.target.id, event.target.checked);
+        break;
+      case 'autoScanTime':
+        this.switchAccessPrefs_.setPref(event.target.id, event.target.value);
+        break;
+    }
+  },
+
+  /**
+   * Handle a change in user preferences.
+   *
+   * @param {!Event} event
+   * @private
+   */
+  handlePrefsUpdate_: function(event) {
+    // Check that this.init_ has been called, since it sets values for all pref
+    // elements anyways.
+    if (!this.inited_)
+      return;
+
+    let updatedPrefs = event.detail;
+    for (let key of Object.keys(updatedPrefs)) {
+      switch (key) {
+        case 'enableAutoScan':
+          $(key).checked = updatedPrefs[key];
+          break;
+        case 'autoScanTime':
+          $(key).value = updatedPrefs[key];
+          break;
+      }
+    }
+  }
+};
+
+new SwitchAccessOptions();

[David Tseng, 2017/03/24 18:53:11]

Would it make sense to do this when the page content is loaded (so you could get
rid of init_, inited_, etc).

[elichtenberg, 2017/03/25 00:02:19]

Done.