Move Chromoting hostlist into tab (from extension popup)

BUG=none TEST=none Review URL: http://codereview.chromium.org/3602002 git-svn-id: svn://svn.chromium.org/chrome/trunk/src@62585 0039d316-1c4b-4281-b951-d872f2087c98
author: garykac@chromium.org <garykac@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> 2010-10-14 18:12:23 +0000
committer: garykac@chromium.org <garykac@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> 2010-10-14 18:12:23 +0000
commit: 150ca3a79a0572e527548430d5849dee2392c9be (patch)
tree: 59be1ed9ae18ab3bb8a42298ebc67187f5733ef1 /remoting/client
parent: 71ee3647e2a1aa84f8a72ff13cfcfa24a2471fe9 (diff)
download: chromium_src-150ca3a79a0572e527548430d5849dee2392c9be.zip
chromium_src-150ca3a79a0572e527548430d5849dee2392c9be.tar.gz
chromium_src-150ca3a79a0572e527548430d5849dee2392c9be.tar.bz2
10 files changed, 210 insertions, 56 deletions
diff --git a/remoting/client/extension/background.js b/remoting/client/extension/background.js
index 0f851a7..b8b400d 100644
--- a/remoting/client/extension/background.js
+++ b/remoting/client/extension/background.js
@@ -2,6 +2,51 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+/**
+ * If there is already a tab with the given URL, switch focus to it. Otherwise,
+ * create a new tab and open the URL.
+ *
+ * @param url The URL to open.
+ */
+function focusOrCreateTab(url) {
+  chrome.windows.getAll({"populate":true}, function(windows) {
+      var existing_tab = null;
+      for (var i in windows) {
+        var tabs = windows[i].tabs;
+        for (var j in tabs) {
+          var tab = tabs[j];
+          if (tab.url == url) {
+            existing_tab = tab;
+            break;
+          }
+        }
+      }
+      if (existing_tab) {
+        chrome.tabs.update(existing_tab.id, {"selected": true});
+      } else {
+        chrome.tabs.create({"url": url, "selected": true});
+      }
+    });
+}
+
+/**
+ * In the current tab, navigate to the specified URL.
+ *
+ * @param url The URL to navigate to.
+ */
+function navigate(url, callback) {
+  chrome.tabs.getSelected(null, function(tab) {
+      chrome.tabs.update(tab.id, {url: url}, callback);
+  });
+}
+
+// Open the Chromoting HostList tab when
+chrome.browserAction.onClicked.addListener(function(tab) {
+    var hostlist_url = chrome.extension.getURL("hostlist.html");
+    focusOrCreateTab(hostlist_url);
+  });
+
+
 function openChromotingTab(hostName, hostJid) {
   var username = getCookie('username');
   var xmppAuth = getCookie('xmpp_auth');
@@ -12,16 +57,13 @@ function openChromotingTab(hostName, hostJid) {
     hostName: hostName,
     hostJid: hostJid,
   };
-  var tabArgs = {
-    url: newTabUrl,
-  };
 
   console.log("Attempt to connect with" +
               " username='" + request.username + "'" +
               " hostName='" + request.hostName + "'" +
               " hostJid='" + request.hostJid + "'" +
               " auth_token='" + request.xmppAuth + "'");
-  chrome.tabs.create(tabArgs, function(tab) {
+  navigate(newTabUrl, function(tab) {
       console.log("We're trying now to send to " + tab.id);
       chrome.tabs.sendRequest(
           tab.id, request, function() {
diff --git a/remoting/client/extension/base.js b/remoting/client/extension/base.js
index 319df94..2c3188d 100644
--- a/remoting/client/extension/base.js
+++ b/remoting/client/extension/base.js
@@ -2,6 +2,9 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+// Namespace for globals.
+var chromoting = {};
+
 // Cookie reading code taken from quirksmode with modification for escaping.
 //   http://www.quirksmode.org/js/cookies.html
 function setCookie(name, value, days) {
diff --git a/remoting/client/extension/chromoting_tab.html b/remoting/client/extension/chromoting_tab.html
index ef53a8d..8a7d656 100644
--- a/remoting/client/extension/chromoting_tab.html
+++ b/remoting/client/extension/chromoting_tab.html
@@ -8,6 +8,7 @@ found in the LICENSE file.
   <head>
     <title id="title">Chromoting Session</title>
     <link rel="stylesheet" type="text/css" href="main.css" />
+    <script type="text/javascript" src="base.js"></script>
     <script type="text/javascript" src="chromoting_tab.js"></script>
   </head>
   <body class="chromoting_body" onload="init();">
diff --git a/remoting/client/extension/chromoting_tab.js b/remoting/client/extension/chromoting_tab.js
index cbdd3a2..adf8f16 100644
--- a/remoting/client/extension/chromoting_tab.js
+++ b/remoting/client/extension/chromoting_tab.js
@@ -2,9 +2,6 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-// Namespace for globals.
-var chromoting = {};
-
 // Message id so that we can identify (and ignore) message fade operations for
 // old messages.  This starts at 1 and is incremented for each new message.
 chromoting.messageId = 1;
@@ -56,7 +53,7 @@ function requestListener(request, sender, sendResponse) {
 }
 
 /**
- * This is that callback that the plugin invokes to indicate that the host/
+ * This is the callback that the plugin invokes to indicate that the host/
  * client connection status has changed.
  */
 function pluginCallback() {
@@ -106,6 +103,62 @@ function showClientStateMessage(message, duration) {
 }
 
 /**
+ * This is that callback that the plugin invokes to indicate that the
+ * host/client connection status has changed.
+ */
+function pluginCallback() {
+  var status = chromoting.plugin.status;
+  var quality = chromoting.plugin.quality;
+
+  if (status == chromoting.plugin.STATUS_UNKNOWN) {
+    setClientStateMessage('');
+  } else if (status == chromoting.plugin.STATUS_CONNECTING) {
+    setClientStateMessage('Connecting to ' + chromoting.hostname
+                   + ' as ' + chromoting.username);
+  } else if (status == chromoting.plugin.STATUS_INITIALIZING) {
+    setClientStateMessageFade('Initializing connection to ' +
+                              chromoting.hostname);
+  } else if (status == chromoting.plugin.STATUS_CONNECTED) {
+    setClientStateMessageFade('Connected to ' + chromoting.hostname, 1000);
+  } else if (status == chromoting.plugin.STATUS_CLOSED) {
+    setClientStateMessage('Closed');
+  } else if (status == chromoting.plugin.STATUS_FAILED) {
+    setClientStateMessage('Failed');
+  }
+}
+
+/**
+ * Show a client message that stays on the screeen until the state changes.
+ *
+ * @param {string} message The message to display.
+ */
+function setClientStateMessage(message) {
+  // Increment message id to ignore any previous fadeout requests.
+  chromoting.messageId++;
+  console.log('setting message ' + chromoting.messageId);
+
+  // Update the status message.
+  var msg = document.getElementById('status_msg');
+  msg.innerText = message;
+  msg.style.opacity = 1;
+}
+
+/**
+ * Show a client message for the specified amount of time.
+ *
+ * @param {string} message The message to display.
+ * @param {number} duration Milliseconds to show message before fading.
+ */
+function setClientStateMessageFade(message, duration) {
+  setClientStateMessage(message);
+
+  // Set message duration.
+  window.setTimeout("fade('status_msg', " + chromoting.messageId + ", " +
+                          "100, 10, 200)",
+                    duration);
+}
+
+/**
  * Fade the specified element.
  * For example, to have element 'foo' fade away over 2 seconds, you could use
  * either:
diff --git a/remoting/client/extension/client.js b/remoting/client/extension/client.js
index 2e636be..8ed5064 100644
--- a/remoting/client/extension/client.js
+++ b/remoting/client/extension/client.js
@@ -2,14 +2,41 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+// Flag to indicate whether or not to show offline hosts in the host list.
+chromoting.showOfflineHosts = true;
+
+// String to identify bad auth tokens.
 var BAD_AUTH_TOKEN = 'bad_token';
 
+// Number of days before auth token cookies expire.
+// TODO(garykac): 21 days is arbitrary. Need to change this to the appropriate
+// value from security review.
+var AUTH_EXPIRES = 21;
+
 function init() {
   updateLoginStatus();
 
   // Defer getting the host list for a little bit so that we don't
   // block the display of the extension popup.
-  window.setTimeout(listHosts, 100);
+  window.setTimeout(populateHostList, 100);
+
+  var showOff = getCookie('offline');
+  chromoting.showOfflineHosts = (!showOff || showOff == '1');
+  updateShowOfflineCheckbox();
+}
+
+function updateShowOfflineHosts(cbox) {
+  chromoting.showOfflineHosts = cbox.checked;
+
+  // Save pref in cookie with long expiration.
+  setCookie('offline', chromoting.showOfflineHosts ? '1' : '0', 1000);
+
+  populateHostList();
+}
+
+function updateShowOfflineCheckbox() {
+  var cbox = document.getElementById('show_offline');
+  cbox.checked = chromoting.showOfflineHosts;
 }
 
 // Update the login status region (at the bottom of the popup) with the
@@ -44,12 +71,12 @@ function updateLoginStatus() {
 
 // Sign out the current user by erasing the auth cookies.
 function logout(form) {
-  setCookie('username', '', 100);
-  setCookie('chromoting_auth', '', 100);
-  setCookie('xmpp_auth', '', 100);
+  setCookie('username', '', AUTH_EXPIRES);
+  setCookie('chromoting_auth', '', AUTH_EXPIRES);
+  setCookie('xmpp_auth', '', AUTH_EXPIRES);
 
   updateLoginStatus();
-  listHosts();
+  populateHostList();
 }
 
 function login(form) {
@@ -69,7 +96,7 @@ function checkLogin() {
   if (cauth == BAD_AUTH_TOKEN || xauth == BAD_AUTH_TOKEN) {
     appendMessage(status, '', 'Sign in failed!');
     if (username) {
-      setCookie('username', '', 100);
+      setCookie('username', '', AUTH_EXPIRES);
     }
   } else {
     appendMessage(status, '', 'Successfully signed in as ' + username);
@@ -85,15 +112,15 @@ function doLogin(username, password, done) {
       done();
     }
   }
-  setCookie('username', username, 100);
+  setCookie('username', username, AUTH_EXPIRES);
   doGaiaLogin(username, password, 'chromoting',
               function(cAuthToken) {
-                setCookie('chromoting_auth', cAuthToken, 100);
+                setCookie('chromoting_auth', cAuthToken, AUTH_EXPIRES);
                 barrier();
               });
   doGaiaLogin(username, password, 'chromiumsync',
               function(xAuthToken) {
-                setCookie('xmpp_auth', xAuthToken, 100);
+                setCookie('xmpp_auth', xAuthToken, AUTH_EXPIRES);
                 barrier();
               });
 }
@@ -158,7 +185,7 @@ function appendMessage(e, classname, message) {
   e.appendChild(p);
 }
 
-function listHosts() {
+function populateHostList() {
   var username = getCookie('username');
 
   var hostlistDiv = document.getElementById('hostlist_div');
@@ -217,19 +244,40 @@ function appendHostLinks(hostlist) {
   // Clear the div before adding the host info.
   clear(hostlistDiv);
 
+  var numHosts = 0;
+  var numOfflineHosts = 0;
+
   // Add the hosts.
-  // TODO(garykac): We should have some sort of MRU list here.
+  // TODO(garykac): We should have some sort of MRU list here or have
+  // the Chromoting Directory provide a MRU list.
   // First, add all of the connected hosts.
   for (var i = 0; i < hostlist.length; ++i) {
     if (hostlist[i].status == "ONLINE") {
       hostlistDiv.appendChild(addHostInfo(hostlist[i]));
+      numHosts++;
     }
   }
   // Add non-online hosts at the end.
   for (var i = 0; i < hostlist.length; ++i) {
     if (hostlist[i].status != "ONLINE") {
-      hostlistDiv.appendChild(addHostInfo(hostlist[i]));
+      if (chromoting.showOfflineHosts == 1) {
+        hostlistDiv.appendChild(addHostInfo(hostlist[i]));
+        numHosts++;
+      }
+      numOfflineHosts++;
+    }
+  }
+
+  if (numHosts == 0) {
+    var message;
+    if (numOfflineHosts == 0) {
+      message = 'No hosts available.';
+    } else {
+      message = 'No online hosts available (' +
+          numOfflineHosts + ' offline hosts).';
     }
+    message += ' See LINK for info on how to set up a new host.';
+    displayMessage(hostlistDiv, 'message', message);
   }
 }
 
@@ -243,29 +291,31 @@ function addHostInfo(host) {
   hostIcon.setAttribute('class', 'hosticon');
   hostEntry.appendChild(hostIcon);
 
-  var span = document.createElement('span');
-  span.setAttribute('class', 'connect');
-  var connect = document.createElement('input');
-  connect.setAttribute('type', 'button');
-  connect.setAttribute('value', 'Connect');
-  connect.setAttribute('onclick', "openChromotingTab('" + host.hostName +
-                       "', '" + host.jabberId + "'); return false;");
-  span.appendChild(connect);
-  hostEntry.appendChild(span);
+  if (host.status == 'ONLINE') {
+    var span = document.createElement('span');
+    span.setAttribute('class', 'connect');
+    var connect = document.createElement('input');
+    connect.setAttribute('type', 'button');
+    connect.setAttribute('value', 'Connect');
+    connect.setAttribute('onclick', "openChromotingTab('" + host.hostName +
+                         "', '" + host.jabberId + "'); return false;");
+    span.appendChild(connect);
+    hostEntry.appendChild(span);
+  }
 
   var hostName = document.createElement('p');
-  hostName.setAttribute('class', 'hostname');
+  hostName.setAttribute('class', 'hostindent hostname');
   hostName.appendChild(document.createTextNode(host.hostName));
   hostEntry.appendChild(hostName);
 
   var hostStatus = document.createElement('p');
-  hostStatus.setAttribute('class', 'hostinfo hoststatus_' +
+  hostStatus.setAttribute('class', 'hostindent hostinfo hoststatus_' +
                           ((host.status == 'ONLINE') ? 'good' : 'bad'));
   hostStatus.appendChild(document.createTextNode(host.status));
   hostEntry.appendChild(hostStatus);
 
   var hostInfo = document.createElement('p');
-  hostInfo.setAttribute('class', 'hostinfo');
+  hostInfo.setAttribute('class', 'hostindent hostinfo');
   hostInfo.appendChild(document.createTextNode(host.jabberId));
   hostEntry.appendChild(hostInfo);
 
diff --git a/remoting/client/extension/popup.html b/remoting/client/extension/hostlist.html
index 117248d..fe6e693 100644
--- a/remoting/client/extension/popup.html
+++ b/remoting/client/extension/hostlist.html
@@ -11,19 +11,22 @@ found in the LICENSE file.
     <link rel="stylesheet" type="text/css" href="main.css" />
     <title>Remote Access</title>
   </head>
-  <body class="popup_body" onload="init();">
+  <body class="hostlist_body" onload="init();">
 
     <h1>Remote Access</h1>
 
-    <div id="hostlist_div" class="hostlist">
-      <p class='message'>Initializing...</p>
+    <div id="login_div" class="login">
     </div>
 
     <p class="reload">
-    <a href="javascript:listHosts()">Reload host list</a>
+    <a href="javascript:populateHostList()">Reload host list</a>
     </p>
 
-    <div id="login_div" class="login">
+    <input type=checkbox name="show_offline" id="show_offline"
+      onClick="updateShowOfflineHosts(this)"/>Show offline hosts
+
+    <div id="hostlist_div" class="hostlist">
+      <p class='message'>Initializing...</p>
     </div>
 
     <br />
diff --git a/remoting/client/extension/main.css b/remoting/client/extension/main.css
index 42f2761..27b77ca 100644
--- a/remoting/client/extension/main.css
+++ b/remoting/client/extension/main.css
@@ -1,7 +1,4 @@
-.popup_body {
-  width: 500px;
-  overflow: hidden;
-  scrollbars: no;
+.hostlist_body {
 }
 
 p {
@@ -23,9 +20,7 @@ h1 {
 
 .hostlist {
   width: 100%;
-  height: 400px;
   margin: 0;
-  overflow: auto;
   border: black 1px solid;
 }
 
@@ -47,12 +42,15 @@ a.hostentry { text-decoration: none; }
   margin: 2px;
 }
 
+.hostindent {
+  margin: 2px 4px 2px 75px;
+}
+
 .hostname {
   font-family: sans-serif;
   font-size: 1.2em;
   font-weight: bold;
   line-height: 1.2em;
-  margin: 2px 4px 2px 75px;
 }
 
 .hoststatus_good {
@@ -68,8 +66,13 @@ a.hostentry { text-decoration: none; }
 .hostinfo {
   font-family: sans-serif;
   font-size: 0.8em;
-  line-height: 1em;
-  margin: 2px 4px 2px 75px;
+  line-height: 1.1em;
+}
+
+.hostlinks {
+  font-family: sans-serif;
+  font-size: 0.7em;
+  line-height: 1.2em;
 }
 
 .connect {
@@ -80,17 +83,14 @@ a.hostentry { text-decoration: none; }
   font-family: sans-serif;
   font-size: 0.8em;
   font-style: italic;
-  text-align: right;
-  margin: 0.25em 0 0.5em 0;
+  margin: 0.25em 0 0.5em 5px;
   line-height: 1em;
 }
 
 .login {
   font-family: sans-serif;
   font-size: 0.9em;
-  position: absolute;
-  bottom: 0;
-  margin-bottom: 3px;
+  margin: 0 0 3px 5px;
 }
 
 .login_email {
diff --git a/remoting/client/extension/manifest.json b/remoting/client/extension/manifest.json
index 6d5f0d6..3531c13 100644
--- a/remoting/client/extension/manifest.json
+++ b/remoting/client/extension/manifest.json
@@ -1,10 +1,10 @@
 {
   "name": "Chromoting Client",
   "version": "1.0",
-  "description": "Lists the hosts that the user can access.",
+  "description": "Lists the Chromoting hosts that the current user can access.",
   "browser_action": {
     "default_icon": "chromoticon.png",
-    "popup": "popup.html"
+    "default_title": "Chromoting"
   },
   "background_page": "background.html",
   "permissions": [
diff --git a/remoting/client/plugin/chromoting_scriptable_object.cc b/remoting/client/plugin/chromoting_scriptable_object.cc
index 1bc909b..1fc04e4 100644
--- a/remoting/client/plugin/chromoting_scriptable_object.cc
+++ b/remoting/client/plugin/chromoting_scriptable_object.cc
@@ -30,6 +30,7 @@ void ChromotingScriptableObject::Init() {
 
   // Connection status.
   AddAttribute(kStatusAttribute, Var(STATUS_UNKNOWN));
+
   // Connection status values.
   AddAttribute("STATUS_UNKNOWN", Var(STATUS_UNKNOWN));
   AddAttribute("STATUS_CONNECTING", Var(STATUS_CONNECTING));
@@ -40,6 +41,8 @@ void ChromotingScriptableObject::Init() {
 
   // Connection quality.
   AddAttribute(kQualityAttribute, Var(QUALITY_UNKNOWN));
+
+  // Connection quality values.
   AddAttribute("QUALITY_UNKNOWN", Var(QUALITY_UNKNOWN));
   AddAttribute("QUALITY_GOOD", Var(QUALITY_GOOD));
   AddAttribute("QUALITY_BAD", Var(QUALITY_BAD));
@@ -64,8 +67,8 @@ bool ChromotingScriptableObject::HasProperty(const Var& name, Var* exception) {
 
   // TODO(ajwong): Investigate why ARM build breaks if you do:
   //    properties_[iter->second].method == NULL;
-  // Somehow the ARM compiler is thinking that the above is using
-  // NULL as an arithmetic expression.
+  // Somehow the ARM compiler is thinking that the above is using NULL as an
+  // arithmetic expression.
   return properties_[iter->second].method == 0;
 }
 
diff --git a/remoting/client/x11_view.cc b/remoting/client/x11_view.cc
index 07f2f87..dc66062 100644
--- a/remoting/client/x11_view.cc
+++ b/remoting/client/x11_view.cc
@@ -139,7 +139,6 @@ void X11View::SetConnectionState(ConnectionState s) {
 
 void X11View::SetViewport(int x, int y, int width, int height) {
   // TODO(garykac): Implement.
-  // NOTIMPLEMENTED();
 }
 
 void X11View::InitPaintTarget() {
author	garykac@chromium.org <garykac@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98>	2010-10-14 18:12:23 +0000
committer	garykac@chromium.org <garykac@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98>	2010-10-14 18:12:23 +0000
commit	150ca3a79a0572e527548430d5849dee2392c9be (patch)
tree	59be1ed9ae18ab3bb8a42298ebc67187f5733ef1 /remoting/client
parent	71ee3647e2a1aa84f8a72ff13cfcfa24a2471fe9 (diff)
download	chromium_src-150ca3a79a0572e527548430d5849dee2392c9be.zip chromium_src-150ca3a79a0572e527548430d5849dee2392c9be.tar.gz chromium_src-150ca3a79a0572e527548430d5849dee2392c9be.tar.bz2