Quick View: Add more metadata and update UI.

ui/file_manager/file_manager/foreground/elements/files_metadata_box.js

Index: ui/file_manager/file_manager/foreground/elements/files_metadata_box.js
diff --git a/ui/file_manager/file_manager/foreground/elements/files_metadata_box.js b/ui/file_manager/file_manager/foreground/elements/files_metadata_box.js
index e74e7b50e754d8220d8b887f2967903f3fd5be94..9040b37a80b49d94af598ef1971330001db74c06 100644
--- a/ui/file_manager/file_manager/foreground/elements/files_metadata_box.js
+++ b/ui/file_manager/file_manager/foreground/elements/files_metadata_box.js
@@ -6,18 +6,84 @@ var FilesMetadataBox = Polymer({
   is: 'files-metadata-box',
 
   properties: {
+    // File media type, e.g. image, video.
+    type: String,
     size: String,
     modiifcationTime: String,
-    /*
-     * TODO(oka): Add the following fields.
-     * filePath: String,
-     * imageWidth: Number,
-     * imageHeight: Number,
-     * mediaTitle: String,
-     * mediaArtist: String,
-     * mediaMimeType: String,
-     */
+    filePath: String,
+    mediaMimeType: String,
+
+    // File type specific metadata below.
+    imageWidth: Number,
+    imageHeight: Number,
+    mediaTitle: String,
+    mediaArtist: String,
   },
 
-});
+  // Clears fields.
+  clear: function() {
+    this.type = '';
+    this.size = '';
+    this.modiifcationTime = '';
+    this.mediaMimeType = '';
+    this.filePath = '';
+
+    this.imageWidth = 0;
+    this.imageHeight = 0;
+    this.mediaTitle = '';
+    this.mediaArtist = '';
+  },
+
+  /**
+   * @param {string} type
+   * @return {boolean}
+   *
+   * @private
+   */
+  isImage_: function(type) { return type === 'image'; },
+
+  /**
+   * @param {string} type
+   * @return {boolean}
+   *
+   * @private
+   */
+  isVideo_: function(type) { return type === 'video'; },
 
+  /**
+   * @param {string} type
+   * @return {boolean}
+   *
+   * @private
+   */
+  isAudio_: function(type) { return type === 'audio'; },
+
+  /**
+   * @param {number} imageWidth
+   * @param {number} imageHeight
+   * @param {string} mediaTitle
+   * @param {string} mediaArtist
+   * @return {boolean}
+   *
+   * @private
+   */
+  hasFileSpecificInfo_: function(
+      imageWidth, imageHeight, mediaTitle, mediaArtist) {
+    var result = (imageWidth && imageHeight) || mediaTitle || mediaArtist;
+    return !!result;
+  },
+
+  /**
+   * @param {number} imageWidth
+   * @param {number} imageHeight
+   * @return {string}
+   *
+   * @private
+   */
+  resolution_: function(imageWidth, imageHeight) {
+    if (imageWidth && imageHeight)
+      return imageWidth + " x " + imageHeight;
+    return '';
+  },
+
+});