Give focus to the Save button.

With this change, users can just press the enter key to save a file.

Along the way, get rid of half-baked <div> based button implementations
(no tab key navigation, no click animation).
We use <button> everywhere else. Using <div> for buttons here doesn't make
sense.

BUG=chromium-os:9193
TEST=confirmed that the focus was given to the Save button.

Review URL: http://codereview.chromium.org/6058002

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@69815 0039d316-1c4b-4281-b951-d872f2087c98

1 files changed, 19 insertions, 31 deletions

diff --git a/chrome/browser/resources/filebrowse.html b/chrome/browser/resources/filebrowse.html
index 614dc9a..f6a5050 100644
--- a/chrome/browser/resources/filebrowse.html
+++ b/chrome/browser/resources/filebrowse.html
@@ -406,21 +406,6 @@ div.scanningcontainer {
   height: 100%;
 }
 
-div.filebutton {
-  height: 18px;
-  cursor: pointer;
-  padding: 5px 15px 2px;
-  border: 1px solid #abb6ce;
-  background-image: -webkit-gradient(linear,
-                                     left top,
-                                     left bottom,
-                                     color-stop(0.80, #fcfcfc),
-                                     color-stop(0.97, #e3e3e3));
-  border-radius: 3px;
-  text-align: center;
-  font-size: .8em;
-}
-
 .filenameprompt {
   top: 8px;
   left: 13px;
@@ -705,15 +690,15 @@ function enabledResult(info) {
         buttonsContainer.className = 'buttonscontainer';
         savemenu.appendChild(buttonsContainer);
 
-        var savebutton = document.createElement('div');
+        var savebutton = document.createElement('button');
         savebutton.id = 'savebutton';
-        savebutton.className = 'filebutton openbutton disabled';
+        savebutton.className = 'openbutton disabled';
         savebutton.onclick = dialogSaveClick;
         savebutton.textContent = localStrings.getString('save');
         buttonsContainer.appendChild(savebutton);
 
-        var cancelbutton = document.createElement('div');
-        cancelbutton.className = 'filebutton cancelbutton';
+        var cancelbutton = document.createElement('button');
+        cancelbutton.className = 'cancelbutton';
         buttonsContainer.appendChild(cancelbutton);
         cancelbutton.textContent = localStrings.getString('confirmcancel');
         cancelbutton.onclick = dialogCancelClick;
@@ -734,25 +719,28 @@ function enabledResult(info) {
         filename.value = args.current_file;
         savemenu.appendChild(filename);
         if (advancedEnabled) {
-          var newfolderbutton = document.createElement('div');
+          var newfolderbutton = document.createElement('button');
           newfolderbutton.id = 'newfolderbutton';
-          newfolderbutton.className = 'filebutton newfolderbutton disabled';
+          newfolderbutton.className = 'newfolderbutton disabled';
           newfolderbutton.textContent = localStrings.getString('newfolder');
           newfolderbutton.onclick = dialogNewFolderClick;
           savemenu.appendChild(newfolderbutton);
         }
         document.body.appendChild(savemenu);
+        // Give focus to the save button. This has to be done after the
+        // parent node is added to document.body.
+        savebutton.focus();
 
       } else {
         var main = mainColumn;
         main.className = 'containerwithopenbuttons';
         var openmenu = document.createElement('div');
         openmenu.className = 'opencontainer';
-        var openbutton = document.createElement('div');
+        var openbutton = document.createElement('button');
         openbutton.id = 'openbutton';
-        openbutton.className = 'filebutton openbutton disabled';
-        var cancelbutton = document.createElement('div');
-        cancelbutton.className = 'filebutton cancelbutton';
+        openbutton.className = 'openbutton disabled';
+        var cancelbutton = document.createElement('button');
+        cancelbutton.className = 'cancelbutton';
         openmenu.appendChild(openbutton);
         openbutton.onclick = dialogOkClick;
         openmenu.appendChild(cancelbutton);
@@ -950,26 +938,26 @@ function getDataForPath(path) {
     if (inSaveMode) {
       if (advancedEnabled) {
         var newfolderbutton = $('newfolderbutton');
-        newfolderbutton.className = 'filebutton newfolderbutton disabled';
+        newfolderbutton.className = 'newfolderbutton disabled';
       }
       var savebutton = $('savebutton');
-      savebutton.className = 'filebutton openbutton disabled';
+      savebutton.className = 'openbutton disabled';
     } else if (inSelectMode) {
       var openbutton = $('openbutton');
-      openbutton.className = 'filebutton openbutton disabled';
+      openbutton.className = 'openbutton disabled';
     }
     chrome.send('getRoots', []);
   } else {
     if (inSaveMode) {
       if (advancedEnabled) {
         var newfolderbutton = $('newfolderbutton');
-        newfolderbutton.className = 'filebutton newfolderbutton';
+        newfolderbutton.className = 'newfolderbutton';
       }
       var savebutton = $('savebutton');
-      savebutton.className = 'filebutton openbutton';
+      savebutton.className = 'openbutton';
     } else if (inSelectMode) {
       var openbutton = $('openbutton');
-      openbutton.className = 'filebutton openbutton';
+      openbutton.className = 'openbutton';
     }
     chrome.send('getChildren', [path]);
   }