Add the collapsed 'miniview' to the apps and most visisted sections.

chrome/browser/resources/ntp/most_visited.js

 // Copyright (c) 2010 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.
 
 // Dependencies that we should remove/formalize:
 // ../shared/js/class_list.js
 // util.js
 //
 // afterTransition
 // chrome.send
@@ skipping 23 matching lines @@
     } else {
       el.classList.remove('pinned');
     }
   }
 
   function getThumbnailIndex(el) {
     var nodes = el.parentNode.querySelectorAll('.thumbnail-container');
     return Array.prototype.indexOf.call(nodes, el);
   }
 
-  function MostVisited(el, useSmallGrid, visible) {
+  function MostVisited(el, miniview, useSmallGrid, visible) {
     this.element = el;
+    this.miniview = miniview;
     this.useSmallGrid_ = useSmallGrid;
     this.visible_ = visible;
 
     this.createThumbnails_();
     this.applyMostVisitedRects_();
 
     el.addEventListener('click', bind(this.handleClick_, this));
     el.addEventListener('keydown', bind(this.handleKeyDown_, this));
 
     document.addEventListener('DOMContentLoaded',
@@ skipping 438 matching lines @@
       var maxItems = 8;
       data.length = Math.min(maxItems, data.length);
       var len = data.length;
       for (var i = len; i < maxItems; i++) {
         data[i] = {filler: true};
       }
 
       // On setting we need to update the items
       this.data_ = data;
       this.updateMostVisited_();
+      this.updateMiniview_();
     },
 
     updateMostVisited_: function() {
 
       function getThumbnailClassName(item) {
         return 'thumbnail-container' +
             (item.pinned ? ' pinned' : '') +
             (item.filler ? ' filler' : '');
       }
 
@@ skipping 34 matching lines @@
         t.querySelector('.thumbnail-wrapper').style.backgroundImage =
             url(thumbnailUrl);
         var titleDiv = t.querySelector('.title > div');
         titleDiv.xtitle = titleDiv.textContent = d.title;
         var faviconUrl = d.faviconUrl || 'chrome://favicon/' + d.url;
         titleDiv.style.backgroundImage = url(faviconUrl);
         titleDiv.dir = d.direction;
       }
     },
 
+    updateMiniview_: function() {
+      this.miniview.textContent = '';
+      var data = this.data.slice(0, MAX_MINIVIEW_ITEMS);
+      for (var i = 0, item; item = data[i]; i++) {
+        var span = document.createElement('span');
+        var a = span.appendChild(document.createElement('a'));
+        a.href = item.url;
+        a.textContent = item.title;
+        a.style.backgroundImage = url('chrome://favicon/' + item.url);
+        a.className = 'item';
+        this.miniview.appendChild(span);
+      }
+    },
+
     handleClick_: function(e) {
       var target = e.target;
       if (target.classList.contains('pin')) {
         this.togglePinned_(getItem(target));
         e.preventDefault();
       } else if (target.classList.contains('remove')) {
         this.blacklist(getItem(target));
         e.preventDefault();
       } else {
         var item = getItem(target);
@@ skipping 12 matching lines @@
     handleKeyDown_: function(e) {
       if (!IS_MAC && e.keyCode == 46 || // Del
           IS_MAC && e.metaKey && e.keyCode == 8) { // Cmd + Backspace
         this.blacklist(e.target);
       }
     }
   };
 
   return MostVisited;
 })();