Sync Promo: Add a way to collapse the sync promo

chrome/browser/resources/new_tab.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.
 
 // To avoid creating tons of unnecessary nodes. We assume we cannot fit more
 // than this many items in the miniview.
 var MAX_MINIVIEW_ITEMS = 15;
 
 // Extra spacing at the top of the layout.
 var LAYOUT_SPACING_TOP = 25;
@@ skipping 470 matching lines @@
   var section;
   for (i = 0; section = sections[i]; i++) {
     headerHeight += section.fixedHeight;
     if (section.expanded) {
       expandedSection = section;
       i++;
       break;
     }
   }
 
+  // Include the height of the sync promo bar.
+  var sync_promo_height = $('sync-promo').offsetHeight;
+  headerHeight += sync_promo_height;
+
   // Calculate the height of the fixed elements below the expanded section, if
   // any.
   for (; section = sections[i]; i++) {
     footerHeight += section.fixedHeight;
   }
   // Leave room for bottom bar if it's visible.
   footerHeight += $('closed-sections-bar').offsetHeight;
 
 
   // Determine the height to use for the expanded section. If there isn't enough
@@ skipping 27 matching lines @@
     }
   } else {
     // We only set the document height when a section is expanded. If
     // all sections are collapsed, then get rid of the previous height.
     document.body.style.height = '';
   }
 
   maxiviewVisibleHeight = expandedSectionHeight;
 
   // Now position all the elements.
-  var y = LAYOUT_SPACING_TOP;
+  var y = LAYOUT_SPACING_TOP + sync_promo_height;
   for (i = 0, section; section = sections[i]; i++) {
     section.section.style.top = y + 'px';
     y += section.fixedHeight;
 
     if (section.maxiview) {
       if (section == expandedSection) {
         section.maxiview.style.top = y + 'px';
       } else {
         // The miniviews fade out gradually, so it may have height at this
         // point. We position the maxiview as if the miniview was not displayed
         // by subtracting off the miniview's total height (height + margin).
         var miniviewFudge = 40;  // miniview margin-bottom + margin-top
         var miniviewHeight = section.miniview.offsetHeight + miniviewFudge;
         section.maxiview.style.top = y - miniviewHeight + 'px';
       }
     }
 
     if (section.maxiview && section == expandedSection)
       updateMask(
           section.maxiview, expandedSectionHeight, expandedSectionIsClipped);
 
     if (section == expandedSection)
       y += expandedSectionHeight;
   }
   if (cr.isChromeOS)
     $('closed-sections-bar').style.top = y + 'px';
 
+  // Position the notification container below the sync promo.
+  $('notification-container').style.top = sync_promo_height + 'px';
+
   updateMenuSections();
   updateAttributionDisplay(y);
 }
 
 function updateMask(maxiview, visibleHeightPx, isClipped) {
   // If the section isn't actually clipped, then we don't want to use a mask at
   // all, since enabling one turns off subpixel anti-aliasing.
   if (!isClipped) {
     maxiview.style.WebkitMaskImage = 'none';
     return;
@@ skipping 895 matching lines @@
 
   // Initialize the listener for the "hide this" link on the apps promo. We do
   // this outside of getAppsCallback because it only needs to be done once per
   // NTP load.
   $('apps-promo-hide').addEventListener('click', function() {
     chrome.send('hideAppsPromo', []);
     document.documentElement.classList.remove('apps-promo-visible');
     layoutSections();
   });
 });