Adding chrome://sessions webui for prototyping tab sync NTP stuff.

This adds the necessary plumbing for chrome://sessions webui page which shows a hierarchy of sessions and their windows and tabs as well as a "magic" list of suggested tabs. The magic list is currently just the last 10 tabs by timestamp for now - but can later be changed to prototype other heuristics.

BUG=none
TEST=manual

Committed: http://src.chromium.org/viewvc/chrome?view=rev&revision=88334
Review URL: http://codereview.chromium.org/6969016

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@88364 0039d316-1c4b-4281-b951-d872f2087c98

chrome/app/generated_resources.grd

@@ -4320,6 +4320,23 @@ Keep your key file in a safe place. You will need it to create new versions of y
         Crash reporting is disabled.
       </message>
 
+      <!-- chrome://sessions -->
+      <message name="IDS_SESSIONS_TITLE" desc="Title for the chrome://sessions page.">
+        Sessions
+      </message>
+      <message name="IDS_SESSIONS_SESSION_COUNT_BANNER_FORMAT" desc="Format for sessions count banner on chrome://sessions">
+        Sessions (<ph name="SESSION_COUNT">$1<ex>3</ex></ph>)
+      </message>
+      <message name="IDS_SESSIONS_NO_SESSIONS_MESSAGE" desc="The explanatory message for chrome://sessions when there are no sessions">
+        There are no sessions.
+      </message>
+      <message name="IDS_SESSIONS_MAGIC_LIST_BANNER_FORMAT" desc="Format for magic list count banner on chrome://sessions">
+        Magic List (<ph name="MAGIC_COUNT">$1<ex>3</ex></ph>)
+      </message>
+      <message name="IDS_SESSIONS_NO_MAGIC_MESSAGE" desc="The explanatory message for chrome://sessions when there are no entries in the magic list">
+        There is no magic.
+      </message>
+
       <!-- Instant -->
       <message name="IDS_INSTANT_OPT_IN_ENABLE" desc="Button shown in the omnibox dropdown for enabling instant">
         Enable...

chrome/browser/browser_resources.grd

@@ -68,6 +68,7 @@
       <include name="IDR_SAFE_BROWSING_MALWARE_BLOCK" file="resources\safe_browsing_malware_block.html" flattenhtml="true" type="BINDATA" />
       <include name="IDR_SAFE_BROWSING_MULTIPLE_THREAT_BLOCK" file="resources\safe_browsing_multiple_threat_block.html" flattenhtml="true" type="BINDATA" />
       <include name="IDR_SAFE_BROWSING_PHISHING_BLOCK" file="resources\safe_browsing_phishing_block.html" flattenhtml="true" type="BINDATA" />
+      <include name="IDR_SESSIONS_HTML" file="resources\sessions.html" flattenhtml="true" type="BINDATA" />
       <include name="IDR_SIGNIN_HTML" file="resources\browser_signin.html" flattenhtml="true" type="BINDATA" />
       <include name="IDR_SSL_ERROR_HTML" file="resources\ssl_error.html" flattenhtml="true" type="BINDATA" />
       <include name="IDR_SSL_ROAD_BLOCK_HTML" file="resources\ssl_roadblock.html" flattenhtml="true" type="BINDATA" />

chrome/browser/resources/sessions.css

