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.

example.js 9.9KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310
  1. /* global $, JitsiMeetJS */
  2. const options = {
  3. hosts: {
  4. domain: 'jitsi-meet.example.com',
  5. muc: 'conference.jitsi-meet.example.com' // FIXME: use XEP-0030
  6. },
  7. bosh: '//jitsi-meet.example.com/http-bind', // FIXME: use xep-0156 for that
  8. // The name of client node advertised in XEP-0115 'c' stanza
  9. clientNode: 'http://jitsi.org/jitsimeet'
  10. };
  11. const confOptions = {
  12. openSctp: true
  13. };
  14. let connection = null;
  15. let isJoined = false;
  16. let room = null;
  17. let localTracks = [];
  18. const remoteTracks = {};
  19. /**
  20. * Handles local tracks.
  21. * @param tracks Array with JitsiTrack objects
  22. */
  23. function onLocalTracks(tracks) {
  24. localTracks = tracks;
  25. for (let i = 0; i < localTracks.length; i++) {
  26. localTracks[i].addEventListener(
  27. JitsiMeetJS.events.track.TRACK_AUDIO_LEVEL_CHANGED,
  28. audioLevel => console.log(`Audio Level local: ${audioLevel}`));
  29. localTracks[i].addEventListener(
  30. JitsiMeetJS.events.track.TRACK_MUTE_CHANGED,
  31. () => console.log('local track muted'));
  32. localTracks[i].addEventListener(
  33. JitsiMeetJS.events.track.LOCAL_TRACK_STOPPED,
  34. () => console.log('local track stoped'));
  35. localTracks[i].addEventListener(
  36. JitsiMeetJS.events.track.TRACK_AUDIO_OUTPUT_CHANGED,
  37. deviceId =>
  38. console.log(
  39. `track audio output device was changed to ${deviceId}`));
  40. if (localTracks[i].getType() === 'video') {
  41. $('body').append(`<video autoplay='1' id='localVideo${i}' />`);
  42. localTracks[i].attach($(`#localVideo${i}`)[0]);
  43. } else {
  44. $('body').append(
  45. `<audio autoplay='1' muted='true' id='localAudio${i}' />`);
  46. localTracks[i].attach($(`#localAudio${i}`)[0]);
  47. }
  48. if (isJoined) {
  49. room.addTrack(localTracks[i]);
  50. }
  51. }
  52. }
  53. /**
  54. * Handles remote tracks
  55. * @param track JitsiTrack object
  56. */
  57. function onRemoteTrack(track) {
  58. if (track.isLocal()) {
  59. return;
  60. }
  61. const participant = track.getParticipantId();
  62. if (!remoteTracks[participant]) {
  63. remoteTracks[participant] = [];
  64. }
  65. const idx = remoteTracks[participant].push(track);
  66. track.addEventListener(
  67. JitsiMeetJS.events.track.TRACK_AUDIO_LEVEL_CHANGED,
  68. audioLevel => console.log(`Audio Level remote: ${audioLevel}`));
  69. track.addEventListener(
  70. JitsiMeetJS.events.track.TRACK_MUTE_CHANGED,
  71. () => console.log('remote track muted'));
  72. track.addEventListener(
  73. JitsiMeetJS.events.track.LOCAL_TRACK_STOPPED,
  74. () => console.log('remote track stoped'));
  75. track.addEventListener(JitsiMeetJS.events.track.TRACK_AUDIO_OUTPUT_CHANGED,
  76. deviceId =>
  77. console.log(
  78. `track audio output device was changed to ${deviceId}`));
  79. const id = participant + track.getType() + idx;
  80. if (track.getType() === 'video') {
  81. $('body').append(
  82. `<video autoplay='1' id='${participant}video${idx}' />`);
  83. } else {
  84. $('body').append(
  85. `<audio autoplay='1' id='${participant}audio${idx}' />`);
  86. }
  87. track.attach($(`#${id}`)[0]);
  88. }
  89. /**
  90. * That function is executed when the conference is joined
  91. */
  92. function onConferenceJoined() {
  93. console.log('conference joined!');
  94. isJoined = true;
  95. for (let i = 0; i < localTracks.length; i++) {
  96. room.addTrack(localTracks[i]);
  97. }
  98. }
  99. function onUserLeft(id) {
  100. console.log('user left');
  101. if (!remoteTracks[id]) {
  102. return;
  103. }
  104. const tracks = remoteTracks[id];
  105. for (let i = 0; i < tracks.length; i++) {
  106. tracks[i].detach($(`#${id}${tracks[i].getType()}`));
  107. }
  108. }
  109. /**
  110. * That function is called when connection is established successfully
  111. */
  112. function onConnectionSuccess() {
  113. room = connection.initJitsiConference('conference', confOptions);
  114. room.on(JitsiMeetJS.events.conference.TRACK_ADDED, onRemoteTrack);
  115. room.on(JitsiMeetJS.events.conference.TRACK_REMOVED, track => {
  116. console.log(`track removed!!!${track}`);
  117. });
  118. room.on(
  119. JitsiMeetJS.events.conference.CONFERENCE_JOINED,
  120. onConferenceJoined);
  121. room.on(JitsiMeetJS.events.conference.USER_JOINED, id => {
  122. console.log('user join');
  123. remoteTracks[id] = [];
  124. });
  125. room.on(JitsiMeetJS.events.conference.USER_LEFT, onUserLeft);
  126. room.on(JitsiMeetJS.events.conference.TRACK_MUTE_CHANGED, track => {
  127. console.log(`${track.getType()} - ${track.isMuted()}`);
  128. });
  129. room.on(
  130. JitsiMeetJS.events.conference.DISPLAY_NAME_CHANGED,
  131. (userID, displayName) => console.log(`${userID} - ${displayName}`));
  132. room.on(JitsiMeetJS.events.conference.TRACK_AUDIO_LEVEL_CHANGED,
  133. (userID, audioLevel) => {
  134. console.log(`${userID} - ${audioLevel}`);
  135. });
  136. room.on(JitsiMeetJS.events.conference.RECORDER_STATE_CHANGED, () => {
  137. console.log(`${room.isRecordingSupported()} - ${
  138. room.getRecordingState()} - ${
  139. room.getRecordingURL()}`);
  140. });
  141. room.on(JitsiMeetJS.events.conference.PHONE_NUMBER_CHANGED, () => {
  142. console.log(
  143. `${room.getPhoneNumber()} - ${
  144. room.getPhonePin()}`);
  145. });
  146. room.join();
  147. }
  148. /**
  149. * This function is called when the connection fail.
  150. */
  151. function onConnectionFailed() {
  152. console.error('Connection Failed!');
  153. }
  154. /**
  155. * This function is called when the connection fail.
  156. */
  157. function onDeviceListChanged(devices) {
  158. console.info('current devices', devices);
  159. }
  160. /**
  161. * This function is called when we disconnect.
  162. */
  163. function disconnect() {
  164. console.log('disconnect!');
  165. connection.removeEventListener(
  166. JitsiMeetJS.events.connection.CONNECTION_ESTABLISHED,
  167. onConnectionSuccess);
  168. connection.removeEventListener(
  169. JitsiMeetJS.events.connection.CONNECTION_FAILED,
  170. onConnectionFailed);
  171. connection.removeEventListener(
  172. JitsiMeetJS.events.connection.CONNECTION_DISCONNECTED,
  173. disconnect);
  174. }
  175. function unload() {
  176. for (let i = 0; i < localTracks.length; i++) {
  177. localTracks[i].stop();
  178. }
  179. room.leave();
  180. connection.disconnect();
  181. }
  182. let isVideo = true;
  183. function switchVideo() { // eslint-disable-line no-unused-vars
  184. isVideo = !isVideo;
  185. if (localTracks[1]) {
  186. localTracks[1].dispose();
  187. localTracks.pop();
  188. }
  189. JitsiMeetJS.createLocalTracks(
  190. { devices: isVideo ? [ 'video' ] : [ 'desktop' ] })
  191. .then(tracks => {
  192. localTracks.push(tracks[0]);
  193. localTracks[1].addEventListener(
  194. JitsiMeetJS.events.track.TRACK_MUTE_CHANGED,
  195. () => console.log('local track muted'));
  196. localTracks[1].addEventListener(
  197. JitsiMeetJS.events.track.LOCAL_TRACK_STOPPED,
  198. () => console.log('local track stoped'));
  199. localTracks[1].attach($('#localVideo1')[0]);
  200. room.addTrack(localTracks[1]);
  201. })
  202. .catch(error => console.log(error));
  203. }
  204. function changeAudioOutput(selected) { // eslint-disable-line no-unused-vars
  205. JitsiMeetJS.mediaDevices.setAudioOutputDevice(selected.value);
  206. }
  207. $(window).bind('beforeunload', unload);
  208. $(window).bind('unload', unload);
  209. // JitsiMeetJS.setLogLevel(JitsiMeetJS.logLevels.ERROR);
  210. const initOptions = {
  211. disableAudioLevels: true,
  212. // The ID of the jidesha extension for Chrome.
  213. desktopSharingChromeExtId: 'mbocklcggfhnbahlnepmldehdhpjfcjp',
  214. // Whether desktop sharing should be disabled on Chrome.
  215. desktopSharingChromeDisabled: false,
  216. // The media sources to use when using screen sharing with the Chrome
  217. // extension.
  218. desktopSharingChromeSources: [ 'screen', 'window' ],
  219. // Required version of Chrome extension
  220. desktopSharingChromeMinExtVersion: '0.1',
  221. // The ID of the jidesha extension for Firefox. If null, we assume that no
  222. // extension is required.
  223. desktopSharingFirefoxExtId: null,
  224. // Whether desktop sharing should be disabled on Firefox.
  225. desktopSharingFirefoxDisabled: true,
  226. // The maximum version of Firefox which requires a jidesha extension.
  227. // Example: if set to 41, we will require the extension for Firefox versions
  228. // up to and including 41. On Firefox 42 and higher, we will run without the
  229. // extension.
  230. // If set to -1, an extension will be required for all versions of Firefox.
  231. desktopSharingFirefoxMaxVersionExtRequired: -1,
  232. // The URL to the Firefox extension for desktop sharing.
  233. desktopSharingFirefoxExtensionURL: null
  234. };
  235. JitsiMeetJS.init(initOptions)
  236. .then(() => {
  237. connection = new JitsiMeetJS.JitsiConnection(null, null, options);
  238. connection.addEventListener(
  239. JitsiMeetJS.events.connection.CONNECTION_ESTABLISHED,
  240. onConnectionSuccess);
  241. connection.addEventListener(
  242. JitsiMeetJS.events.connection.CONNECTION_FAILED,
  243. onConnectionFailed);
  244. connection.addEventListener(
  245. JitsiMeetJS.events.connection.CONNECTION_DISCONNECTED,
  246. disconnect);
  247. JitsiMeetJS.mediaDevices.addEventListener(
  248. JitsiMeetJS.events.mediaDevices.DEVICE_LIST_CHANGED,
  249. onDeviceListChanged);
  250. connection.connect();
  251. JitsiMeetJS.createLocalTracks({ devices: [ 'audio', 'video' ] })
  252. .then(onLocalTracks)
  253. .catch(error => {
  254. throw error;
  255. });
  256. })
  257. .catch(error => console.log(error));
  258. if (JitsiMeetJS.mediaDevices.isDeviceChangeAvailable('output')) {
  259. JitsiMeetJS.mediaDevices.enumerateDevices(devices => {
  260. const audioOutputDevices
  261. = devices.filter(d => d.kind === 'audiooutput');
  262. if (audioOutputDevices.length > 1) {
  263. $('#audioOutputSelect').html(
  264. audioOutputDevices
  265. .map(
  266. d =>
  267. `<option value="${d.deviceId}">${d.label}</option>`)
  268. .join('\n'));
  269. $('#audioOutputSelectWrapper').show();
  270. }
  271. });
  272. }