Add type annotations to gallery/js/ribbon.js.

ui/file_manager/gallery/js/ribbon.js

Index: ui/file_manager/gallery/js/ribbon.js
diff --git a/ui/file_manager/gallery/js/ribbon.js b/ui/file_manager/gallery/js/ribbon.js
index acbc4f97f99e9f3c68d139cab310ae669900e20b..acddca48ee4443785017049d4da9d41a71addfc1 100644
--- a/ui/file_manager/gallery/js/ribbon.js
+++ b/ui/file_manager/gallery/js/ribbon.js
@@ -5,14 +5,17 @@
 /**
  * Scrollable thumbnail ribbon at the bottom of the Gallery in the Slide mode.
  *
- * @param {Document} document Document.
- * @param {cr.ui.ArrayDataModel} dataModel Data model.
- * @param {cr.ui.ListSelectionModel} selectionModel Selection model.
- * @return {Element} Ribbon element.
+ * @param {!Document} document Document.
+ * @param {!cr.ui.ArrayDataModel} dataModel Data model.
+ * @param {!cr.ui.ListSelectionModel} selectionModel Selection model.
+ * @return {!HTMLElement} Ribbon element.
+ * @extends {HTMLElement}
  * @constructor
+ * @suppress {checkStructDictInheritance}
+ * @struct
  */
 function Ribbon(document, dataModel, selectionModel) {
-  var self = document.createElement('div');
+  var self = assertInstanceof(document.createElement('div'), HTMLElement);
   Ribbon.decorate(self, dataModel, selectionModel);
   return self;
 }
@@ -25,21 +28,31 @@ Ribbon.prototype.__proto__ = HTMLDivElement.prototype;
 /**
  * Decorate a Ribbon instance.
  *
- * @param {Ribbon} self Self pointer.
- * @param {cr.ui.ArrayDataModel} dataModel Data model.
- * @param {cr.ui.ListSelectionModel} selectionModel Selection model.
+ * @param {!HTMLElement} self Self pointer.
+ * @param {!cr.ui.ArrayDataModel} dataModel Data model.
+ * @param {!cr.ui.ListSelectionModel} selectionModel Selection model.
  */
 Ribbon.decorate = function(self, dataModel, selectionModel) {
   self.__proto__ = Ribbon.prototype;
+  self = /** @type{!Ribbon} */ (self);
   self.dataModel_ = dataModel;
   self.selectionModel_ = selectionModel;
 
+  /** @type {!Object} */ self.renderCache_ = {};

[fukino, 2014/11/13 07:14:26]

I like the following style to be consistent with other classes.

/** @type {!Object} */
self.renderCache_ = {};

[yawano, 2014/11/13 08:18:52]

Done.

+  /** @type {number} */ self.firstVisibleIndex_ = 0;
+  /** @type {number} */ self.lastVisibleIndex_ = -1;
+  /** @type {?function(!Event)} */ self.onContentBound_ = null;
+  /** @type {?function(!Event)} */ self.onSpliceBound_ = null;
+  /** @type {?function(!Event)} */ self.onSelectionBound_ = null;
+  /** @type {?number}*/ self.removeTimeout_ = null;
+
   self.className = 'ribbon';
 };
 
 /**
  * Max number of thumbnails in the ribbon.
- * @type {number}
+ * @type {!number}

[fukino, 2014/11/13 07:14:26]

number (and string, function) are non-nullable by default, so we don't need '!'.
See the Q&A part of
https://docs.google.com/document/d/1Q8ClzNzg5TEi5AM2iwABfWOSGfapuW9POeeyN67Wm...

[yawano, 2014/11/13 08:18:52]

Done.

+ * @const
  */
 Ribbon.ITEMS_COUNT = 5;
 
@@ -90,7 +103,7 @@ Ribbon.prototype.disable = function() {
 
 /**
  * Data model splice handler.
- * @param {Event} event Event.
+ * @param {!Event} event Event.
  * @private
  */
 Ribbon.prototype.onSplice_ = function(event) {
@@ -297,8 +310,8 @@ Ribbon.prototype.removeVanishing_ = function() {
 /**
  * Create a DOM element for a thumbnail.
  *
- * @param {number} index Item index.
- * @return {Element} Newly created element.
+ * @param {!number} index Item index.

[fukino, 2014/11/13 07:14:26]

ditto

[yawano, 2014/11/13 08:18:52]

Done.

+ * @return {!Element} Newly created element.
  * @private
  */
 Ribbon.prototype.renderThumbnail_ = function(index) {
@@ -335,8 +348,8 @@ Ribbon.prototype.renderThumbnail_ = function(index) {
 /**
  * Set the thumbnail image.
  *
- * @param {Element} thumbnail Thumbnail element.
- * @param {Gallery.Item} item Gallery item.
+ * @param {!Element} thumbnail Thumbnail element.
+ * @param {!Gallery.Item} item Gallery item.
  * @private
  */
 Ribbon.prototype.setThumbnailImage_ = function(thumbnail, item) {
@@ -353,7 +366,7 @@ Ribbon.prototype.setThumbnailImage_ = function(thumbnail, item) {
 /**
  * Content change handler.
  *
- * @param {Event} event Event.
+ * @param {!Event} event Event.
  * @private
  */
 Ribbon.prototype.onContentChange_ = function(event) {
@@ -369,8 +382,8 @@ Ribbon.prototype.onContentChange_ = function(event) {
 /**
  * Update the thumbnail element cache.
  *
- * @param {string} oldUrl Old url.
- * @param {string} newUrl New url.
+ * @param {!string} oldUrl Old url.

[fukino, 2014/11/13 07:14:26]

ditto

[yawano, 2014/11/13 08:18:52]

Done.

+ * @param {!string} newUrl New url.

[fukino, 2014/11/13 07:14:26]

ditto

[yawano, 2014/11/13 08:18:52]

Done.

  * @private
  */
 Ribbon.prototype.remapCache_ = function(oldUrl, newUrl) {