Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(139)

Side by Side Diff: ui/file_manager/gallery/js/ribbon.js

Issue 719273004: Add type annotations to gallery/js/ribbon.js. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Added a space. Created 6 years, 1 month ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « no previous file | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 // Copyright 2014 The Chromium Authors. All rights reserved. 1 // Copyright 2014 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 /** 5 /**
6 * Scrollable thumbnail ribbon at the bottom of the Gallery in the Slide mode. 6 * Scrollable thumbnail ribbon at the bottom of the Gallery in the Slide mode.
7 * 7 *
8 * @param {Document} document Document. 8 * @param {!Document} document Document.
9 * @param {cr.ui.ArrayDataModel} dataModel Data model. 9 * @param {!cr.ui.ArrayDataModel} dataModel Data model.
10 * @param {cr.ui.ListSelectionModel} selectionModel Selection model. 10 * @param {!cr.ui.ListSelectionModel} selectionModel Selection model.
11 * @return {Element} Ribbon element. 11 * @return {!HTMLElement} Ribbon element.
12 * @extends {HTMLElement}
12 * @constructor 13 * @constructor
14 * @suppress {checkStructDictInheritance}
15 * @struct
13 */ 16 */
14 function Ribbon(document, dataModel, selectionModel) { 17 function Ribbon(document, dataModel, selectionModel) {
15 var self = document.createElement('div'); 18 var self = assertInstanceof(document.createElement('div'), HTMLElement);
16 Ribbon.decorate(self, dataModel, selectionModel); 19 Ribbon.decorate(self, dataModel, selectionModel);
17 return self; 20 return self;
18 } 21 }
19 22
20 /** 23 /**
21 * Inherit from HTMLDivElement. 24 * Inherit from HTMLDivElement.
22 */ 25 */
23 Ribbon.prototype.__proto__ = HTMLDivElement.prototype; 26 Ribbon.prototype.__proto__ = HTMLDivElement.prototype;
24 27
25 /** 28 /**
26 * Decorate a Ribbon instance. 29 * Decorate a Ribbon instance.
27 * 30 *
28 * @param {Ribbon} self Self pointer. 31 * @param {!HTMLElement} self Self pointer.
29 * @param {cr.ui.ArrayDataModel} dataModel Data model. 32 * @param {!cr.ui.ArrayDataModel} dataModel Data model.
30 * @param {cr.ui.ListSelectionModel} selectionModel Selection model. 33 * @param {!cr.ui.ListSelectionModel} selectionModel Selection model.
31 */ 34 */
32 Ribbon.decorate = function(self, dataModel, selectionModel) { 35 Ribbon.decorate = function(self, dataModel, selectionModel) {
33 self.__proto__ = Ribbon.prototype; 36 self.__proto__ = Ribbon.prototype;
37 self = /** @type {!Ribbon} */ (self);
34 self.dataModel_ = dataModel; 38 self.dataModel_ = dataModel;
35 self.selectionModel_ = selectionModel; 39 self.selectionModel_ = selectionModel;
36 40
41 /** @type {!Object} */
42 self.renderCache_ = {};
43
44 /** @type {number} */
45 self.firstVisibleIndex_ = 0;
46
47 /** @type {number} */
48 self.lastVisibleIndex_ = -1;
49
50 /** @type {?function(!Event)} */
51 self.onContentBound_ = null;
52
53 /** @type {?function(!Event)} */
54 self.onSpliceBound_ = null;
55
56 /** @type {?function(!Event)} */
57 self.onSelectionBound_ = null;
58
59 /** @type {?number} */
60 self.removeTimeout_ = null;
61
37 self.className = 'ribbon'; 62 self.className = 'ribbon';
38 }; 63 };
39 64
40 /** 65 /**
41 * Max number of thumbnails in the ribbon. 66 * Max number of thumbnails in the ribbon.
42 * @type {number} 67 * @type {number}
68 * @const
43 */ 69 */
44 Ribbon.ITEMS_COUNT = 5; 70 Ribbon.ITEMS_COUNT = 5;
45 71
46 /** 72 /**
47 * Force redraw the ribbon. 73 * Force redraw the ribbon.
48 */ 74 */
49 Ribbon.prototype.redraw = function() { 75 Ribbon.prototype.redraw = function() {
50 this.onSelection_(); 76 this.onSelection_();
51 }; 77 };
52 78
(...skipping 30 matching lines...) Expand all
83 this.dataModel_.removeEventListener('content', this.onContentBound_); 109 this.dataModel_.removeEventListener('content', this.onContentBound_);
84 this.dataModel_.removeEventListener('splice', this.onSpliceBound_); 110 this.dataModel_.removeEventListener('splice', this.onSpliceBound_);
85 this.selectionModel_.removeEventListener('change', this.onSelectionBound_); 111 this.selectionModel_.removeEventListener('change', this.onSelectionBound_);
86 112
87 this.removeVanishing_(); 113 this.removeVanishing_();
88 this.textContent = ''; 114 this.textContent = '';
89 }; 115 };
90 116
91 /** 117 /**
92 * Data model splice handler. 118 * Data model splice handler.
93 * @param {Event} event Event. 119 * @param {!Event} event Event.
94 * @private 120 * @private
95 */ 121 */
96 Ribbon.prototype.onSplice_ = function(event) { 122 Ribbon.prototype.onSplice_ = function(event) {
97 if (event.removed.length > 1) { 123 if (event.removed.length > 1) {
98 console.error('Cannot remove multiple items.'); 124 console.error('Cannot remove multiple items.');
99 return; 125 return;
100 } 126 }
101 127
102 if (event.removed.length > 0 && event.added.length > 0) { 128 if (event.removed.length > 0 && event.added.length > 0) {
103 console.error('Replacing is not implemented.'); 129 console.error('Replacing is not implemented.');
(...skipping 187 matching lines...) Expand 10 before | Expand all | Expand 10 after
291 for (var i = 0; i != vanishingNodes.length; i++) { 317 for (var i = 0; i != vanishingNodes.length; i++) {
292 vanishingNodes[i].removeAttribute('vanishing'); 318 vanishingNodes[i].removeAttribute('vanishing');
293 this.removeChild(vanishingNodes[i]); 319 this.removeChild(vanishingNodes[i]);
294 } 320 }
295 }; 321 };
296 322
297 /** 323 /**
298 * Create a DOM element for a thumbnail. 324 * Create a DOM element for a thumbnail.
299 * 325 *
300 * @param {number} index Item index. 326 * @param {number} index Item index.
301 * @return {Element} Newly created element. 327 * @return {!Element} Newly created element.
302 * @private 328 * @private
303 */ 329 */
304 Ribbon.prototype.renderThumbnail_ = function(index) { 330 Ribbon.prototype.renderThumbnail_ = function(index) {
305 var item = this.dataModel_.item(index); 331 var item = this.dataModel_.item(index);
306 var url = item.getEntry().toURL(); 332 var url = item.getEntry().toURL();
307 333
308 var cached = this.renderCache_[url]; 334 var cached = this.renderCache_[url];
309 if (cached) { 335 if (cached) {
310 var img = cached.querySelector('img'); 336 var img = cached.querySelector('img');
311 if (img) 337 if (img)
(...skipping 16 matching lines...) Expand all
328 // TODO: Implement LRU eviction. 354 // TODO: Implement LRU eviction.
329 // Never evict the thumbnails that are currently in the DOM because we rely 355 // Never evict the thumbnails that are currently in the DOM because we rely
330 // on this cache to find them by URL. 356 // on this cache to find them by URL.
331 this.renderCache_[url] = thumbnail; 357 this.renderCache_[url] = thumbnail;
332 return thumbnail; 358 return thumbnail;
333 }; 359 };
334 360
335 /** 361 /**
336 * Set the thumbnail image. 362 * Set the thumbnail image.
337 * 363 *
338 * @param {Element} thumbnail Thumbnail element. 364 * @param {!Element} thumbnail Thumbnail element.
339 * @param {Gallery.Item} item Gallery item. 365 * @param {!Gallery.Item} item Gallery item.
340 * @private 366 * @private
341 */ 367 */
342 Ribbon.prototype.setThumbnailImage_ = function(thumbnail, item) { 368 Ribbon.prototype.setThumbnailImage_ = function(thumbnail, item) {
343 var loader = new ThumbnailLoader( 369 var loader = new ThumbnailLoader(
344 item.getEntry(), 370 item.getEntry(),
345 ThumbnailLoader.LoaderType.IMAGE, 371 ThumbnailLoader.LoaderType.IMAGE,
346 item.getMetadata()); 372 item.getMetadata());
347 loader.load( 373 loader.load(
348 thumbnail.querySelector('.image-wrapper'), 374 thumbnail.querySelector('.image-wrapper'),
349 ThumbnailLoader.FillMode.FILL /* fill */, 375 ThumbnailLoader.FillMode.FILL /* fill */,
350 ThumbnailLoader.OptimizationMode.NEVER_DISCARD); 376 ThumbnailLoader.OptimizationMode.NEVER_DISCARD);
351 }; 377 };
352 378
353 /** 379 /**
354 * Content change handler. 380 * Content change handler.
355 * 381 *
356 * @param {Event} event Event. 382 * @param {!Event} event Event.
357 * @private 383 * @private
358 */ 384 */
359 Ribbon.prototype.onContentChange_ = function(event) { 385 Ribbon.prototype.onContentChange_ = function(event) {
360 var url = event.item.getEntry().toURL(); 386 var url = event.item.getEntry().toURL();
361 if (event.oldEntry.toURL() !== url) 387 if (event.oldEntry.toURL() !== url)
362 this.remapCache_(event.oldEntry.toURL(), url); 388 this.remapCache_(event.oldEntry.toURL(), url);
363 389
364 var thumbnail = this.renderCache_[url]; 390 var thumbnail = this.renderCache_[url];
365 if (thumbnail && event.item) 391 if (thumbnail && event.item)
366 this.setThumbnailImage_(thumbnail, event.item); 392 this.setThumbnailImage_(thumbnail, event.item);
367 }; 393 };
368 394
369 /** 395 /**
370 * Update the thumbnail element cache. 396 * Update the thumbnail element cache.
371 * 397 *
372 * @param {string} oldUrl Old url. 398 * @param {string} oldUrl Old url.
373 * @param {string} newUrl New url. 399 * @param {string} newUrl New url.
374 * @private 400 * @private
375 */ 401 */
376 Ribbon.prototype.remapCache_ = function(oldUrl, newUrl) { 402 Ribbon.prototype.remapCache_ = function(oldUrl, newUrl) {
377 if (oldUrl != newUrl && (oldUrl in this.renderCache_)) { 403 if (oldUrl != newUrl && (oldUrl in this.renderCache_)) {
378 this.renderCache_[newUrl] = this.renderCache_[oldUrl]; 404 this.renderCache_[newUrl] = this.renderCache_[oldUrl];
379 delete this.renderCache_[oldUrl]; 405 delete this.renderCache_[oldUrl];
380 } 406 }
381 }; 407 };
OLDNEW
« no previous file with comments | « no previous file | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698