webrtc.js 43 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199
  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. let peername = 'avatar-' + peerMoniker;
  191. deletePeerConnection.call( this, peername);
  192. }
  193. }
  194. } else {
  195. // this is a client who has has a peer leave the converstaion
  196. // remove that client, and the
  197. client = findClientByMoniker.call( this, moniker );
  198. if ( client ) {
  199. client.connection && client.connection.disconnect();
  200. removeClient.call( this, client );
  201. delete this.state.clients[ client ]
  202. }
  203. }
  204. //}
  205. },
  206. createdProperty: function( nodeID, propertyName, propertyValue ) {
  207. this.satProperty( nodeID, propertyName, propertyValue );
  208. },
  209. initializedProperty: function( nodeID, propertyName, propertyValue ) {
  210. this.satProperty( nodeID, propertyName, propertyValue );
  211. },
  212. satProperty: function( nodeID, propertyName, propertyValue ) {
  213. var client = this.state.clients[ nodeID ];
  214. if ( client ) {
  215. switch( propertyName ) {
  216. case "sharing":
  217. if ( propertyValue ) {
  218. client.sharing = propertyValue;
  219. if ( nodeID == this.local.ID ) {
  220. updateSharing.call( this, nodeID, propertyValue );
  221. }
  222. }
  223. break;
  224. case "localUrl":
  225. if ( propertyValue ) {
  226. if ( nodeID != this.local.ID ) {
  227. client.localUrl = propertyValue;
  228. }
  229. }
  230. break;
  231. case "remoteUrl":
  232. if ( propertyValue ) {
  233. client.remoteUrl = propertyValue;
  234. }
  235. break;
  236. case "displayName":
  237. if ( propertyValue ) {
  238. client.displayName = propertyValue;
  239. }
  240. break;
  241. default:
  242. // propertyName is the moniker of the client that
  243. // this connection supports
  244. if ( nodeID == this.local.ID ) {
  245. if ( propertyValue ) {
  246. // propertyName - moniker of the client
  247. // propertyValue - peerConnection message
  248. handlePeerMessage.call( this, propertyName, propertyValue );
  249. }
  250. }
  251. break;
  252. }
  253. }
  254. },
  255. gotProperty: function( nodeID, propertyName, propertyValue ) {
  256. var value = undefined;
  257. return value;
  258. },
  259. calledMethod: function( nodeID, methodName, methodParameters, methodValue ) {
  260. switch ( methodName ) {
  261. case "setLocalMute":
  262. if ( this.kernel.moniker() == this.kernel.client() ) {
  263. methodValue = setMute.call( this, methodParameters );
  264. }
  265. break;
  266. case "webrtcTurnOnOff":
  267. if ( this.kernel.moniker() == this.kernel.client() ) {
  268. console.log("WEBRTC turn on/off")
  269. methodValue = turnOnOffTracks.call( this, methodParameters );
  270. }
  271. break;
  272. case "webrtcMuteAudio":
  273. if ( this.kernel.moniker() == this.kernel.client() ) {
  274. methodValue = muteAudio.call( this, methodParameters );
  275. }
  276. break;
  277. case "webrtcMuteVideo":
  278. if ( this.kernel.moniker() == this.kernel.client() ) {
  279. methodValue = this.muteVideo.call( this, methodParameters );
  280. }
  281. break;
  282. }
  283. },
  284. firedEvent: function( nodeID, eventName, eventParameters ) {
  285. },
  286. muteVideo: function ( mute ) {
  287. let str = this.local.stream;
  288. if ( str ) {
  289. var tracks = str.getVideoTracks();
  290. tracks.forEach(function(track) {
  291. track.enabled = mute[0];
  292. });
  293. }
  294. },
  295. muteAudio: function ( mute ) {
  296. let str = this.local.stream;
  297. if ( str ) {
  298. var tracks = str.getAudioTracks();
  299. tracks.forEach(function(track) {
  300. track.enabled = mute[0];
  301. });
  302. }
  303. }
  304. } );
  305. function createVideoElementAsAsset(id, local) {
  306. var video = document.querySelector('#' + id);
  307. if (!video) {
  308. video = document.createElement('video');
  309. }
  310. video.setAttribute('id', id);
  311. video.setAttribute('autoplay', true);
  312. //video.setAttribute('src', '');
  313. video.setAttribute("webkit-playsinline", true);
  314. video.setAttribute("controls", true);
  315. video.setAttribute("width", 640);
  316. video.setAttribute("height", 480);
  317. if (local) video.setAttribute("muted", true);
  318. var assets = document.querySelector('a-assets');
  319. // if (!assets) {
  320. // assets = document.createElement('a-assets');
  321. // document.querySelector('a-scene').appendChild(assets);
  322. // }
  323. if (!assets.contains(video)) {
  324. assets.appendChild(video);
  325. }
  326. return video;
  327. }
  328. function getPrototypes( extendsID ) {
  329. var prototypes = [];
  330. var id = extendsID;
  331. while ( id !== undefined ) {
  332. prototypes.push( id );
  333. id = this.kernel.prototype( id );
  334. }
  335. return prototypes;
  336. }
  337. function getPeer( moniker ) {
  338. var clientNode;
  339. for ( var id in this.state.clients ) {
  340. if ( this.state.clients[id].moniker == moniker ) {
  341. clientNode = this.state.clients[id];
  342. break;
  343. }
  344. }
  345. return clientNode;
  346. }
  347. function displayLocal( stream, name) {
  348. var id = this.kernel.moniker();
  349. return displayVideo.call( this, id, stream, this.local.url, name, id, true);
  350. }
  351. function displayVideo( id, stream, url, name, destMoniker, local) {
  352. let video = createVideoElementAsAsset(name, local);
  353. //video.setAttribute('src', url);
  354. video.srcObject = stream;
  355. this.kernel.callMethod( 'avatar-'+id, "setVideoTexture", [name]);
  356. return id;
  357. }
  358. function removeVideo( client ) {
  359. // if ( client.videoDivID ) {
  360. // var $videoWin = $( "#" + client.videoDivID );
  361. // if ( $videoWin ) {
  362. // $videoWin.remove();
  363. // }
  364. // client.videoDivID = undefined;
  365. // }
  366. // this.kernel.callMethod( this.kernel.application(), "removeVideo", [ client.moniker ] );
  367. }
  368. function displayRemote( id, stream, url, name, destMoniker, color ) {
  369. return displayVideo.call( this, id, stream, url, name, destMoniker, false );
  370. }
  371. function capture( media ) {
  372. if ( this.local.stream === undefined && ( media.video || media.audio ) ) {
  373. var self = this;
  374. var constraints = {
  375. audio: true,
  376. video: true
  377. };
  378. navigator.mediaDevices.getUserMedia(constraints).then(handleSuccess).catch(handleError);
  379. function handleError(error) {
  380. console.log('navigator.getUserMedia error: ', error);
  381. }
  382. function handleSuccess(stream) {
  383. // var videoTracks = stream.getVideoTracks();
  384. // console.log('Got stream with constraints:', constraints);
  385. // if (videoTracks.length) {
  386. // videoTracks[0].enabled = true;
  387. // }
  388. let webRTCGUI = document.querySelector('#webrtcswitch');
  389. if (webRTCGUI) webRTCGUI.setAttribute("checked", true);
  390. let videoTracks = stream.getVideoTracks();
  391. let vstatus = videoTracks[0].enabled;
  392. let vidui = document.querySelector('#webrtcvideo');
  393. if (vidui) vidui.setAttribute("checked", vstatus);
  394. let audioTracks = stream.getAudioTracks();
  395. let astatus = audioTracks[0].enabled;
  396. let micui = document.querySelector('#webrtcaudio');
  397. if (micui) micui.setAttribute("checked", astatus);
  398. self.local.url = "url" //URL.createObjectURL( stream );
  399. self.local.stream = stream;
  400. self.kernel.setProperty( self.local.ID, "localUrl", self.local.url );
  401. var localNode = self.state.clients[ self.local.ID ];
  402. displayLocal.call( self, stream, localNode.displayName);
  403. sendOffers.call( self );
  404. }
  405. }
  406. }
  407. function appMoniker( name ) {
  408. return name.substr( 7, name.length-1 );
  409. }
  410. function findClientByMoniker( moniker ) {
  411. var client = undefined;
  412. for ( var id in this.state.clients ) {
  413. if ( client === undefined && moniker == this.state.clients[ id ].moniker ) {
  414. client = this.state.clients[ id ];
  415. }
  416. }
  417. return client;
  418. }
  419. function removeClient( client ) {
  420. if ( client ) {
  421. removeVideo.call( this, client );
  422. }
  423. }
  424. function sendOffers() {
  425. var peerNode;
  426. for ( var id in this.state.clients ) {
  427. if ( id != this.local.ID ) {
  428. peerNode = this.state.clients[ id ];
  429. // if there's a url then connect
  430. if ( peerNode.localUrl && peerNode.localUrl != "" && peerNode.connection === undefined ) {
  431. createPeerConnection.call( this, peerNode, true );
  432. }
  433. }
  434. }
  435. }
  436. function updateSharing( nodeID, sharing ) {
  437. setMute.call( this, !sharing.audio );
  438. setPause.call( this, !sharing.video );
  439. }
  440. function turnOnOffTracks( mute ) {
  441. let str = this.local.stream;
  442. if ( str ) {
  443. var audioTracks = str.getAudioTracks();
  444. var videoTracks = str.getVideoTracks();
  445. audioTracks.forEach(function(track) {
  446. track.enabled = mute[0];
  447. });
  448. videoTracks.forEach(function(track) {
  449. track.enabled = mute[0];
  450. });
  451. }
  452. };
  453. function muteAudio( mute ) {
  454. let str = this.local.stream;
  455. if ( str ) {
  456. var audioTracks = str.getAudioTracks();
  457. audioTracks.forEach(function(track) {
  458. track.enabled = mute[0];
  459. });
  460. }
  461. };
  462. function setMute( mute ) {
  463. if ( this.local.stream && this.local.stream.audioTracks && this.local.stream.audioTracks.length > 0 ) {
  464. if ( mute !== undefined ) {
  465. this.local.stream.audioTracks[0].enabled = !mute;
  466. }
  467. }
  468. };
  469. function setPause( pause ) {
  470. if ( this.local.stream && this.local.stream.videoTracks && this.local.stream.videoTracks.length > 0 ) {
  471. if ( pause !== undefined ) {
  472. this.local.stream.videoTracks[0].enabled = !pause;
  473. }
  474. }
  475. }
  476. function release() {
  477. for ( id in this.connections ) {
  478. this.connections[id].disconnect();
  479. }
  480. this.connections = {};
  481. }
  482. function hasStream() {
  483. return ( this.stream !== undefined );
  484. }
  485. function createPeerConnection( peerNode, sendOffer ) {
  486. if ( peerNode ) {
  487. if ( peerNode.connection === undefined ) {
  488. peerNode.connection = new mediaConnection( this, peerNode );
  489. peerNode.connection.connect( this.local.stream, sendOffer );
  490. //if ( this.bandwidth !== undefined ) {
  491. // debugger;
  492. //}
  493. }
  494. }
  495. }
  496. function handlePeerMessage( propertyName, msg ) {
  497. var peerNode = getPeer.call( this, propertyName )
  498. if ( peerNode ) {
  499. if ( peerNode.connection !== undefined ) {
  500. peerNode.connection.processMessage( msg );
  501. } else {
  502. if ( msg.type === 'offer' ) {
  503. this.msgQueue.unshift( msg );
  504. peerNode.connection = new mediaConnection( this, peerNode );
  505. peerNode.connection.connect( this.local.stream, false );
  506. while ( this.msgQueue.length > 0 ) {
  507. peerNode.connection.processMessage( this.msgQueue.shift() );
  508. }
  509. this.msgQueue = [];
  510. } else {
  511. this.msgQueue.push( msg );
  512. }
  513. }
  514. }
  515. }
  516. function deletePeerConnection( peerID ) {
  517. var peerNode = this.state.clients[ peerID ];
  518. if ( peerNode ) {
  519. peerNode.connection.disconnect();
  520. peerNode.connection = undefined;
  521. }
  522. }
  523. function getConnectionStats() {
  524. var peerNode = undefined;
  525. for ( var id in this.state.clients ) {
  526. peerNode = this.state.clients[ id ];
  527. if ( peerNode && peerNode.connection ) {
  528. peerNode.connection.getStats();
  529. }
  530. }
  531. }
  532. function isClientDefinition( prototypes ) {
  533. var foundClient = false;
  534. if ( prototypes ) {
  535. var len = prototypes.length;
  536. for ( var i = 0; i < len && !foundClient; i++ ) {
  537. foundClient = ( prototypes[i] == "http://vwf.example.com/aframe/avatar.vwf" );
  538. }
  539. }
  540. return foundClient;
  541. }
  542. function isClientInstanceDef( nodeID ) {
  543. return ( nodeID == "http://vwf.example.com/clients.vwf" );
  544. }
  545. function mediaConnection( view, peerNode ) {
  546. this.view = view;
  547. this.peerNode = peerNode;
  548. //
  549. this.stream = undefined;
  550. this.url = undefined;
  551. this.pc = undefined;
  552. this.connected = false;
  553. this.streamAdded = false;
  554. this.state = "created";
  555. // webrtc peerConnection parameters
  556. this.pc_config = { "iceServers": this.view.iceServers };
  557. this.pc_constraints = { "optional": [ { "DtlsSrtpKeyAgreement": true } ] };
  558. // Set up audio and video regardless of what devices are present.
  559. this.sdpConstraints = {
  560. 'offerToReceiveAudio':1,
  561. 'offerToReceiveVideo':1 };
  562. this.connect = function( stream, sendOffer ) {
  563. var self = this;
  564. if ( this.pc === undefined ) {
  565. if ( this.view.debug ) console.log("Creating PeerConnection.");
  566. var iceCallback = function( event ) {
  567. //console.log( "------------------------ iceCallback ------------------------" );
  568. if ( event.candidate ) {
  569. var sMsg = {
  570. "type": 'candidate',
  571. "label": event.candidate.sdpMLineIndex,
  572. "id": event.candidate.sdpMid,
  573. "candidate": event.candidate.candidate
  574. };
  575. // each client creates a property for each other
  576. // the message value is broadcast via the property
  577. self.view.kernel.setProperty( self.peerNode.ID, self.view.kernel.moniker(), sMsg );
  578. } else {
  579. if ( self.view.debug ) console.log("End of candidates.");
  580. }
  581. };
  582. // if ( webrtcDetectedBrowser == "firefox" ) {
  583. // this.pc_config = {"iceServers":[{"url":"stun:23.21.150.121"}]};
  584. // }
  585. try {
  586. this.pc = new RTCPeerConnection( this.pc_config);
  587. this.pc.onicecandidate = iceCallback;
  588. if ( self.view.debug ) console.log("Created RTCPeerConnnection with config \"" + JSON.stringify( this.pc_config ) + "\".");
  589. } catch (e) {
  590. console.log("Failed to create PeerConnection, exception: " + e.message);
  591. alert("Cannot create RTCPeerConnection object; WebRTC is not supported by this browser.");
  592. return;
  593. }
  594. this.pc.onnegotiationeeded = function( event ) {
  595. //debugger;
  596. //console.info( "onnegotiationeeded." );
  597. }
  598. this.pc.ontrack = function( event ) {
  599. if ( self.view.debug ) console.log("Remote stream added.");
  600. self.stream = event.streams[0];
  601. self.url = "url" //URL.createObjectURL( event.streams[0] );
  602. if ( self.view.debug ) console.log("Remote stream added. url: " + self.url );
  603. var divID = displayRemote.call( self.view, self.peerNode.moniker, self.stream, self.url, self.peerNode.displayName, view.kernel.moniker(), self.peerNode.color );
  604. if ( divID !== undefined ) {
  605. self.peerNode.videoDivID = divID;
  606. }
  607. };
  608. this.pc.onremovestream = function( event ) {
  609. if ( self.view.debug ) console.log("Remote stream removed.");
  610. };
  611. this.pc.onsignalingstatechange = function() {
  612. //console.info( "onsignalingstatechange state change." );
  613. }
  614. this.pc.oniceconnectionstatechange = function( ) {
  615. if ( self && self.pc ) {
  616. var state = self.pc.signalingState || self.pc.readyState;
  617. //console.info( "peerConnection state change: " + state );
  618. }
  619. }
  620. if ( stream ) {
  621. // stream.getVideoTracks();
  622. // stream.getAudioTracks();
  623. stream.getTracks().forEach(
  624. function(track) {
  625. self.pc.addTrack(
  626. track,
  627. stream
  628. );
  629. }
  630. );
  631. //this.pc.addStream( stream );
  632. this.streamAdded = true;
  633. }
  634. if ( sendOffer ){
  635. this.call();
  636. }
  637. }
  638. this.connected = ( this.pc !== undefined );
  639. };
  640. this.setMute = function( mute ) {
  641. if ( this.stream && this.stream.audioTracks && this.stream.audioTracks.length > 0 ) {
  642. if ( mute !== undefined ) {
  643. this.stream.audioTracks[0].enabled = !mute;
  644. }
  645. }
  646. }
  647. this.setPause = function( pause ) {
  648. if ( this.stream && this.stream.videoTracks && this.stream.videoTracks.length > 0 ) {
  649. if ( pause !== undefined ) {
  650. this.stream.videoTracks[0].enabled = !pause;
  651. }
  652. }
  653. }
  654. this.disconnect = function() {
  655. if ( this.view.debug ) console.log( "PC.disconnect " + this.peerID );
  656. if ( this.pc ) {
  657. this.pc.close();
  658. this.pc = undefined;
  659. }
  660. };
  661. this.processMessage = function( msg ) {
  662. //var msg = JSON.parse(message);
  663. if ( this.view.debug ) console.log('S->C: ' + JSON.stringify(msg) );
  664. if ( this.pc ) {
  665. if ( msg.type === 'offer') {
  666. // if ( this.view.stereo ) {
  667. // msg.sdp = addStereo( msg.sdp );
  668. // }
  669. this.pc.setRemoteDescription( new RTCSessionDescription( msg ) ); //msg.sdp
  670. this.answer();
  671. } else if ( msg.type === 'answer' && this.streamAdded ) {
  672. // if ( this.view.stereo ) {
  673. // msg.sdp = addStereo( msg.sdp );
  674. // }
  675. this.pc.setRemoteDescription( new RTCSessionDescription( msg ) ); //msg.sdp
  676. } else if ( msg.type === 'candidate' && this.streamAdded ) {
  677. var candidate = new RTCIceCandidate( {
  678. "sdpMLineIndex": msg.label,
  679. "candidate": msg.candidate
  680. } );
  681. this.pc.addIceCandidate( candidate );
  682. } else if ( msg.type === 'bye' && this.streamAdded ) {
  683. this.hangup();
  684. }
  685. }
  686. };
  687. this.answer = function() {
  688. if ( this.view.debug ) console.log( "Send answer to peer" );
  689. var self = this;
  690. var answerer = function( sessionDescription ) {
  691. // // Set Opus as the preferred codec in SDP if Opus is present.
  692. // sessionDescription.sdp = self.preferOpus( sessionDescription.sdp );
  693. // sessionDescription.sdp = self.setBandwidth( sessionDescription.sdp );
  694. self.pc.setLocalDescription( sessionDescription );
  695. self.view.kernel.setProperty( self.peerNode.ID, self.view.kernel.moniker(), sessionDescription );
  696. };
  697. function onCreateSessionDescriptionError(error) {
  698. console.log('Failed to create session description: ' + error.toString());
  699. }
  700. this.pc.createAnswer(
  701. self.sdpConstraints
  702. ).then(
  703. answerer,
  704. onCreateSessionDescriptionError
  705. );
  706. //this.pc.createAnswer( answerer, null, this.sdpConstraints);
  707. };
  708. this.call = function() {
  709. var self = this;
  710. var constraints = {
  711. offerToReceiveAudio: 1,
  712. offerToReceiveVideo: 1
  713. };
  714. var offerer = function( sessionDescription ) {
  715. self.pc.setLocalDescription(sessionDescription).then(
  716. function() {
  717. onSetLocalSuccess(self.pc);
  718. },
  719. onSetSessionDescriptionError
  720. );
  721. function onSetLocalSuccess(pc) {
  722. console.log(self.pc + ' setLocalDescription complete');
  723. }
  724. function onSetSessionDescriptionError(error) {
  725. console.log('Failed to set session description: ' + error.toString());
  726. }
  727. // Set Opus as the preferred codec in SDP if Opus is present.
  728. // sessionDescription.sdp = self.preferOpus( sessionDescription.sdp );
  729. // sessionDescription.sdp = self.setBandwidth( sessionDescription.sdp );
  730. // self.pc.setLocalDescription( sessionDescription );
  731. //sendSignalMessage.call( sessionDescription, self.peerID );
  732. self.view.kernel.setProperty( self.peerNode.ID, self.view.kernel.moniker(), sessionDescription );
  733. };
  734. var onFailure = function(e) {
  735. console.log(e)
  736. }
  737. self.pc.createOffer(
  738. constraints
  739. ).then(
  740. offerer,
  741. onFailure
  742. );
  743. //this.pc.createOffer( offerer, onFailure, constraints );
  744. };
  745. this.setBandwidth = function( sdp ) {
  746. // apparently this only works in chrome
  747. if ( this.bandwidth === undefined || moz ) {
  748. return sdp;
  749. }
  750. // remove existing bandwidth lines
  751. sdp = sdp.replace(/b=AS([^\r\n]+\r\n)/g, '');
  752. if ( this.bandwidth.audio ) {
  753. sdp = sdp.replace(/a=mid:audio\r\n/g, 'a=mid:audio\r\nb=AS:' + this.bandwidth.audio + '\r\n');
  754. }
  755. if ( this.bandwidth.video ) {
  756. sdp = sdp.replace(/a=mid:video\r\n/g, 'a=mid:video\r\nb=AS:' + this.bandwidth.video + '\r\n');
  757. }
  758. if ( this.bandwidth.data /*&& !options.preferSCTP */ ) {
  759. sdp = sdp.replace(/a=mid:data\r\n/g, 'a=mid:data\r\nb=AS:' + this.bandwidth.data + '\r\n');
  760. }
  761. return sdp;
  762. }
  763. this.getStats = function(){
  764. if ( this.pc && this.pc.getStats ) {
  765. console.info( "pc.iceConnectionState = " + this.pc.iceConnectionState );
  766. console.info( " pc.iceGatheringState = " + this.pc.iceGatheringState );
  767. console.info( " pc.readyState = " + this.pc.readyState );
  768. console.info( " pc.signalingState = " + this.pc.signalingState );
  769. var consoleStats = function( obj ) {
  770. console.info( ' Timestamp:' + obj.timestamp );
  771. if ( obj.id ) {
  772. console.info( ' id: ' + obj.id );
  773. }
  774. if ( obj.type ) {
  775. console.info( ' type: ' + obj.type );
  776. }
  777. if ( obj.names ) {
  778. var names = obj.names();
  779. for ( var i = 0; i < names.length; ++i ) {
  780. console.info( " "+names[ i ]+": " + obj.stat( names[ i ] ) );
  781. }
  782. } else {
  783. if ( obj.stat && obj.stat( 'audioOutputLevel' ) ) {
  784. console.info( " audioOutputLevel: " + obj.stat( 'audioOutputLevel' ) );
  785. }
  786. }
  787. };
  788. // local function
  789. var readStats = function( stats ) {
  790. var results = stats.result();
  791. var bitrateText = 'No bitrate stats';
  792. for ( var i = 0; i < results.length; ++i ) {
  793. var res = results[ i ];
  794. console.info( 'Report ' + i );
  795. if ( !res.local || res.local === res ) {
  796. consoleStats( res );
  797. // The bandwidth info for video is in a type ssrc stats record
  798. // with googFrameHeightReceived defined.
  799. // Should check for mediatype = video, but this is not
  800. // implemented yet.
  801. if ( res.type == 'ssrc' && res.stat( 'googFrameHeightReceived' ) ) {
  802. var bytesNow = res.stat( 'bytesReceived' );
  803. if ( timestampPrev > 0) {
  804. var bitRate = Math.round( ( bytesNow - bytesPrev ) * 8 / ( res.timestamp - timestampPrev ) );
  805. bitrateText = bitRate + ' kbits/sec';
  806. }
  807. timestampPrev = res.timestamp;
  808. bytesPrev = bytesNow;
  809. }
  810. } else {
  811. // Pre-227.0.1445 (188719) browser
  812. if ( res.local ) {
  813. console.info( " Local: " );
  814. consoleStats( res.local );
  815. }
  816. if ( res.remote ) {
  817. console.info( " Remote: " );
  818. consoleStats( res.remote );
  819. }
  820. }
  821. }
  822. console.info( " bitrate: " + bitrateText )
  823. }
  824. this.pc.getStats( readStats );
  825. }
  826. }
  827. this.hangup = function() {
  828. if ( this.view.debug ) console.log( "PC.hangup " + this.id );
  829. if ( this.pc ) {
  830. this.pc.close();
  831. this.pc = undefined;
  832. }
  833. };
  834. this.mergeConstraints = function( cons1, cons2 ) {
  835. var merged = cons1;
  836. for (var name in cons2.mandatory) {
  837. merged.mandatory[ name ] = cons2.mandatory[ name ];
  838. }
  839. merged.optional.concat( cons2.optional );
  840. return merged;
  841. }
  842. // Set Opus as the default audio codec if it's present.
  843. this.preferOpus = function( sdp ) {
  844. var sdpLines = sdp.split( '\r\n' );
  845. // Search for m line.
  846. for ( var i = 0; i < sdpLines.length; i++ ) {
  847. if ( sdpLines[i].search( 'm=audio' ) !== -1 ) {
  848. var mLineIndex = i;
  849. break;
  850. }
  851. }
  852. if ( mLineIndex === null ) {
  853. return sdp;
  854. }
  855. // for ( var i = 0; i < sdpLines.length; i++ ) {
  856. // if ( i == 0 ) console.info( "=============================================" );
  857. // console.info( "sdpLines["+i+"] = " + sdpLines[i] );
  858. // }
  859. // If Opus is available, set it as the default in m line.
  860. for ( var i = 0; i < sdpLines.length; i++ ) {
  861. if ( sdpLines[i].search( 'opus/48000' ) !== -1 ) {
  862. var opusPayload = this.extractSdp( sdpLines[i], /:(\d+) opus\/48000/i );
  863. if ( opusPayload) {
  864. sdpLines[ mLineIndex ] = this.setDefaultCodec( sdpLines[ mLineIndex ], opusPayload );
  865. }
  866. break;
  867. }
  868. }
  869. // Remove CN in m line and sdp.
  870. sdpLines = this.removeCN( sdpLines, mLineIndex );
  871. sdp = sdpLines.join('\r\n');
  872. return sdp;
  873. }
  874. // Set Opus in stereo if stereo is enabled.
  875. function addStereo( sdp ) {
  876. var sdpLines = sdp.split('\r\n');
  877. // Find opus payload.
  878. for (var i = 0; i < sdpLines.length; i++) {
  879. if (sdpLines[i].search('opus/48000') !== -1) {
  880. var opusPayload = extractSdp(sdpLines[i], /:(\d+) opus\/48000/i);
  881. break;
  882. }
  883. }
  884. // Find the payload in fmtp line.
  885. for (var i = 0; i < sdpLines.length; i++) {
  886. if (sdpLines[i].search('a=fmtp') !== -1) {
  887. var payload = extractSdp(sdpLines[i], /a=fmtp:(\d+)/ );
  888. if (payload === opusPayload) {
  889. var fmtpLineIndex = i;
  890. break;
  891. }
  892. }
  893. }
  894. // No fmtp line found.
  895. if (fmtpLineIndex === null)
  896. return sdp;
  897. // Append stereo=1 to fmtp line.
  898. sdpLines[fmtpLineIndex] = sdpLines[fmtpLineIndex].concat(' stereo=1');
  899. sdp = sdpLines.join('\r\n');
  900. return sdp;
  901. }
  902. // Strip CN from sdp before CN constraints is ready.
  903. this.removeCN = function( sdpLines, mLineIndex ) {
  904. var mLineElements = sdpLines[mLineIndex].split( ' ' );
  905. // Scan from end for the convenience of removing an item.
  906. for ( var i = sdpLines.length-1; i >= 0; i-- ) {
  907. var payload = this.extractSdp( sdpLines[i], /a=rtpmap:(\d+) CN\/\d+/i );
  908. if ( payload ) {
  909. var cnPos = mLineElements.indexOf( payload );
  910. if ( cnPos !== -1 ) {
  911. // Remove CN payload from m line.
  912. mLineElements.splice( cnPos, 1 );
  913. }
  914. // Remove CN line in sdp
  915. sdpLines.splice( i, 1 );
  916. }
  917. }
  918. sdpLines[ mLineIndex ] = mLineElements.join( ' ' );
  919. return sdpLines;
  920. }
  921. this.extractSdp = function( sdpLine, pattern ) {
  922. var result = sdpLine.match( pattern );
  923. return ( result && result.length == 2 ) ? result[ 1 ] : null;
  924. }
  925. // Set the selected codec to the first in m line.
  926. this.setDefaultCodec = function( mLine, payload ) {
  927. var elements = mLine.split( ' ' );
  928. var newLine = new Array();
  929. var index = 0;
  930. for ( var i = 0; i < elements.length; i++ ) {
  931. if ( index === 3 ) // Format of media starts from the fourth.
  932. newLine[ index++ ] = payload; // Put target payload to the first.
  933. if ( elements[ i ] !== payload )
  934. newLine[ index++ ] = elements[ i ];
  935. }
  936. return newLine.join( ' ' );
  937. }
  938. }
  939. } );