Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.

external_api.js 13KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423
  1. import EventEmitter from 'events';
  2. import postisInit from 'postis';
  3. const logger = require('jitsi-meet-logger').getLogger(__filename);
  4. /**
  5. * Maps the names of the commands expected by the API with the name of the
  6. * commands expected by jitsi-meet
  7. */
  8. const commands = {
  9. avatarUrl: 'avatar-url',
  10. displayName: 'display-name',
  11. email: 'email',
  12. hangup: 'video-hangup',
  13. toggleAudio: 'toggle-audio',
  14. toggleChat: 'toggle-chat',
  15. toggleContactList: 'toggle-contact-list',
  16. toggleFilmStrip: 'toggle-film-strip',
  17. toggleShareScreen: 'toggle-share-screen',
  18. toggleVideo: 'toggle-video'
  19. };
  20. /**
  21. * Maps the names of the events expected by the API with the name of the
  22. * events expected by jitsi-meet
  23. */
  24. const events = {
  25. displayNameChange: 'display-name-change',
  26. incomingMessage: 'incoming-message',
  27. outgoingMessage: 'outgoing-message',
  28. participantJoined: 'participant-joined',
  29. participantLeft: 'participant-left',
  30. readyToClose: 'video-ready-to-close',
  31. videoConferenceJoined: 'video-conference-joined',
  32. videoConferenceLeft: 'video-conference-left'
  33. };
  34. /**
  35. * Last id of api object
  36. * @type {number}
  37. */
  38. let id = 0;
  39. /**
  40. * The minimum height for the Jitsi Meet frame
  41. * @type {number}
  42. */
  43. const MIN_HEIGHT = 300;
  44. /**
  45. * The minimum width for the Jitsi Meet frame
  46. * @type {number}
  47. */
  48. const MIN_WIDTH = 790;
  49. /**
  50. * Adds given number to the numberOfParticipants property of given APIInstance.
  51. *
  52. * @param {JitsiMeetExternalAPI} APIInstance - The instance of the API.
  53. * @param {int} number - The number of participants to be added to
  54. * numberOfParticipants property (this parameter can be negative number if the
  55. * numberOfParticipants should be decreased).
  56. * @returns {void}
  57. */
  58. function changeParticipantNumber(APIInstance, number) {
  59. APIInstance.numberOfParticipants += number;
  60. }
  61. /**
  62. * Generates array with URL params based on the passed config object that will
  63. * be used for the Jitsi Meet URL generation.
  64. *
  65. * @param {Object} config - The config object.
  66. * @returns {Array<string>} The array with URL param strings.
  67. */
  68. function configToURLParamsArray(config = {}) {
  69. const params = [];
  70. for (const key in config) { // eslint-disable-line guard-for-in
  71. try {
  72. params.push(`${key}=${
  73. encodeURIComponent(JSON.stringify(config[key]))}`);
  74. } catch (e) {
  75. console.warn(`Error encoding ${key}: ${e}`);
  76. }
  77. }
  78. return params;
  79. }
  80. /**
  81. * Generates the URL for the iframe.
  82. *
  83. * @param {string} domain - The domain name of the server that hosts the
  84. * conference.
  85. * @param {string} [options] - Another optional parameters.
  86. * @param {Object} [options.configOverwrite] - Object containing configuration
  87. * options defined in config.js to be overridden.
  88. * @param {Object} [options.interfaceConfigOverwrite] - Object containing
  89. * configuration options defined in interface_config.js to be overridden.
  90. * @param {string} [options.jwt] - The JWT token if needed by jitsi-meet for
  91. * authentication.
  92. * @param {boolean} [options.noSsl] - If the value is true https won't be used.
  93. * @param {string} [options.roomName] - The name of the room to join.
  94. * @returns {string} The URL.
  95. */
  96. function generateURL(domain, options = {}) {
  97. const {
  98. configOverwrite,
  99. interfaceConfigOverwrite,
  100. jwt,
  101. noSSL,
  102. roomName
  103. } = options;
  104. let url = `${noSSL ? 'http' : 'https'}://${domain}/${roomName || ''}`;
  105. if (jwt) {
  106. url += `?jwt=${jwt}`;
  107. }
  108. url += `#jitsi_meet_external_api_id=${id}`;
  109. const configURLParams = configToURLParamsArray(configOverwrite);
  110. if (configURLParams.length) {
  111. url += `&config.${configURLParams.join('&config.')}`;
  112. }
  113. const interfaceConfigURLParams
  114. = configToURLParamsArray(interfaceConfigOverwrite);
  115. if (interfaceConfigURLParams.length) {
  116. url += `&interfaceConfig.${
  117. interfaceConfigURLParams.join('&interfaceConfig.')}`;
  118. }
  119. return url;
  120. }
  121. /**
  122. * The IFrame API interface class.
  123. */
  124. class JitsiMeetExternalAPI extends EventEmitter {
  125. /**
  126. * Constructs new API instance. Creates iframe and loads Jitsi Meet in it.
  127. *
  128. * @param {string} domain - The domain name of the server that hosts the
  129. * conference.
  130. * @param {string} [roomName] - The name of the room to join.
  131. * @param {number} [width] - Width of the iframe.
  132. * @param {number} [height] - Height of the iframe.
  133. * @param {DOMElement} [parentNode] - The node that will contain the
  134. * iframe.
  135. * @param {Object} [configOverwrite] - Object containing configuration
  136. * options defined in config.js to be overridden.
  137. * @param {Object} [interfaceConfigOverwrite] - Object containing
  138. * configuration options defined in interface_config.js to be overridden.
  139. * @param {boolean} [noSSL] - If the value is true https won't be used.
  140. * @param {string} [jwt] - The JWT token if needed by jitsi-meet for
  141. * authentication.
  142. */
  143. constructor(domain, // eslint-disable-line max-params
  144. roomName = '',
  145. width = MIN_WIDTH,
  146. height = MIN_HEIGHT,
  147. parentNode = document.body,
  148. configOverwrite = {},
  149. interfaceConfigOverwrite = {},
  150. noSSL = false,
  151. jwt = undefined) {
  152. super();
  153. this.parentNode = parentNode;
  154. this.url = generateURL(domain, {
  155. configOverwrite,
  156. interfaceConfigOverwrite,
  157. jwt,
  158. noSSL,
  159. roomName
  160. });
  161. this._createIFrame(Math.max(height, MIN_HEIGHT),
  162. Math.max(width, MIN_WIDTH));
  163. this.postis = postisInit({
  164. scope: `jitsi_meet_external_api_${id}`,
  165. window: this.frame.contentWindow
  166. });
  167. this.numberOfParticipants = 1;
  168. this._setupListeners();
  169. id++;
  170. }
  171. /**
  172. * Creates the iframe element.
  173. *
  174. * @param {number} height - The height of the iframe.
  175. * @param {number} width - The with of the iframe.
  176. * @returns {void}
  177. *
  178. * @private
  179. */
  180. _createIFrame(height, width) {
  181. this.iframeHolder
  182. = this.parentNode.appendChild(document.createElement('div'));
  183. this.iframeHolder.id = `jitsiConference${id}`;
  184. this.iframeHolder.style.width = `${width}px`;
  185. this.iframeHolder.style.height = `${height}px`;
  186. this.frameName = `jitsiConferenceFrame${id}`;
  187. this.frame = document.createElement('iframe');
  188. this.frame.src = this.url;
  189. this.frame.name = this.frameName;
  190. this.frame.id = this.frameName;
  191. this.frame.width = '100%';
  192. this.frame.height = '100%';
  193. this.frame.setAttribute('allowFullScreen', 'true');
  194. this.frame = this.iframeHolder.appendChild(this.frame);
  195. }
  196. /**
  197. * Setups listeners that are used internally for JitsiMeetExternalAPI.
  198. *
  199. * @returns {void}
  200. *
  201. * @private
  202. */
  203. _setupListeners() {
  204. this.postis.listen('participant-joined',
  205. changeParticipantNumber.bind(null, this, 1));
  206. this.postis.listen('participant-left',
  207. changeParticipantNumber.bind(null, this, -1));
  208. for (const eventName in events) { // eslint-disable-line guard-for-in
  209. const postisMethod = events[eventName];
  210. this.postis.listen(postisMethod,
  211. (...args) => this.emit(eventName, ...args));
  212. }
  213. }
  214. /**
  215. * Adds event listener to Meet Jitsi.
  216. *
  217. * @param {string} event - The name of the event.
  218. * @param {Function} listener - The listener.
  219. * @returns {void}
  220. *
  221. * @deprecated
  222. * NOTE: This method is not removed for backward comatability purposes.
  223. */
  224. addEventListener(event, listener) {
  225. this.on(event, listener);
  226. }
  227. /**
  228. * Adds event listeners to Meet Jitsi.
  229. *
  230. * @param {Object} listeners - The object key should be the name of
  231. * the event and value - the listener.
  232. * Currently we support the following
  233. * events:
  234. * incomingMessage - receives event notifications about incoming
  235. * messages. The listener will receive object with the following structure:
  236. * {{
  237. * 'from': from,//JID of the user that sent the message
  238. * 'nick': nick,//the nickname of the user that sent the message
  239. * 'message': txt//the text of the message
  240. * }}
  241. * outgoingMessage - receives event notifications about outgoing
  242. * messages. The listener will receive object with the following structure:
  243. * {{
  244. * 'message': txt//the text of the message
  245. * }}
  246. * displayNameChanged - receives event notifications about display name
  247. * change. The listener will receive object with the following structure:
  248. * {{
  249. * jid: jid,//the JID of the participant that changed his display name
  250. * displayname: displayName //the new display name
  251. * }}
  252. * participantJoined - receives event notifications about new participant.
  253. * The listener will receive object with the following structure:
  254. * {{
  255. * jid: jid //the jid of the participant
  256. * }}
  257. * participantLeft - receives event notifications about the participant that
  258. * left the room.
  259. * The listener will receive object with the following structure:
  260. * {{
  261. * jid: jid //the jid of the participant
  262. * }}
  263. * video-conference-joined - receives event notifications about the local
  264. * user has successfully joined the video conference.
  265. * The listener will receive object with the following structure:
  266. * {{
  267. * roomName: room //the room name of the conference
  268. * }}
  269. * video-conference-left - receives event notifications about the local user
  270. * has left the video conference.
  271. * The listener will receive object with the following structure:
  272. * {{
  273. * roomName: room //the room name of the conference
  274. * }}
  275. * readyToClose - all hangup operations are completed and Jitsi Meet is
  276. * ready to be disposed.
  277. * @returns {void}
  278. *
  279. * @deprecated
  280. * NOTE: This method is not removed for backward comatability purposes.
  281. */
  282. addEventListeners(listeners) {
  283. for (const event in listeners) { // eslint-disable-line guard-for-in
  284. this.addEventListener(event, listeners[event]);
  285. }
  286. }
  287. /**
  288. * Removes the listeners and removes the Jitsi Meet frame.
  289. *
  290. * @returns {void}
  291. */
  292. dispose() {
  293. if (this.postis) {
  294. this.postis.destroy();
  295. this.postis = null;
  296. }
  297. this.removeAllListeners();
  298. if (this.iframeHolder) {
  299. this.iframeHolder.parentNode.removeChild(this.iframeHolder);
  300. }
  301. }
  302. /**
  303. * Executes command. The available commands are:
  304. * displayName - sets the display name of the local participant to the value
  305. * passed in the arguments array.
  306. * toggleAudio - mutes / unmutes audio with no arguments.
  307. * toggleVideo - mutes / unmutes video with no arguments.
  308. * toggleFilmStrip - hides / shows the filmstrip with no arguments.
  309. * If the command doesn't require any arguments the parameter should be set
  310. * to empty array or it may be omitted.
  311. *
  312. * @param {string} name - The name of the command.
  313. * @returns {void}
  314. */
  315. executeCommand(name, ...args) {
  316. if (!(name in commands)) {
  317. logger.error('Not supported command name.');
  318. return;
  319. }
  320. if (!this.postis) {
  321. logger.error('Cannot execute command using disposed instance.');
  322. return;
  323. }
  324. this.postis.send({
  325. method: commands[name],
  326. params: args
  327. });
  328. }
  329. /**
  330. * Executes commands. The available commands are:
  331. * displayName - sets the display name of the local participant to the value
  332. * passed in the arguments array.
  333. * toggleAudio - mutes / unmutes audio. no arguments
  334. * toggleVideo - mutes / unmutes video. no arguments
  335. * toggleFilmStrip - hides / shows the filmstrip. no arguments
  336. * toggleChat - hides / shows chat. no arguments.
  337. * toggleContactList - hides / shows contact list. no arguments.
  338. * toggleShareScreen - starts / stops screen sharing. no arguments.
  339. *
  340. * @param {Object} commandList - The object with commands to be executed.
  341. * The keys of the object are the commands that will be executed and the
  342. * values are the arguments for the command.
  343. * @returns {void}
  344. */
  345. executeCommands(commandList) {
  346. for (const key in commandList) { // eslint-disable-line guard-for-in
  347. this.executeCommand(key, commandList[key]);
  348. }
  349. }
  350. /**
  351. * Returns the number of participants in the conference. The local
  352. * participant is included.
  353. *
  354. * @returns {int} The number of participants in the conference.
  355. */
  356. getNumberOfParticipants() {
  357. return this.numberOfParticipants;
  358. }
  359. /**
  360. * Removes event listener.
  361. *
  362. * @param {string} event - The name of the event.
  363. * @returns {void}
  364. *
  365. * @deprecated
  366. * NOTE: This method is not removed for backward comatability purposes.
  367. */
  368. removeEventListener(event) {
  369. this.removeAllListeners(event);
  370. }
  371. /**
  372. * Removes event listeners.
  373. *
  374. * @param {Array<string>} eventList - Array with the names of the events.
  375. * @returns {void}
  376. *
  377. * @deprecated
  378. * NOTE: This method is not removed for backward comatability purposes.
  379. */
  380. removeEventListeners(eventList) {
  381. eventList.forEach(event => this.removeEventListener(event));
  382. }
  383. }
  384. module.exports = JitsiMeetExternalAPI;