Add window buttons (close and maximize) to the Files.app's new UI.

chrome/browser/resources/file_manager/js/photo/gallery.js

 // Copyright (c) 2012 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.
 
 'use strict';
 
 util.addPageLoadHandler(function() {
   if (!location.hash)
     return;
 
@@ skipping 17 matching lines @@
  * @param {boolean=} opt_exiting True if the app is exiting.
  */
 function unload(opt_exiting) { Gallery.instance.onUnload(opt_exiting) }
 
 /**
  * Gallery for viewing and editing image files.
  *
  * @param {Object} context Object containing the following:
  *     {function(string)} onNameChange Called every time a selected
  *         item name changes (on rename and on selection change).
+ *     {function} onBack

[yoshiki, 2013/05/07 02:21:50]

s/function/function(string)/

[mtomasz, 2013/05/07 03:52:02]

Done.

  *     {function} onClose

[yoshiki, 2013/05/07 02:21:50]

s/function/function()/

[mtomasz, 2013/05/07 03:52:02]

Done.

+ *     {function} onMaximize

[yoshiki, 2013/05/07 02:21:50]

ditto

[mtomasz, 2013/05/07 03:52:02]

Done.

  *     {MetadataCache} metadataCache
  *     {Array.<Object>} shareActions
  *     {string} readonlyDirName Directory name for readonly warning or null.
  *     {DirEntry} saveDirEntry Directory to save to.
  *     {function(string)} displayStringFunction.
  * @class
  * @constructor
  */
 function Gallery(context) {
   this.container_ = document.querySelector('.gallery');
@@ skipping 52 matching lines @@
         function() {
           // Try to scan the parent directory.
           var pathParts = path.split('/');
           pathParts.pop();
           var parentPath = pathParts.join('/');
           filesystem.root.getDirectory(parentPath, {create: false},
               scanDirectory, open /* no data, just display an error */);
         });
   });
 
-  function scanDirectory(dirEntry) {
+  var scanDirectory = function(dirEntry) {
     currentDir = dirEntry;
     util.forEachDirEntry(currentDir, function(entry) {
       if (entry == null) {
         open();
       } else if (FileType.isImageOrVideo(entry)) {
         var url = entry.toURL();
         urls.push(url);
         if (entry.fullPath == path)
           selectedUrls = [url];
       }
     });
-  }
+  };
 
-  function onClose() {
+  var onBack = function() {

[yoshiki, 2013/05/07 02:21:50]

I should think that a 'selectedUrls' parameter is passed as an argument.
Shouldn't we use it?

[mtomasz, 2013/05/07 03:52:02]

We get the selected path from the current location.hash.

     // Exiting to the Files app seems arbitrary. Consider closing the tab.
     document.location = 'main.html?' +

[yoshiki, 2013/05/07 02:21:50]

Shouldn't we use 'main_new_ui.html' in new ui?

[mtomasz, 2013/05/07 03:52:02]

This seem not to be used in Files.app V2. I've added a comment to remove this
code.

         JSON.stringify({defaultPath: document.location.hash.substr(1)});
-  }
+  };
+
+  var onClose = function() {
+    window.close();
+  };
+
+  var onMaximize = function() {
+    var appWindow = chrome.app.window.current();
+    if (appWindow.isMaximized())
+      appWindow.restore();
+    else
+      appWindow.maximize();
+  };
 
   function open() {
     urls.sort();
     Gallery.getFileBrowserPrivate().getStrings(function(strings) {
       loadTimeData.data = strings;
       var context = {
         readonlyDirName: null,
         curDirEntry: currentDir,
         saveDirEntry: null,
         metadataCache: MetadataCache.createFull(),
         pageState: pageState,
+        onBack: onBack,
         onClose: onClose,
+        onMaximize: onMaximize,
         displayStringFunction: strf
       };
       Gallery.open(context, urls, selectedUrls);
       if (opt_callback) opt_callback();
     });
   }
 };
 
 /**
  * Tools fade-out timeout im milliseconds.
@@ skipping 56 matching lines @@
 
 /**
  * Closes gallery when a volume containing the selected item is unmounted.
  * @param {Event} event The unmount event.
  * @private
  */
 Gallery.prototype.onExternallyUnmounted_ = function(event) {
   if (!this.selectedItemFilesystemPath_)
     return;
   if (this.selectedItemFilesystemPath_.indexOf(event.mountPath) == 0)
-    this.onClose_();
+    this.onBack_();
 };
 
 /**
  * Beforeunload handler.
  * @return {string?} User-visible message on null if it is OK to close.
  */
 Gallery.prototype.onBeforeUnload = function() {
   return this.slideMode_.onBeforeUnload();
 };
 
 /**
  * Unload the Gallery.
  * @param {boolean} exiting True if the app is exiting.
  */
 Gallery.prototype.onUnload = function(exiting) {
   if (!this.context_.searchResults) {
     this.metadataCache_.removeObserver(this.thumbnailObserverId_);
   }
   this.slideMode_.onUnload(exiting);
 };
 
 /**
  * Initializes DOM UI
  * @private
  */
 Gallery.prototype.initDom_ = function() {
   var content = util.createChild(this.container_, 'content');
   content.addEventListener('click', this.onContentClick_.bind(this));
 
-  var closeButton = util.createChild(this.container_, 'close tool dimmable');
-  util.createChild(closeButton);
-  closeButton.addEventListener('click', this.onClose_.bind(this));
-
   this.header_ = util.createChild(this.container_, 'header tool dimmable');
   this.toolbar_ = util.createChild(this.container_, 'toolbar tool dimmable');
 
+  var backButton = util.createChild(this.container_,
+                                    'back-button tool dimmable');
+  util.createChild(backButton);
+  backButton.addEventListener('click', this.onBack_.bind(this));
+
+  if (util.platform.newUI()) {
+    var maximizeButton = util.createChild(this.header_,
+                                          'maximize-button tool dimmable',
+                                          'button');
+    maximizeButton.addEventListener('click', this.onMaximize_.bind(this));
+
+    var closeButton = util.createChild(this.header_,
+                                       'close-button tool dimmable',
+                                       'button');
+    closeButton.addEventListener('click', this.onClose_.bind(this));
+  }
+
   this.filenameSpacer_ = util.createChild(this.toolbar_, 'filename-spacer');
-
   this.filenameEdit_ = util.createChild(this.filenameSpacer_,
                                         'namebox', 'input');
 
   this.filenameEdit_.setAttribute('type', 'text');
   this.filenameEdit_.addEventListener('blur',
       this.onFilenameEditBlur_.bind(this));
 
   this.filenameEdit_.addEventListener('focus',
       this.onFilenameFocus_.bind(this));
 
@@ skipping 119 matching lines @@
     /* TODO: consider nice blow-up animation for the first image */
     this.slideMode_.enter(null, function() {
         // Flash the toolbar briefly to show it is there.
         this.inactivityWatcher_.kick(Gallery.FIRST_FADE_TIMEOUT);
       }.bind(this),
       maybeLoadMosaic);
   }
 };
 
 /**
- * Close the Gallery.
+ * Close the Gallery and go to Files.app.
  * @private
  */
