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

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