OLD | NEW |
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 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 'use strict'; | 5 'use strict'; |
6 | 6 |
7 /** | 7 /** |
8 * Scrollable thumbnail ribbon at the bottom of the Gallery in the Slide mode. | 8 * Scrollable thumbnail ribbon at the bottom of the Gallery in the Slide mode. |
9 * | 9 * |
10 * @param {Document} document Document. | 10 * @param {Document} document Document. |
(...skipping 89 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
100 */ | 100 */ |
101 Ribbon.prototype.onSplice_ = function(event) { | 101 Ribbon.prototype.onSplice_ = function(event) { |
102 if (event.removed.length == 0) | 102 if (event.removed.length == 0) |
103 return; | 103 return; |
104 | 104 |
105 if (event.removed.length > 1) { | 105 if (event.removed.length > 1) { |
106 console.error('Cannot remove multiple items'); | 106 console.error('Cannot remove multiple items'); |
107 return; | 107 return; |
108 } | 108 } |
109 | 109 |
110 var removed = this.renderCache_[event.removed[0].getUrl()]; | 110 var removed = this.renderCache_[event.removed[0].getEntry().toURL()]; |
111 if (!removed || !removed.parentNode || !removed.hasAttribute('selected')) { | 111 if (!removed || !removed.parentNode || !removed.hasAttribute('selected')) { |
112 console.error('Can only remove the selected item'); | 112 console.error('Can only remove the selected item'); |
113 return; | 113 return; |
114 } | 114 } |
115 | 115 |
116 var persistentNodes = this.querySelectorAll('.ribbon-image:not([vanishing])'); | 116 var persistentNodes = this.querySelectorAll('.ribbon-image:not([vanishing])'); |
117 if (this.lastVisibleIndex_ < this.dataModel_.length) { // Not at the end. | 117 if (this.lastVisibleIndex_ < this.dataModel_.length) { // Not at the end. |
118 var lastNode = persistentNodes[persistentNodes.length - 1]; | 118 var lastNode = persistentNodes[persistentNodes.length - 1]; |
119 if (lastNode.nextSibling) { | 119 if (lastNode.nextSibling) { |
120 // Pull back a vanishing node from the right. | 120 // Pull back a vanishing node from the right. |
(...skipping 120 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
241 this.firstVisibleIndex_ = firstIndex; | 241 this.firstVisibleIndex_ = firstIndex; |
242 this.lastVisibleIndex_ = lastIndex; | 242 this.lastVisibleIndex_ = lastIndex; |
243 | 243 |
244 this.scheduleRemove_(); | 244 this.scheduleRemove_(); |
245 } | 245 } |
246 | 246 |
247 var oldSelected = this.querySelector('[selected]'); | 247 var oldSelected = this.querySelector('[selected]'); |
248 if (oldSelected) oldSelected.removeAttribute('selected'); | 248 if (oldSelected) oldSelected.removeAttribute('selected'); |
249 | 249 |
250 var newSelected = | 250 var newSelected = |
251 this.renderCache_[this.dataModel_.item(selectedIndex).getUrl()]; | 251 this.renderCache_[this.dataModel_.item(selectedIndex).getEntry().toURL()]; |
252 if (newSelected) newSelected.setAttribute('selected', true); | 252 if (newSelected) newSelected.setAttribute('selected', true); |
253 }; | 253 }; |
254 | 254 |
255 /** | 255 /** |
256 * Schedule the removal of thumbnails marked as vanishing. | 256 * Schedule the removal of thumbnails marked as vanishing. |
257 * @private | 257 * @private |
258 */ | 258 */ |
259 Ribbon.prototype.scheduleRemove_ = function() { | 259 Ribbon.prototype.scheduleRemove_ = function() { |
260 if (this.removeTimeout_) | 260 if (this.removeTimeout_) |
261 clearTimeout(this.removeTimeout_); | 261 clearTimeout(this.removeTimeout_); |
(...skipping 22 matching lines...) Expand all Loading... |
284 | 284 |
285 /** | 285 /** |
286 * Create a DOM element for a thumbnail. | 286 * Create a DOM element for a thumbnail. |
287 * | 287 * |
288 * @param {number} index Item index. | 288 * @param {number} index Item index. |
289 * @return {Element} Newly created element. | 289 * @return {Element} Newly created element. |
290 * @private | 290 * @private |
291 */ | 291 */ |
292 Ribbon.prototype.renderThumbnail_ = function(index) { | 292 Ribbon.prototype.renderThumbnail_ = function(index) { |
293 var item = this.dataModel_.item(index); | 293 var item = this.dataModel_.item(index); |
294 var url = item.getUrl(); | 294 var url = item.getEntry().toURL(); |
295 | 295 |
296 var cached = this.renderCache_[url]; | 296 var cached = this.renderCache_[url]; |
297 if (cached) { | 297 if (cached) { |
298 var img = cached.querySelector('img'); | 298 var img = cached.querySelector('img'); |
299 if (img) | 299 if (img) |
300 img.classList.add('cached'); | 300 img.classList.add('cached'); |
301 return cached; | 301 return cached; |
302 } | 302 } |
303 | 303 |
304 var thumbnail = this.ownerDocument.createElement('div'); | 304 var thumbnail = this.ownerDocument.createElement('div'); |
305 thumbnail.className = 'ribbon-image'; | 305 thumbnail.className = 'ribbon-image'; |
306 thumbnail.addEventListener('click', function() { | 306 thumbnail.addEventListener('click', function() { |
307 var index = this.dataModel_.indexOf(item); | 307 var index = this.dataModel_.indexOf(item); |
308 this.selectionModel_.unselectAll(); | 308 this.selectionModel_.unselectAll(); |
309 this.selectionModel_.setIndexSelected(index, true); | 309 this.selectionModel_.setIndexSelected(index, true); |
310 }.bind(this)); | 310 }.bind(this)); |
311 | 311 |
312 util.createChild(thumbnail, 'image-wrapper'); | 312 util.createChild(thumbnail, 'image-wrapper'); |
313 | 313 |
314 this.metadataCache_.get(url, Gallery.METADATA_TYPE, | 314 this.metadataCache_.get(item.getEntry().toURL(), Gallery.METADATA_TYPE, |
315 this.setThumbnailImage_.bind(this, thumbnail, url)); | 315 this.setThumbnailImage_.bind(this, thumbnail, url)); |
316 | 316 |
317 // TODO: Implement LRU eviction. | 317 // TODO: Implement LRU eviction. |
318 // Never evict the thumbnails that are currently in the DOM because we rely | 318 // Never evict the thumbnails that are currently in the DOM because we rely |
319 // on this cache to find them by URL. | 319 // on this cache to find them by URL. |
320 this.renderCache_[url] = thumbnail; | 320 this.renderCache_[url] = thumbnail; |
321 return thumbnail; | 321 return thumbnail; |
322 }; | 322 }; |
323 | 323 |
324 /** | 324 /** |
(...skipping 11 matching lines...) Expand all Loading... |
336 ThumbnailLoader.OptimizationMode.NEVER_DISCARD); | 336 ThumbnailLoader.OptimizationMode.NEVER_DISCARD); |
337 }; | 337 }; |
338 | 338 |
339 /** | 339 /** |
340 * Content change handler. | 340 * Content change handler. |
341 * | 341 * |
342 * @param {Event} event Event. | 342 * @param {Event} event Event. |
343 * @private | 343 * @private |
344 */ | 344 */ |
345 Ribbon.prototype.onContentChange_ = function(event) { | 345 Ribbon.prototype.onContentChange_ = function(event) { |
346 var url = event.item.getUrl(); | 346 var url = event.item.getEntry().toURL(); |
347 this.remapCache_(event.oldUrl, url); | 347 this.remapCache_(event.oldUrl, url); |
348 | 348 |
349 var thumbnail = this.renderCache_[url]; | 349 var thumbnail = this.renderCache_[url]; |
350 if (thumbnail && event.metadata) | 350 if (thumbnail && event.metadata) |
351 this.setThumbnailImage_(thumbnail, url, event.metadata); | 351 this.setThumbnailImage_(thumbnail, url, event.metadata); |
352 }; | 352 }; |
353 | 353 |
354 /** | 354 /** |
355 * Update the thumbnail element cache. | 355 * Update the thumbnail element cache. |
356 * | 356 * |
357 * @param {string} oldUrl Old url. | 357 * @param {string} oldUrl Old url. |
358 * @param {string} newUrl New url. | 358 * @param {string} newUrl New url. |
359 * @private | 359 * @private |
360 */ | 360 */ |
361 Ribbon.prototype.remapCache_ = function(oldUrl, newUrl) { | 361 Ribbon.prototype.remapCache_ = function(oldUrl, newUrl) { |
362 if (oldUrl != newUrl && (oldUrl in this.renderCache_)) { | 362 if (oldUrl != newUrl && (oldUrl in this.renderCache_)) { |
363 this.renderCache_[newUrl] = this.renderCache_[oldUrl]; | 363 this.renderCache_[newUrl] = this.renderCache_[oldUrl]; |
364 delete this.renderCache_[oldUrl]; | 364 delete this.renderCache_[oldUrl]; |
365 } | 365 } |
366 }; | 366 }; |
OLD | NEW |