| 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 * @param {Element} container Content container. | 8 * @param {Element} container Content container. |
| 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 * @param {MetadataCache} metadataCache Metadata cache. | 11 * @param {MetadataCache} metadataCache Metadata cache. |
| 12 * @param {VolumeManagerWrapper} volumeManager Volume manager. |
| 12 * @param {function} toggleMode Function to switch to the Slide mode. | 13 * @param {function} toggleMode Function to switch to the Slide mode. |
| 13 * @constructor | 14 * @constructor |
| 14 */ | 15 */ |
| 15 function MosaicMode( | 16 function MosaicMode( |
| 16 container, dataModel, selectionModel, metadataCache, toggleMode) { | 17 container, dataModel, selectionModel, metadataCache, volumeManager, |
| 18 toggleMode) { |
| 17 this.mosaic_ = new Mosaic( | 19 this.mosaic_ = new Mosaic( |
| 18 container.ownerDocument, dataModel, selectionModel, metadataCache); | 20 container.ownerDocument, dataModel, selectionModel, metadataCache, |
| 21 volumeManager); |
| 19 container.appendChild(this.mosaic_); | 22 container.appendChild(this.mosaic_); |
| 20 | 23 |
| 21 this.toggleMode_ = toggleMode; | 24 this.toggleMode_ = toggleMode; |
| 22 this.mosaic_.addEventListener('dblclick', this.toggleMode_); | 25 this.mosaic_.addEventListener('dblclick', this.toggleMode_); |
| 23 this.showingTimeoutID_ = null; | 26 this.showingTimeoutID_ = null; |
| 24 } | 27 } |
| 25 | 28 |
| 26 /** | 29 /** |
| 27 * @return {Mosaic} The mosaic control. | 30 * @return {Mosaic} The mosaic control. |
| 28 */ | 31 */ |
| (...skipping 37 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 66 | 69 |
| 67 //////////////////////////////////////////////////////////////////////////////// | 70 //////////////////////////////////////////////////////////////////////////////// |
| 68 | 71 |
| 69 /** | 72 /** |
| 70 * Mosaic control. | 73 * Mosaic control. |
| 71 * | 74 * |
| 72 * @param {Document} document Document. | 75 * @param {Document} document Document. |
| 73 * @param {cr.ui.ArrayDataModel} dataModel Data model. | 76 * @param {cr.ui.ArrayDataModel} dataModel Data model. |
| 74 * @param {cr.ui.ListSelectionModel} selectionModel Selection model. | 77 * @param {cr.ui.ListSelectionModel} selectionModel Selection model. |
| 75 * @param {MetadataCache} metadataCache Metadata cache. | 78 * @param {MetadataCache} metadataCache Metadata cache. |
| 79 * @param {VolumeManagerWrapper} volumeManager Volume manager. |
| 76 * @return {Element} Mosaic element. | 80 * @return {Element} Mosaic element. |
| 77 * @constructor | 81 * @constructor |
| 78 */ | 82 */ |
| 79 function Mosaic(document, dataModel, selectionModel, metadataCache) { | 83 function Mosaic(document, dataModel, selectionModel, metadataCache, |
| 84 volumeManager) { |
| 80 var self = document.createElement('div'); | 85 var self = document.createElement('div'); |
| 81 Mosaic.decorate(self, dataModel, selectionModel, metadataCache); | 86 Mosaic.decorate( |
| 87 self, dataModel, selectionModel, metadataCache, volumeManager); |
| 82 return self; | 88 return self; |
| 83 } | 89 } |
| 84 | 90 |
| 85 /** | 91 /** |
| 86 * Inherits from HTMLDivElement. | 92 * Inherits from HTMLDivElement. |
| 87 */ | 93 */ |
| 88 Mosaic.prototype.__proto__ = HTMLDivElement.prototype; | 94 Mosaic.prototype.__proto__ = HTMLDivElement.prototype; |
| 89 | 95 |
| 90 /** | 96 /** |
| 91 * Default layout delay in ms. | 97 * Default layout delay in ms. |
| (...skipping 10 matching lines...) Expand all Loading... |
| 102 */ | 108 */ |
| 103 Mosaic.ANIMATED_SCROLL_DURATION = 500; | 109 Mosaic.ANIMATED_SCROLL_DURATION = 500; |
| 104 | 110 |
| 105 /** | 111 /** |
| 106 * Decorates a Mosaic instance. | 112 * Decorates a Mosaic instance. |
| 107 * | 113 * |
| 108 * @param {Mosaic} self Self pointer. | 114 * @param {Mosaic} self Self pointer. |
| 109 * @param {cr.ui.ArrayDataModel} dataModel Data model. | 115 * @param {cr.ui.ArrayDataModel} dataModel Data model. |
| 110 * @param {cr.ui.ListSelectionModel} selectionModel Selection model. | 116 * @param {cr.ui.ListSelectionModel} selectionModel Selection model. |
| 111 * @param {MetadataCache} metadataCache Metadata cache. | 117 * @param {MetadataCache} metadataCache Metadata cache. |
| 118 * @param {VolumeManagerWrapper} volumeManager Volume manager. |
| 112 */ | 119 */ |
| 113 Mosaic.decorate = function(self, dataModel, selectionModel, metadataCache) { | 120 Mosaic.decorate = function( |
| 121 self, dataModel, selectionModel, metadataCache, volumeManager) { |
| 114 self.__proto__ = Mosaic.prototype; | 122 self.__proto__ = Mosaic.prototype; |
| 115 self.className = 'mosaic'; | 123 self.className = 'mosaic'; |
| 116 | 124 |
| 117 self.dataModel_ = dataModel; | 125 self.dataModel_ = dataModel; |
| 118 self.selectionModel_ = selectionModel; | 126 self.selectionModel_ = selectionModel; |
| 119 self.metadataCache_ = metadataCache; | 127 self.metadataCache_ = metadataCache; |
| 128 self.volumeManager_ = volumeManager; |
| 120 | 129 |
| 121 // Initialization is completed lazily on the first call to |init|. | 130 // Initialization is completed lazily on the first call to |init|. |
| 122 }; | 131 }; |
| 123 | 132 |
| 124 /** | 133 /** |
| 125 * Initializes the mosaic element. | 134 * Initializes the mosaic element. |
| 126 */ | 135 */ |
| 127 Mosaic.prototype.init = function() { | 136 Mosaic.prototype.init = function() { |
| 128 if (this.tiles_) | 137 if (this.tiles_) |
| 129 return; // Already initialized, nothing to do. | 138 return; // Already initialized, nothing to do. |
| 130 | 139 |
| 131 this.layoutModel_ = new Mosaic.Layout(); | 140 this.layoutModel_ = new Mosaic.Layout(); |
| 132 this.onResize_(); | 141 this.onResize_(); |
| 133 | 142 |
| 134 this.selectionController_ = | 143 this.selectionController_ = |
| 135 new Mosaic.SelectionController(this.selectionModel_, this.layoutModel_); | 144 new Mosaic.SelectionController(this.selectionModel_, this.layoutModel_); |
| 136 | 145 |
| 137 this.tiles_ = []; | 146 this.tiles_ = []; |
| 138 for (var i = 0; i !== this.dataModel_.length; i++) | 147 for (var i = 0; i !== this.dataModel_.length; i++) { |
| 139 this.tiles_.push(new Mosaic.Tile(this, this.dataModel_.item(i))); | 148 var locationInfo = |
| 149 this.volumeManager_.getLocationInfo(this.dataModel_.item(i).getEntry()); |
| 150 this.tiles_.push( |
| 151 new Mosaic.Tile(this, this.dataModel_.item(i), locationInfo)); |
| 152 } |
| 140 | 153 |
| 141 this.selectionModel_.selectedIndexes.forEach(function(index) { | 154 this.selectionModel_.selectedIndexes.forEach(function(index) { |
| 142 this.tiles_[index].select(true); | 155 this.tiles_[index].select(true); |
| 143 }.bind(this)); | 156 }.bind(this)); |
| 144 | 157 |
| 145 this.initTiles_(this.tiles_); | 158 this.initTiles_(this.tiles_); |
| 146 | 159 |
| 147 // The listeners might be called while some tiles are still loading. | 160 // The listeners might be called while some tiles are still loading. |
| 148 this.initListeners_(); | 161 this.initListeners_(); |
| 149 }; | 162 }; |
| (...skipping 1465 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 1615 } | 1628 } |
| 1616 }; | 1629 }; |
| 1617 | 1630 |
| 1618 //////////////////////////////////////////////////////////////////////////////// | 1631 //////////////////////////////////////////////////////////////////////////////// |
| 1619 | 1632 |
| 1620 /** | 1633 /** |
| 1621 * A single tile of the image mosaic. | 1634 * A single tile of the image mosaic. |
| 1622 * | 1635 * |
| 1623 * @param {Element} container Container element. | 1636 * @param {Element} container Container element. |
| 1624 * @param {Gallery.Item} item Gallery item associated with this tile. | 1637 * @param {Gallery.Item} item Gallery item associated with this tile. |
| 1638 * @param {EntryLocation} locationInfo Location information for the tile. |
| 1625 * @return {Element} The new tile element. | 1639 * @return {Element} The new tile element. |
| 1626 * @constructor | 1640 * @constructor |
| 1627 */ | 1641 */ |
| 1628 Mosaic.Tile = function(container, item) { | 1642 Mosaic.Tile = function(container, item, locationInfo) { |
| 1629 var self = container.ownerDocument.createElement('div'); | 1643 var self = container.ownerDocument.createElement('div'); |
| 1630 Mosaic.Tile.decorate(self, container, item); | 1644 Mosaic.Tile.decorate(self, container, item, locationInfo); |
| 1631 return self; | 1645 return self; |
| 1632 }; | 1646 }; |
| 1633 | 1647 |
| 1634 /** | 1648 /** |
| 1635 * @param {Element} self Self pointer. | 1649 * @param {Element} self Self pointer. |
| 1636 * @param {Element} container Container element. | 1650 * @param {Element} container Container element. |
| 1637 * @param {Gallery.Item} item Gallery item associated with this tile. | 1651 * @param {Gallery.Item} item Gallery item associated with this tile. |
| 1652 * @param {EntryLocation} locationInfo Location info for the tile image. |
| 1638 */ | 1653 */ |
| 1639 Mosaic.Tile.decorate = function(self, container, item) { | 1654 Mosaic.Tile.decorate = function(self, container, item, locationInfo) { |
| 1640 self.__proto__ = Mosaic.Tile.prototype; | 1655 self.__proto__ = Mosaic.Tile.prototype; |
| 1641 self.className = 'mosaic-tile'; | 1656 self.className = 'mosaic-tile'; |
| 1642 | 1657 |
| 1643 self.container_ = container; | 1658 self.container_ = container; |
| 1644 self.item_ = item; | 1659 self.item_ = item; |
| 1645 self.left_ = null; // Mark as not laid out. | 1660 self.left_ = null; // Mark as not laid out. |
| 1661 self.hidpiEmbedded_ = locationInfo && locationInfo.isDriveBased; |
| 1646 }; | 1662 }; |
| 1647 | 1663 |
| 1648 /** | 1664 /** |
| 1649 * Load mode for the tile's image. | 1665 * Load mode for the tile's image. |
| 1650 * @enum {number} | 1666 * @enum {number} |
| 1651 */ | 1667 */ |
| 1652 Mosaic.Tile.LoadMode = { | 1668 Mosaic.Tile.LoadMode = { |
| 1653 LOW_DPI: 0, | 1669 LOW_DPI: 0, |
| 1654 HIGH_DPI: 1 | 1670 HIGH_DPI: 1 |
| 1655 }; | 1671 }; |
| (...skipping 114 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 1770 * @param {function()} onImageMeasured Image measured callback. | 1786 * @param {function()} onImageMeasured Image measured callback. |
| 1771 */ | 1787 */ |
| 1772 Mosaic.Tile.prototype.init = function(metadata, onImageMeasured) { | 1788 Mosaic.Tile.prototype.init = function(metadata, onImageMeasured) { |
| 1773 this.markUnloaded(); | 1789 this.markUnloaded(); |
| 1774 this.left_ = null; // Mark as not laid out. | 1790 this.left_ = null; // Mark as not laid out. |
| 1775 | 1791 |
| 1776 // Set higher priority for the selected elements to load them first. | 1792 // Set higher priority for the selected elements to load them first. |
| 1777 var priority = this.getAttribute('selected') ? 2 : 3; | 1793 var priority = this.getAttribute('selected') ? 2 : 3; |
| 1778 | 1794 |
| 1779 // Use embedded thumbnails on Drive, since they have higher resolution. | 1795 // Use embedded thumbnails on Drive, since they have higher resolution. |
| 1780 // TODO(mtomasz): Use Entry instead of paths. | |
| 1781 var hidpiEmbedded = | |
| 1782 PathUtil.isDriveBasedPath(this.getItem().getEntry().fullPath); | |
| 1783 this.thumbnailLoader_ = new ThumbnailLoader( | 1796 this.thumbnailLoader_ = new ThumbnailLoader( |
| 1784 this.getItem().getEntry(), | 1797 this.getItem().getEntry(), |
| 1785 ThumbnailLoader.LoaderType.CANVAS, | 1798 ThumbnailLoader.LoaderType.CANVAS, |
| 1786 metadata, | 1799 metadata, |
| 1787 undefined, // Media type. | 1800 undefined, // Media type. |
| 1788 hidpiEmbedded ? ThumbnailLoader.UseEmbedded.USE_EMBEDDED : | 1801 this.hidpiEmbedded_ ? ThumbnailLoader.UseEmbedded.USE_EMBEDDED : |
| 1789 ThumbnailLoader.UseEmbedded.NO_EMBEDDED, | 1802 ThumbnailLoader.UseEmbedded.NO_EMBEDDED, |
| 1790 priority); | 1803 priority); |
| 1791 | 1804 |
| 1792 // If no hidpi embedded thumbnail available, then use the low resolution | 1805 // If no hidpi embedded thumbnail available, then use the low resolution |
| 1793 // for preloading. | 1806 // for preloading. |
| 1794 if (!hidpiEmbedded) { | 1807 if (!this.hidpiEmbedded_) { |
| 1795 this.thumbnailPreloader_ = new ThumbnailLoader( | 1808 this.thumbnailPreloader_ = new ThumbnailLoader( |
| 1796 this.getItem().getEntry(), | 1809 this.getItem().getEntry(), |
| 1797 ThumbnailLoader.LoaderType.CANVAS, | 1810 ThumbnailLoader.LoaderType.CANVAS, |
| 1798 metadata, | 1811 metadata, |
| 1799 undefined, // Media type. | 1812 undefined, // Media type. |
| 1800 ThumbnailLoader.UseEmbedded.USE_EMBEDDED, | 1813 ThumbnailLoader.UseEmbedded.USE_EMBEDDED, |
| 1801 2); // Preloaders have always higher priotity, so the preload images | 1814 2); // Preloaders have always higher priotity, so the preload images |
| 1802 // are loaded as soon as possible. | 1815 // are loaded as soon as possible. |
| 1803 } | 1816 } |
| 1804 | 1817 |
| (...skipping 200 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 2005 return new Rect(this.left_ - this.container_.scrollLeft, this.top_, | 2018 return new Rect(this.left_ - this.container_.scrollLeft, this.top_, |
| 2006 this.width_, this.height_).inflate(-margin, -margin); | 2019 this.width_, this.height_).inflate(-margin, -margin); |
| 2007 }; | 2020 }; |
| 2008 | 2021 |
| 2009 /** | 2022 /** |
| 2010 * @return {number} X coordinate of the tile center. | 2023 * @return {number} X coordinate of the tile center. |
| 2011 */ | 2024 */ |
| 2012 Mosaic.Tile.prototype.getCenterX = function() { | 2025 Mosaic.Tile.prototype.getCenterX = function() { |
| 2013 return this.left_ + Math.round(this.width_ / 2); | 2026 return this.left_ + Math.round(this.width_ / 2); |
| 2014 }; | 2027 }; |
| OLD | NEW |