[NTP] Allow reordering of apps via drag and drop.

chrome/browser/resources/new_new_tab.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.
 
 // 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 177 matching lines @@
     winEl.sessionTag = win.sessionTag;
     winEl.winNum = i;
     winEl.addEventListener('click', maybeOpenForeignWindow);
     winEl.addEventListener('keydown',
                            handleIfEnterKey(maybeOpenForeignWindow));
     winSpan.appendChild(winEl);
 
     // Sort tabs by MRU order
     win.tabs.sort(function(a, b) {
       return a.timestamp < b.timestamp;
-    })
+    });
 
     // Create individual tab information.
     win.tabs.forEach(function(data) {
         var tabEl = document.createElement('a');
         tabEl.className = 'item link tab';
         tabEl.href = data.timestamp;
         tabEl.style.backgroundImage = url('chrome://favicon/' + data.url);
         tabEl.dir = data.direction;
         tabEl.textContent = data.title;
         tabEl.sessionTag = win.sessionTag;
         tabEl.winNum = i;
         tabEl.sessionId = data.sessionId;
         tabEl.addEventListener('click', maybeOpenForeignTab);
         tabEl.addEventListener('keydown',
                                handleIfEnterKey(maybeOpenForeignTab));
 
         winSpan.appendChild(tabEl);
-    })
+    });
 
     // Append the window.
     stack.appendChild(winSpan);
   });
   return stack;
 }
 
 var recentItems = [];
 
 function recentlyClosedTabs(data) {
@@ skipping 83 matching lines @@
     return;
   }
 
   var oldLayoutMode = layoutMode;
   var b = useSmallGrid();
   layoutMode = b ? LayoutMode.SMALL : LayoutMode.NORMAL;
 
   if (layoutMode != oldLayoutMode){
     mostVisited.useSmallGrid = b;
     mostVisited.layout();
+    apps.invalidate();
+    apps.layout();
     renderRecentlyClosed();
     renderForeignSessions();
     updateAllMiniviewClippings();
   }
 
   layoutSections();
 }
 
 // Stores some information about each section necessary to layout. A new
 // instance is constructed for each section on each layout.
@@ skipping 277 matching lines @@
         // The miniview is hidden immediately (no need to set this async).
         miniview.classList.remove('opaque');
       }
     }
 
     switch (section) {
       case Section.THUMB:
         mostVisited.visible = true;
         mostVisited.layout();
         break;
+      case Section.APPS:
+        apps.visible = true;

[Aaron Boodman, 2011/01/22 23:42:57]

The visible flag here (and in mostVisited ftm) seems to serve the same purpose
that the css classes are.

If you rebase, I believe you can just check !classList.contains('disabled') &&
!classList.contains('hidden') without having the extra flag.

[jstritar, 2011/01/24 01:00:42]

I think we could use the classes to determine visibility, but using this flag
helps us avoid invalidating the layout when not necessary.

+        apps.layout(true);
     }
   }
 }
 
 // Show this section and hide all other sections - at most one section can
 // be open at one time.
 function showOnlySection(section) {
   for (var p in Section) {
     if (p == section)
       showSection(Section[p]);
     else
       hideSection(Section[p]);
   }
 }
 
 function hideSection(section) {
   if (section & shownSections) {
     shownSections &= ~section;
 
     switch (section) {
       case Section.THUMB:
         mostVisited.visible = false;
         mostVisited.layout();
         break;
+      case Section.APPS:
+        apps.visible = false;
+        apps.layout();
+        break;
     }
 
     var el = getSectionElement(section);
     if (el) {
       el.classList.add('hidden');
 
       var maxiview = getSectionMaxiview(el);
       if (maxiview) {
         maxiview.classList.add(isDoneLoading() ? 'hiding' : 'hidden');
         maxiview.classList.remove('opaque');
@@ skipping 731 matching lines @@
   var promoLink = document.querySelector('#apps-promo-text1 a');
   promoLink.id = 'apps-promo-link';
   promoLink.href = localStrings.getString('web_store_url');
 
   $('apps-promo-hide').addEventListener('click', function() {
     chrome.send('hideAppsPromo', []);
     document.documentElement.classList.remove('apps-promo-visible');
     layoutSections();
   });
 });