Add the framework for a chrome app.

* Adds the required files for a chrome app * Add generates a random room id and connects
Chu-Thai-Tan · Jan 7, 2015 · 15845b0 · 15845b0
1 parent 158f57b
commit 15845b0
Show file tree

Hide file tree

Showing 14 changed files with 230 additions and 12 deletions.
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -37,6 +37,7 @@ module.exports = function(grunt) {
       html1: {
         src: [
         'samples/web/content/apprtc/index.html',
+        'samples/web/content/apprtc/appwindow.html',
         'samples/web/content/datachannel/index.html',
         'samples/web/content/getusermedia/**/index.html',
         'samples/web/content/peerconnection/**/index.html'

diff --git a/samples/web/content/apprtc/appwindow.html b/samples/web/content/apprtc/appwindow.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<!--
+ *  Copyright (c) 2014 The WebRTC project authors. All Rights Reserved.
+ *
+ *  Use of this source code is governed by a BSD-style license
+ *  that can be found in the LICENSE file in the root of the source
+ *  tree.
+-->
+<html>
+
+<head>
+
+  <title>WebRTC Reference App</title>
+
+  <meta charset="utf-8">
+  <meta name="description" content="WebRTC reference app">
+  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
+  <link rel="stylesheet" href="/css/main.css">
+
+</head>
+
+<body>
+
+  <div id="videos">
+    <video id="mini-video" autoplay muted></video>
+    <canvas id="remote-canvas"></canvas>
+    <video id="remote-video" autoplay></video>
+    <video id="local-video" autoplay muted></video>
+  </div>
+
+  <footer id="footer">
+    <div id="sharing">
+      <div>Waiting for someone to join this room: <a id="room-link" href="" target="_blank"></a></div>
+    </div>
+    <div id="info"></div>
+    <div id="status"></div>
+  </footer>
+
+  <script src="/js/stats.js"></script>
+  <!-- {{ include_loopback_js }} -->
+  <script src="/js/signaling.js"></script>
+  <script src="/js/infobox.js"></script>
+  <script src="/js/sdputils.js"></script>
+  <script src="/js/util.js"></script>
+  <script src="/js/main.js"></script>
+  <!-- {{ include_vr_js }} -->
+  <script src="/js/adapter.js"></script>
+  <script src="/js/appwindow.js"></script>
+
+</body>
+</html>
diff --git a/samples/web/content/apprtc/images/apprtc-128.png b/samples/web/content/apprtc/images/apprtc-128.png
diff --git a/samples/web/content/apprtc/images/apprtc-16.png b/samples/web/content/apprtc/images/apprtc-16.png
diff --git a/samples/web/content/apprtc/images/apprtc-22.png b/samples/web/content/apprtc/images/apprtc-22.png
diff --git a/samples/web/content/apprtc/images/apprtc-32.png b/samples/web/content/apprtc/images/apprtc-32.png
diff --git a/samples/web/content/apprtc/images/apprtc-48.png b/samples/web/content/apprtc/images/apprtc-48.png
diff --git a/samples/web/content/apprtc/js/appwindow.js b/samples/web/content/apprtc/js/appwindow.js
@@ -0,0 +1,75 @@
+/*
+ *  Copyright (c) 2014 The WebRTC project authors. All Rights Reserved.
+ *
+ *  Use of this source code is governed by a BSD-style license
+ *  that can be found in the LICENSE file in the root of the source
+ *  tree.
+ */
+
+/* More information about these options at jshint.com/docs/options */
+// Variables defined in and used from main.js.
+/* globals randomString, initialize */
+/* exported params */
+'use strict';
+
+// Provide params var, provided inline in index.html.
+var params;
+
+// Generate random room id and connect.
+var room = randomString(9);
+
+// Provide default params set to the values returned by apprtc.appspot.com.
+var params = {
+  errorMessages: [],
+  isLoopback: false,
+  mediaConstraints: {
+    'audio': true,
+    'video': {
+      'optional': [{
+        'minWidth': '1280'
+      }, {
+        'minHeight': '720'
+      }],
+      'mandatory': {}
+    }
+  },
+  offerConstraints: {
+    'optional': [],
+    'mandatory': {}
+  },
+  peerConnectionConfig: {
+    'iceServers': []
+  },
+  peerConnectionConstraints: {
+    'optional': [{
+      'googImprovedWifiBwe': true
+    }]
+  },
+  turnRequestUrl: 'https://computeengineondemand.appspot.com/turn?username=073557600&key=4080218913',
+  turnTransports: '',
+  audioSendBitrate: '',
+  audioSendCodec: '',
+  audioRecvBitrate: '',
+  audioRecvCodec: '',
+  isStereoscopic: '',
+  opusMaxPbr: '',
+  opusFec: '',
+  opusStereo: '',
+  videoSendBitrate: '',
+  videoSendInitialBitrate: '',
+  videoSendCodec: '',
+  videoRecvBitrate: '',
+  videoRecvCodec: '',
+  wssUrl: 'wss://apprtc-ws.webrtc.org:443/ws',
+  wssPostUrl: 'https://apprtc-ws.webrtc.org:443'
+};
+
+params.roomId = room;
+params.roomLink =  'https://apprtc.appspot.com/room/' + room;
+params.server = 'https://apprtc.appspot.com';
+
+var joinRoomLink = document.querySelector('#room-link');
+joinRoomLink.href = params.roomLink;
+joinRoomLink.text = params.roomLink;
+
+initialize();
diff --git a/samples/web/content/apprtc/js/background.js b/samples/web/content/apprtc/js/background.js
@@ -0,0 +1,22 @@
+/*
+ *  Copyright (c) 2014 The WebRTC project authors. All Rights Reserved.
+ *
+ *  Use of this source code is governed by a BSD-style license
+ *  that can be found in the LICENSE file in the root of the source
+ *  tree.
+ */
+
+/* More information about these options at jshint.com/docs/options */
+
+// Variables defined in and used from chrome.
+/* globals chrome */
+
+'use strict';
+chrome.app.runtime.onLaunched.addListener(function() {
+  chrome.app.window.create('appwindow.html', {
+    'width': 800,
+    'height': 600,
+    'left': 0,
+    'top': 0
+  });
+});
diff --git a/samples/web/content/apprtc/js/main.js b/samples/web/content/apprtc/js/main.js
@@ -94,7 +94,7 @@ function initialize() {
   }
   document.body.ondblclick = toggleFullScreen;
   trace('Initializing; room=' + params.roomId + '.');
-  connectToRoom(params.roomId);
+  connectToRoom(params.server, params.roomId);
   if (params.isLoopback) {
     setupLoopback();
   }
@@ -139,7 +139,12 @@ function disconnectFromRoom() {
   // When the other client sees BYE it attempts to post offer and candidates to
   // GAE. GAE needs to know that we're disconnected at that point otherwise
   // it will forward messages to this client instead of storing them.
-  path = '/bye/' + params.roomId + '/' + params.clientId;
+  var server = params.server;
+  if (!server) {
+    // If server is not provided, use relative URI.
+    server = '';
+  }
+  path = server + '/bye/' + params.roomId + '/' + params.clientId;
   xhr = new XMLHttpRequest();
   xhr.open('POST', path, false);
   xhr.send();

diff --git a/samples/web/content/apprtc/js/signaling.js b/samples/web/content/apprtc/js/signaling.js
@@ -33,7 +33,7 @@ var messageQueue = [];
 // tasks is complete, the signaling process begins. At the same time, a
 // WebSocket connection is opened using |wss_url| followed by a subsequent
 // registration once GAE registration completes.
-function connectToRoom(roomId) {
+function connectToRoom(server, roomId) {
   var mediaPromise = getMediaIfNeeded();
   var turnPromise = getTurnServersIfNeeded();
 
@@ -44,7 +44,7 @@ function connectToRoom(roomId) {
   });
 
   // Asynchronously register with GAE.
-  var registerPromise = registerWithGAE(roomId).then(function(roomParams) {
+  var registerPromise = registerWithGAE(server, roomId).then(function(roomParams) {
     // The only difference in parameters should be clientId and isInitiator,
     // and the turn servers that we requested.
     // TODO(tkchin): clean up response format. JSHint doesn't like it either.
@@ -134,12 +134,17 @@ function getTurnServersIfNeeded() {
 }
 
 // Registers with GAE and returns room parameters.
-function registerWithGAE(roomId) {
+function registerWithGAE(server, roomId) {
   return new Promise(function(resolve, reject) {
     if (!roomId) {
       reject(Error('Missing room id.'));
     }
-    var path = '/register/' + roomId + window.location.search;
+
+    if (!server) {
+      // If server is not provided, use relative URI.
+      server = '';
+    }
+    var path = server + '/register/' + roomId + window.location.search;
 
     sendAsyncUrlRequest('POST', path).then(function(response) {
       var responseObj = parseJSON(response);
@@ -384,10 +389,14 @@ function setRemote(message) {
   }
 }
 
-function sendGAEMessage(message) {
+function sendGAEMessage(server, message) {
+  if (!server) {
+    // If server is not provided, use relative URI.
+    server = '';
+  }
   var msgString = JSON.stringify(message);
   // Must append query parameters in case we've specified alternate WSS url.
-  var path = '/message/' + params.roomId + '/' + params.clientId +
+  var path = server + '/message/' + params.roomId + '/' + params.clientId +
       window.location.search;
   var xhr = new XMLHttpRequest();
   xhr.open('POST', path, true);
@@ -417,7 +426,7 @@ function sendSignalingMessage(message) {
     // Initiator posts all messages to GAE. GAE will either store the messages
     // until the other client connects, or forward the message to Collider if
     // the other client is already connected.
-    sendGAEMessage(message);
+    sendGAEMessage(params.server, message);
   } else {
     sendWSSMessage(message);
   }
@@ -563,4 +572,4 @@ function recordIceCandidate(location, candidateObj) {
     ++types[type];
   }
   updateInfoDiv();
-}
+}
diff --git a/samples/web/content/apprtc/js/util.js b/samples/web/content/apprtc/js/util.js
@@ -8,7 +8,7 @@
 
 /* More information about these options at jshint.com/docs/options */
 
-/* exported requestTurnServers, sendAsyncUrlRequest */
+/* exported requestTurnServers, sendAsyncUrlRequest, randomString */
 
 'use strict';
 
@@ -83,3 +83,14 @@ function filterTurnUrls(urls, protocol) {
     }
   }
 }
+
+// Return a random numerical string.
+function randomString(strLength) {
+  var result = [];
+  strLength = strLength || 5;
+  var charSet = '0123456789';
+  while (strLength--) {
+    result.push(charSet.charAt(Math.floor(Math.random() * charSet.length)));
+  }
+  return result.join('');
+}
diff --git a/samples/web/content/apprtc/js/utils_test.js b/samples/web/content/apprtc/js/utils_test.js
@@ -8,7 +8,7 @@
 
 /* More information about these options at jshint.com/docs/options */
 
-/* globals TestCase, filterTurnUrls, assertEquals */
+/* globals TestCase, filterTurnUrls, assertEquals, randomString */
 
 'use strict';
 
@@ -43,3 +43,22 @@ UtilsTest.prototype.testFilterTurnUrlsTcp = function() {
   assertEquals('Only transport=tcp URLs should remain.', TURN_URLS_TCP, urls);
 };
 
+UtilsTest.prototype.testRandomReturnsCorrectLength = function() {
+  assertEquals('13 length string', 13, randomString(13).length);
+  assertEquals('5 length string', 5, randomString(5).length);
+  assertEquals('10 length string', 10, randomString(10).length);
+};
+
+UtilsTest.prototype.testRandomReturnsCorrectCharacters = function() { 
+  var str = randomString(500);
+
+  // randromString should return only the digits 0-9
+  var positiveRe = /^[0-9]+$/;
+  var negativeRe = /[^0-9]/;
+
+  var positiveResult = positiveRe.exec(str);
+  var negativeResult = negativeRe.exec(str);
+
+  assertEquals('Number only regular expression should match.', 0, positiveResult.index);
+  assertEquals('Anything other than digits regular expression should not match.', null, negativeResult);
+};
diff --git a/samples/web/content/apprtc/manifest.json b/samples/web/content/apprtc/manifest.json
@@ -0,0 +1,25 @@
+{
+  "name": "AppRTC",
+  "description": "AppRTC video chat application",
+  "version": "0.1",
+  "manifest_version": 2,
+  "app": {
+    "background": {
+      "scripts": ["js/background.js"]
+    }
+  },
+  "icons": {
+    "16": "images/apprtc-16.png",
+    "22": "images/apprtc-22.png",
+    "32": "images/apprtc-32.png",
+    "48": "images/apprtc-48.png",
+    "128": "images/apprtc-128.png"
+  },
+  "permissions": [
+    "audioCapture",
+    "videoCapture",
+    "storage",
+    "https://apprtc.appspot.com/",
+    "https://computeengineondemand.appspot.com/"
+  ]
+}