summaryrefslogtreecommitdiffstats
path: root/chrome/browser/resources
diff options
context:
space:
mode:
authoridana@chromium.org <idana@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98>2009-08-17 23:03:21 +0000
committeridana@chromium.org <idana@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98>2009-08-17 23:03:21 +0000
commit386afa320189f08ab18b453863d6cc6a758b06d1 (patch)
tree7e5ce37fdbf63daf478f2b178b2c8d2e47e150fe /chrome/browser/resources
parentd9810a805d4e4626bf2ec9dc805e5643a801d3d9 (diff)
downloadchromium_src-386afa320189f08ab18b453863d6cc6a758b06d1.zip
chromium_src-386afa320189f08ab18b453863d6cc6a758b06d1.tar.gz
chromium_src-386afa320189f08ab18b453863d6cc6a758b06d1.tar.bz2
Made the Sync UI work in the New New tab page.
There are no significant logic changes except the addition of a link which points to the web ui. BUG=none Review URL: http://codereview.chromium.org/172007 git-svn-id: svn://svn.chromium.org/chrome/trunk/src@23591 0039d316-1c4b-4281-b951-d872f2087c98
Diffstat (limited to 'chrome/browser/resources')
-rw-r--r--chrome/browser/resources/new_new_tab.css24
-rw-r--r--chrome/browser/resources/new_new_tab.html10
-rw-r--r--chrome/browser/resources/new_new_tab.js106
3 files changed, 135 insertions, 5 deletions
diff --git a/chrome/browser/resources/new_new_tab.css b/chrome/browser/resources/new_new_tab.css
index 1f52452..1c4fefe 100644
--- a/chrome/browser/resources/new_new_tab.css
+++ b/chrome/browser/resources/new_new_tab.css
@@ -460,7 +460,7 @@ html[dir='rtl'] .item {
background-color: hsla(213, 60%, 92%, .4);
border: 1px solid hsl(213, 60%, 92%);
-webkit-border-radius: 5px;
- padding: 5px 0px;;
+ padding: 5px 0px;
white-space: nowrap;
overflow-x: hidden;
}
@@ -490,6 +490,28 @@ html[dir='rtl'] .item {
-webkit-padding-start: 2px;
}
+#sync-status {
+ -webkit-transition: height .15s, opacity .15s;
+ background-color: hsla(213, 60%, 92%, .4);
+ border: 1px solid hsl(213, 60%, 92%);
+ -webkit-border-radius: 6px;
+ padding: 5px 0;
+ margin: 10px 0;
+ white-space: nowrap;
+ opacity: 0;
+ overflow-x: hidden;
+}
+
+#sync-status > * {
+ display: inline-block;
+ max-width: none;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ font-size: 100%;
+ margin: 0 10px;
+}
+
#view-toolbar {
-webkit-user-select: none;
text-align: right;
diff --git a/chrome/browser/resources/new_new_tab.html b/chrome/browser/resources/new_new_tab.html
index 6012544..e6ae26a 100644
--- a/chrome/browser/resources/new_new_tab.html
+++ b/chrome/browser/resources/new_new_tab.html
@@ -1,5 +1,5 @@
<!DOCTYPE html>
-<html i18n-values="dir:textdirection;firstview:firstview;bookmarkbarattached:bookmarkbarattached;hasattribution:hasattribution;anim:anim">
+<html i18n-values="dir:textdirection;firstview:firstview;bookmarkbarattached:bookmarkbarattached;hasattribution:hasattribution;anim:anim;syncispresent:syncispresent">
<meta charset="utf-8">
<title i18n-content="title"></title>
@@ -39,6 +39,8 @@ chrome.send('getRecentlyClosedTabs');
registerCallback('onShownSections');
registerCallback('mostVisitedPages');
registerCallback('recentlyClosedTabs');
+registerCallback('syncMessageChanged');
+
// TODO(arv): The backend calls this function. Remove the call on the backend.
function downloadsList() {}
@@ -226,6 +228,12 @@ document.write('<link id="themecss" rel="stylesheet" ' +
</span>
</div>
+ <div id="sync-status">
+ <h2>&nbsp;</h2>
+ <span>&nbsp;</span>
+ <span><a href="">&nbsp;</a></span>
+ </div>
+
</div> <!-- main -->
<div>
diff --git a/chrome/browser/resources/new_new_tab.js b/chrome/browser/resources/new_new_tab.js
index 7ce28bd..dcd7c20 100644
--- a/chrome/browser/resources/new_new_tab.js
+++ b/chrome/browser/resources/new_new_tab.js
@@ -102,7 +102,6 @@ function recentlyClosedTabs(data) {
}
var recentItems = [];
-var recentItemKeys = {};
function renderRecentlyClosed() {
// We remove all items but the header and the nav
@@ -646,8 +645,6 @@ var mostVisited = {
function layoutRecentlyClosed() {
var recentElement = $('recently-closed');
-
- var rtl = document.documentElement.dir == 'rtl';
var recentShown = shownSections & Section.RECENT;
var style = recentElement.style;
@@ -685,6 +682,90 @@ function layoutRecentlyClosed() {
}
/**
+ * This function is called by the backend whenever the sync status section
+ * needs to be updated to reflect recent sync state changes. The backend passes
+ * the new status information in the newMessage parameter. The state includes
+ * the following:
+ *
+ * syncsectionisvisible: true if the sync section needs to show up on the new
+ * tab page and false otherwise.
+ * msgtype: represents the states - "error", "presynced" or "synced".
+ * title: the header for the sync status section.
+ * msg: the actual message (e.g. "Synced to foo@gmail.com").
+ * linkisvisible: true if the link element should be visible within the sync
+ * section and false otherwise.
+ * linktext: the text to display as the link in the sync status (only used if
+ * linkisvisible is true).
+ * linkurlisset: true if an URL should be set as the href for the link and false
+ * otherwise. If this field is false, then clicking on the link
+ * will result in sending a message to the backend (see
+ * 'SyncLinkClicked').
+ * linkurl: the URL to use as the element's href (only used if linkurlisset is
+ * true).
+ */
+function syncMessageChanged(newMessage) {
+ var syncStatusElement = $('sync-status');
+ var style = syncStatusElement.style;
+
+ // Hide the section if the message is emtpy.
+ if (!newMessage.syncsectionisvisible) {
+ style.opacity = style.height = 0;
+ return;
+ }
+ style.height = '';
+ style.opacity = 1;
+
+ // Set the sync section background color based on the state.
+ if (newMessage.msgtype == "error") {
+ style.backgroundColor = "tomato";
+ } else if (newMessage.msgtype == "presynced") {
+ style.backgroundColor = "greenyellow";
+ } else {
+ style.backgroundColor = "#CAFF70";
+ }
+
+ // Set the text for the header and sync message.
+ var titleElement = syncStatusElement.firstElementChild;
+ titleElement.textContent = newMessage.title;
+ var messageElement = titleElement.nextElementSibling;
+ messageElement.textContent = newMessage.msg;
+
+ // Set up the link if we should show one or hide it otherwise.
+ var linkContainer = messageElement.nextElementSibling;
+ var containerStyle = linkContainer.style;
+ var linkElement = linkContainer.firstElementChild;
+ linkElement.removeEventListener('click', syncSectionLinkClicked);
+
+ // TODO(idana): when we don't have an URL to set, using an href is not a good
+ // idea because the user will still be able to right click on the link and
+ // open the empty href in a new tab/window.
+ //
+ // See http://code.google.com/p/chromium/issues/detail?id=19538 for more info
+ // about how to fix this.
+ linkElement.href = '';
+ containerStyle.display = 'none';
+ if (newMessage.linkisvisible) {
+ containerStyle.display = '';
+ linkElement.textContent = newMessage.linktext;
+ // We don't listen to click events if the backend specified a target URL
+ // for the link.
+ if (newMessage.linkurlisset) {
+ linkElement.href = newMessage.linkurl;
+ } else {
+ linkElement.addEventListener('click', syncSectionLinkClicked);
+ }
+ }
+}
+
+/**
+ * Invoked when the link in the sync status section is clicked.
+ */
+function syncSectionLinkClicked(e) {
+ chrome.send('SyncLinkClicked');
+ e.preventDefault();
+}
+
+/**
* Returns the text used for a recently closed window.
* @param {number} numTabs Number of tabs in the window.
* @return {string} The text to use.
@@ -1206,6 +1287,25 @@ window.addEventListener('resize', handleWindowResize);
document.addEventListener('DOMContentLoaded', bind(logEvent, global,
'domcontentloaded fired'));
+// Whether or not we should send the initial 'GetSyncMessage' to the backend
+// depends on the value of the attribue 'syncispresent' which the backend sets
+// to indicate if there is code in the backend which is capable of processing
+// this message. This attribute is loaded by the JSTemplate and therefore we
+// must make sure we check the attribute after the DOM is loaded.
+document.addEventListener('DOMContentLoaded',
+ callGetSyncMessageIfSyncIsPresent);
+
+/**
+ * The sync code is not yet built by default on all platforms so we have to
+ * make sure we don't send the initial sync message to the backend unless the
+ * backend told us that the sync code is present.
+ */
+function callGetSyncMessageIfSyncIsPresent() {
+ if (document.documentElement.getAttribute("syncispresent") == "true") {
+ chrome.send('GetSyncMessage');
+ }
+}
+
function hideAllMenus() {
optionMenu.hide();
}
generated by cgit v1.1 at 2025-02-08 13:00:27 +0000