Lines Matching refs:Mosaic
17 this.mosaic_ = new Mosaic(
26 * @return {Mosaic} The mosaic control.
33 MosaicMode.prototype.getName = function() { return 'mosaic' };
69 * Mosaic control.
75 * @return {Element} Mosaic element.
78 function Mosaic(document, dataModel, selectionModel, metadataCache) {
80 Mosaic.decorate(self, dataModel, selectionModel, metadataCache);
87 Mosaic.prototype.__proto__ = HTMLDivElement.prototype;
94 Mosaic.LAYOUT_DELAY = 200;
102 Mosaic.ANIMATED_SCROLL_DURATION = 500;
105 * Decorate a Mosaic instance.
107 * @param {Mosaic} self Self pointer.
112 Mosaic.decorate = function(self, dataModel, selectionModel, metadataCache) {
113 self.__proto__ = Mosaic.prototype;
114 self.className = 'mosaic';
124 * Initialize the mosaic element.
126 Mosaic.prototype.init = function() {
130 this.layoutModel_ = new Mosaic.Layout();
134 new Mosaic.SelectionController(this.selectionModel_, this.layoutModel_);
138 this.tiles_.push(new Mosaic.Tile(this, this.dataModel_.item(i)));
151 * @return {boolean} Whether mosaic is initialized.
153 Mosaic.prototype.isInitialized = function() {
160 * We keep listening to events even when the mosaic is hidden in order to
165 Mosaic.prototype.initListeners_ = function() {
188 Mosaic.prototype.animatedScrollTo = function(targetPosition) {
205 var factor = delta / integral(0, Mosaic.ANIMATED_SCROLL_DURATION);
213 integral(Math.max(0, Mosaic.ANIMATED_SCROLL_DURATION - position),
214 Math.max(0, Mosaic.ANIMATED_SCROLL_DURATION - lastPosition));
244 * @return {Mosaic.Tile} Selected tile or undefined if no selection.
246 Mosaic.prototype.getSelectedTile = function() {
254 Mosaic.prototype.getTileRect = function(index) {
263 Mosaic.prototype.scrollIntoView = function(index) {
271 * @param {Array.<Mosaic.Tile>} tiles Array of tiles.
275 Mosaic.prototype.initTiles_ = function(tiles, opt_callback) {
306 * @param {Mosaic.Tile} tile Tile.
310 Mosaic.prototype.initTile_ = function(tile, callback) {
322 Mosaic.prototype.reload = function() {
334 Mosaic.prototype.layout = function() {
356 Mosaic.prototype.scheduleLayout = function(opt_delay) {
370 Mosaic.prototype.onResize_ = function() {
372 (Mosaic.Layout.PADDING_TOP + Mosaic.Layout.PADDING_BOTTOM));
382 Mosaic.prototype.onMouseEvent_ = function(event) {
394 if (target.classList.contains('mosaic-tile')) {
406 Mosaic.prototype.onScroll_ = function() {
418 Mosaic.prototype.onSelection_ = function(event) {
432 Mosaic.prototype.onLeadChange_ = function(event) {
446 Mosaic.prototype.onSplice_ = function(event) {
455 this.scheduleLayout(Mosaic.LAYOUT_DELAY);
461 newTiles.push(new Mosaic.Tile(this, this.dataModel_.item(index + t)));
468 console.error('Mosaic is out of sync');
477 Mosaic.prototype.onContentChange_ = function(event) {
492 Mosaic.Tile.LoadMode.HIGH_DPI,
493 this.scheduleLayout.bind(this, Mosaic.LAYOUT_DELAY));
503 Mosaic.prototype.onKeyDown = function(event) {
511 * @return {boolean} True if the mosaic zoom effect can be applied. It is
515 Mosaic.prototype.canZoom = function() {
520 * Show the mosaic.
522 Mosaic.prototype.show = function() {
528 // Mosaic is not animating but the large image is. Fade in the mosaic
534 // If the mosaic is not animated it will start fading in now.
541 * Hide the mosaic.
543 Mosaic.prototype.hide = function() {
548 * Checks if the mosaic view is visible.
552 Mosaic.prototype.isVisible_ = function() {
561 Mosaic.prototype.loadVisibleTiles_ = function() {
598 // Show high-dpi only when the mosaic view is visible.
599 var loadMode = this.isVisible_() ? Mosaic.Tile.LoadMode.HIGH_DPI :
600 Mosaic.Tile.LoadMode.LOW_DPI;
620 tile.load(Mosaic.Tile.LoadMode.LOW_DPI, function() {});
633 Mosaic.prototype.transform = function(tileRect, imageRect, opt_instant) {
662 * @param {Mosaic.Layout} layoutModel The layout model to use.
666 Mosaic.SelectionController = function(selectionModel, layoutModel) {
674 Mosaic.SelectionController.prototype.__proto__ =
678 Mosaic.SelectionController.prototype.getLastIndex = function() {
683 Mosaic.SelectionController.prototype.getIndexBefore = function(index) {
688 Mosaic.SelectionController.prototype.getIndexAfter = function(index) {
693 Mosaic.SelectionController.prototype.getIndexAbove = function(index) {
698 Mosaic.SelectionController.prototype.getIndexBelow = function(index) {
705 * Mosaic layout.
708 * @param {Mosaic.Density=} opt_maxDensity Layout density.
711 Mosaic.Layout = function(opt_mode, opt_maxDensity) {
712 this.mode_ = opt_mode || Mosaic.Layout.MODE_TENTATIVE;
713 this.maxDensity_ = opt_maxDensity || Mosaic.Density.createHighest();
718 * Blank space at the top of the mosaic element. We do not do that in CSS
721 Mosaic.Layout.PADDING_TOP = 50;
724 * Blank space at the bottom of the mosaic element.
726 Mosaic.Layout.PADDING_BOTTOM = 50;
730 * with the style of .mosaic-item in gallery.css (= 2 * ( 4 + 1))
732 Mosaic.Layout.SPACING = 10;
738 Mosaic.Layout.SCROLL_MARGIN = 30;
743 Mosaic.Layout.MODE_FINAL = 'final';
749 Mosaic.Layout.MODE_TENTATIVE = 'tentative';
754 Mosaic.Layout.MODE_DRY_RUN = 'dry_run';
761 Mosaic.Layout.prototype.reset_ = function() {
764 this.density_ = Mosaic.Density.createLowest();
765 if (this.mode_ != Mosaic.Layout.MODE_DRY_RUN) // DRY_RUN is sticky.
766 this.mode_ = Mosaic.Layout.MODE_TENTATIVE;
773 Mosaic.Layout.prototype.setViewportSize = function(width, height) {
782 Mosaic.Layout.prototype.getWidth = function() {
790 Mosaic.Layout.prototype.getHeight = function() {
796 * @return {Array.<Mosaic.Tile>} All tiles in the layout.
798 Mosaic.Layout.prototype.getTiles = function() {
806 Mosaic.Layout.prototype.getTileCount = function() {
812 * @return {Mosaic.Column} The last column or null for empty layout.
815 Mosaic.Layout.prototype.getLastColumn_ = function() {
822 Mosaic.Layout.prototype.getLaidOutTileCount = function() {
830 * @param {Mosaic.Tile} tile The tile to be added.
833 Mosaic.Layout.prototype.add = function(tile, isLast) {
837 // |Mosaic.Layout.density_| tracks the state of the 'global' backtracking
843 // |Mosaic.Column.density_| tracks the state of the 'local' backtracking
851 this.newColumn_ = new Mosaic.Column(
876 if (this.mode_ == Mosaic.Layout.MODE_FINAL) {
885 if (this.mode_ == Mosaic.Layout.MODE_TENTATIVE)
897 if (isFinalColumn && this.mode_ == Mosaic.Layout.MODE_TENTATIVE) {
916 Mosaic.Layout.prototype.commit_ = function(opt_offsetX, opt_offsetY) {
917 console.assert(this.mode_ != Mosaic.Layout.MODE_FINAL,
922 this.mode_ = Mosaic.Layout.MODE_FINAL;
935 * @return {Mosaic.Layout} A horizontally stretched layout.
938 Mosaic.Layout.prototype.findHorizontalLayout_ = function() {
953 var layout = new Mosaic.Layout(
954 Mosaic.Layout.MODE_DRY_RUN, this.density_.clone());
973 Mosaic.Layout.prototype.invalidateFromTile_ = function(index) {
982 console.assert(this.mode_ == Mosaic.Layout.MODE_FINAL,
989 this.mode_ = Mosaic.Layout.MODE_TENTATIVE;
1000 Mosaic.Layout.prototype.getHorizontalAdjacentIndex = function(
1033 Mosaic.Layout.prototype.getVerticalAdjacentIndex = function(
1086 Mosaic.Layout.prototype.getColumnIndexByTile_ = function(index) {
1104 Mosaic.Layout.rescaleSizesToNewTotal = function(sizes, newTotal) {
1131 Mosaic.Density = function(horizontal, vertical) {
1139 Mosaic.Density.MIN_HORIZONTAL = 1;
1144 Mosaic.Density.MAX_HORIZONTAL = 3;
1149 Mosaic.Density.MIN_VERTICAL = 2;
1154 Mosaic.Density.MAX_VERTICAL = 3;
1157 * @return {Mosaic.Density} Lowest density.
1159 Mosaic.Density.createLowest = function() {
1160 return new Mosaic.Density(
1161 Mosaic.Density.MIN_HORIZONTAL,
1162 Mosaic.Density.MIN_VERTICAL /* ignored when horizontal is at min */);
1166 * @return {Mosaic.Density} Highest density.
1168 Mosaic.Density.createHighest = function() {
1169 return new Mosaic.Density(
1170 Mosaic.Density.MAX_HORIZONTAL,
1171 Mosaic.Density.MAX_VERTICAL);
1175 * @return {Mosaic.Density} A clone of this density object.
1177 Mosaic.Density.prototype.clone = function() {
1178 return new Mosaic.Density(this.horizontal, this.vertical);
1182 * @param {Mosaic.Density} that The other object.
1185 Mosaic.Density.prototype.equals = function(that) {
1193 Mosaic.Density.prototype.increase = function() {
1194 if (this.horizontal == Mosaic.Density.MIN_HORIZONTAL ||
1195 this.vertical == Mosaic.Density.MAX_VERTICAL) {
1196 console.assert(this.horizontal < Mosaic.Density.MAX_HORIZONTAL);
1198 this.vertical = Mosaic.Density.MIN_VERTICAL;
1207 Mosaic.Density.prototype.decreaseHorizontal = function() {
1208 console.assert(this.horizontal > Mosaic.Density.MIN_HORIZONTAL);
1217 Mosaic.Density.prototype.isRowComplete = function(tileCount, rowIndex) {
1224 * A column in a mosaic layout. Contains rows.
1231 * @param {Mosaic.Density} density Layout density.
1234 Mosaic.Column = function(index, firstRowIndex, firstTileIndex, left, maxHeight,
1250 Mosaic.Column.prototype.reset_ = function() {
1259 Mosaic.Column.prototype.getTileCount = function() { return this.tiles_.length };
1264 Mosaic.Column.prototype.getNextTileIndex = function() {
1271 Mosaic.Column.prototype.getNextRowIndex = function() {
1276 * @return {Array.<Mosaic.Tile>} Array of tiles in the column.
1278 Mosaic.Column.prototype.getTiles = function() { return this.tiles_ };
1284 Mosaic.Column.prototype.hasTile = function(index) {
1296 Mosaic.Column.prototype.getEdgeTileIndex_ = function(y, direction) {
1306 * @return {Mosaic.Row} The row containing the tile with a given index.
1308 Mosaic.Column.prototype.getRowByTileIndex = function(index) {
1319 * @param {Mosaic.Tile} tile The tile to add.
1321 Mosaic.Column.prototype.add = function(tile) {
1325 this.newRow_ = new Mosaic.Row(this.getNextTileIndex());
1343 Mosaic.Column.prototype.prepareLayout = function(opt_force) {
1372 Mosaic.Layout.rescaleSizesToNewTotal(this.rowHeights_, this.maxHeight_);
1381 Mosaic.Column.prototype.retryWithLowerDensity = function() {
1389 Mosaic.Column.prototype.getLeft = function() { return this.left_ };
1394 Mosaic.Column.prototype.getRight = function() {
1401 Mosaic.Column.prototype.getHeight = function() { return this.height_ };
1408 Mosaic.Column.prototype.layout = function(opt_offsetX, opt_offsetY) {
1411 var rowTop = Mosaic.Layout.PADDING_TOP;
1427 Mosaic.Column.prototype.isSuboptimal = function() {
1439 var allSmall = Math.max.apply(null, sizes) <= Mosaic.Tile.SMALL_IMAGE_SIZE;
1444 var allLarge = Math.min.apply(null, sizes) > Mosaic.Tile.SMALL_IMAGE_SIZE;
1459 * A row in a mosaic layout. Contains tiles.
1464 Mosaic.Row = function(firstTileIndex) {
1470 * @param {Mosaic.Tile} tile The tile to add.
1472 Mosaic.Row.prototype.add = function(tile) {
1473 console.assert(this.getTileCount() < Mosaic.Density.MAX_HORIZONTAL);
1478 * @return {Array.<Mosaic.Tile>} Array of tiles in the row.
1480 Mosaic.Row.prototype.getTiles = function() { return this.tiles_ };
1485 * @return {Mosaic.Tile} Requested tile or null if not found.
1487 Mosaic.Row.prototype.getTileByIndex = function(index) {
1497 Mosaic.Row.prototype.getTileCount = function() { return this.tiles_.length };
1503 Mosaic.Row.prototype.hasTile = function(index) {
1512 Mosaic.Row.prototype.coversY = function(y) {
1519 Mosaic.Row.prototype.getCenterY = function() {
1530 Mosaic.Row.prototype.getEdgeTileIndex_ = function(direction) {
1541 Mosaic.Row.prototype.getTotalContentAspectRatio_ = function() {
1554 Mosaic.Row.prototype.getTotalHorizontalSpacing_ = function() {
1555 return Mosaic.Layout.SPACING * this.getTileCount();
1562 Mosaic.Row.prototype.getMaxWidth = function() {
1578 Mosaic.Row.prototype.getHeightForWidth = function(width) {
1582 return contentHeight + Mosaic.Layout.SPACING;
1586 * Position the row in the mosaic.
1593 Mosaic.Row.prototype.layout = function(left, top, width, height) {
1598 var contentHeight = height - Mosaic.Layout.SPACING;
1603 Mosaic.Layout.rescaleSizesToNewTotal(tileContentWidth, contentWidth);
1607 var tileWidth = tileContentWidth[t] + Mosaic.Layout.SPACING;
1616 * A single tile of the image mosaic.
1623 Mosaic.Tile = function(container, item) {
1625 Mosaic.Tile.decorate(self, container, item);
1634 Mosaic.Tile.decorate = function(self, container, item) {
1635 self.__proto__ = Mosaic.Tile.prototype;
1636 self.className = 'mosaic-tile';
1647 Mosaic.Tile.LoadMode = {
1655 Mosaic.Tile.prototype.__proto__ = HTMLDivElement.prototype;
1660 Mosaic.Tile.MIN_CONTENT_SIZE = 64;
1665 Mosaic.Tile.MAX_CONTENT_SIZE = 512;
1670 Mosaic.Tile.GENERIC_ICON_SIZE = 128;
1676 Mosaic.Tile.SMALL_IMAGE_SIZE = 160;
1681 Mosaic.Tile.prototype.getItem = function() { return this.item_ };
1686 Mosaic.Tile.prototype.getMaxContentHeight = function() {
1693 Mosaic.Tile.prototype.getAspectRatio = function() { return this.aspectRatio_ };
1698 Mosaic.Tile.prototype.isInitialized = function() {
1705 * @param {Mosaic.Tile.LoadMode=} opt_loadMode Loading mode, default: LOW_DPI.
1709 Mosaic.Tile.prototype.isLoaded = function(opt_loadMode) {
1710 var loadMode = opt_loadMode || Mosaic.Tile.LoadMode.LOW_DPI;
1712 case Mosaic.Tile.LoadMode.LOW_DPI:
1716 case Mosaic.Tile.LoadMode.HIGH_DPI:
1727 * @param {Mosaic.Tile.LoadMode=} opt_loadMode Loading mode, default: LOW_DPI.
1731 Mosaic.Tile.prototype.isLoading = function(opt_loadMode) {
1732 var loadMode = opt_loadMode || Mosaic.Tile.LoadMode.LOW_DPI;
1734 case Mosaic.Tile.LoadMode.LOW_DPI:
1738 case Mosaic.Tile.LoadMode.HIGH_DPI:
1749 Mosaic.Tile.prototype.markUnloaded = function() {
1767 Mosaic.Tile.prototype.init = function(metadata, onImageMeasured) {
1800 if (width > Mosaic.Tile.MAX_CONTENT_SIZE) {
1801 height = Math.round(height * Mosaic.Tile.MAX_CONTENT_SIZE / width);
1802 width = Mosaic.Tile.MAX_CONTENT_SIZE;
1805 if (height > Mosaic.Tile.MAX_CONTENT_SIZE) {
1806 width = Math.round(width * Mosaic.Tile.MAX_CONTENT_SIZE / height);
1807 height = Mosaic.Tile.MAX_CONTENT_SIZE;
1810 this.maxContentHeight_ = Math.max(Mosaic.Tile.MIN_CONTENT_SIZE, height);
1822 setDimensions(Mosaic.Tile.GENERIC_ICON_SIZE,
1823 Mosaic.Tile.GENERIC_ICON_SIZE);
1838 * @param {Mosaic.Tile.LoadMode} loadMode Loading mode.
1842 Mosaic.Tile.prototype.load = function(loadMode, onImageLoaded) {
1857 case Mosaic.Tile.LoadMode.LOW_DPI:
1861 case Mosaic.Tile.LoadMode.HIGH_DPI:
1876 finalizeLoader(Mosaic.Tile.LoadMode.LOW_DPI,
1885 (loadMode == Mosaic.Tile.LoadMode.HIGH_DPI || !this.imagePreloading_)) {
1891 finalizeLoader(Mosaic.Tile.LoadMode.HIGH_DPI,
1901 Mosaic.Tile.prototype.unload = function() {
1917 Mosaic.Tile.prototype.select = function(on) {
1925 * Position the tile in the mosaic.
1932 Mosaic.Tile.prototype.layout = function(left, top, width, height) {
1962 Mosaic.Tile.prototype.scrollIntoView = function(opt_animated) {
1967 var tileLeft = this.left_ - Mosaic.Layout.SCROLL_MARGIN;
1971 var tileRight = this.left_ + this.width_ + Mosaic.Layout.SCROLL_MARGIN;
1989 Mosaic.Tile.prototype.getImageRect = function() {
1993 var margin = Mosaic.Layout.SPACING / 2;
2001 Mosaic.Tile.prototype.getCenterX = function() {