+body {
+  margin: 20px;
+}
+
+h1 {
+  -webkit-padding-start: 75px;
+  background-image: url('shared/images/history_section.png');
+  background-position: left;
+  background-repeat: no-repeat;
+  font-size: 156%;
+  font-weight: bold;
+  margin: 0;
+  padding-bottom: 20px;
+  padding-top: 20px;
+}
+
+html[dir=rtl] h1 {
+  background-position: right;
+}
+
+#magic-summary {
+  background-color: #ebeff9;
+  border-top: 1px solid #9cc2ef;
+  margin-bottom: 6px;
+  margin-top: 12px;
+  padding: 3px;
+}
+
+#magic-summary-text {
+  font-weight: bold;
+}
+
+#sessions-summary {
+  background-color: #ebeff9;
+  border-top: 1px solid #9cc2ef;
+  margin-bottom: 6px;
+  margin-top: 12px;
+  padding: 3px;
+}
+
+#sessions-summary-text {
+  font-weight: bold;
+}
+
+#session-list h3 {
+  font-size: 100%;
+}
+
+#session-list > div > * {
+  margin: 0.75em 0;
+}
+
+#session-list a:visited {
+  color: #666;
+}
+
+#session-list > div:not(:last-child) {
+  border-bottom: 1px solid #bbb;
+}
+
+a.tab-link {
+  background: no-repeat 0% 50%;
+  background-size: 16px 16px;
+  display: block;
+  line-height: 20px;
+  padding-left: 18px;
+}
+
+.indent {
+  margin: 4px;
+  padding-left: 16px;
+}
+
+.expandable {
+  cursor: pointer;
+  font-size: 16px;
+}
+

chrome/browser/resources/sessions.html

+<!DOCTYPE HTML>
+<html i18n-values="dir:textdirection;">
+<head>
+  <meta charset="utf-8">
+  <title i18n-content="sessionsTitle"></title>
+  <link rel="stylesheet" href="sessions.css">
+  <script src="chrome://resources/js/local_strings.js"></script>
+  <script src="chrome://resources/js/util.js"></script>
+  <script src="sessions.js"></script>
+</head>
+<body i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize">
+  <header><h1 i18n-content="sessionsTitle"></h1></header>
+  <div id="content">
+    <div id="sessions-summary"><span id="sessions-summary-text"></span></div>
+    <div id="session-list"></div>
+    <p id="no-sessions" i18n-content="noSessionsMessage" hidden></p>
+  </div>
+  <div id="magic">
+    <div id="magic-summary"><span id="magic-summary-text"></span></div>
+    <div id="magic-list"></div>
+    <p id="no-magic" i18n-content="noMagicMessage" hidden></p>
+  </div>
+</body>
+</html>

