Displaying unknown file types.

BUG=126798,126941
TEST=Download a file. Rename it to '1', '1.', '1.XxX'. Copy and paste large amount of big files. Start renaming a file operation while files are adding to the directory. Ensure renaming works, files added, no errors in the console.

Review URL: https://chromiumcodereview.appspot.com/10382010

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

3 files changed, 100 insertions, 103 deletions

diff --git a/chrome/browser/resources/file_manager/js/file_manager.js b/chrome/browser/resources/file_manager/js/file_manager.js
index feddb20..fddb121 100644
--- a/chrome/browser/resources/file_manager/js/file_manager.js
+++ b/chrome/browser/resources/file_manager/js/file_manager.js
@@ -832,11 +832,8 @@ FileManager.prototype = {
    * Compare by type first, then by subtype and then by name.
    */
   FileManager.prototype.compareType_ = function(a, b) {
-    var aCachedFilesystem = this.metadataCache_.getCached(a, 'filesystem');
-    var aType = aCachedFilesystem ? aCachedFilesystem.fileType : {};
-
-    var bCachedFilesystem = this.metadataCache_.getCached(b, 'filesystem');
-    var bType = bCachedFilesystem ? bCachedFilesystem.fileType : {};
+    var aType = FileType.getType(a);
+    var bType = FileType.getType(b);
 
 
     // Files of unknown type follows all the others.
@@ -1130,7 +1127,7 @@ FileManager.prototype = {
     var renderFunction = this.table_.getRenderFunction();
     this.table_.setRenderFunction(function(entry, parent) {
       var item = renderFunction(entry, parent);
-      this.displayGDataStyleInItem_(
+      this.updateGDataStyle_(
           item, entry, this.metadataCache_.getCached(entry, 'gdata'));
       return item;
     }.bind(this));
@@ -1701,7 +1698,7 @@ FileManager.prototype = {
 
     li.appendChild(this.renderThumbnailBox_(entry, false));
     li.appendChild(this.renderFileNameLabel_(entry));
-    this.displayGDataStyleInItem_(
+    this.updateGDataStyle_(
         li, entry, this.metadataCache_.getCached(entry, 'gdata'));
   };
 
@@ -1717,10 +1714,7 @@ FileManager.prototype = {
   FileManager.prototype.renderIconType_ = function(entry, columnId, table) {
     var icon = this.document_.createElement('div');
     icon.className = 'detail-icon';
-    this.metadataCache_.get(entry, 'filesystem', function(filesystem) {
-      if (filesystem)
-        icon.setAttribute('iconType', filesystem.icon);
-    });
+    icon.setAttribute('iconType', FileType.getIcon(entry));
     return icon;
   };
 
@@ -1819,7 +1813,7 @@ FileManager.prototype = {
     chrome.fileBrowserPrivate.removeMount(entry.toURL());
   };
 
-  FileManager.prototype.displayGDataStyleInItem_ = function(
+  FileManager.prototype.updateGDataStyle_ = function(
       listItem, entry, gdata) {
     if (!this.isOnGData() || !gdata)
       return;
@@ -1879,26 +1873,23 @@ FileManager.prototype = {
   FileManager.prototype.renderSize_ = function(entry, columnId, table) {
     var div = this.document_.createElement('div');
     div.className = 'size';
-    this.updateSize_(div, entry);
-    return div;
-  };
-
-  FileManager.prototype.updateSize_ = function(div, entry) {
     // Unlike other rtl languages, Herbew use MB and writes the unit to the
     // right of the number. We use css trick to workaround this.
     if (navigator.language == 'he')
       div.className = 'align-end-weakrtl';
-    div.textContent = '...';
-    this.displaySizeInDiv_(
-        div, this.metadataCache_.getCached(entry, 'filesystem'));
+    this.updateSize_(
+        div, entry, this.metadataCache_.getCached(entry, 'filesystem'));
+
+    return div;
   };
 
-  FileManager.prototype.displaySizeInDiv_ = function(div, filesystemProps) {
-    if (!filesystemProps) return;
-    if (filesystemProps.size == -1) {
+  FileManager.prototype.updateSize_ = function(div, entry, filesystemProps) {
+    if (!filesystemProps) {
+      div.textContent = '...';
+    } else if (filesystemProps.size == -1) {
       div.textContent = '--';
     } else if (filesystemProps.size == 0 &&
-               filesystemProps.fileType.type == 'hosted') {
+               FileType.isHosted(entry)) {
       div.textContent = '--';
     } else {
       div.textContent = util.bytesToSi(filesystemProps.size);
@@ -1915,28 +1906,14 @@ FileManager.prototype = {
   FileManager.prototype.renderType_ = function(entry, columnId, table) {
     var div = this.document_.createElement('div');
     div.className = 'type';
-    this.updateType_(div, entry);
+    var fileType = FileType.getType(entry);
+    if (fileType.subtype)
+      div.textContent = strf(fileType.name, fileType.subtype);
+    else
+      div.textContent = str(fileType.name);
     return div;
   };
 
-  FileManager.prototype.updateType_ = function(div, entry) {
-    this.displayTypeInDiv_(
-        div, this.metadataCache_.getCached(entry, 'filesystem'));
-  };
-
-  FileManager.prototype.displayTypeInDiv_ = function(div, filesystemProps) {
-    if (!filesystemProps) return;
-    var fileType = filesystemProps.fileType;
-    if (fileType.name) {
-      if (fileType.subtype)
-        div.textContent = strf(fileType.name, fileType.subtype);
-      else
-        div.textContent = str(fileType.name);
-    } else {
-      div.textContent = '';
-    }
-  };
-
   /**
    * Render the Date column of the detail table.
    *
@@ -1947,19 +1924,16 @@ FileManager.prototype = {
   FileManager.prototype.renderDate_ = function(entry, columnId, table) {
     var div = this.document_.createElement('div');
     div.className = 'date';
-    this.updateDate_(div, entry);
-    return div;
-  };
 
-  FileManager.prototype.updateDate_ = function(div, entry) {
-    div.textContent = '...';
-    this.displayDateInDiv_(
-        div, this.metadataCache_.getCached(entry, 'filesystem'));
+    this.updateDate_(div,
+        this.metadataCache_.getCached(entry, 'filesystem'));
+    return div;
   };
 
-  FileManager.prototype.displayDateInDiv_ = function(div, filesystemProps) {
-    if (!filesystemProps) return;
-    if (this.directoryModel_.isSystemDirectory() &&
+  FileManager.prototype.updateDate_ = function(div, filesystemProps) {
+    if (!filesystemProps) {
+      div.textContent = '...';
+    } if (this.directoryModel_.isSystemDirectory() &&
         filesystemProps.modificationTime.getTime() == 0) {
       // Mount points for FAT volumes have this time associated with them.
       // We'd rather display nothing than this bogus date.
@@ -1986,13 +1960,13 @@ FileManager.prototype = {
     div.appendChild(checkbox);
 
     if (this.isOnGData()) {
-      this.displayOfflineInDiv_(
+      this.updateOffline_(
           div, this.metadataCache_.getCached(entry, 'gdata'));
     }
     return div;
   };
 
-  FileManager.prototype.displayOfflineInDiv_ = function(div, gdata) {
+  FileManager.prototype.updateOffline_ = function(div, gdata) {
     if (!gdata) return;
     if (gdata.hosted) return;
     var checkbox = div.querySelector('.pin');
@@ -2037,14 +2011,13 @@ FileManager.prototype = {
       var entry = entries[url];
       var props = properties[index];
       if (type == 'filesystem') {
-        this.displayDateInDiv_(listItem.querySelector('.date'), props);
-        this.displaySizeInDiv_(listItem.querySelector('.size'), props);
-        this.displayTypeInDiv_(listItem.querySelector('.type'), props);
+        this.updateDate_(listItem.querySelector('.date'), props);
+        this.updateSize_(listItem.querySelector('.size'), entry, props);
       } else if (type == 'gdata') {
         var offline = listItem.querySelector('.offline');
         if (offline)  // This column is only present in full page mode.
-          this.displayOfflineInDiv_(offline, props);
-        this.displayGDataStyleInItem_(listItem, entry, props);
+          this.updateOffline_(offline, props);
+        this.updateGDataStyle_(listItem, entry, props);
       }
     }
   };
@@ -2072,9 +2045,9 @@ FileManager.prototype = {
 
     var leadListItem = this.findListItemForNode_(this.renameInput_);
     if (this.currentList_ == this.table_.list) {
-      this.updateType_(leadListItem.querySelector('.type'), leadEntry);
-      this.updateDate_(leadListItem.querySelector('.date'), leadEntry);
-      this.updateSize_(leadListItem.querySelector('.size'), leadEntry);
+      var props = this.metadataCache_.getCached(leadEntry, 'filesystem');
+      this.updateDate_(leadListItem.querySelector('.date'), props);
+      this.updateSize_(leadListItem.querySelector('.size'), leadEntry, props);
     }
     this.currentList_.restoreLeadItem(leadListItem);
   };
@@ -2161,8 +2134,17 @@ FileManager.prototype = {
         thumbnails.appendChild(box);
       }
 
+      if (selection.iconType == null) {
+        selection.iconType = FileType.getIcon(entry);
+      } else if (selection.iconType != 'unknown') {
+        var iconType = FileType.getIcon(entry);
+        if (selection.iconType != iconType)
+          selection.iconType = 'unknown';
+      }
+
       if (entry.isFile) {
         selection.fileCount += 1;
+        selection.showBytes |= !FileType.isHosted(entry);
       } else {
         selection.directoryCount += 1;
       }
@@ -2191,20 +2173,10 @@ FileManager.prototype = {
 
     this.metadataCache_.get(selection.entries, 'filesystem', function(props) {
       for (var index = 0; index < selection.entries.length; index++) {
-        var entry = selection.entries[index];
         var filesystem = props[index];
 
-        if (selection.iconType == null) {
-          selection.iconType = filesystem.icon;
-        } else if (selection.iconType != 'unknown') {
-          var iconType = filesystem.icon;
-          if (selection.iconType != iconType)
-            selection.iconType = 'unknown';
-        }
-
         if (entry.isFile) {
           selection.bytes += filesystem.size;
-          selection.showBytes |= filesystem.fileType.type != 'hosted';
         }
       }
 
@@ -2415,7 +2387,7 @@ FileManager.prototype = {
                 chrome.extension.getURL('images/filetype_generic.png');
           } else {
             // Use specific icon.
-            var icon = FileType.getType(selection.urls[0]).icon;
+            var icon = FileType.getIcon(selection.urls[0]);
             task.iconUrl =
                 chrome.extension.getURL('images/filetype_' + icon + '.png');
           }
@@ -3008,30 +2980,29 @@ FileManager.prototype = {
     if (!entry)
       return;
 
-    this.metadataCache_.get(entry, 'filesystem', function(filesystem) {
+    var iconType = FileType.getIcon(entry);
 
-      var iconType = filesystem.icon;
-
-      function returnStockIcon() {
-        callback(iconType, FileType.getPreviewArt(iconType));
-      }
+    function returnStockIcon() {
+      callback(iconType, FileType.getPreviewArt(iconType));
+    }
 
-      this.getMetadataProvider().fetch(entry.toURL(), function(metadata) {
-        if (metadata.thumbnailURL) {
-          callback(iconType, metadata.thumbnailURL,
-                   metadata.thumbnailTransform);
-        } else if (iconType == 'image') {
+    var self = this;
+    this.getMetadataProvider().fetch(entry.toURL(), function(metadata) {
+      if (metadata.thumbnailURL) {
+        callback(iconType, metadata.thumbnailURL,
+                 metadata.thumbnailTransform);
+      } else if (iconType == 'image') {
+        self.metadataCache_.get(entry, 'filesystem', function(filesystem) {
           if (FileType.canUseImageUrlForPreview(metadata, filesystem.size)) {
             callback(iconType, entry.toURL(), metadata.imageTransform);
           } else {
             returnStockIcon();
           }
-        } else {
-          returnStockIcon();
-        }
-      });
-
-    }.bind(this));
+        });
+      } else {
+        returnStockIcon();
+      }
+    });
   };
 
   FileManager.prototype.focusCurrentList_ = function() {
diff --git a/chrome/browser/resources/file_manager/js/file_type.js b/chrome/browser/resources/file_manager/js/file_type.js
index 2526ba1..b3aec10 100644
--- a/chrome/browser/resources/file_manager/js/file_type.js
+++ b/chrome/browser/resources/file_manager/js/file_type.js
@@ -118,17 +118,31 @@ FileType.DIRECTORY = {name: 'FOLDER', type: '.folder', icon: 'folder'};
 /**
  * Get the file type object that matches a given url.
  *
- * @param {string} url Reference to the file.
+ * @param {string|Entry} file Reference to the file.
  * @return {Object} The matching file type object or an empty object.
  */
-FileType.getType = function(url) {
+FileType.getType = function(file) {
+  if (typeof file == 'object') {
+    if (file.isDirectory)
+      return FileType.DIRECTORY;
+    else
+      file = file.name;
+  }
   var types = FileType.types;
   for (var i = 0; i < types.length; i++) {
-    if (types[i].pattern.test(url)) {
+    if (types[i].pattern.test(file)) {
       return types[i];
     }
   }
-  return {};
+  // Unknown file type.
+  var extensionStartIndex = file.lastIndexOf('.');
+  if (extensionStartIndex == -1 || extensionStartIndex == file.length - 1) {
+    return { name: 'NO_EXTENSION_FILE_TYPE', type: 'UNKNOWN', icon: '' };
+  } else {
+    var extension = file.substr(extensionStartIndex + 1).toUpperCase();
+    return { name: 'GENERIC_FILE_TYPE', type: 'UNKNOWN',
+             subtype: extension, icon: '' };
+  }
 };
 
 /**
@@ -181,6 +195,24 @@ FileType.isImageOrVideo = function(url) {
 };
 
 /**
+ * @param {string|Entry} file Reference to the file.
+ * @return {boolean} Returns true if the file is hosted.
+ */
+FileType.isHosted = function(file) {
+  return FileType.getType(file).type === 'hosted';
+};
+
+/**
+ * @param {string|Entry} file Reference to the file.
+ * @return {string} Returns string that represents the file icon.
+ *                  It refers to a file 'images/filetype_' + icon + '.png'.
+ */
+FileType.getIcon = function(file) {
+  var fileType = FileType.getType(file);
+  return fileType.icon || fileType.type || 'unknown';
+};
+
+/**
  * Get the preview url for a given type.
  *
  * @param {string} type File type from FileType.types.
diff --git a/chrome/browser/resources/file_manager/js/metadata/metadata_cache.js b/chrome/browser/resources/file_manager/js/metadata/metadata_cache.js
index e923454..6f59f41 100644
--- a/chrome/browser/resources/file_manager/js/metadata/metadata_cache.js
+++ b/chrome/browser/resources/file_manager/js/metadata/metadata_cache.js
@@ -8,7 +8,7 @@
  * at once.
  * Some of the properties:
  * {
- *   filesystem: size, modificationTime, icon, fileType
+ *   filesystem: size, modificationTime, icon
  *   internal: presence
  *   gdata: pinned, present, hosted, editUrl, contentUrl, availableOffline
  *   thumbnail: url, transform
@@ -457,7 +457,6 @@ MetadataProvider2.prototype.fetch = function(url, type, callback, opt_entry) {
  *   size;
  *   modificationTime;
  *   icon - string describing icon type;
- *   fileType - the file type object from file_type.js.
  * }
  * @constructor
  */
@@ -504,15 +503,10 @@ FilesystemProvider.prototype.fetch = function(url, type, callback, opt_entry) {
   }
 
   function onMetadata(entry, metadata) {
-    var fileType = entry.isDirectory ? FileType.DIRECTORY :
-        FileType.getType(url);
-    var icon = fileType.icon || fileType.type;
     callback({
       filesystem: {
         size: entry.isFile ? (metadata.size || 0) : -1,
-        modificationTime: metadata.modificationTime,
-        fileType: fileType,
-        icon: icon
+        modificationTime: metadata.modificationTime
       }
     });
   }