webrtc.js 43 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198
  1. "use strict";
  2. // Copyright 2012 United States Government, as represented by the Secretary of Defense, Under
  3. // Secretary of Defense (Personnel & Readiness).
  4. //
  5. // Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
  6. // in compliance with the License. You may obtain a copy of the License at
  7. //
  8. // http://www.apache.org/licenses/LICENSE-2.0
  9. //
  10. // Unless required by applicable law or agreed to in writing, software distributed under the License
  11. // is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
  12. // or implied. See the License for the specific language governing permissions and limitations under
  13. // the License.
  14. /// @module vwf/view/webrtc
  15. /// @requires vwf/view
  16. define( [ "module", "vwf/view", "vwf/utility", "vwf/utility/color", "jquery" ], function( module, view, utility, Color, $ ) {
  17. return view.load( module, {
  18. // == Module Definition ====================================================================
  19. initialize: function( options ) {
  20. if ( !this.state ) {
  21. this.state = {};
  22. }
  23. this.state.clients = {};
  24. this.state.instances = {};
  25. this.local = {
  26. "ID": undefined,
  27. "url": undefined,
  28. "stream": undefined,
  29. "sharing": { audio: true, video: true }
  30. };
  31. if ( options === undefined ) { options = {}; }
  32. this.stereo = options.stereo !== undefined ? options.stereo : false;
  33. this.videoElementsDiv = options.videoElementsDiv !== undefined ? options.videoElementsDiv : 'videoSurfaces';
  34. this.videoProperties = options.videoProperties !== undefined ? options.videoProperties : {};
  35. this.bandwidth = options.bandwidth;
  36. this.iceServers = options.iceServers !== undefined ? options.iceServers : [ { "url": "stun:stun.l.google.com:19302" } ];
  37. this.debug = options.debug !== undefined ? options.debug : false;
  38. this.videosAdded = 0;
  39. this.msgQueue = [];
  40. },
  41. createdNode: function( nodeID, childID, childExtendsID, childImplementsIDs,
  42. childSource, childType, childIndex, childName, callback /* ( ready ) */ ) {
  43. if ( childExtendsID === undefined )
  44. return;
  45. var self = this, node;
  46. var protos = getPrototypes.call( self, childExtendsID )
  47. if ( isClientInstanceDef.call( this, protos ) && childName ) {
  48. node = {
  49. "parentID": nodeID,
  50. "ID": childID,
  51. "extendsID": childExtendsID,
  52. "implementsIDs": childImplementsIDs,
  53. "source": childSource,
  54. "type": childType,
  55. "name": childName,
  56. "prototypes": protos,
  57. };
  58. this.state.instances[ childID ] = node;
  59. } else if ( isClientDefinition.call( this, protos ) && childName ) {
  60. // check if this instance of client and if this client is for this instance
  61. // create a login for this
  62. node = {
  63. "parentID": nodeID,
  64. "ID": childID,
  65. "moniker": undefined,
  66. "extendsID": childExtendsID,
  67. "implementsIDs": childImplementsIDs,
  68. "source": childSource,
  69. "type": childType,
  70. "name": childName,
  71. "prototypes": protos,
  72. "displayName": "",
  73. "connection": undefined,
  74. "localUrl": undefined,
  75. "remoteUrl": undefined,
  76. //"color": "rgb(0,0,0)",
  77. "createProperty": true,
  78. "sharing": { audio: true, video: true }
  79. };
  80. this.state.clients[ childID ] = node;
  81. // add the client specific locals
  82. node.moniker = appMoniker.call( this, childName );
  83. //console.info( "new client moniker: " + node.moniker );
  84. node.displayName = undefined;
  85. node.prototypes = protos;
  86. if ( this.kernel.moniker() == node.moniker ) {
  87. this.local.ID = childID;
  88. }
  89. }
  90. },
  91. deleteConnection: function(nodeID){
  92. // debugger;
  93. //if ( this.kernel.find( nodeID, "parent::element(*,'http://vwf.example.com/clients.vwf')" ).length > 0 ) {
  94. //if ( this.kernel.find( nodeID ).length > 0 ) {
  95. var moniker = nodeID.slice(-20);//this.kernel.name( nodeID );
  96. var client = undefined;
  97. if ( moniker == this.kernel.moniker() ) {
  98. // this is the client that has left the converstaion
  99. // go through the peerConnections and close the
  100. // all current connections
  101. var peer, peerMoniker;
  102. for ( var peerID in this.state.clients ) {
  103. peer = this.state.clients[ peerID ];
  104. peerMoniker = appMoniker.call( this, peer.name )
  105. if ( peerMoniker != this.kernel.moniker() ) {
  106. peer.connection && peer.connection.disconnect();
  107. let peername = 'avatar-' + peerMoniker;
  108. deletePeerConnection.call( this, peername);
  109. }
  110. }
  111. } else {
  112. // this is a client who has has a peer leave the converstaion
  113. // remove that client, and the
  114. client = findClientByMoniker.call( this, moniker );
  115. if ( client ) {
  116. client.connection && client.connection.disconnect();
  117. //removeClient.call( this, client );
  118. //delete this.state.clients[ client ]
  119. }
  120. }
  121. },
  122. stopWebRTC: function(nodeID){
  123. if( this.local.stream ){
  124. var tracks = this.local.stream.getTracks();
  125. tracks.forEach(function(track) {
  126. track.stop();
  127. });
  128. this.local.stream = undefined;
  129. let vidui = document.querySelector('#webrtcvideo');
  130. if (vidui) vidui.removeAttribute('checked');
  131. let micui = document.querySelector('#webrtcaudio');
  132. if (micui) micui.removeAttribute('checked');
  133. this.deleteConnection(nodeID);
  134. }
  135. },
  136. startWebRTC: function(childID) {
  137. var client = this.state.clients[ childID ];
  138. if ( client ) {
  139. if ( this.local.ID == childID ){
  140. // local client object
  141. // grab access to the webcam
  142. capture.call( this, this.local.sharing );
  143. var remoteClient = undefined;
  144. // existing clients
  145. for ( var clientID in this.state.clients ) {
  146. if ( clientID != this.local.ID ) {
  147. // create property for this client on each existing client
  148. remoteClient = this.state.clients[ clientID ];
  149. if ( remoteClient.createProperty ) {
  150. //console.info( "++ 1 ++ createProperty( "+clientID+", "+this.kernel.moniker()+" )" );
  151. remoteClient.createProperty = false;
  152. this.kernel.createProperty( clientID, this.kernel.moniker() );
  153. }
  154. }
  155. }
  156. } else {
  157. // not the local client, but if the local client has logged
  158. // in create the property for this on the new client
  159. if ( this.local.ID ) {
  160. if ( client.createProperty ) {
  161. client.createProperty = false;
  162. //console.info( "++ 2 ++ createProperty( "+childID+", "+this.kernel.moniker()+" )" );
  163. this.kernel.createProperty( childID, this.kernel.moniker() );
  164. }
  165. }
  166. }
  167. }
  168. },
  169. initializedNode: function( nodeID, childID, childExtendsID, childImplementsIDs,
  170. childSource, childType, childIndex, childName ) {
  171. if ( childExtendsID === undefined )
  172. return;
  173. },
  174. deletedNode: function( nodeID ) {
  175. // debugger;
  176. //if ( this.kernel.find( nodeID, "parent::element(*,'http://vwf.example.com/clients.vwf')" ).length > 0 ) {
  177. //if ( this.kernel.find( nodeID ).length > 0 ) {
  178. var moniker = nodeID.slice(-20);//this.kernel.name( nodeID );
  179. var client = undefined;
  180. if ( moniker == this.kernel.moniker() ) {
  181. // this is the client that has left the converstaion
  182. // go through the peerConnections and close the
  183. // all current connections
  184. var peer, peerMoniker;
  185. for ( var peerID in this.state.clients ) {
  186. peer = this.state.clients[ peerID ];
  187. peerMoniker = appMoniker.call( this, peer.name )
  188. if ( peerMoniker != this.kernel.moniker() ) {
  189. peer.connection && peer.connection.disconnect();
  190. }
  191. }
  192. } else {
  193. // this is a client who has has a peer leave the converstaion
  194. // remove that client, and the
  195. client = findClientByMoniker.call( this, moniker );
  196. if ( client ) {
  197. client.connection && client.connection.disconnect();
  198. removeClient.call( this, client );
  199. delete this.state.clients[ client ]
  200. }
  201. }
  202. //}
  203. },
  204. createdProperty: function( nodeID, propertyName, propertyValue ) {
  205. this.satProperty( nodeID, propertyName, propertyValue );
  206. },
  207. initializedProperty: function( nodeID, propertyName, propertyValue ) {
  208. this.satProperty( nodeID, propertyName, propertyValue );
  209. },
  210. satProperty: function( nodeID, propertyName, propertyValue ) {
  211. var client = this.state.clients[ nodeID ];
  212. if ( client ) {
  213. switch( propertyName ) {
  214. case "sharing":
  215. if ( propertyValue ) {
  216. client.sharing = propertyValue;
  217. if ( nodeID == this.local.ID ) {
  218. updateSharing.call( this, nodeID, propertyValue );
  219. }
  220. }
  221. break;
  222. case "localUrl":
  223. if ( propertyValue ) {
  224. if ( nodeID != this.local.ID ) {
  225. client.localUrl = propertyValue;
  226. }
  227. }
  228. break;
  229. case "remoteUrl":
  230. if ( propertyValue ) {
  231. client.remoteUrl = propertyValue;
  232. }
  233. break;
  234. case "displayName":
  235. if ( propertyValue ) {
  236. client.displayName = propertyValue;
  237. }
  238. break;
  239. default:
  240. // propertyName is the moniker of the client that
  241. // this connection supports
  242. if ( nodeID == this.local.ID ) {
  243. if ( propertyValue ) {
  244. // propertyName - moniker of the client
  245. // propertyValue - peerConnection message
  246. handlePeerMessage.call( this, propertyName, propertyValue );
  247. }
  248. }
  249. break;
  250. }
  251. }
  252. },
  253. gotProperty: function( nodeID, propertyName, propertyValue ) {
  254. var value = undefined;
  255. return value;
  256. },
  257. calledMethod: function( nodeID, methodName, methodParameters, methodValue ) {
  258. switch ( methodName ) {
  259. case "setLocalMute":
  260. if ( this.kernel.moniker() == this.kernel.client() ) {
  261. methodValue = setMute.call( this, methodParameters );
  262. }
  263. break;
  264. case "webrtcTurnOnOff":
  265. if ( this.kernel.moniker() == this.kernel.client() ) {
  266. console.log("WEBRTC turn on/off")
  267. methodValue = turnOnOffTracks.call( this, methodParameters );
  268. }
  269. break;
  270. case "webrtcMuteAudio":
  271. if ( this.kernel.moniker() == this.kernel.client() ) {
  272. methodValue = muteAudio.call( this, methodParameters );
  273. }
  274. break;
  275. case "webrtcMuteVideo":
  276. if ( this.kernel.moniker() == this.kernel.client() ) {
  277. methodValue = this.muteVideo.call( this, methodParameters );
  278. }
  279. break;
  280. }
  281. },
  282. firedEvent: function( nodeID, eventName, eventParameters ) {
  283. },
  284. muteVideo: function ( mute ) {
  285. let str = this.local.stream;
  286. if ( str ) {
  287. var tracks = str.getVideoTracks();
  288. tracks.forEach(function(track) {
  289. track.enabled = mute[0];
  290. });
  291. }
  292. },
  293. muteAudio: function ( mute ) {
  294. let str = this.local.stream;
  295. if ( str ) {
  296. var tracks = str.getAudioTracks();
  297. tracks.forEach(function(track) {
  298. track.enabled = mute[0];
  299. });
  300. }
  301. }
  302. } );
  303. function createVideoElementAsAsset(id, local) {
  304. var video = document.querySelector('#' + id);
  305. if (!video) {
  306. video = document.createElement('video');
  307. }
  308. video.setAttribute('id', id);
  309. video.setAttribute('autoplay', true);
  310. //video.setAttribute('src', '');
  311. video.setAttribute("webkit-playsinline", true);
  312. video.setAttribute("controls", true);
  313. video.setAttribute("width", 640);
  314. video.setAttribute("height", 480);
  315. if (local) video.setAttribute("muted", true);
  316. var assets = document.querySelector('a-assets');
  317. // if (!assets) {
  318. // assets = document.createElement('a-assets');
  319. // document.querySelector('a-scene').appendChild(assets);
  320. // }
  321. if (!assets.contains(video)) {
  322. assets.appendChild(video);
  323. }
  324. return video;
  325. }
  326. function getPrototypes( extendsID ) {
  327. var prototypes = [];
  328. var id = extendsID;
  329. while ( id !== undefined ) {
  330. prototypes.push( id );
  331. id = this.kernel.prototype( id );
  332. }
  333. return prototypes;
  334. }
  335. function getPeer( moniker ) {
  336. var clientNode;
  337. for ( var id in this.state.clients ) {
  338. if ( this.state.clients[id].moniker == moniker ) {
  339. clientNode = this.state.clients[id];
  340. break;
  341. }
  342. }
  343. return clientNode;
  344. }
  345. function displayLocal( stream, name) {
  346. var id = this.kernel.moniker();
  347. return displayVideo.call( this, id, stream, this.local.url, name, id, true);
  348. }
  349. function displayVideo( id, stream, url, name, destMoniker, local) {
  350. let video = createVideoElementAsAsset(name, local);
  351. //video.setAttribute('src', url);
  352. video.srcObject = stream;
  353. this.kernel.callMethod( 'avatar-'+id, "setVideoTexture", [name]);
  354. return id;
  355. }
  356. function removeVideo( client ) {
  357. // if ( client.videoDivID ) {
  358. // var $videoWin = $( "#" + client.videoDivID );
  359. // if ( $videoWin ) {
  360. // $videoWin.remove();
  361. // }
  362. // client.videoDivID = undefined;
  363. // }
  364. // this.kernel.callMethod( this.kernel.application(), "removeVideo", [ client.moniker ] );
  365. }
  366. function displayRemote( id, stream, url, name, destMoniker, color ) {
  367. return displayVideo.call( this, id, stream, url, name, destMoniker, false );
  368. }
  369. function capture( media ) {
  370. if ( this.local.stream === undefined && ( media.video || media.audio ) ) {
  371. var self = this;
  372. var constraints = {
  373. audio: true,
  374. video: true
  375. };
  376. navigator.mediaDevices.getUserMedia(constraints).then(handleSuccess).catch(handleError);
  377. function handleError(error) {
  378. console.log('navigator.getUserMedia error: ', error);
  379. }
  380. function handleSuccess(stream) {
  381. // var videoTracks = stream.getVideoTracks();
  382. // console.log('Got stream with constraints:', constraints);
  383. // if (videoTracks.length) {
  384. // videoTracks[0].enabled = true;
  385. // }
  386. let webRTCGUI = document.querySelector('#webrtcswitch');
  387. if (webRTCGUI) webRTCGUI.setAttribute("checked", true);
  388. let videoTracks = stream.getVideoTracks();
  389. let vstatus = videoTracks[0].enabled;
  390. let vidui = document.querySelector('#webrtcvideo');
  391. if (vidui) vidui.setAttribute("checked", vstatus);
  392. let audioTracks = stream.getAudioTracks();
  393. let astatus = audioTracks[0].enabled;
  394. let micui = document.querySelector('#webrtcaudio');
  395. if (micui) micui.setAttribute("checked", astatus);
  396. self.local.url = "url" //URL.createObjectURL( stream );
  397. self.local.stream = stream;
  398. self.kernel.setProperty( self.local.ID, "localUrl", self.local.url );
  399. var localNode = self.state.clients[ self.local.ID ];
  400. displayLocal.call( self, stream, localNode.displayName);
  401. sendOffers.call( self );
  402. }
  403. }
  404. }
  405. function appMoniker( name ) {
  406. return name.substr( 7, name.length-1 );
  407. }
  408. function findClientByMoniker( moniker ) {
  409. var client = undefined;
  410. for ( var id in this.state.clients ) {
  411. if ( client === undefined && moniker == this.state.clients[ id ].moniker ) {
  412. client = this.state.clients[ id ];
  413. }
  414. }
  415. return client;
  416. }
  417. function removeClient( client ) {
  418. if ( client ) {
  419. removeVideo.call( this, client );
  420. }
  421. }
  422. function sendOffers() {
  423. var peerNode;
  424. for ( var id in this.state.clients ) {
  425. if ( id != this.local.ID ) {
  426. peerNode = this.state.clients[ id ];
  427. // if there's a url then connect
  428. if ( peerNode.localUrl && peerNode.localUrl != "" && peerNode.connection === undefined ) {
  429. createPeerConnection.call( this, peerNode, true );
  430. }
  431. }
  432. }
  433. }
  434. function updateSharing( nodeID, sharing ) {
  435. setMute.call( this, !sharing.audio );
  436. setPause.call( this, !sharing.video );
  437. }
  438. function turnOnOffTracks( mute ) {
  439. let str = this.local.stream;
  440. if ( str ) {
  441. var audioTracks = str.getAudioTracks();
  442. var videoTracks = str.getVideoTracks();
  443. audioTracks.forEach(function(track) {
  444. track.enabled = mute[0];
  445. });
  446. videoTracks.forEach(function(track) {
  447. track.enabled = mute[0];
  448. });
  449. }
  450. };
  451. function muteAudio( mute ) {
  452. let str = this.local.stream;
  453. if ( str ) {
  454. var audioTracks = str.getAudioTracks();
  455. audioTracks.forEach(function(track) {
  456. track.enabled = mute[0];
  457. });
  458. }
  459. };
  460. function setMute( mute ) {
  461. if ( this.local.stream && this.local.stream.audioTracks && this.local.stream.audioTracks.length > 0 ) {
  462. if ( mute !== undefined ) {
  463. this.local.stream.audioTracks[0].enabled = !mute;
  464. }
  465. }
  466. };
  467. function setPause( pause ) {
  468. if ( this.local.stream && this.local.stream.videoTracks && this.local.stream.videoTracks.length > 0 ) {
  469. if ( pause !== undefined ) {
  470. this.local.stream.videoTracks[0].enabled = !pause;
  471. }
  472. }
  473. }
  474. function release() {
  475. for ( id in this.connections ) {
  476. this.connections[id].disconnect();
  477. }
  478. this.connections = {};
  479. }
  480. function hasStream() {
  481. return ( this.stream !== undefined );
  482. }
  483. function createPeerConnection( peerNode, sendOffer ) {
  484. if ( peerNode ) {
  485. if ( peerNode.connection === undefined ) {
  486. peerNode.connection = new mediaConnection( this, peerNode );
  487. peerNode.connection.connect( this.local.stream, sendOffer );
  488. //if ( this.bandwidth !== undefined ) {
  489. // debugger;
  490. //}
  491. }
  492. }
  493. }
  494. function handlePeerMessage( propertyName, msg ) {
  495. var peerNode = getPeer.call( this, propertyName )
  496. if ( peerNode ) {
  497. if ( peerNode.connection !== undefined ) {
  498. peerNode.connection.processMessage( msg );
  499. } else {
  500. if ( msg.type === 'offer' ) {
  501. this.msgQueue.unshift( msg );
  502. peerNode.connection = new mediaConnection( this, peerNode );
  503. peerNode.connection.connect( this.local.stream, false );
  504. while ( this.msgQueue.length > 0 ) {
  505. peerNode.connection.processMessage( this.msgQueue.shift() );
  506. }
  507. this.msgQueue = [];
  508. } else {
  509. this.msgQueue.push( msg );
  510. }
  511. }
  512. }
  513. }
  514. function deletePeerConnection( peerID ) {
  515. var peerNode = this.state.clients[ peerID ];
  516. if ( peerNode ) {
  517. peerNode.connection.disconnect();
  518. peerNode.connection = undefined;
  519. }
  520. }
  521. function getConnectionStats() {
  522. var peerNode = undefined;
  523. for ( var id in this.state.clients ) {
  524. peerNode = this.state.clients[ id ];
  525. if ( peerNode && peerNode.connection ) {
  526. peerNode.connection.getStats();
  527. }
  528. }
  529. }
  530. function isClientDefinition( prototypes ) {
  531. var foundClient = false;
  532. if ( prototypes ) {
  533. var len = prototypes.length;
  534. for ( var i = 0; i < len && !foundClient; i++ ) {
  535. foundClient = ( prototypes[i] == "http://vwf.example.com/aframe/avatar.vwf" );
  536. }
  537. }
  538. return foundClient;
  539. }
  540. function isClientInstanceDef( nodeID ) {
  541. return ( nodeID == "http://vwf.example.com/clients.vwf" );
  542. }
  543. function mediaConnection( view, peerNode ) {
  544. this.view = view;
  545. this.peerNode = peerNode;
  546. //
  547. this.stream = undefined;
  548. this.url = undefined;
  549. this.pc = undefined;
  550. this.connected = false;
  551. this.streamAdded = false;
  552. this.state = "created";
  553. // webrtc peerConnection parameters
  554. this.pc_config = { "iceServers": this.view.iceServers };
  555. this.pc_constraints = { "optional": [ { "DtlsSrtpKeyAgreement": true } ] };
  556. // Set up audio and video regardless of what devices are present.
  557. this.sdpConstraints = {
  558. 'offerToReceiveAudio':1,
  559. 'offerToReceiveVideo':1 };
  560. this.connect = function( stream, sendOffer ) {
  561. var self = this;
  562. if ( this.pc === undefined ) {
  563. if ( this.view.debug ) console.log("Creating PeerConnection.");
  564. var iceCallback = function( event ) {
  565. //console.log( "------------------------ iceCallback ------------------------" );
  566. if ( event.candidate ) {
  567. var sMsg = {
  568. "type": 'candidate',
  569. "label": event.candidate.sdpMLineIndex,
  570. "id": event.candidate.sdpMid,
  571. "candidate": event.candidate.candidate
  572. };
  573. // each client creates a property for each other
  574. // the message value is broadcast via the property
  575. self.view.kernel.setProperty( self.peerNode.ID, self.view.kernel.moniker(), sMsg );
  576. } else {
  577. if ( self.view.debug ) console.log("End of candidates.");
  578. }
  579. };
  580. // if ( webrtcDetectedBrowser == "firefox" ) {
  581. // this.pc_config = {"iceServers":[{"url":"stun:23.21.150.121"}]};
  582. // }
  583. try {
  584. this.pc = new RTCPeerConnection( this.pc_config);
  585. this.pc.onicecandidate = iceCallback;
  586. if ( self.view.debug ) console.log("Created RTCPeerConnnection with config \"" + JSON.stringify( this.pc_config ) + "\".");
  587. } catch (e) {
  588. console.log("Failed to create PeerConnection, exception: " + e.message);
  589. alert("Cannot create RTCPeerConnection object; WebRTC is not supported by this browser.");
  590. return;
  591. }
  592. this.pc.onnegotiationeeded = function( event ) {
  593. //debugger;
  594. //console.info( "onnegotiationeeded." );
  595. }
  596. this.pc.ontrack = function( event ) {
  597. if ( self.view.debug ) console.log("Remote stream added.");
  598. self.stream = event.streams[0];
  599. self.url = "url" //URL.createObjectURL( event.streams[0] );
  600. if ( self.view.debug ) console.log("Remote stream added. url: " + self.url );
  601. var divID = displayRemote.call( self.view, self.peerNode.moniker, self.stream, self.url, self.peerNode.displayName, view.kernel.moniker(), self.peerNode.color );
  602. if ( divID !== undefined ) {
  603. self.peerNode.videoDivID = divID;
  604. }
  605. };
  606. this.pc.onremovestream = function( event ) {
  607. if ( self.view.debug ) console.log("Remote stream removed.");
  608. };
  609. this.pc.onsignalingstatechange = function() {
  610. //console.info( "onsignalingstatechange state change." );
  611. }
  612. this.pc.oniceconnectionstatechange = function( ) {
  613. if ( self && self.pc ) {
  614. var state = self.pc.signalingState || self.pc.readyState;
  615. //console.info( "peerConnection state change: " + state );
  616. }
  617. }
  618. if ( stream ) {
  619. // stream.getVideoTracks();
  620. // stream.getAudioTracks();
  621. stream.getTracks().forEach(
  622. function(track) {
  623. self.pc.addTrack(
  624. track,
  625. stream
  626. );
  627. }
  628. );
  629. //this.pc.addStream( stream );
  630. this.streamAdded = true;
  631. }
  632. if ( sendOffer ){
  633. this.call();
  634. }
  635. }
  636. this.connected = ( this.pc !== undefined );
  637. };
  638. this.setMute = function( mute ) {
  639. if ( this.stream && this.stream.audioTracks && this.stream.audioTracks.length > 0 ) {
  640. if ( mute !== undefined ) {
  641. this.stream.audioTracks[0].enabled = !mute;
  642. }
  643. }
  644. }
  645. this.setPause = function( pause ) {
  646. if ( this.stream && this.stream.videoTracks && this.stream.videoTracks.length > 0 ) {
  647. if ( pause !== undefined ) {
  648. this.stream.videoTracks[0].enabled = !pause;
  649. }
  650. }
  651. }
  652. this.disconnect = function() {
  653. if ( this.view.debug ) console.log( "PC.disconnect " + this.peerID );
  654. if ( this.pc ) {
  655. this.pc.close();
  656. this.pc = undefined;
  657. }
  658. };
  659. this.processMessage = function( msg ) {
  660. //var msg = JSON.parse(message);
  661. if ( this.view.debug ) console.log('S->C: ' + JSON.stringify(msg) );
  662. if ( this.pc ) {
  663. if ( msg.type === 'offer') {
  664. // if ( this.view.stereo ) {
  665. // msg.sdp = addStereo( msg.sdp );
  666. // }
  667. this.pc.setRemoteDescription( new RTCSessionDescription( msg ) ); //msg.sdp
  668. this.answer();
  669. } else if ( msg.type === 'answer' && this.streamAdded ) {
  670. // if ( this.view.stereo ) {
  671. // msg.sdp = addStereo( msg.sdp );
  672. // }
  673. this.pc.setRemoteDescription( new RTCSessionDescription( msg ) ); //msg.sdp
  674. } else if ( msg.type === 'candidate' && this.streamAdded ) {
  675. var candidate = new RTCIceCandidate( {
  676. "sdpMLineIndex": msg.label,
  677. "candidate": msg.candidate
  678. } );
  679. this.pc.addIceCandidate( candidate );
  680. } else if ( msg.type === 'bye' && this.streamAdded ) {
  681. this.hangup();
  682. }
  683. }
  684. };
  685. this.answer = function() {
  686. if ( this.view.debug ) console.log( "Send answer to peer" );
  687. var self = this;
  688. var answerer = function( sessionDescription ) {
  689. // // Set Opus as the preferred codec in SDP if Opus is present.
  690. // sessionDescription.sdp = self.preferOpus( sessionDescription.sdp );
  691. // sessionDescription.sdp = self.setBandwidth( sessionDescription.sdp );
  692. self.pc.setLocalDescription( sessionDescription );
  693. self.view.kernel.setProperty( self.peerNode.ID, self.view.kernel.moniker(), sessionDescription );
  694. };
  695. function onCreateSessionDescriptionError(error) {
  696. console.log('Failed to create session description: ' + error.toString());
  697. }
  698. this.pc.createAnswer(
  699. self.sdpConstraints
  700. ).then(
  701. answerer,
  702. onCreateSessionDescriptionError
  703. );
  704. //this.pc.createAnswer( answerer, null, this.sdpConstraints);
  705. };
  706. this.call = function() {
  707. var self = this;
  708. var constraints = {
  709. offerToReceiveAudio: 1,
  710. offerToReceiveVideo: 1
  711. };
  712. var offerer = function( sessionDescription ) {
  713. self.pc.setLocalDescription(sessionDescription).then(
  714. function() {
  715. onSetLocalSuccess(self.pc);
  716. },
  717. onSetSessionDescriptionError
  718. );
  719. function onSetLocalSuccess(pc) {
  720. console.log(self.pc + ' setLocalDescription complete');
  721. }
  722. function onSetSessionDescriptionError(error) {
  723. console.log('Failed to set session description: ' + error.toString());
  724. }
  725. // Set Opus as the preferred codec in SDP if Opus is present.
  726. // sessionDescription.sdp = self.preferOpus( sessionDescription.sdp );
  727. // sessionDescription.sdp = self.setBandwidth( sessionDescription.sdp );
  728. // self.pc.setLocalDescription( sessionDescription );
  729. //sendSignalMessage.call( sessionDescription, self.peerID );
  730. self.view.kernel.setProperty( self.peerNode.ID, self.view.kernel.moniker(), sessionDescription );
  731. };
  732. var onFailure = function(e) {
  733. console.log(e)
  734. }
  735. self.pc.createOffer(
  736. constraints
  737. ).then(
  738. offerer,
  739. onFailure
  740. );
  741. //this.pc.createOffer( offerer, onFailure, constraints );
  742. };
  743. this.setBandwidth = function( sdp ) {
  744. // apparently this only works in chrome
  745. if ( this.bandwidth === undefined || moz ) {
  746. return sdp;
  747. }
  748. // remove existing bandwidth lines
  749. sdp = sdp.replace(/b=AS([^\r\n]+\r\n)/g, '');
  750. if ( this.bandwidth.audio ) {
  751. sdp = sdp.replace(/a=mid:audio\r\n/g, 'a=mid:audio\r\nb=AS:' + this.bandwidth.audio + '\r\n');
  752. }
  753. if ( this.bandwidth.video ) {
  754. sdp = sdp.replace(/a=mid:video\r\n/g, 'a=mid:video\r\nb=AS:' + this.bandwidth.video + '\r\n');
  755. }
  756. if ( this.bandwidth.data /*&& !options.preferSCTP */ ) {
  757. sdp = sdp.replace(/a=mid:data\r\n/g, 'a=mid:data\r\nb=AS:' + this.bandwidth.data + '\r\n');
  758. }
  759. return sdp;
  760. }
  761. this.getStats = function(){
  762. if ( this.pc && this.pc.getStats ) {
  763. console.info( "pc.iceConnectionState = " + this.pc.iceConnectionState );
  764. console.info( " pc.iceGatheringState = " + this.pc.iceGatheringState );
  765. console.info( " pc.readyState = " + this.pc.readyState );
  766. console.info( " pc.signalingState = " + this.pc.signalingState );
  767. var consoleStats = function( obj ) {
  768. console.info( ' Timestamp:' + obj.timestamp );
  769. if ( obj.id ) {
  770. console.info( ' id: ' + obj.id );
  771. }
  772. if ( obj.type ) {
  773. console.info( ' type: ' + obj.type );
  774. }
  775. if ( obj.names ) {
  776. var names = obj.names();
  777. for ( var i = 0; i < names.length; ++i ) {
  778. console.info( " "+names[ i ]+": " + obj.stat( names[ i ] ) );
  779. }
  780. } else {
  781. if ( obj.stat && obj.stat( 'audioOutputLevel' ) ) {
  782. console.info( " audioOutputLevel: " + obj.stat( 'audioOutputLevel' ) );
  783. }
  784. }
  785. };
  786. // local function
  787. var readStats = function( stats ) {
  788. var results = stats.result();
  789. var bitrateText = 'No bitrate stats';
  790. for ( var i = 0; i < results.length; ++i ) {
  791. var res = results[ i ];
  792. console.info( 'Report ' + i );
  793. if ( !res.local || res.local === res ) {
  794. consoleStats( res );
  795. // The bandwidth info for video is in a type ssrc stats record
  796. // with googFrameHeightReceived defined.
  797. // Should check for mediatype = video, but this is not
  798. // implemented yet.
  799. if ( res.type == 'ssrc' && res.stat( 'googFrameHeightReceived' ) ) {
  800. var bytesNow = res.stat( 'bytesReceived' );
  801. if ( timestampPrev > 0) {
  802. var bitRate = Math.round( ( bytesNow - bytesPrev ) * 8 / ( res.timestamp - timestampPrev ) );
  803. bitrateText = bitRate + ' kbits/sec';
  804. }
  805. timestampPrev = res.timestamp;
  806. bytesPrev = bytesNow;
  807. }
  808. } else {
  809. // Pre-227.0.1445 (188719) browser
  810. if ( res.local ) {
  811. console.info( " Local: " );
  812. consoleStats( res.local );
  813. }
  814. if ( res.remote ) {
  815. console.info( " Remote: " );
  816. consoleStats( res.remote );
  817. }
  818. }
  819. }
  820. console.info( " bitrate: " + bitrateText )
  821. }
  822. this.pc.getStats( readStats );
  823. }
  824. }
  825. this.hangup = function() {
  826. if ( this.view.debug ) console.log( "PC.hangup " + this.id );
  827. if ( this.pc ) {
  828. this.pc.close();
  829. this.pc = undefined;
  830. }
  831. };
  832. this.mergeConstraints = function( cons1, cons2 ) {
  833. var merged = cons1;
  834. for (var name in cons2.mandatory) {
  835. merged.mandatory[ name ] = cons2.mandatory[ name ];
  836. }
  837. merged.optional.concat( cons2.optional );
  838. return merged;
  839. }
  840. // Set Opus as the default audio codec if it's present.
  841. this.preferOpus = function( sdp ) {
  842. var sdpLines = sdp.split( '\r\n' );
  843. // Search for m line.
  844. for ( var i = 0; i < sdpLines.length; i++ ) {
  845. if ( sdpLines[i].search( 'm=audio' ) !== -1 ) {
  846. var mLineIndex = i;
  847. break;
  848. }
  849. }
  850. if ( mLineIndex === null ) {
  851. return sdp;
  852. }
  853. // for ( var i = 0; i < sdpLines.length; i++ ) {
  854. // if ( i == 0 ) console.info( "=============================================" );
  855. // console.info( "sdpLines["+i+"] = " + sdpLines[i] );
  856. // }
  857. // If Opus is available, set it as the default in m line.
  858. for ( var i = 0; i < sdpLines.length; i++ ) {
  859. if ( sdpLines[i].search( 'opus/48000' ) !== -1 ) {
  860. var opusPayload = this.extractSdp( sdpLines[i], /:(\d+) opus\/48000/i );
  861. if ( opusPayload) {
  862. sdpLines[ mLineIndex ] = this.setDefaultCodec( sdpLines[ mLineIndex ], opusPayload );
  863. }
  864. break;
  865. }
  866. }
  867. // Remove CN in m line and sdp.
  868. sdpLines = this.removeCN( sdpLines, mLineIndex );
  869. sdp = sdpLines.join('\r\n');
  870. return sdp;
  871. }
  872. // Set Opus in stereo if stereo is enabled.
  873. function addStereo( sdp ) {
  874. var sdpLines = sdp.split('\r\n');
  875. // Find opus payload.
  876. for (var i = 0; i < sdpLines.length; i++) {
  877. if (sdpLines[i].search('opus/48000') !== -1) {
  878. var opusPayload = extractSdp(sdpLines[i], /:(\d+) opus\/48000/i);
  879. break;
  880. }
  881. }
  882. // Find the payload in fmtp line.
  883. for (var i = 0; i < sdpLines.length; i++) {
  884. if (sdpLines[i].search('a=fmtp') !== -1) {
  885. var payload = extractSdp(sdpLines[i], /a=fmtp:(\d+)/ );
  886. if (payload === opusPayload) {
  887. var fmtpLineIndex = i;
  888. break;
  889. }
  890. }
  891. }
  892. // No fmtp line found.
  893. if (fmtpLineIndex === null)
  894. return sdp;
  895. // Append stereo=1 to fmtp line.
  896. sdpLines[fmtpLineIndex] = sdpLines[fmtpLineIndex].concat(' stereo=1');
  897. sdp = sdpLines.join('\r\n');
  898. return sdp;
  899. }
  900. // Strip CN from sdp before CN constraints is ready.
  901. this.removeCN = function( sdpLines, mLineIndex ) {
  902. var mLineElements = sdpLines[mLineIndex].split( ' ' );
  903. // Scan from end for the convenience of removing an item.
  904. for ( var i = sdpLines.length-1; i >= 0; i-- ) {
  905. var payload = this.extractSdp( sdpLines[i], /a=rtpmap:(\d+) CN\/\d+/i );
  906. if ( payload ) {
  907. var cnPos = mLineElements.indexOf( payload );
  908. if ( cnPos !== -1 ) {
  909. // Remove CN payload from m line.
  910. mLineElements.splice( cnPos, 1 );
  911. }
  912. // Remove CN line in sdp
  913. sdpLines.splice( i, 1 );
  914. }
  915. }
  916. sdpLines[ mLineIndex ] = mLineElements.join( ' ' );
  917. return sdpLines;
  918. }
  919. this.extractSdp = function( sdpLine, pattern ) {
  920. var result = sdpLine.match( pattern );
  921. return ( result && result.length == 2 ) ? result[ 1 ] : null;
  922. }
  923. // Set the selected codec to the first in m line.
  924. this.setDefaultCodec = function( mLine, payload ) {
  925. var elements = mLine.split( ' ' );
  926. var newLine = new Array();
  927. var index = 0;
  928. for ( var i = 0; i < elements.length; i++ ) {
  929. if ( index === 3 ) // Format of media starts from the fourth.
  930. newLine[ index++ ] = payload; // Put target payload to the first.
  931. if ( elements[ i ] !== payload )
  932. newLine[ index++ ] = elements[ i ];
  933. }
  934. return newLine.join( ' ' );
  935. }
  936. }
  937. } );