Add display of available bluetooth devices, and mechanism for retrieving the list.

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

 // Copyright (c) 2011 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.
 
 cr.define('options', function() {
 
   var OptionsPage = options.OptionsPage;
   /////////////////////////////////////////////////////////////////////////////
   // SystemOptions class:
 
@@ skipping 23 matching lines @@
       // Disable time-related settings if we're not logged in as a real user.
       if (AccountsOptions.loggedInAsGuest()) {
         var timezone = $('timezone-select');
         if (timezone)
           timezone.disabled = true;
         var use_24hour_clock = $('use-24hour-clock');
         if (use_24hour_clock)
           use_24hour_clock.disabled = true;
       }
 
+      options.system.bluetooth.BluetoothListElement.decorate(
+          $('bluetooth-device-list'));
+
       // TODO (kevers) - Populate list of connected bluetooth devices.
       //                 Set state of 'Enable bluetooth' checkbox.
-      //                 Set state of 'Find devices' button.
+
+      $('bluetooth-find-devices').disabled =
+          $('enable-bluetooth-label') ? false : true;
+      $('bluetooth-find-devices').onclick = function(event) {
+        findBluetoothDevices_();
+      };
 
       $('language-button').onclick = function(event) {
         OptionsPage.navigateToPage('language');
       };
       $('modifier-keys-button').onclick = function(event) {
         OptionsPage.navigateToPage('languageCustomizeModifierKeysOverlay');
       };
       $('accesibility-check').onchange = function(event) {
         chrome.send('accessibilityChange',
                     [String($('accesibility-check').checked)]);
@@ skipping 12 matching lines @@
     $('accesibility-check').checked = checked;
   };
 
   /**
    * Activate the bluetooth settings section on the System settings page.
    */
   SystemOptions.ShowBluetoothSettings = function() {
     $('bluetooth-devices').hidden = false;
   }
 
+  /**
+   * Adds an element to the list of available bluetooth devices.
+   * @param{{'deviceName': string,
+   *         'deviceId': string,
+   *         'deviceType': Constants.DEVICE_TYPE,
+   *         'deviceStatus': Constants.DEVICE_STATUS} device
+   *     Decription of the bluetooth device.
+   */
+  SystemOptions.AddBluetoothDevice = function(device) {

[James Hawkins, 2011/10/06 17:20:45]

Public methods should be at the bottom.

[James Hawkins, 2011/10/06 17:20:45]

s/Add/add/

[kevers, 2011/10/06 20:24:41]

Done.

[kevers, 2011/10/06 20:24:41]

Done.

+    $('bluetooth-device-list').appendDevice(device);
+  }
+
+  /**
+   * Hides the scanning label and icon that are used to indicate that a device
+   * search is in progress.
+   */
+  SystemOptions.NotifyBluetoothSearchComplete = function() {

[James Hawkins, 2011/10/06 17:20:45]

s/Notify/notify/

[kevers, 2011/10/06 20:24:41]

Done.

+    // TDOO (kevers) - Reset state immediately once results are received
+    //                 asynchronously.
+    setTimeout(function() {
+      setVisibility_('bluetooth-scanning-label', false);
+      setVisibility_('bluetooth-scanning-icon', false);
+    }, 2000);
+  }
+
+  /**
+   * Scan for bluetooth devices.
+   * @private
+   */
+  function findBluetoothDevices_() {
+    setVisibility_('bluetooth-scanning-label', true);
+    setVisibility_('bluetooth-scanning-icon', true);
+
+    // Remove devices that are not currently connected.
+    var devices = $('bluetooth-device-list').childNodes;
+    for (var i = devices.length - 1; i >= 0; i--) {
+      var device = devices.item(i);
+      var data = device.data;
+      if (!data || data.status !== 'connected')
+        $('bluetooth-device-list').removeChild(device);
+    }
+    // TODO (kevers) - Set arguments to a list of the currently connected
+    //                 devices.
+    chrome.send('findBluetoothDevices');
+  }
+
+  /**
+   * Sets the visibility of an element.
+   * @param {string} id The id of the element.
+   * @param {boolean} visible True if the element should be made visible.
+   * @private
+   */
+  function setVisibility_(id, visible) {
+    var el = $(id);
+    if (el.hidden != visible) {
+      if (visible)
+        el.classList.remove("transparent");
+      return;
+    }
+    if (visible) {
+      el.hidden = false;
+      setTimeout(function() {
+        el.classList.remove('transparent');
+      });
+    } else {
+      el.addEventListener('webkitTransitionEnd', function f(e) {
+        if (e.propertyName != 'opacity')
+          return;
+        el.removeEventListener('webkitTransitionEnd', f);

[James Hawkins, 2011/10/06 17:20:45]

Can't this all be done in CSS?

[kevers, 2011/10/06 20:24:41]

Can animate opacity but not the 'hidden' attribute.  In a previous review, I was
asked to use hidden to show/hide the content.  In this case, the logic could be
simplified by dropping the hidden attribute and relying solely on the addition
and removable the 'transparent' class.  

+        fadeCompleted_(el);
+      });
+      el.classList.add('transparent');
+    }
+  }
+
+  /**
+   * Called when the opacity animation finishes on an element.
+   * @param {!Element} el The target element.
+   * @private
+   */
+  function fadeCompleted_(el) {
+    if (el.classList.contains('transparent'))
+      el.hidden = true;
+  }
+
   // Export
   return {
     SystemOptions: SystemOptions
   };
 
 });