You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

RTCUtils.js 19KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568
  1. /* global APP, config, require, attachMediaStream, getUserMedia,
  2. RTCPeerConnection, webkitMediaStream, webkitURL, webkitRTCPeerConnection,
  3. mozRTCIceCandidate, mozRTCSessionDescription, mozRTCPeerConnection */
  4. /* jshint -W101 */
  5. var RTCBrowserType = require("./RTCBrowserType");
  6. var Resolutions = require("../../service/RTC/Resolutions");
  7. var AdapterJS = require("./adapter.screenshare");
  8. var currentResolution = null;
  9. function getPreviousResolution(resolution) {
  10. if(!Resolutions[resolution])
  11. return null;
  12. var order = Resolutions[resolution].order;
  13. var res = null;
  14. var resName = null;
  15. for(var i in Resolutions) {
  16. var tmp = Resolutions[i];
  17. if (!res || (res.order < tmp.order && tmp.order < order)) {
  18. resName = i;
  19. res = tmp;
  20. }
  21. }
  22. return resName;
  23. }
  24. function setResolutionConstraints(constraints, resolution) {
  25. var isAndroid = RTCBrowserType.isAndroid();
  26. if (Resolutions[resolution]) {
  27. constraints.video.mandatory.minWidth = Resolutions[resolution].width;
  28. constraints.video.mandatory.minHeight = Resolutions[resolution].height;
  29. }
  30. else if (isAndroid) {
  31. // FIXME can't remember if the purpose of this was to always request
  32. // low resolution on Android ? if yes it should be moved up front
  33. constraints.video.mandatory.minWidth = 320;
  34. constraints.video.mandatory.minHeight = 240;
  35. constraints.video.mandatory.maxFrameRate = 15;
  36. }
  37. if (constraints.video.mandatory.minWidth)
  38. constraints.video.mandatory.maxWidth =
  39. constraints.video.mandatory.minWidth;
  40. if (constraints.video.mandatory.minHeight)
  41. constraints.video.mandatory.maxHeight =
  42. constraints.video.mandatory.minHeight;
  43. }
  44. function getConstraints(um, resolution, bandwidth, fps, desktopStream) {
  45. var constraints = {audio: false, video: false};
  46. if (um.indexOf('video') >= 0) {
  47. // same behaviour as true
  48. constraints.video = { mandatory: {}, optional: [] };
  49. constraints.video.optional.push({ googLeakyBucket: true });
  50. setResolutionConstraints(constraints, resolution);
  51. }
  52. if (um.indexOf('audio') >= 0) {
  53. if (!RTCBrowserType.isFirefox()) {
  54. // same behaviour as true
  55. constraints.audio = { mandatory: {}, optional: []};
  56. // if it is good enough for hangouts...
  57. constraints.audio.optional.push(
  58. {googEchoCancellation: true},
  59. {googAutoGainControl: true},
  60. {googNoiseSupression: true},
  61. {googHighpassFilter: true},
  62. {googNoisesuppression2: true},
  63. {googEchoCancellation2: true},
  64. {googAutoGainControl2: true}
  65. );
  66. } else {
  67. constraints.audio = true;
  68. }
  69. }
  70. if (um.indexOf('screen') >= 0) {
  71. if (RTCBrowserType.isChrome()) {
  72. constraints.video = {
  73. mandatory: {
  74. chromeMediaSource: "screen",
  75. googLeakyBucket: true,
  76. maxWidth: window.screen.width,
  77. maxHeight: window.screen.height,
  78. maxFrameRate: 3
  79. },
  80. optional: []
  81. };
  82. } else if (RTCBrowserType.isTemasysPluginUsed()) {
  83. constraints.video = {
  84. optional: [
  85. {
  86. sourceId: AdapterJS.WebRTCPlugin.plugin.screensharingKey
  87. }
  88. ]
  89. };
  90. } else if (RTCBrowserType.isFirefox()) {
  91. constraints.video = {
  92. mozMediaSource: "window",
  93. mediaSource: "window"
  94. };
  95. } else {
  96. console.error(
  97. "'screen' WebRTC media source is supported only in Chrome" +
  98. " and with Temasys plugin");
  99. }
  100. }
  101. if (um.indexOf('desktop') >= 0) {
  102. constraints.video = {
  103. mandatory: {
  104. chromeMediaSource: "desktop",
  105. chromeMediaSourceId: desktopStream,
  106. googLeakyBucket: true,
  107. maxWidth: window.screen.width,
  108. maxHeight: window.screen.height,
  109. maxFrameRate: 3
  110. },
  111. optional: []
  112. };
  113. }
  114. if (bandwidth) {
  115. if (!constraints.video) {
  116. //same behaviour as true
  117. constraints.video = {mandatory: {}, optional: []};
  118. }
  119. constraints.video.optional.push({bandwidth: bandwidth});
  120. }
  121. if (fps) {
  122. // for some cameras it might be necessary to request 30fps
  123. // so they choose 30fps mjpg over 10fps yuy2
  124. if (!constraints.video) {
  125. // same behaviour as true;
  126. constraints.video = {mandatory: {}, optional: []};
  127. }
  128. constraints.video.mandatory.minFrameRate = fps;
  129. }
  130. // we turn audio for both audio and video tracks, the fake audio & video seems to work
  131. // only when enabled in one getUserMedia call, we cannot get fake audio separate by fake video
  132. // this later can be a problem with some of the tests
  133. if(RTCBrowserType.isFirefox() && config.firefox_fake_device)
  134. {
  135. constraints.audio = true;
  136. constraints.fake = true;
  137. }
  138. return constraints;
  139. }
  140. function RTCUtils(RTCService, onTemasysPluginReady)
  141. {
  142. var self = this;
  143. this.service = RTCService;
  144. if (RTCBrowserType.isFirefox()) {
  145. var FFversion = RTCBrowserType.getFirefoxVersion();
  146. if (FFversion >= 40) {
  147. this.peerconnection = mozRTCPeerConnection;
  148. this.getUserMedia = navigator.mozGetUserMedia.bind(navigator);
  149. this.pc_constraints = {};
  150. this.attachMediaStream = function (element, stream) {
  151. // srcObject is being standardized and FF will eventually
  152. // support that unprefixed. FF also supports the
  153. // "element.src = URL.createObjectURL(...)" combo, but that
  154. // will be deprecated in favour of srcObject.
  155. //
  156. // https://groups.google.com/forum/#!topic/mozilla.dev.media/pKOiioXonJg
  157. // https://github.com/webrtc/samples/issues/302
  158. if(!element[0])
  159. return;
  160. element[0].mozSrcObject = stream;
  161. element[0].play();
  162. };
  163. this.getStreamID = function (stream) {
  164. var id = stream.id;
  165. if (!id) {
  166. var tracks = stream.getVideoTracks();
  167. if (!tracks || tracks.length === 0) {
  168. tracks = stream.getAudioTracks();
  169. }
  170. id = tracks[0].id;
  171. }
  172. return APP.xmpp.filter_special_chars(id);
  173. };
  174. this.getVideoSrc = function (element) {
  175. if(!element)
  176. return null;
  177. return element.mozSrcObject;
  178. };
  179. this.setVideoSrc = function (element, src) {
  180. if(element)
  181. element.mozSrcObject = src;
  182. };
  183. window.RTCSessionDescription = mozRTCSessionDescription;
  184. window.RTCIceCandidate = mozRTCIceCandidate;
  185. } else {
  186. console.error(
  187. "Firefox version too old: " + FFversion + ". Required >= 40.");
  188. window.location.href = 'unsupported_browser.html';
  189. return;
  190. }
  191. } else if (RTCBrowserType.isChrome() || RTCBrowserType.isOpera()) {
  192. this.peerconnection = webkitRTCPeerConnection;
  193. this.getUserMedia = navigator.webkitGetUserMedia.bind(navigator);
  194. this.attachMediaStream = function (element, stream) {
  195. element.attr('src', webkitURL.createObjectURL(stream));
  196. };
  197. this.getStreamID = function (stream) {
  198. // streams from FF endpoints have the characters '{' and '}'
  199. // that make jQuery choke.
  200. return APP.xmpp.filter_special_chars(stream.id);
  201. };
  202. this.getVideoSrc = function (element) {
  203. if(!element)
  204. return null;
  205. return element.getAttribute("src");
  206. };
  207. this.setVideoSrc = function (element, src) {
  208. if(element)
  209. element.setAttribute("src", src);
  210. };
  211. // DTLS should now be enabled by default but..
  212. this.pc_constraints = {'optional': [{'DtlsSrtpKeyAgreement': 'true'}]};
  213. if (RTCBrowserType.isAndroid()) {
  214. this.pc_constraints = {}; // disable DTLS on Android
  215. }
  216. if (!webkitMediaStream.prototype.getVideoTracks) {
  217. webkitMediaStream.prototype.getVideoTracks = function () {
  218. return this.videoTracks;
  219. };
  220. }
  221. if (!webkitMediaStream.prototype.getAudioTracks) {
  222. webkitMediaStream.prototype.getAudioTracks = function () {
  223. return this.audioTracks;
  224. };
  225. }
  226. }
  227. // Detect IE/Safari
  228. else if (RTCBrowserType.isTemasysPluginUsed()) {
  229. //AdapterJS.WebRTCPlugin.setLogLevel(
  230. // AdapterJS.WebRTCPlugin.PLUGIN_LOG_LEVELS.VERBOSE);
  231. AdapterJS.webRTCReady(function (isPlugin) {
  232. self.peerconnection = RTCPeerConnection;
  233. self.getUserMedia = getUserMedia;
  234. self.attachMediaStream = function (elSel, stream) {
  235. if (stream.id === "dummyAudio" || stream.id === "dummyVideo") {
  236. return;
  237. }
  238. attachMediaStream(elSel[0], stream);
  239. };
  240. self.getStreamID = function (stream) {
  241. var id = APP.xmpp.filter_special_chars(stream.label);
  242. return id;
  243. };
  244. self.getVideoSrc = function (element) {
  245. if (!element) {
  246. console.warn("Attempt to get video SRC of null element");
  247. return null;
  248. }
  249. var children = element.children;
  250. for (var i = 0; i !== children.length; ++i) {
  251. if (children[i].name === 'streamId') {
  252. return children[i].value;
  253. }
  254. }
  255. //console.info(element.id + " SRC: " + src);
  256. return null;
  257. };
  258. self.setVideoSrc = function (element, src) {
  259. //console.info("Set video src: ", element, src);
  260. if (!src) {
  261. console.warn("Not attaching video stream, 'src' is null");
  262. return;
  263. }
  264. AdapterJS.WebRTCPlugin.WaitForPluginReady();
  265. var stream = AdapterJS.WebRTCPlugin.plugin
  266. .getStreamWithId(AdapterJS.WebRTCPlugin.pageId, src);
  267. attachMediaStream(element, stream);
  268. };
  269. onTemasysPluginReady(isPlugin);
  270. });
  271. } else {
  272. try {
  273. console.log('Browser does not appear to be WebRTC-capable');
  274. } catch (e) { }
  275. window.location.href = 'unsupported_browser.html';
  276. }
  277. }
  278. RTCUtils.prototype.getUserMediaWithConstraints = function(
  279. um, success_callback, failure_callback, resolution,bandwidth, fps,
  280. desktopStream) {
  281. currentResolution = resolution;
  282. var constraints = getConstraints(
  283. um, resolution, bandwidth, fps, desktopStream);
  284. console.info("Get media constraints", constraints);
  285. var self = this;
  286. try {
  287. this.getUserMedia(constraints,
  288. function (stream) {
  289. console.log('onUserMediaSuccess');
  290. self.setAvailableDevices(um, true);
  291. success_callback(stream);
  292. },
  293. function (error) {
  294. self.setAvailableDevices(um, false);
  295. console.warn('Failed to get access to local media. Error ',
  296. error, constraints);
  297. if (failure_callback) {
  298. failure_callback(error);
  299. }
  300. });
  301. } catch (e) {
  302. console.error('GUM failed: ', e);
  303. if(failure_callback) {
  304. failure_callback(e);
  305. }
  306. }
  307. };
  308. RTCUtils.prototype.setAvailableDevices = function (um, available) {
  309. var devices = {};
  310. if(um.indexOf("video") != -1) {
  311. devices.video = available;
  312. }
  313. if(um.indexOf("audio") != -1) {
  314. devices.audio = available;
  315. }
  316. this.service.setDeviceAvailability(devices);
  317. };
  318. /**
  319. * We ask for audio and video combined stream in order to get permissions and
  320. * not to ask twice.
  321. */
  322. RTCUtils.prototype.obtainAudioAndVideoPermissions =
  323. function(devices, callback, usageOptions)
  324. {
  325. var self = this;
  326. // Get AV
  327. var successCallback = function (stream) {
  328. if(callback)
  329. callback(stream, usageOptions);
  330. else
  331. self.successCallback(stream, usageOptions);
  332. };
  333. if(!devices)
  334. devices = ['audio', 'video'];
  335. var newDevices = [];
  336. if(usageOptions)
  337. for(var i = 0; i < devices.length; i++) {
  338. var device = devices[i];
  339. if(usageOptions[device] === true)
  340. newDevices.push(device);
  341. }
  342. else
  343. newDevices = devices;
  344. if(newDevices.length === 0) {
  345. successCallback();
  346. return;
  347. }
  348. if (RTCBrowserType.isFirefox() || RTCBrowserType.isTemasysPluginUsed()) {
  349. // With FF/IE we can't split the stream into audio and video because FF
  350. // doesn't support media stream constructors. So, we need to get the
  351. // audio stream separately from the video stream using two distinct GUM
  352. // calls. Not very user friendly :-( but we don't have many other
  353. // options neither.
  354. //
  355. // Note that we pack those 2 streams in a single object and pass it to
  356. // the successCallback method.
  357. var obtainVideo = function (audioStream) {
  358. self.getUserMediaWithConstraints(
  359. ['video'],
  360. function (videoStream) {
  361. return successCallback({
  362. audioStream: audioStream,
  363. videoStream: videoStream
  364. });
  365. },
  366. function (error) {
  367. console.error(
  368. 'failed to obtain video stream - stop', error);
  369. self.errorCallback(error);
  370. },
  371. config.resolution || '360');
  372. };
  373. var obtainAudio = function () {
  374. self.getUserMediaWithConstraints(
  375. ['audio'],
  376. function (audioStream) {
  377. if (newDevices.indexOf('video') !== -1)
  378. obtainVideo(audioStream);
  379. },
  380. function (error) {
  381. console.error(
  382. 'failed to obtain audio stream - stop', error);
  383. self.errorCallback(error);
  384. }
  385. );
  386. };
  387. if (newDevices.indexOf('audio') !== -1) {
  388. obtainAudio();
  389. } else {
  390. obtainVideo(null);
  391. }
  392. } else {
  393. this.getUserMediaWithConstraints(
  394. newDevices,
  395. function (stream) {
  396. successCallback(stream);
  397. },
  398. function (error) {
  399. self.errorCallback(error);
  400. },
  401. config.resolution || '360');
  402. }
  403. };
  404. RTCUtils.prototype.successCallback = function (stream, usageOptions) {
  405. // If this is FF or IE, the stream parameter is *not* a MediaStream object,
  406. // it's an object with two properties: audioStream, videoStream.
  407. if (stream && stream.getAudioTracks && stream.getVideoTracks)
  408. console.log('got', stream, stream.getAudioTracks().length,
  409. stream.getVideoTracks().length);
  410. this.handleLocalStream(stream, usageOptions);
  411. };
  412. RTCUtils.prototype.errorCallback = function (error) {
  413. var self = this;
  414. console.error('failed to obtain audio/video stream - trying audio only', error);
  415. var resolution = getPreviousResolution(currentResolution);
  416. if(typeof error == "object" && error.constraintName && error.name
  417. && (error.name == "ConstraintNotSatisfiedError" ||
  418. error.name == "OverconstrainedError") &&
  419. (error.constraintName == "minWidth" || error.constraintName == "maxWidth" ||
  420. error.constraintName == "minHeight" || error.constraintName == "maxHeight")
  421. && resolution)
  422. {
  423. self.getUserMediaWithConstraints(['audio', 'video'],
  424. function (stream) {
  425. return self.successCallback(stream);
  426. }, function (error) {
  427. return self.errorCallback(error);
  428. }, resolution);
  429. }
  430. else {
  431. self.getUserMediaWithConstraints(
  432. ['audio'],
  433. function (stream) {
  434. return self.successCallback(stream);
  435. },
  436. function (error) {
  437. console.error('failed to obtain audio/video stream - stop',
  438. error);
  439. return self.successCallback(null);
  440. }
  441. );
  442. }
  443. };
  444. RTCUtils.prototype.handleLocalStream = function(stream, usageOptions) {
  445. // If this is FF, the stream parameter is *not* a MediaStream object, it's
  446. // an object with two properties: audioStream, videoStream.
  447. var audioStream, videoStream;
  448. if(window.webkitMediaStream)
  449. {
  450. audioStream = new webkitMediaStream();
  451. videoStream = new webkitMediaStream();
  452. if(stream) {
  453. var audioTracks = stream.getAudioTracks();
  454. for (var i = 0; i < audioTracks.length; i++) {
  455. audioStream.addTrack(audioTracks[i]);
  456. }
  457. var videoTracks = stream.getVideoTracks();
  458. for (i = 0; i < videoTracks.length; i++) {
  459. videoStream.addTrack(videoTracks[i]);
  460. }
  461. }
  462. }
  463. else if (RTCBrowserType.isFirefox() || RTCBrowserType.isTemasysPluginUsed())
  464. { // Firefox and Temasys plugin
  465. if (stream && stream.audioStream)
  466. audioStream = stream.audioStream;
  467. else
  468. audioStream = new DummyMediaStream("dummyAudio");
  469. if (stream && stream.videoStream)
  470. videoStream = stream.videoStream;
  471. else
  472. videoStream = new DummyMediaStream("dummyVideo");
  473. }
  474. var audioMuted = (usageOptions && usageOptions.audio === false),
  475. videoMuted = (usageOptions && usageOptions.video === false);
  476. var audioGUM = (!usageOptions || usageOptions.audio !== false),
  477. videoGUM = (!usageOptions || usageOptions.video !== false);
  478. this.service.createLocalStream(audioStream, "audio", null, null,
  479. audioMuted, audioGUM);
  480. this.service.createLocalStream(videoStream, "video", null, 'camera',
  481. videoMuted, videoGUM);
  482. };
  483. function DummyMediaStream(id) {
  484. this.id = id;
  485. this.label = id;
  486. this.stop = function() { };
  487. this.getAudioTracks = function() { return []; };
  488. this.getVideoTracks = function() { return []; };
  489. }
  490. RTCUtils.prototype.createStream = function(stream, isVideo) {
  491. var newStream = null;
  492. if (window.webkitMediaStream) {
  493. newStream = new webkitMediaStream();
  494. if (newStream) {
  495. var tracks = (isVideo ? stream.getVideoTracks() : stream.getAudioTracks());
  496. for (var i = 0; i < tracks.length; i++) {
  497. newStream.addTrack(tracks[i]);
  498. }
  499. }
  500. }
  501. else {
  502. // FIXME: this is duplicated with 'handleLocalStream' !!!
  503. if (stream) {
  504. newStream = stream;
  505. } else {
  506. newStream =
  507. new DummyMediaStream(isVideo ? "dummyVideo" : "dummyAudio");
  508. }
  509. }
  510. return newStream;
  511. };
  512. module.exports = RTCUtils;