chrome/browser/resources/sessions.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.
+
+localStrings = new LocalStrings();
+
+// UTF8 sequence for an arrow triangle pointing down.
+kExpandedArrow = "\u25BE";
+// UTF8 sequence for an arrow triangle pointing right.
+kCollapsedArrow = "\u25B8";
+
+/**
+ * Requests the list of sessions from the backend.
+ */
+function requestSessions() {
+  chrome.send('requestSessionList', [])
+}
+
+/**
+ * Expands or collapses the specified list.
+ */
+function toggleExpandedState(div) {
+  if (div.textContent.indexOf(kExpandedArrow) != -1) {
+    div.textContent = div.textContent.replace(kExpandedArrow, kCollapsedArrow);
+    div.parentNode.querySelector(".indent").hidden = true;
+  } else {
+    div.textContent = div.textContent.replace(kCollapsedArrow, kExpandedArrow);
+    div.parentNode.querySelector(".indent").hidden = false;
+  }
+}
+
+/**
+ * Creates a div element to serve as an expandable/collapsable
+ * title for a list of windows or tabs.
+ */
+function createTitleDiv(className, textContent) {
+  var div = document.createElement('div');
+  div.className = className + ' expandable';
+  div.textContent = kExpandedArrow + ' ' + textContent;
+  div.onclick = Function('toggleExpandedState(this)');
+  return div;
+}
+
+/**
+ * Utility function to call |transformFn| on each element of |from|
+ * and add them to a div which is then added to |container|.
+ */
+function addItems(container, from, transformFn) {
+  var divBlock = document.createElement('div');
+  divBlock.className = 'indent';
+  for (var i = 0; i < from.length; i++) {
+    divBlock.appendChild(transformFn(from[i]));
+  }
+  container.appendChild(divBlock);
+}
+
+/**
+ * Transforms a tab into an HTML element.
+ */
+function transformTab(tab) {
+  var tabItem = document.createElement('a');
+  tabItem.setAttribute('href', tab.url);
+  tabItem.textContent = tab.title;
+  tabItem.className = 'tab-link';
+  tabItem.style.backgroundImage = url('chrome://favicon/' + tab.url);
+  return tabItem;
+}
+
+/**
+ * Transforms a window into an HTML element.
+ */
+function transformWindow(window) {
+  var windowDiv = document.createElement('div');
+  windowDiv.className = "window";
+  windowDiv.appendChild(createTitleDiv('window-title', 'Window'));
+  addItems(windowDiv, window.tabs, transformTab);
+  return windowDiv;
+}
+
+/**
+ * Transforms a session into an HTML element.
+ */
+function transformSession(session) {
+  var sessionDiv = document.createElement('div');
+  sessionDiv.className = "session";
+  sessionDiv.appendChild(createTitleDiv('session-title', 'Session'));
+  addItems(sessionDiv, session.windows, transformWindow);
+  return sessionDiv;
+}
+
+/**
+ * Creates the UI for the sessions tree.
+ */
+function createSessionTreeUI(sessionList) {
+  $('sessions-summary-text').textContent =
+      localStrings.getStringF('sessionsCountFormat', sessionList.length);
+
+  var sessionSection = $('session-list');
+
+  // Clear any previous list.
+  sessionSection.textContent = '';
+
+  var sectionDiv = document.createElement('div');
+  addItems(sectionDiv, sessionList, transformSession);
+  sessionSection.appendChild(sectionDiv);
+
+  $('no-sessions').hidden = sessionList.length != 0;
+}
+
+/**
+ * Creates the UI for the "magic" list.
+ */
+function createMagicListUI(magicList) {
+  $('magic-summary-text').textContent =
+      localStrings.getStringF('magicCountFormat', magicList.length);
+
+  var magicSection = $('magic-list');
+
+  // Clear any previous list.
+  magicSection.textContent = '';
+
+  var sectionDiv = document.createElement('div');
+  addItems(sectionDiv, magicList, transformTab);
+  magicSection.appendChild(sectionDiv);
+
+  $('no-magic').hidden = magicList.length != 0;
+}
+
+/**
+ * Callback from backend with the list of sessions. Builds the UI.
+ * @param {array} sessionList The list of sessions.
+ * @param {array} magicList List of "interesting" tabs.
+ */
+function updateSessionList(sessionList, magicList) {
+  createSessionTreeUI(sessionList);
+  createMagicListUI(magicList);
+}
+
+document.addEventListener('DOMContentLoaded', requestSessions);

chrome/browser/ui/webui/chrome_web_ui_factory.cc

@@ -27,6 +27,7 @@
 #include "chrome/browser/ui/webui/options/options_ui.h"
 #include "chrome/browser/ui/webui/plugins_ui.h"
 #include "chrome/browser/ui/webui/print_preview_ui.h"
+#include "chrome/browser/ui/webui/sessions_ui.h"
 #include "chrome/browser/ui/webui/sync_internals_ui.h"
 #include "chrome/browser/ui/webui/test_chrome_web_ui_factory.h"
 #include "chrome/browser/ui/webui/textfields_ui.h"
