Merge pull request #14 from stefanalund/media-prefs

Saves audio/video preferences
EricssonResearch · Oct 14, 2014 · 613789b · adam-be · Oct 16, 2014 · stefanalund
2 parents 8bb5ebc + 856c512
commit 613789b
Show file tree

Hide file tree

Showing 3 changed files with 59 additions and 5 deletions.
diff --git a/server/client/main.css b/server/client/main.css
@@ -65,6 +65,10 @@ video {
 	-moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.4);
 	box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.4);
 }
+#audio-only-container {
+	visibility: hidden;
+	color: red;
+}
 #share-container {
 	visibility: hidden;
 	padding-top: 5px;

diff --git a/server/client/main.js b/server/client/main.js
@@ -8,6 +8,9 @@ if (window.mozRTCPeerConnection) {
 
 var remoteView;
 var callButton;
+var audioCheckBox;
+var videoCheckBox;
+var audioOnlyView;
 
 var signalingChannel;
 var pc;
@@ -22,12 +25,20 @@ window.onload = function () {
     callButton = document.getElementById("call_but");
     var selfView = document.getElementById("self_view");
     var joinButton = document.getElementById("join_but");
-    var audioCheckBox = document.getElementById("audio_cb");
-    var videoCheckBox = document.getElementById("video_cb");
+    audioCheckBox = document.getElementById("audio_cb");
+    videoCheckBox = document.getElementById("video_cb");
+    audioOnlyView = document.getElementById("audio-only-container");
     var shareView = document.getElementById("share-container");
 
+    updateMediaPrefs();
+
     joinButton.disabled = !navigator.webkitGetUserMedia;
     joinButton.onclick = function (evt) {
+        if (!saveMediaPrefs()) {
+            alert("Choose at least audio or video");
+            return;
+        }
+
         audioCheckBox.disabled = videoCheckBox.disabled = joinButton.disabled = true;
 
         // get a local stream
@@ -39,7 +50,10 @@ window.onload = function () {
             localStream = stream;
 
             joinButton.disabled = true;
-            selfView.style.visibility = "visible";
+            if (videoCheckBox.checked)
+                selfView.style.visibility = "visible";
+            else
+                audioOnlyView.style.visibility = "visible";
 
             var sessionId = document.getElementById("session_txt").value;
             signalingChannel = new SignalingChannel(sessionId);
@@ -48,7 +62,6 @@ window.onload = function () {
             var link = document.getElementById("share_link");
             var maybeAddHash = window.location.href.indexOf('#') !== -1 ? "" : ("#" + sessionId);
             link.href = link.text = window.location.href + maybeAddHash;
-            window.location.hash = sessionId;
             shareView.style.visibility = "visible";
 
             callButton.onclick = function () {
@@ -89,6 +102,39 @@ window.onload = function () {
     }
 }
 
+function saveMediaPrefs() {
+    var prefs;
+    if (audioCheckBox.checked && videoCheckBox.checked)
+        prefs = "both";
+    else if (audioCheckBox.checked)
+        prefs = "audio";
+    else if (videoCheckBox.checked)
+        prefs = "video";
+    else
+        return false;
+    localStorage.setItem("media-prefs", prefs);
+    return true;
+}
+
+function updateMediaPrefs() {
+    var mediaPrefs = localStorage.getItem("media-prefs");
+    switch (mediaPrefs) {
+        case "audio":
+            audioCheckBox.checked = true;
+            videoCheckBox.checked = false;
+            break;
+        case "video":
+            audioCheckBox.checked = false;
+            videoCheckBox.checked = true;
+            break;
+        case "both":
+            audioCheckBox.checked = videoCheckBox.checked = true;
+            break;
+        default:
+            break;
+    }
+}
+
 // handle signaling messages received from the other peer
 function handleMessage(evt) {
     if (!pc)
@@ -127,7 +173,10 @@ function start(isInitiator) {
     // once the remote stream arrives, show it in the remote video element
     pc.onaddstream = function (evt) {
         remoteView.src = URL.createObjectURL(evt.stream);
-        remoteView.style.visibility = "visible";
+        if (videoCheckBox.checked)
+            remoteView.style.visibility = "visible";
+        else
+            audioOnlyView.style.visibility = "visible";
     };
 
     pc.addStream(localStream);

diff --git a/server/client/webrtc_example.html b/server/client/webrtc_example.html
@@ -21,6 +21,7 @@ <h2>Simple WebRTC Example</h2>
                 <input class="btn" type="button" id="call_but" value="Call" disabled><br>
                 <input type="checkbox" id="audio_cb">Audio<br>
                 <input type="checkbox" id="video_cb" checked>Video
+                <div id="audio-only-container">Audio-only call</div>
                 <div id="share-container">
                     Send link to a friend: <a id="share_link" target="_blank" href=""></a>
                 </div>