Show other users.

dodecaphonic · Mar 13, 2014 · f046e1e · f046e1e
1 parent 116b044
commit f046e1e
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 8 deletions.
diff --git a/lib/balladina_web/public/css/app.css b/lib/balladina_web/public/css/app.css
@@ -7,16 +7,24 @@
     float: left;
     width: 75%;
     height: 100%;
-    background-color: green;
+    border-right: solid 1px #ccc;
+}
+
+#remote-view video {
+    width: 320px;
 }
 
 #panel {
     float: left;
-    width: 25%;
+    width: 24%;
     height: 100%;
     overflow-y: scroll;
 }
 
+#panel video {
+    width: 100%;
+}
+
 #peers .track {
     height: 100px;
     border-bottom: solid 1px black;

diff --git a/lib/balladina_web/public/index.html b/lib/balladina_web/public/index.html
@@ -42,10 +42,12 @@
 
   <body>
     <div id="mosaic">
-      <video id="local-view" width="320"></video>
+      <div id="remote-view"></div>
     </div>
     <div id="panel">
       <div id="controls">
+        <video id="local-view" width="320"></video>
+
         <button id="start-recording">Start</button>
         <button id="stop-recording">Stop</button>
       </div>

diff --git a/lib/balladina_web/public/js/app.js b/lib/balladina_web/public/js/app.js
@@ -1,3 +1,5 @@
+var AudioContext = window.webkitAudioContext || window.AudioContext;
+var WEBSOCKET_URI = "ws://" + location.hostname + ":7331";
 var CLIENT_ID_PARTS = 6;
 var clientId, controlSocket, dataSocket;
 var isRecording = false, recorder, recordingTimer;
@@ -37,7 +39,7 @@ function renderPeers(peers) {
 }
 
 function prepareRecorder(stream) {
-  var context = new webkitAudioContext();
+  var context = new AudioContext();
   var mediaStreamSource = context.createMediaStreamSource(stream);
   recorder = new Recorder(mediaStreamSource, {
     workerPath: "/js/recorderjs/recorderWorker.js"
@@ -49,6 +51,7 @@ function startRecording() {
 
   recorder.record();
   recordingTimer = setInterval(function() {
+    recorder.stop();
     recorder.exportWAV(function(blob) {
       recorder.clear();
       dataSocket.send(blob);
@@ -73,13 +76,14 @@ function startRTC() {
 
   webrtc.on("readyToCall", function() {
     webrtc.joinRoom("foodafafa");
+    window.webrtceca = webrtc.webrtc;
     prepareRecorder(webrtc.webrtc.localStream);
   });
 }
 
 clientId      = generateClientId();
-controlSocket = new WebSocket("ws://localhost:7331");
-dataSocket    = new WebSocket("ws://localhost:7331");
+controlSocket = new WebSocket(WEBSOCKET_URI);
+dataSocket    = new WebSocket(WEBSOCKET_URI);
 
 controlSocket.onopen = function() {
   var message = { command: "promote_to_control", data: clientId };
@@ -98,14 +102,12 @@ controlSocket.onmessage = function(event) {
 
 $(document).ready(function() {
   $("#start-recording").on("click", function() {
-    console.log("START");
     controlSocket.send(JSON.stringify({
       command: "start_recording"
     }));
   });
 
   $("#stop-recording").on("click", function() {
-    console.log("STOP");
     controlSocket.send(JSON.stringify({
       command: "stop_recording"
     }));