@@ -164,6 +165,8 @@ static WebUIFactoryFunction GetWebUIFactoryFunction(Profile* profile,
     return &NewWebUI<NetInternalsUI>;
   if (url.host() == chrome::kChromeUIPluginsHost)
     return &NewWebUI<PluginsUI>;
+  if (url.host() == chrome::kChromeUISessionsHost)
+    return &NewWebUI<SessionsUI>;
   if (url.host() == chrome::kChromeUISyncInternalsHost)
     return &NewWebUI<SyncInternalsUI>;
   if (url.host() == chrome::kChromeUISettingsHost)
@@ -343,6 +346,9 @@ RefCountedMemory* ChromeWebUIFactory::GetFaviconResourceBytes(
   if (page_url.host() == chrome::kChromeUIFlagsHost)
     return FlagsUI::GetFaviconResourceBytes();
 
+  if (page_url.host() == chrome::kChromeUISessionsHost)
+    return SessionsUI::GetFaviconResourceBytes();
+
   if (page_url.host() == chrome::kChromeUIFlashHost)
     return FlashUI::GetFaviconResourceBytes();
 

chrome/browser/ui/webui/sessions_ui.h

+// 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.
+
+#ifndef CHROME_BROWSER_UI_WEBUI_SESSIONS_UI_H_
+#define CHROME_BROWSER_UI_WEBUI_SESSIONS_UI_H_
+#pragma once
+
+#include "chrome/browser/ui/webui/chrome_web_ui.h"
+
+class RefCountedMemory;
+
+class SessionsUI : public ChromeWebUI {
+ public:
+  explicit SessionsUI(TabContents* contents);
+
+  static RefCountedMemory* GetFaviconResourceBytes();
+
+ private:
+  DISALLOW_COPY_AND_ASSIGN(SessionsUI);
+};
+
+#endif  // CHROME_BROWSER_UI_WEBUI_SESSIONS_UI_H_

chrome/chrome_browser.gypi

@@ -3472,6 +3472,8 @@
         'browser/ui/webui/print_preview_ui.h',
         'browser/ui/webui/screenshot_source.cc',
         'browser/ui/webui/screenshot_source.h',
+        'browser/ui/webui/sessions_ui.cc',
+        'browser/ui/webui/sessions_ui.h',
         'browser/ui/webui/shared_resources_data_source.cc',
         'browser/ui/webui/shared_resources_data_source.h',
         'browser/ui/webui/sync_internals_html_source.cc',

chrome/common/url_constants.cc

@@ -73,6 +73,7 @@ const char kChromeUIKeyboardURL[] = "chrome://keyboard/";
 const char kChromeUINewTabURL[] = "chrome://newtab/";
 const char kChromeUIPluginsURL[] = "chrome://plugins/";
 const char kChromeUIPrintURL[] = "chrome://print/";
+const char kChromeUISessionsURL[] = "chrome://sessions/";
 const char kChromeUISettingsURL[] = "chrome://settings/";
 const char kChromeUITextfieldsURL[] = "chrome://textfields/";
 
@@ -124,6 +125,7 @@ const char kChromeUIPluginsHost[] = "plugins";
 const char kChromeUIPrintHost[] = "print";
 const char kChromeUIResourcesHost[] = "resources";
 const char kChromeUIScreenshotPath[] = "screenshots";
+const char kChromeUISessionsHost[] = "sessions";
 const char kChromeUISettingsHost[] = "settings";
 const char kChromeUISyncInternalsHost[] = "sync-internals";
 const char kChromeUISyncResourcesHost[] = "syncresources";

chrome/common/url_constants.h

@@ -65,6 +65,7 @@ extern const char kChromeUIKeyboardURL[];
 extern const char kChromeUINewTabURL[];
 extern const char kChromeUIPluginsURL[];
 extern const char kChromeUIPrintURL[];
+extern const char kChromeUISessionsURL[];
 extern const char kChromeUISettingsURL[];
 extern const char kChromeUITextfieldsURL[];
 
@@ -114,6 +115,7 @@ extern const char kChromeUIPluginsHost[];
 extern const char kChromeUIPrintHost[];
 extern const char kChromeUIResourcesHost[];
 extern const char kChromeUIScreenshotPath[];
+extern const char kChromeUISessionsHost[];
 extern const char kChromeUISettingsHost[];
 extern const char kChromeUISyncInternalsHost[];
 extern const char kChromeUISyncResourcesHost[];