[ntp4] Limit the maximum bookmark tiles that will display at once, for now.

chrome/browser/resources/ntp4/bookmarks_page.js

 // Copyright (c) 2011 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 cr.define('ntp4', function() {
   'use strict';
 
   var localStrings = new LocalStrings;
 
   /**
    * A running count of bookmark tiles that we create so that each will have
    * a unique ID.
    */
   var tileId = 0;
 
   /**
+   * The maximum number of tiles that we will display on this page.  If there
+   * are not enough spaces to show all bookmarks, we'll include a link to the
+   * Bookmarks manager.
+   • TODO(csilv): Eliminate the need for this restraint.
+   * @type {number}
+   * @const
+   */
+  var MAX_BOOKMARK_TILES = 60;

[Evan Stade, 2011/08/25 01:46:24]

I'd do 18

[csilv, 2011/08/25 17:41:56]

Done.

+
+  /**
    * Creates a new bookmark object.
    * @param {Object} data The url and title.
    * @constructor
    * @extends {HTMLDivElement}
    */
   function Bookmark(data) {
     var el = $('bookmark-template').cloneNode(true);
     el.__proto__ = Bookmark.prototype;
     el.data = data;
     el.initialize();
@@ skipping 140 matching lines @@
     el.initialize();
 
     return el;
   }
 
   BookmarksPage.prototype = {
     __proto__: TilePage.prototype,
 
     initialize: function() {
       this.classList.add('bookmarks-page');
+
+      // insert the bookmark titles header which is unique to bookmark pages.
       this.insertBefore($('bookmarks-title-wrapper'), this.firstChild);
+
+      // insert a container for a link to a Bookmarks Manager page.
+      var link = document.createElement('a');
+      link.className = 'bookmarks-manager-link';
+      link.textContent = localStrings.getString('bookmarksManagerLinkTitle');
+      var container = document.createElement('div');
+      container.className = 'bookmarks-manager-link-container';
+      container.hidden = true;
+      container.appendChild(link);
+      this.querySelector('.tile-page-content').appendChild(container);
     },
 
     /**
      * Build the bookmark titles bar (ie, navigation hiearchy).
      * @param {Array} items The parent hiearchy of the current folder.
      * @private
      */
     updateBookmarkTitles_: function(items) {
       var wrapper = $('bookmarks-title-wrapper');
       var title = wrapper.querySelector('.section-title');
@@ skipping 12 matching lines @@
       title.appendChild(titleCrumb);
     },
 
     /**
      * Build the bookmark tiles.
      * @param {Array} items The contents of the current folder.
      * @private
      */
     updateBookmarkTiles_: function(items) {
       this.removeAllTiles();
-      for (var i = 0; i < items.length; i++)
+      var tile_count = Math.min(items.length, MAX_BOOKMARK_TILES);
+      for (var i = 0; i < tile_count; i++)
         this.appendTile(new Bookmark(items[i]), false);
+
+      var container = this.querySelector('.bookmarks-manager-link-container');
+      if (items.length > MAX_BOOKMARK_TILES) {
+        var link = container.querySelector('.bookmarks-manager-link');
+        link.href = 'chrome://bookmarks/#' + this.id;
+        container.hidden = false;
+      } else {
+        container.hidden = true;
+      }
     },
 
     /** @inheritDoc */
     shouldAcceptDrag: function(dataTransfer) {
       return false;
     },
 
     /**
      * Set the bookmark data that should be displayed, replacing any existing
      * data.
      */
     set data(data) {
+      this.id = data.navigationItems[0].id;
       this.updateBookmarkTiles_(data.items);
       this.updateBookmarkTitles_(data.navigationItems);
     },
   };
 
   /**
    * Initializes and renders the bookmark chevron canvas.  This needs to be
    * performed after the page has been loaded so that we have access to the
    * style sheet values.
    */
@@ skipping 24 matching lines @@
   };
 
   return {
     BookmarksPage: BookmarksPage,
     initBookmarkChevron: initBookmarkChevron,
     setBookmarksFaviconDominantColor: setBookmarksFaviconDominantColor
   };
 });
 
 window.addEventListener('load', ntp4.initBookmarkChevron);