[SYNC] Sessions datatype refactor. Most things related to sessions under-the-...

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 117 matching lines @@
 }
 
 function renderForeignSessions() {
   // Remove all existing items and create new items.
   var sessionElement = $('foreign-sessions');
   var parentSessionElement = sessionElement.lastElementChild;
   parentSessionElement.textContent = '';
 
   // For each client, create entries and append the lists together.
   sessionItems.forEach(function(item, i) {
-    // TODO(zea): Get real client names. See issue 59672
+    // TODO(zea): Get real client names. See crbug/59672.
     var name = 'Client ' + i;
     parentSessionElement.appendChild(createForeignSession(item, name));
   });
 
   layoutForeignSessions();
 }
 
 function layoutForeignSessions() {
   var sessionElement = $('foreign-sessions');
   // We cannot use clientWidth here since the width has a transition.
   var availWidth = useSmallGrid() ? 692 : 920;
   var parentSessEl = sessionElement.lastElementChild;
 
   if (parentSessEl.hasChildNodes()) {
     sessionElement.classList.remove('disabled');
   } else {
     sessionElement.classList.add('disabled');
   }
 }
 
 function createForeignSession(client, name) {
   // Vertically stack the windows in a client.
   var stack = document.createElement('div');
-  stack.className = 'foreign-session-client';
+  stack.className = 'foreign-session-client item link';
   stack.textContent = name;
+  stack.sessionTag = client[0].sessionTag;
 
-  client.forEach(function(win) {
-    // We know these are lists of multiple tabs, don't need the special case for
-    // single url + favicon.
-    var el = document.createElement('p');
-    el.className = 'item link window';
-    el.tabItems = win.tabs;
-    el.tabIndex = 0;
-    el.textContent = formatTabsText(win.tabs.length);
+  client.forEach(function(win, i) {
+    // Create a window entry.
+    var winSpan = document.createElement('span');
+    var winEl = document.createElement('p');
+    winEl.className = 'item link window';
+    winEl.tabItems = win.tabs;
+    winEl.tabIndex = 0;
+    winEl.textContent = formatTabsText(win.tabs.length);
+    winEl.xtitle = win.title;
+    winEl.sessionTag = win.sessionTag;
+    winEl.winNum = i;
+    winEl.addEventListener('click', maybeOpenForeignWindow);
+    winEl.addEventListener('keydown',
+                           handleIfEnterKey(maybeOpenForeignWindow));
+    winSpan.appendChild(winEl);
 
-    el.sessionId = win.sessionId;
-    el.xtitle = win.title;
-    el.sessionTag = win.sessionTag;
+    // Sort tabs by MRU order
+    win.tabs.sort(function(a, b) {
+      return a.timestamp < b.timestamp;
+    })
 
-    // Add the actual tab listing.
-    stack.appendChild(el);
+    // 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));
 
-    // TODO(zea): Should there be a clickHandler as well? We appear to be
-    // breaking windowTooltip's hide: removeEventListener(onMouseOver) when we
-    // click.
+        winSpan.appendChild(tabEl);
+    })
+
+    // Append the window.
+    stack.appendChild(winSpan);
   });
   return stack;
 }
 
 var recentItems = [];
 
 function recentlyClosedTabs(data) {
   logEvent('received recently closed tabs');
   // We need to store the recent items so we can update the layout on a resize.
   recentItems = data;
@@ skipping 757 matching lines @@
     return el.sessionId !== undefined;
   });
   if (el) {
     chrome.send('reopenTab', [String(el.sessionId)]);
     e.preventDefault();
 
     setWindowTooltipTimeout();
   }
 }
 
-function maybeReopenSession(e) {
+// Note that the openForeignSession calls can fail, resulting this method to
+// not have any action (hence the maybe).
+function maybeOpenForeignSession(e) {
   var el = findAncestor(e.target, function(el) {
-    return el.sessionId;
+    return el.sessionTag !== undefined;
   });
   if (el) {
-    chrome.send('reopenForeignSession', [String(el.sessionTag)]);
+    chrome.send('openForeignSession', [String(el.sessionTag)]);
+    e.stopPropagation();
+    e.preventDefault();
+    setWindowTooltipTimeout();
+  }
+}
 
+function maybeOpenForeignWindow(e) {
+  var el = findAncestor(e.target, function(el) {
+    return el.winNum !== undefined;
+  });
+  if (el) {
+    chrome.send('openForeignSession', [String(el.sessionTag),
+        String(el.winNum)]);
+    e.stopPropagation();
+    e.preventDefault();
+    setWindowTooltipTimeout();
+  }
+}
+
+function maybeOpenForeignTab(e) {
+  var el = findAncestor(e.target, function(el) {
+    return el.sessionId !== undefined;
+  });
+  if (el) {
+    chrome.send('openForeignSession', [String(el.sessionTag), String(el.winNum),
+        String(el.sessionId)]);
+    e.stopPropagation();
+    e.preventDefault();
     setWindowTooltipTimeout();
   }
 }
 
 // HACK(arv): After the window onblur event happens we get a mouseover event
 // on the next item and we want to make sure that we do not show a tooltip
 // for that.
 function setWindowTooltipTimeout(e) {
   window.setTimeout(function() {
     windowTooltip.hide();
@@ skipping 16 matching lines @@
 
 recentlyClosedElement.addEventListener('click', maybeReopenTab);
 recentlyClosedElement.addEventListener('keydown',
                                        handleIfEnterKey(maybeReopenTab));
 
 recentlyClosedElement.addEventListener('mouseover', maybeShowWindowTooltip);
 recentlyClosedElement.addEventListener('focus', maybeShowWindowTooltip, true);
 
 var foreignSessionElement = $('foreign-sessions');
 
-foreignSessionElement.addEventListener('click', maybeReopenSession);
+foreignSessionElement.addEventListener('click', maybeOpenForeignSession);
 foreignSessionElement.addEventListener('keydown',
-                                       handleIfEnterKey(maybeReopenSession));
+                                       handleIfEnterKey(
+                                           maybeOpenForeignSession));
 
 foreignSessionElement.addEventListener('mouseover', maybeShowWindowTooltip);
 foreignSessionElement.addEventListener('focus', maybeShowWindowTooltip, true);
 
 /**
  * This object represents a tooltip representing a closed window. It is
  * shown when hovering over a closed window item or when the item is focused. It
  * gets hidden when blurred or when mousing out of the menu or the item.
  * @param {Element} tooltipEl The element to use as the tooltip.
  * @constructor
@@ skipping 233 matching lines @@
   var promoLink = promoText1.querySelector('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();
   });
 });