Fixed gear menu navigation using keyboard.

chrome/browser/resources/file_manager/js/file_manager.js

Index: chrome/browser/resources/file_manager/js/file_manager.js
diff --git a/chrome/browser/resources/file_manager/js/file_manager.js b/chrome/browser/resources/file_manager/js/file_manager.js
index 4d735c5fd8d42ee67e6ccf7ca3d5ab1851c69e17..e8cfea70467c9ce719cb78e3566e6e997c2cf4e4 100644
--- a/chrome/browser/resources/file_manager/js/file_manager.js
+++ b/chrome/browser/resources/file_manager/js/file_manager.js
@@ -63,6 +63,7 @@ function FileManager(dialogDom) {
        DialogType.FULL_PAGE]);
 
   this.selectionHandler_ = null;
+  this.ctrlKeyPressed_ = false;
 
   this.metadataCache_ = MetadataCache.createFull();
   this.volumeManager_ = VolumeManager.getInstance();
@@ -547,6 +548,9 @@ DialogType.isModal = function(type) {
                                          false /* Without loading caption. */));
     cr.ui.decorate(this.gearButton_, cr.ui.MenuButton);
 
+    this.dialogDom_.querySelector('#gear-menu').menuItemSelector =
+      'menuitem, hr';
+
     this.syncButton.checkable = true;
     this.hostedButton.checkable = true;
   };
@@ -1618,6 +1622,13 @@ DialogType.isModal = function(type) {
   };
 
   /**
+   * @return {boolean} True if the ctrl key is pressed now.
+   */
+  FileManager.prototype.isCtrlKeyPressed = function() {
+    return this.ctrlKeyPressed_;
+  };
+
+  /**
    * @return {boolean} True if the "Available offline" column should be shown in
    *     the table layout.
    */
@@ -2036,6 +2047,8 @@ DialogType.isModal = function(type) {
   FileManager.prototype.updateGearMenu_ = function() {
     this.syncButton.hidden = !this.isOnDrive();
     this.hostedButton.hidden = !this.isOnDrive();
+    this.document_.getElementById('drive-separator').hidden =
+      !this.isOnDrive();
 
     // If volume has changed, then fetch remaining space data.
     if (this.previousRootUrl_ != this.directoryModel_.getCurrentRootUrl())
@@ -2516,7 +2529,7 @@ DialogType.isModal = function(type) {
 
     switch (util.getKeyModifiers(event) + event.keyCode) {
       case 'Ctrl-17':  // Ctrl => Show hidden setting
-        this.dialogDom_.setAttribute('ctrl-pressing', 'true');
+        this.setCtrlKeyPressed_(true);
         return;
 
       case 'Ctrl-190':  // Ctrl-. => Toggle filter files.
@@ -2561,7 +2574,7 @@ DialogType.isModal = function(type) {
 
     switch (util.getKeyModifiers(event) + event.keyCode) {
       case '17':  // Ctrl => Hide hidden setting
-        this.dialogDom_.removeAttribute('ctrl-pressing');
+        this.setCtrlKeyPressed_(false);
         return;
     }
   };
@@ -3409,4 +3422,15 @@ DialogType.isModal = function(type) {
       callback(prefs);
     }.bind(this));
   };
+
+  /**
+   * Set the flag expressing whether the ctrl key is pressed or not.
+   * @param {boolean} flag New value of the flag
+   * @private
+   */
+  FileManager.prototype.setCtrlKeyPressed_ = function(flag) {
+    this.ctrlKeyPressed_ = flag;

[mtomasz, 2013/04/09 05:44:58]

Can we use querySelector instead for consistency?

[hirono, 2013/04/09 06:01:04]

I think getElementById is a little faster than querySelector.
Is this reasonable excuse to use getElementById?
(or is consistency more important here?)

On 2013/04/09 05:44:58, mtomasz wrote:

[mtomasz, 2013/04/09 06:11:39]

It is faster (http://jsperf.com/queryselector-vs-getdocumentbyid), but it is
still microseconds so doesn't matter here. I would go for consistency.

[hirono, 2013/04/09 06:43:13]

Done.

+    this.document_.getElementById('drive-clear-local-cache').canExecuteChange();
+    this.document_.getElementById('drive-reload').canExecuteChange();
+  };
 })();