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 20KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570
  1. /* global APP, config, require, attachMediaStream, getUserMedia,
  2. RTCPeerConnection, webkitMediaStream, webkitURL, webkitRTCPeerConnection,
  3. mozRTCIceCandidate, mozRTCSessionDescription, mozRTCPeerConnection */
  4. /* jshint -W101 */
  5. var MediaStreamType = require("../../service/RTC/MediaStreamTypes");
  6. var RTCBrowserType = require("./RTCBrowserType");
  7. var Resolutions = require("../../service/RTC/Resolutions");
  8. var AdapterJS = require("./adapter.screenshare");
  9. var currentResolution = null;
  10. function getPreviousResolution(resolution) {
  11. if(!Resolutions[resolution])
  12. return null;
  13. var order = Resolutions[resolution].order;
  14. var res = null;
  15. var resName = null;
  16. for(var i in Resolutions) {
  17. var tmp = Resolutions[i];
  18. if (!res || (res.order < tmp.order && tmp.order < order)) {
  19. resName = i;
  20. res = tmp;
  21. }
  22. }
  23. return resName;
  24. }
  25. function setResolutionConstraints(constraints, resolution) {
  26. var isAndroid = RTCBrowserType.isAndroid();
  27. if (Resolutions[resolution]) {
  28. constraints.video.mandatory.minWidth = Resolutions[resolution].width;
  29. constraints.video.mandatory.minHeight = Resolutions[resolution].height;
  30. }
  31. else if (isAndroid) {
  32. // FIXME can't remember if the purpose of this was to always request
  33. // low resolution on Android ? if yes it should be moved up front
  34. constraints.video.mandatory.minWidth = 320;
  35. constraints.video.mandatory.minHeight = 240;
  36. constraints.video.mandatory.maxFrameRate = 15;
  37. }
  38. if (constraints.video.mandatory.minWidth)
  39. constraints.video.mandatory.maxWidth =
  40. constraints.video.mandatory.minWidth;
  41. if (constraints.video.mandatory.minHeight)
  42. constraints.video.mandatory.maxHeight =
  43. constraints.video.mandatory.minHeight;
  44. }
  45. function getConstraints(um, resolution, bandwidth, fps, desktopStream) {
  46. var constraints = {audio: false, video: false};
  47. if (um.indexOf('video') >= 0) {
  48. // same behaviour as true
  49. constraints.video = { mandatory: {}, optional: [] };
  50. constraints.video.optional.push({ googLeakyBucket: true });
  51. setResolutionConstraints(constraints, resolution);
  52. }
  53. if (um.indexOf('audio') >= 0) {
  54. if (!RTCBrowserType.isFirefox()) {
  55. // same behaviour as true
  56. constraints.audio = { mandatory: {}, optional: []};
  57. // if it is good enough for hangouts...
  58. constraints.audio.optional.push(
  59. {googEchoCancellation: true},
  60. {googAutoGainControl: true},
  61. {googNoiseSupression: true},
  62. {googHighpassFilter: true},
  63. {googNoisesuppression2: true},
  64. {googEchoCancellation2: true},
  65. {googAutoGainControl2: true}
  66. );
  67. } else {
  68. constraints.audio = true;
  69. }
  70. }
  71. if (um.indexOf('screen') >= 0) {
  72. if (RTCBrowserType.isChrome()) {
  73. constraints.video = {
  74. mandatory: {
  75. chromeMediaSource: "screen",
  76. googLeakyBucket: true,
  77. maxWidth: window.screen.width,
  78. maxHeight: window.screen.height,
  79. maxFrameRate: 3
  80. },
  81. optional: []
  82. };
  83. } else if (RTCBrowserType.isTemasysPluginUsed()) {
  84. constraints.video = {
  85. optional: [
  86. {
  87. sourceId: AdapterJS.WebRTCPlugin.plugin.screensharingKey
  88. }
  89. ]
  90. };
  91. } else if (RTCBrowserType.isFirefox()) {
  92. constraints.video = {
  93. mozMediaSource: "window",
  94. mediaSource: "window"
  95. };
  96. } else {
  97. console.error(
  98. "'screen' WebRTC media source is supported only in Chrome" +
  99. " and with Temasys plugin");
  100. }
  101. }
  102. if (um.indexOf('desktop') >= 0) {
  103. constraints.video = {
  104. mandatory: {
  105. chromeMediaSource: "desktop",
  106. chromeMediaSourceId: desktopStream,
  107. googLeakyBucket: true,
  108. maxWidth: window.screen.width,
  109. maxHeight: window.screen.height,
  110. maxFrameRate: 3
  111. },
  112. optional: []
  113. };
  114. }
  115. if (bandwidth) {
  116. if (!constraints.video) {
  117. //same behaviour as true
  118. constraints.video = {mandatory: {}, optional: []};
  119. }
  120. constraints.video.optional.push({bandwidth: bandwidth});
  121. }
  122. if (fps) {
  123. // for some cameras it might be necessary to request 30fps
  124. // so they choose 30fps mjpg over 10fps yuy2
  125. if (!constraints.video) {
  126. // same behaviour as true;
  127. constraints.video = {mandatory: {}, optional: []};
  128. }
  129. constraints.video.mandatory.minFrameRate = fps;
  130. }
  131. // we turn audio for both audio and video tracks, the fake audio & video seems to work
  132. // only when enabled in one getUserMedia call, we cannot get fake audio separate by fake video
  133. // this later can be a problem with some of the tests
  134. if(RTCBrowserType.isFirefox() && config.firefox_fake_device)
  135. {
  136. constraints.audio = true;
  137. constraints.fake = true;
  138. }
  139. return constraints;
  140. }
  141. function RTCUtils(RTCService, onTemasysPluginReady)
  142. {
  143. var self = this;
  144. this.service = RTCService;
  145. if (RTCBrowserType.isFirefox()) {
  146. var FFversion = RTCBrowserType.getFirefoxVersion();
  147. if (FFversion >= 40) {
  148. this.peerconnection = mozRTCPeerConnection;
  149. this.getUserMedia = navigator.mozGetUserMedia.bind(navigator);
  150. this.pc_constraints = {};
  151. this.attachMediaStream = function (element, stream) {
  152. // srcObject is being standardized and FF will eventually
  153. // support that unprefixed. FF also supports the
  154. // "element.src = URL.createObjectURL(...)" combo, but that
  155. // will be deprecated in favour of srcObject.
  156. //
  157. // https://groups.google.com/forum/#!topic/mozilla.dev.media/pKOiioXonJg
  158. // https://github.com/webrtc/samples/issues/302
  159. if(!element[0])
  160. return;
  161. element[0].mozSrcObject = stream;
  162. element[0].play();
  163. };
  164. this.getStreamID = function (stream) {
  165. var id = stream.id;
  166. if (!id) {
  167. var tracks = stream.getVideoTracks();
  168. if (!tracks || tracks.length === 0) {
  169. tracks = stream.getAudioTracks();
  170. }
  171. id = tracks[0].id;
  172. }
  173. return APP.xmpp.filter_special_chars(id);
  174. };
  175. this.getVideoSrc = function (element) {
  176. if(!element)
  177. return null;
  178. return element.mozSrcObject;
  179. };
  180. this.setVideoSrc = function (element, src) {
  181. if(element)
  182. element.mozSrcObject = src;
  183. };
  184. window.RTCSessionDescription = mozRTCSessionDescription;
  185. window.RTCIceCandidate = mozRTCIceCandidate;
  186. } else {
  187. console.error(
  188. "Firefox version too old: " + FFversion + ". Required >= 40.");
  189. window.location.href = 'unsupported_browser.html';
  190. return;
  191. }
  192. } else if (RTCBrowserType.isChrome() || RTCBrowserType.isOpera()) {
  193. this.peerconnection = webkitRTCPeerConnection;
  194. this.getUserMedia = navigator.webkitGetUserMedia.bind(navigator);
  195. this.attachMediaStream = function (element, stream) {
  196. element.attr('src', webkitURL.createObjectURL(stream));
  197. };
  198. this.getStreamID = function (stream) {
  199. // streams from FF endpoints have the characters '{' and '}'
  200. // that make jQuery choke.
  201. return APP.xmpp.filter_special_chars(stream.id);
  202. };
  203. this.getVideoSrc = function (element) {
  204. if(!element)
  205. return null;
  206. return element.getAttribute("src");
  207. };
  208. this.setVideoSrc = function (element, src) {
  209. if(element)
  210. element.setAttribute("src", src);
  211. };
  212. // DTLS should now be enabled by default but..
  213. this.pc_constraints = {'optional': [{'DtlsSrtpKeyAgreement': 'true'}]};
  214. if (RTCBrowserType.isAndroid()) {
  215. this.pc_constraints = {}; // disable DTLS on Android
  216. }
  217. if (!webkitMediaStream.prototype.getVideoTracks) {
  218. webkitMediaStream.prototype.getVideoTracks = function () {
  219. return this.videoTracks;
  220. };
  221. }
  222. if (!webkitMediaStream.prototype.getAudioTracks) {
  223. webkitMediaStream.prototype.getAudioTracks = function () {
  224. return this.audioTracks;
  225. };
  226. }
  227. }
  228. // Detect IE/Safari
  229. else if (RTCBrowserType.isTemasysPluginUsed()) {
  230. //AdapterJS.WebRTCPlugin.setLogLevel(
  231. // AdapterJS.WebRTCPlugin.PLUGIN_LOG_LEVELS.VERBOSE);
  232. AdapterJS.webRTCReady(function (isPlugin) {
  233. self.peerconnection = RTCPeerConnection;
  234. self.getUserMedia = getUserMedia;
  235. self.attachMediaStream = function (elSel, stream) {
  236. if (stream.id === "dummyAudio" || stream.id === "dummyVideo") {
  237. return;
  238. }
  239. attachMediaStream(elSel[0], stream);
  240. };
  241. self.getStreamID = function (stream) {
  242. return APP.xmpp.filter_special_chars(stream.label);
  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(
  479. audioStream, MediaStreamType.AUDIO_TYPE, null, null,
  480. audioMuted, audioGUM);
  481. this.service.createLocalStream(
  482. videoStream, MediaStreamType.VIDEO_TYPE, null, 'camera',
  483. videoMuted, videoGUM);
  484. };
  485. function DummyMediaStream(id) {
  486. this.id = id;
  487. this.label = id;
  488. this.stop = function() { };
  489. this.getAudioTracks = function() { return []; };
  490. this.getVideoTracks = function() { return []; };
  491. }
  492. RTCUtils.prototype.createStream = function(stream, isVideo) {
  493. var newStream = null;
  494. if (window.webkitMediaStream) {
  495. newStream = new webkitMediaStream();
  496. if (newStream) {
  497. var tracks = (isVideo ? stream.getVideoTracks() : stream.getAudioTracks());
  498. for (var i = 0; i < tracks.length; i++) {
  499. newStream.addTrack(tracks[i]);
  500. }
  501. }
  502. }
  503. else {
  504. // FIXME: this is duplicated with 'handleLocalStream' !!!
  505. if (stream) {
  506. newStream = stream;
  507. } else {
  508. newStream =
  509. new DummyMediaStream(isVideo ? "dummyVideo" : "dummyAudio");
  510. }
  511. }
  512. return newStream;
  513. };
  514. module.exports = RTCUtils;