-Gallery.prototype.close_ = function() {
+Gallery.prototype.back_ = function() {
   if (util.isFullScreen()) {
     util.toggleFullScreen(this.document_,
                           false);  // Leave the full screen mode.
   }
-  this.context_.onClose(this.getSelectedUrls());
+  this.context_.onBack(this.getSelectedUrls());
 };
 
 /**
- * Handle user's 'Close' action (Escape or a click on the X icon).
+ * Handle user's 'Back' action (Escape or a click on the X icon).
+ * @private
+ */
+Gallery.prototype.onBack_ = function() {
+  this.executeWhenReady(this.back_.bind(this));
+};
+
+/**
+ * Handle user's 'Close' action.
  * @private
  */
 Gallery.prototype.onClose_ = function() {
-  this.executeWhenReady(this.close_.bind(this));
+  this.executeWhenReady(this.context_.onClose);
 };
 
 /**
+ * Handle user's 'Maximize' action (Escape or a click on the X icon).
+ * @private
+ */
+Gallery.prototype.onMaximize_ = function() {
+  this.executeWhenReady(this.context_.onMaximize);
+};
+
+/**
  * Execute a function when the editor is done with the modifications.
  * @param {function} callback Function to execute.
  */
 Gallery.prototype.executeWhenReady = function(callback) {
   this.currentMode_.executeWhenReady(callback);
 };
 
 /**
  * @return {Object} File browser private API.
  */
@@ skipping 220 matching lines @@
 
   switch (util.getKeyModifiers(event) + event.keyIdentifier) {
     case 'U+0008': // Backspace.
       // The default handler would call history.back and close the Gallery.
       event.preventDefault();
       break;
 
     case 'U+001B':  // Escape
       // Swallow Esc if it closed the Share menu, otherwise close the Gallery.
       if (!wasSharing)
-        this.onClose_();
+        this.onBack_();
       break;
 
     case 'U+004D':  // 'm' switches between Slide and Mosaic mode.
       this.toggleMode_(null, event);
       break;
 
 
     case 'U+0056':  // 'v'
       this.slideMode_.startSlideshow(SlideMode.SLIDESHOW_INTERVAL_FIRST, event);
       return;
@@ skipping 234 matching lines @@
 Gallery.prototype.updateThumbnails_ = function() {
   if (this.currentMode_ == this.slideMode_)
     this.slideMode_.updateThumbnails();
 
   if (this.mosaicMode_) {
     var mosaic = this.mosaicMode_.getMosaic();
     if (mosaic.isInitialized())
       mosaic.reload();
   }
 };