Browse code

screen sharing for visio

devnewton authored on 17/03/2017 at 17:08:08
Showing 1 changed files
... ...
@@ -1,12 +1,30 @@
1 1
 var jb3VisioTemplate = '\
2
-<form class="c-input-group" if="{ nextRTCReady && !localVideoStream }" onsubmit="{ joinConversation }" >\
3
-    <div class="o-field">\
4
-        <input name="conversationId" placeholder="Type room name" list="rooms" class="c-field" oninput="{ changeConversationId }">\
2
+<form class=""o-fieldset" if="{ nextRTCReady && !localVideoStream }" onsubmit="{ joinConversation }" >\
3
+    <label class="c-label o-form-element">\
4
+        Room:\
5
+        <input name="conversationId" placeholder="Type room name" list="rooms" class="c-field o-form-element" oninput="{ changeConversationId }">\
5 6
         <datalist id="rooms">\
6 7
             <option each="{ rooms }" value="{ rname }">\
7 8
         </datalist>\
9
+    </label>\
10
+    <label class="c-label o-form-element">\
11
+        Share:\
12
+        <select name="mediaType" class="c-field o-form-element" onchange="{ changeMediaType }">\
13
+            <optgroup>\
14
+                <option value="audio-and-video">Audio and Video</option>\
15
+                <option value="audio-only">Audio only</option>\
16
+                <option value="video-only">Video only</option>\
17
+            </optgroup>\
18
+            <optgroup>\
19
+                <option value="application">Application</option>\
20
+                <option value="screen">Screen</option>\
21
+                <option value="window">Window</option>\
22
+            <optgroup>\
23
+        </select>\
24
+    </label>\
25
+    <div class="c-label o-form-element">\
26
+        <input if="{ conversationId.value }" type="submit" class="c-button c-button--info" value="Join">\
8 27
     </div>\
9
-    <input if="{ conversationId.value }" type="submit" class="c-button c-button--info" value="Join">\
10 28
 </form>\
11 29
 <div class="o-grid  o-grid--wrap" >\
12 30
     <div class="o-grid__cell">\
... ...
@@ -25,7 +43,27 @@ var jb3VisioTemplate = '\
25 25
 </div>\
26 26
 ';
27 27
 function jb3VisioConstructor(opts) {
28
-    var self = this;    
28
+    var self = this;
29
+    self.getMediaConfig = function() {
30
+        switch(self.mediaType.value) {
31
+            case "audio-only":
32
+                return { audio: true };
33
+            case "video-only":
34
+                return { video: true };
35
+            case "application":
36
+                return {video: {mediaSource: 'application'}};
37
+            case "screen":
38
+                return {video: {mediaSource: 'screen'}};
39
+            case "window":
40
+                return {video: {mediaSource: 'window'}};
41
+            default:
42
+            case "audio-and-video":
43
+                return { video: true, audio: true };
44
+        }  
45
+    };
46
+    self.changeMediaType = function(event) {
47
+        self.nextRTC.mediaConfig = self.getMediaConfig();
48
+    }
29 49
     self.reset = function() {
30 50
         self.rooms = jb3_common.getRooms();
31 51
         self.conversationId.value = URI(window.location).search(true).room || '';
... ...
@@ -36,10 +74,7 @@ function jb3VisioConstructor(opts) {
36 36
         rtcCoinURL = rtcCoinURL.protocol(rtcCoinURL.protocol() === "https" ? "wss" : "ws").path("/rtcoin");
37 37
         self.nextRTC = new NextRTC({
38 38
             wsURL: rtcCoinURL,
39
-            mediaConfig: {
40
-                video: true,
41
-                audio: true
42
-            },
39
+            mediaConfig: self.getMediaConfig(),
43 40
             peerConfig: {
44 41
                 iceServers: [
45 42
                     {urls: "stun:turn.bci.im"},