Nevar pievienot vairāk kā 25 tēmas Tēmai ir jāsākas ar burtu vai ciparu, tā var saturēt domu zīmes ('-') un var būt līdz 35 simboliem gara.

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903
  1. /* global Strophe, APP, $, config, interfaceConfig, toastr */
  2. /* jshint -W101 */
  3. var UI = {};
  4. var VideoLayout = require("./videolayout/VideoLayout.js");
  5. var AudioLevels = require("./audio_levels/AudioLevels.js");
  6. var Prezi = require("./prezi/Prezi.js");
  7. var Etherpad = require("./etherpad/Etherpad.js");
  8. var Chat = require("./side_pannels/chat/Chat.js");
  9. var Toolbar = require("./toolbars/Toolbar");
  10. var ToolbarToggler = require("./toolbars/ToolbarToggler");
  11. var BottomToolbar = require("./toolbars/BottomToolbar");
  12. var ContactList = require("./side_pannels/contactlist/ContactList");
  13. var Avatar = require("./avatar/Avatar");
  14. var EventEmitter = require("events");
  15. var SettingsMenu = require("./side_pannels/settings/SettingsMenu");
  16. var Settings = require("./../settings/Settings");
  17. var PanelToggler = require("./side_pannels/SidePanelToggler");
  18. var RoomNameGenerator = require("./welcome_page/RoomnameGenerator");
  19. UI.messageHandler = require("./util/MessageHandler");
  20. var messageHandler = UI.messageHandler;
  21. var Authentication = require("./authentication/Authentication");
  22. var UIUtil = require("./util/UIUtil");
  23. var NicknameHandler = require("./util/NicknameHandler");
  24. var JitsiPopover = require("./util/JitsiPopover");
  25. var CQEvents = require("../../service/connectionquality/CQEvents");
  26. var DesktopSharingEventTypes
  27. = require("../../service/desktopsharing/DesktopSharingEventTypes");
  28. var MediaStreamType = require("../../service/RTC/MediaStreamTypes");
  29. var RTCEvents = require("../../service/RTC/RTCEvents");
  30. var RTCBrowserType = require("../RTC/RTCBrowserType");
  31. var StreamEventTypes = require("../../service/RTC/StreamEventTypes");
  32. var XMPPEvents = require("../../service/xmpp/XMPPEvents");
  33. var StatisticsEvents = require("../../service/statistics/Events");
  34. var UIEvents = require("../../service/UI/UIEvents");
  35. var MemberEvents = require("../../service/members/Events");
  36. var eventEmitter = new EventEmitter();
  37. var roomNode = null;
  38. var roomName = null;
  39. function promptDisplayName() {
  40. var message = '<h2 data-i18n="dialog.displayNameRequired">';
  41. message += APP.translation.translateString(
  42. "dialog.displayNameRequired");
  43. message += '</h2>' +
  44. '<input name="displayName" type="text" data-i18n=' +
  45. '"[placeholder]defaultNickname" placeholder="' +
  46. APP.translation.translateString(
  47. "defaultNickname", {name: "Jane Pink"}) +
  48. '" autofocus>';
  49. var buttonTxt
  50. = APP.translation.generateTranslationHTML("dialog.Ok");
  51. var buttons = [];
  52. buttons.push({title: buttonTxt, value: "ok"});
  53. messageHandler.openDialog(null, message,
  54. true,
  55. buttons,
  56. function (e, v, m, f) {
  57. if (v == "ok") {
  58. var displayName = f.displayName;
  59. if (displayName) {
  60. VideoLayout.inputDisplayNameHandler(displayName);
  61. return true;
  62. }
  63. }
  64. e.preventDefault();
  65. },
  66. function () {
  67. var form = $.prompt.getPrompt();
  68. var input = form.find("input[name='displayName']");
  69. input.focus();
  70. var button = form.find("button");
  71. button.attr("disabled", "disabled");
  72. input.keyup(function () {
  73. if(!input.val())
  74. button.attr("disabled", "disabled");
  75. else
  76. button.removeAttr("disabled");
  77. });
  78. }
  79. );
  80. }
  81. function notifyForInitialMute() {
  82. messageHandler.notify(null, "notify.mutedTitle", "connected",
  83. "notify.muted", null, {timeOut: 120000});
  84. }
  85. function setupPrezi() {
  86. $("#reloadPresentationLink").click(function() {
  87. Prezi.reloadPresentation();
  88. });
  89. }
  90. function setupChat() {
  91. Chat.init();
  92. $("#toggle_smileys").click(function() {
  93. Chat.toggleSmileys();
  94. });
  95. }
  96. function setupToolbars() {
  97. Toolbar.init(UI);
  98. Toolbar.setupButtonsFromConfig();
  99. BottomToolbar.init();
  100. }
  101. function streamHandler(stream, isMuted) {
  102. switch (stream.type) {
  103. case MediaStreamType.AUDIO_TYPE:
  104. VideoLayout.changeLocalAudio(stream, isMuted);
  105. break;
  106. case MediaStreamType.VIDEO_TYPE:
  107. VideoLayout.changeLocalVideo(stream, isMuted);
  108. break;
  109. default:
  110. console.error("Unknown stream type: " + stream.type);
  111. break;
  112. }
  113. }
  114. function onXmppConnectionFailed(stropheErrorMsg) {
  115. var title = APP.translation.generateTranslationHTML(
  116. "dialog.error");
  117. var message;
  118. if (stropheErrorMsg) {
  119. message = APP.translation.generateTranslationHTML(
  120. "dialog.connectErrorWithMsg", {msg: stropheErrorMsg});
  121. } else {
  122. message = APP.translation.generateTranslationHTML(
  123. "dialog.connectError");
  124. }
  125. messageHandler.openDialog(
  126. title, message, true, {}, function (e, v, m, f) { return false; });
  127. }
  128. function onDisposeConference(unload) {
  129. Toolbar.showAuthenticateButton(false);
  130. }
  131. function onDisplayNameChanged(jid, displayName) {
  132. ContactList.onDisplayNameChange(jid, displayName);
  133. SettingsMenu.onDisplayNameChange(jid, displayName);
  134. VideoLayout.onDisplayNameChanged(jid, displayName);
  135. }
  136. function registerListeners() {
  137. APP.RTC.addStreamListener(streamHandler,
  138. StreamEventTypes.EVENT_TYPE_LOCAL_CREATED);
  139. APP.RTC.addStreamListener(streamHandler,
  140. StreamEventTypes.EVENT_TYPE_LOCAL_CHANGED);
  141. APP.RTC.addStreamListener(function (stream) {
  142. VideoLayout.onRemoteStreamAdded(stream);
  143. }, StreamEventTypes.EVENT_TYPE_REMOTE_CREATED);
  144. APP.RTC.addListener(RTCEvents.LASTN_CHANGED, onLastNChanged);
  145. APP.RTC.addListener(RTCEvents.DOMINANTSPEAKER_CHANGED,
  146. function (resourceJid) {
  147. VideoLayout.onDominantSpeakerChanged(resourceJid);
  148. });
  149. APP.RTC.addListener(RTCEvents.LASTN_ENDPOINT_CHANGED,
  150. function (lastNEndpoints, endpointsEnteringLastN, stream) {
  151. VideoLayout.onLastNEndpointsChanged(lastNEndpoints,
  152. endpointsEnteringLastN, stream);
  153. });
  154. APP.RTC.addListener(RTCEvents.AVAILABLE_DEVICES_CHANGED,
  155. function (devices) {
  156. VideoLayout.setDeviceAvailabilityIcons(null, devices);
  157. });
  158. APP.RTC.addListener(RTCEvents.VIDEO_MUTE, UI.setVideoMuteButtonsState);
  159. APP.RTC.addListener(RTCEvents.DATA_CHANNEL_OPEN, function () {
  160. // when the data channel becomes available, tell the bridge about video
  161. // selections so that it can do adaptive simulcast,
  162. // we want the notification to trigger even if userJid is undefined,
  163. // or null.
  164. var userResource = APP.UI.getLargeVideoResource();
  165. eventEmitter.emit(UIEvents.SELECTED_ENDPOINT, userResource);
  166. });
  167. APP.statistics.addListener(StatisticsEvents.AUDIO_LEVEL,
  168. function(jid, audioLevel) {
  169. var resourceJid;
  170. if(jid === APP.statistics.LOCAL_JID) {
  171. resourceJid = AudioLevels.LOCAL_LEVEL;
  172. if(APP.RTC.localAudio.isMuted()) {
  173. audioLevel = 0;
  174. }
  175. } else {
  176. resourceJid = Strophe.getResourceFromJid(jid);
  177. }
  178. AudioLevels.updateAudioLevel(resourceJid, audioLevel,
  179. UI.getLargeVideoResource());
  180. });
  181. APP.desktopsharing.addListener(
  182. DesktopSharingEventTypes.INIT,
  183. ToolbarToggler.showToolbar);
  184. APP.desktopsharing.addListener(
  185. DesktopSharingEventTypes.SWITCHING_DONE,
  186. Toolbar.changeDesktopSharingButtonState);
  187. APP.desktopsharing.addListener(
  188. DesktopSharingEventTypes.FIREFOX_EXTENSION_NEEDED,
  189. function (url) {
  190. APP.UI.messageHandler.openMessageDialog(
  191. "dialog.extensionRequired",
  192. null,
  193. null,
  194. APP.translation.generateTranslationHTML(
  195. "dialog.firefoxExtensionPrompt", {url: url}));
  196. });
  197. APP.connectionquality.addListener(CQEvents.LOCALSTATS_UPDATED,
  198. VideoLayout.updateLocalConnectionStats);
  199. APP.connectionquality.addListener(CQEvents.REMOTESTATS_UPDATED,
  200. VideoLayout.updateConnectionStats);
  201. APP.connectionquality.addListener(CQEvents.STOP,
  202. VideoLayout.onStatsStop);
  203. APP.xmpp.addListener(XMPPEvents.CONNECTION_FAILED, onXmppConnectionFailed);
  204. APP.xmpp.addListener(XMPPEvents.DISPOSE_CONFERENCE, onDisposeConference);
  205. APP.xmpp.addListener(XMPPEvents.GRACEFUL_SHUTDOWN, function () {
  206. messageHandler.openMessageDialog(
  207. 'dialog.serviceUnavailable',
  208. 'dialog.gracefulShutdown'
  209. );
  210. });
  211. APP.xmpp.addListener(XMPPEvents.RESERVATION_ERROR, function (code, msg) {
  212. var title = APP.translation.generateTranslationHTML(
  213. "dialog.reservationError");
  214. var message = APP.translation.generateTranslationHTML(
  215. "dialog.reservationErrorMsg", {code: code, msg: msg});
  216. messageHandler.openDialog(
  217. title,
  218. message,
  219. true, {},
  220. function (event, value, message, formVals) {
  221. return false;
  222. }
  223. );
  224. });
  225. APP.xmpp.addListener(XMPPEvents.KICKED, function () {
  226. messageHandler.openMessageDialog("dialog.sessTerminated",
  227. "dialog.kickMessage");
  228. });
  229. APP.xmpp.addListener(XMPPEvents.MUC_DESTROYED, function (reason) {
  230. //FIXME: use Session Terminated from translation, but
  231. // 'reason' text comes from XMPP packet and is not translated
  232. var title = APP.translation.generateTranslationHTML("dialog.sessTerminated");
  233. messageHandler.openDialog(
  234. title, reason, true, {},
  235. function (event, value, message, formVals) {
  236. return false;
  237. }
  238. );
  239. });
  240. APP.xmpp.addListener(XMPPEvents.BRIDGE_DOWN, function () {
  241. messageHandler.showError("dialog.error",
  242. "dialog.bridgeUnavailable");
  243. });
  244. APP.xmpp.addListener(XMPPEvents.USER_ID_CHANGED, function (from, id) {
  245. Avatar.setUserAvatar(from, id);
  246. });
  247. APP.xmpp.addListener(XMPPEvents.DISPLAY_NAME_CHANGED, onDisplayNameChanged);
  248. APP.xmpp.addListener(XMPPEvents.MUC_JOINED, onMucJoined);
  249. APP.xmpp.addListener(XMPPEvents.LOCAL_ROLE_CHANGED, onLocalRoleChanged);
  250. APP.xmpp.addListener(XMPPEvents.MUC_MEMBER_JOINED, onMucMemberJoined);
  251. APP.xmpp.addListener(XMPPEvents.MUC_ROLE_CHANGED, onMucRoleChanged);
  252. APP.xmpp.addListener(XMPPEvents.PRESENCE_STATUS, onMucPresenceStatus);
  253. APP.xmpp.addListener(XMPPEvents.SUBJECT_CHANGED, chatSetSubject);
  254. APP.xmpp.addListener(XMPPEvents.MUC_MEMBER_LEFT, onMucMemberLeft);
  255. APP.xmpp.addListener(XMPPEvents.PASSWORD_REQUIRED, onPasswordRequired);
  256. APP.xmpp.addListener(XMPPEvents.ETHERPAD, initEtherpad);
  257. APP.xmpp.addListener(XMPPEvents.AUTHENTICATION_REQUIRED,
  258. onAuthenticationRequired);
  259. APP.xmpp.addListener(XMPPEvents.PARTICIPANT_VIDEO_TYPE_CHANGED,
  260. onPeerVideoTypeChanged);
  261. APP.xmpp.addListener(XMPPEvents.DEVICE_AVAILABLE,
  262. function (resource, devices) {
  263. VideoLayout.setDeviceAvailabilityIcons(resource, devices);
  264. });
  265. APP.xmpp.addListener(XMPPEvents.PARTICIPANT_AUDIO_MUTED,
  266. VideoLayout.onAudioMute);
  267. APP.xmpp.addListener(XMPPEvents.PARTICIPANT_VIDEO_MUTED,
  268. VideoLayout.onVideoMute);
  269. APP.xmpp.addListener(XMPPEvents.AUDIO_MUTED_BY_FOCUS, function (doMuteAudio) {
  270. UI.setAudioMuted(doMuteAudio);
  271. });
  272. APP.members.addListener(MemberEvents.DTMF_SUPPORT_CHANGED,
  273. onDtmfSupportChanged);
  274. APP.xmpp.addListener(XMPPEvents.START_MUTED_SETTING_CHANGED, function (audio, video) {
  275. SettingsMenu.setStartMuted(audio, video);
  276. });
  277. APP.xmpp.addListener(XMPPEvents.START_MUTED_FROM_FOCUS, function (audio, video) {
  278. UI.setInitialMuteFromFocus(audio, video);
  279. });
  280. APP.xmpp.addListener(XMPPEvents.JINGLE_FATAL_ERROR, function (session, error) {
  281. UI.messageHandler.showError("dialog.sorry",
  282. "dialog.internalError");
  283. });
  284. APP.xmpp.addListener(XMPPEvents.SET_LOCAL_DESCRIPTION_ERROR, function () {
  285. messageHandler.showError("dialog.error",
  286. "dialog.SLDFailure");
  287. });
  288. APP.xmpp.addListener(XMPPEvents.SET_REMOTE_DESCRIPTION_ERROR, function () {
  289. messageHandler.showError("dialog.error",
  290. "dialog.SRDFailure");
  291. });
  292. APP.xmpp.addListener(XMPPEvents.CREATE_ANSWER_ERROR, function () {
  293. messageHandler.showError();
  294. });
  295. APP.xmpp.addListener(XMPPEvents.PROMPT_FOR_LOGIN, function (callback) {
  296. // FIXME: re-use LoginDialog which supports retries
  297. if (config.token) {
  298. messageHandler.showError("dialog.error", "dialog.tokenAuthFailed");
  299. } else {
  300. UI.showLoginPopup(callback);
  301. }
  302. });
  303. APP.xmpp.addListener(XMPPEvents.FOCUS_DISCONNECTED, function (focusComponent, retrySec) {
  304. UI.messageHandler.notify(
  305. null, "notify.focus",
  306. 'disconnected', "notify.focusFail",
  307. {component: focusComponent, ms: retrySec});
  308. });
  309. APP.xmpp.addListener(XMPPEvents.ROOM_JOIN_ERROR, function (pres) {
  310. UI.messageHandler.openReportDialog(null,
  311. "dialog.connectError", pres);
  312. });
  313. APP.xmpp.addListener(XMPPEvents.ROOM_CONNECT_ERROR, function (pres) {
  314. UI.messageHandler.openReportDialog(null,
  315. "dialog.connectError", pres);
  316. });
  317. APP.xmpp.addListener(XMPPEvents.READY_TO_JOIN, function () {
  318. var roomName = UI.generateRoomName();
  319. APP.xmpp.allocateConferenceFocus(roomName, UI.checkForNicknameAndJoin);
  320. });
  321. //NicknameHandler emits this event
  322. UI.addListener(UIEvents.NICKNAME_CHANGED, function (nickname) {
  323. APP.xmpp.addToPresence("displayName", nickname);
  324. });
  325. UI.addListener(UIEvents.LARGEVIDEO_INIT, function () {
  326. AudioLevels.init();
  327. });
  328. if (!interfaceConfig.filmStripOnly) {
  329. APP.xmpp.addListener(XMPPEvents.MESSAGE_RECEIVED, updateChatConversation);
  330. APP.xmpp.addListener(XMPPEvents.CHAT_ERROR_RECEIVED, chatAddError);
  331. // Listens for video interruption events.
  332. APP.xmpp.addListener(XMPPEvents.CONNECTION_INTERRUPTED, VideoLayout.onVideoInterrupted);
  333. // Listens for video restores events.
  334. APP.xmpp.addListener(XMPPEvents.CONNECTION_RESTORED, VideoLayout.onVideoRestored);
  335. }
  336. }
  337. /**
  338. * Mutes/unmutes the local video.
  339. *
  340. * @param mute <tt>true</tt> to mute the local video; otherwise, <tt>false</tt>
  341. * @param options an object which specifies optional arguments such as the
  342. * <tt>boolean</tt> key <tt>byUser</tt> with default value <tt>true</tt> which
  343. * specifies whether the method was initiated in response to a user command (in
  344. * contrast to an automatic decision taken by the application logic)
  345. */
  346. function setVideoMute(mute, options) {
  347. APP.RTC.setVideoMute(mute,
  348. UI.setVideoMuteButtonsState,
  349. options);
  350. }
  351. function onResize() {
  352. Chat.resizeChat();
  353. VideoLayout.resizeLargeVideoContainer();
  354. }
  355. function bindEvents() {
  356. /**
  357. * Resizes and repositions videos in full screen mode.
  358. */
  359. $(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange',
  360. onResize);
  361. $(window).resize(onResize);
  362. }
  363. UI.start = function (init) {
  364. document.title = interfaceConfig.APP_NAME;
  365. var setupWelcomePage = null;
  366. if(config.enableWelcomePage && window.location.pathname == "/" &&
  367. (!window.localStorage.welcomePageDisabled ||
  368. window.localStorage.welcomePageDisabled == "false")) {
  369. $("#videoconference_page").hide();
  370. if (!setupWelcomePage)
  371. setupWelcomePage = require("./welcome_page/WelcomePage");
  372. setupWelcomePage();
  373. return;
  374. }
  375. $("#welcome_page").hide();
  376. // Set the defaults for prompt dialogs.
  377. $.prompt.setDefaults({persistent: false});
  378. registerListeners();
  379. VideoLayout.init(eventEmitter);
  380. NicknameHandler.init(eventEmitter);
  381. bindEvents();
  382. setupPrezi();
  383. if (!interfaceConfig.filmStripOnly) {
  384. $("#videospace").mousemove(function () {
  385. return ToolbarToggler.showToolbar();
  386. });
  387. setupToolbars();
  388. setupChat();
  389. // Display notice message at the top of the toolbar
  390. if (config.noticeMessage) {
  391. $('#noticeText').text(config.noticeMessage);
  392. $('#notice').css({display: 'block'});
  393. }
  394. $("#downloadlog").click(function (event) {
  395. dump(event.target);
  396. });
  397. }
  398. else
  399. {
  400. $("#header").css("display", "none");
  401. $("#bottomToolbar").css("display", "none");
  402. $("#downloadlog").css("display", "none");
  403. $("#remoteVideos").css("padding", "0px 0px 18px 0px");
  404. $("#remoteVideos").css("right", "0px");
  405. messageHandler.disableNotifications();
  406. $('body').popover("disable");
  407. // $("[data-toggle=popover]").popover("disable");
  408. JitsiPopover.enabled = false;
  409. }
  410. document.title = interfaceConfig.APP_NAME;
  411. if(config.requireDisplayName) {
  412. var currentSettings = Settings.getSettings();
  413. if (!currentSettings.displayName) {
  414. promptDisplayName();
  415. }
  416. }
  417. init();
  418. if (!interfaceConfig.filmStripOnly) {
  419. toastr.options = {
  420. "closeButton": true,
  421. "debug": false,
  422. "positionClass": "notification-bottom-right",
  423. "onclick": null,
  424. "showDuration": "300",
  425. "hideDuration": "1000",
  426. "timeOut": "2000",
  427. "extendedTimeOut": "1000",
  428. "showEasing": "swing",
  429. "hideEasing": "linear",
  430. "showMethod": "fadeIn",
  431. "hideMethod": "fadeOut",
  432. "reposition": function () {
  433. if (PanelToggler.isVisible()) {
  434. $("#toast-container").addClass("notification-bottom-right-center");
  435. } else {
  436. $("#toast-container").removeClass("notification-bottom-right-center");
  437. }
  438. },
  439. "newestOnTop": false
  440. };
  441. SettingsMenu.init();
  442. }
  443. };
  444. function chatAddError(errorMessage, originalText) {
  445. return Chat.chatAddError(errorMessage, originalText);
  446. }
  447. function chatSetSubject(text) {
  448. return Chat.chatSetSubject(text);
  449. }
  450. function updateChatConversation(from, displayName, message, myjid, stamp) {
  451. return Chat.updateChatConversation(from, displayName, message, myjid, stamp);
  452. }
  453. function onMucJoined(jid, info) {
  454. Toolbar.updateRoomUrl(window.location.href);
  455. var meHTML = APP.translation.generateTranslationHTML("me");
  456. $("#localNick").html(Strophe.getResourceFromJid(jid) + " (" + meHTML + ")");
  457. var settings = Settings.getSettings();
  458. // Make sure we configure our avatar id, before creating avatar for us
  459. Avatar.setUserAvatar(jid, settings.email || settings.uid);
  460. // Add myself to the contact list.
  461. ContactList.addContact(jid);
  462. // Once we've joined the muc show the toolbar
  463. ToolbarToggler.showToolbar();
  464. var displayName =
  465. config.displayJids ? Strophe.getResourceFromJid(jid) : info.displayName;
  466. if (displayName)
  467. onDisplayNameChanged('localVideoContainer', displayName);
  468. VideoLayout.mucJoined();
  469. }
  470. function initEtherpad(name) {
  471. Etherpad.init(name);
  472. }
  473. function onMucMemberLeft(jid) {
  474. console.log('left.muc', jid);
  475. var displayName = $('#participant_' + Strophe.getResourceFromJid(jid) +
  476. '>.displayname').html();
  477. messageHandler.notify(displayName,'notify.somebody',
  478. 'disconnected',
  479. 'notify.disconnected');
  480. if (!config.startAudioMuted ||
  481. config.startAudioMuted > APP.members.size()) {
  482. UIUtil.playSoundNotification('userLeft');
  483. }
  484. ContactList.removeContact(jid);
  485. VideoLayout.participantLeft(jid);
  486. }
  487. function onLocalRoleChanged(jid, info, pres, isModerator) {
  488. console.info("My role changed, new role: " + info.role);
  489. onModeratorStatusChanged(isModerator);
  490. VideoLayout.showModeratorIndicator();
  491. SettingsMenu.onRoleChanged();
  492. if (isModerator) {
  493. Authentication.closeAuthenticationWindow();
  494. messageHandler.notify(null, "notify.me",
  495. 'connected', "notify.moderator");
  496. Toolbar.checkAutoRecord();
  497. }
  498. }
  499. function onModeratorStatusChanged(isModerator) {
  500. Toolbar.showSipCallButton(isModerator);
  501. Toolbar.showRecordingButton(
  502. isModerator); //&&
  503. // FIXME:
  504. // Recording visible if
  505. // there are at least 2(+ 1 focus) participants
  506. //Object.keys(connection.emuc.members).length >= 3);
  507. }
  508. function onPasswordRequired(callback) {
  509. // password is required
  510. Toolbar.lockLockButton();
  511. var message = '<h2 data-i18n="dialog.passwordRequired">';
  512. message += APP.translation.translateString(
  513. "dialog.passwordRequired");
  514. message += '</h2>' +
  515. '<input name="lockKey" type="text" data-i18n=' +
  516. '"[placeholder]dialog.password" placeholder="' +
  517. APP.translation.translateString("dialog.password") +
  518. '" autofocus>';
  519. messageHandler.openTwoButtonDialog(null, null, null, message,
  520. true,
  521. "dialog.Ok",
  522. function (e, v, m, f) {},
  523. null,
  524. function (e, v, m, f) {
  525. if (v) {
  526. var lockKey = f.lockKey;
  527. if (lockKey) {
  528. Toolbar.setSharedKey(lockKey);
  529. callback(lockKey);
  530. }
  531. }
  532. },
  533. ':input:first'
  534. );
  535. }
  536. /**
  537. * The dialpad button is shown iff there is at least one member that supports
  538. * DTMF (e.g. jigasi).
  539. */
  540. function onDtmfSupportChanged(dtmfSupport) {
  541. //TODO: enable when the UI is ready
  542. //Toolbar.showDialPadButton(dtmfSupport);
  543. }
  544. function onMucMemberJoined(jid, id, displayName) {
  545. messageHandler.notify(displayName,'notify.somebody',
  546. 'connected',
  547. 'notify.connected');
  548. if (!config.startAudioMuted ||
  549. config.startAudioMuted > APP.members.size())
  550. UIUtil.playSoundNotification('userJoined');
  551. // Configure avatar
  552. Avatar.setUserAvatar(jid, id);
  553. // Add Peer's container
  554. VideoLayout.ensurePeerContainerExists(jid);
  555. }
  556. function onMucPresenceStatus(jid, info) {
  557. VideoLayout.setPresenceStatus(Strophe.getResourceFromJid(jid), info.status);
  558. }
  559. function onPeerVideoTypeChanged(resourceJid, newVideoType) {
  560. VideoLayout.onVideoTypeChanged(resourceJid, newVideoType);
  561. }
  562. function onMucRoleChanged(role, displayName) {
  563. VideoLayout.showModeratorIndicator();
  564. if (role === 'moderator') {
  565. var messageKey, messageOptions = {};
  566. if (!displayName) {
  567. messageKey = "notify.grantedToUnknown";
  568. }
  569. else {
  570. messageKey = "notify.grantedTo";
  571. messageOptions = {to: displayName};
  572. }
  573. messageHandler.notify(
  574. displayName,'notify.somebody',
  575. 'connected', messageKey,
  576. messageOptions);
  577. }
  578. }
  579. function onAuthenticationRequired(intervalCallback) {
  580. Authentication.openAuthenticationDialog(
  581. roomName, intervalCallback, function () {
  582. Toolbar.authenticateClicked();
  583. });
  584. }
  585. function onLastNChanged(oldValue, newValue) {
  586. if (config.muteLocalVideoIfNotInLastN) {
  587. setVideoMute(!newValue, { 'byUser': false });
  588. }
  589. }
  590. UI.toggleSmileys = function () {
  591. Chat.toggleSmileys();
  592. };
  593. UI.getSettings = function () {
  594. return Settings.getSettings();
  595. };
  596. UI.toggleFilmStrip = function () {
  597. return BottomToolbar.toggleFilmStrip();
  598. };
  599. UI.toggleChat = function () {
  600. return BottomToolbar.toggleChat();
  601. };
  602. UI.toggleContactList = function () {
  603. return BottomToolbar.toggleContactList();
  604. };
  605. UI.inputDisplayNameHandler = function (value) {
  606. VideoLayout.inputDisplayNameHandler(value);
  607. };
  608. UI.getLargeVideoResource = function () {
  609. return VideoLayout.getLargeVideoResource();
  610. };
  611. UI.getRoomNode = function () {
  612. if (roomNode)
  613. return roomNode;
  614. var path = window.location.pathname;
  615. // determinde the room node from the url
  616. // TODO: just the roomnode or the whole bare jid?
  617. if (config.getroomnode && typeof config.getroomnode === 'function') {
  618. // custom function might be responsible for doing the pushstate
  619. roomNode = config.getroomnode(path);
  620. } else {
  621. /* fall back to default strategy
  622. * this is making assumptions about how the URL->room mapping happens.
  623. * It currently assumes deployment at root, with a rewrite like the
  624. * following one (for nginx):
  625. location ~ ^/([a-zA-Z0-9]+)$ {
  626. rewrite ^/(.*)$ / break;
  627. }
  628. */
  629. if (path.length > 1) {
  630. roomNode = path.substr(1).toLowerCase();
  631. } else {
  632. var word = RoomNameGenerator.generateRoomWithoutSeparator();
  633. roomNode = word.toLowerCase();
  634. window.history.pushState('VideoChat',
  635. 'Room: ' + word, window.location.pathname + word);
  636. }
  637. }
  638. return roomNode;
  639. };
  640. UI.generateRoomName = function () {
  641. if (roomName)
  642. return roomName;
  643. var roomNode = UI.getRoomNode();
  644. roomName = roomNode + '@' + config.hosts.muc;
  645. return roomName;
  646. };
  647. UI.connectionIndicatorShowMore = function(jid) {
  648. return VideoLayout.showMore(jid);
  649. };
  650. UI.showLoginPopup = function(callback) {
  651. console.log('password is required');
  652. var message = '<h2 data-i18n="dialog.passwordRequired">';
  653. message += APP.translation.translateString(
  654. "dialog.passwordRequired");
  655. message += '</h2>' +
  656. '<input name="username" type="text" ' +
  657. 'placeholder="user@domain.net" autofocus>' +
  658. '<input name="password" ' +
  659. 'type="password" data-i18n="[placeholder]dialog.userPassword"' +
  660. ' placeholder="user password">';
  661. UI.messageHandler.openTwoButtonDialog(null, null, null, message,
  662. true,
  663. "dialog.Ok",
  664. function (e, v, m, f) {
  665. if (v) {
  666. if (f.username && f.password) {
  667. callback(f.username, f.password);
  668. }
  669. }
  670. },
  671. null, null, ':input:first'
  672. );
  673. };
  674. UI.checkForNicknameAndJoin = function () {
  675. Authentication.closeAuthenticationDialog();
  676. Authentication.stopInterval();
  677. var nick = null;
  678. if (config.useNicks) {
  679. nick = window.prompt('Your nickname (optional)');
  680. }
  681. APP.xmpp.joinRoom(roomName, config.useNicks, nick);
  682. };
  683. function dump(elem, filename) {
  684. elem = elem.parentNode;
  685. elem.download = filename || 'meetlog.json';
  686. elem.href = 'data:application/json;charset=utf-8,\n';
  687. var data = APP.xmpp.getJingleLog();
  688. var metadata = {};
  689. metadata.time = new Date();
  690. metadata.url = window.location.href;
  691. metadata.ua = navigator.userAgent;
  692. var log = APP.xmpp.getXmppLog();
  693. if (log) {
  694. metadata.xmpp = log;
  695. }
  696. data.metadata = metadata;
  697. elem.href += encodeURIComponent(JSON.stringify(data, null, ' '));
  698. return false;
  699. }
  700. UI.getRoomName = function () {
  701. return roomName;
  702. };
  703. UI.setInitialMuteFromFocus = function (muteAudio, muteVideo) {
  704. if (muteAudio || muteVideo)
  705. notifyForInitialMute();
  706. if (muteAudio)
  707. UI.setAudioMuted(true);
  708. if (muteVideo)
  709. UI.setVideoMute(true);
  710. };
  711. /**
  712. * Mutes/unmutes the local video.
  713. */
  714. UI.toggleVideo = function () {
  715. setVideoMute(!APP.RTC.localVideo.isMuted());
  716. };
  717. /**
  718. * Mutes / unmutes audio for the local participant.
  719. */
  720. UI.toggleAudio = function() {
  721. UI.setAudioMuted(!APP.RTC.localAudio.isMuted());
  722. };
  723. /**
  724. * Sets muted audio state for the local participant.
  725. */
  726. UI.setAudioMuted = function (mute, earlyMute) {
  727. var audioMute = null;
  728. if (earlyMute)
  729. audioMute = function (mute, cb) {
  730. return APP.xmpp.sendAudioInfoPresence(mute, cb);
  731. };
  732. else
  733. audioMute = function (mute, cb) {
  734. return APP.xmpp.setAudioMute(mute, cb);
  735. };
  736. if (!audioMute(mute, function () {
  737. VideoLayout.showLocalAudioIndicator(mute);
  738. UIUtil.buttonClick("#toolbar_button_mute", "icon-microphone icon-mic-disabled");
  739. })) {
  740. // We still click the button.
  741. UIUtil.buttonClick("#toolbar_button_mute", "icon-microphone icon-mic-disabled");
  742. return;
  743. }
  744. };
  745. UI.addListener = function (type, listener) {
  746. eventEmitter.on(type, listener);
  747. };
  748. UI.clickOnVideo = function (videoNumber) {
  749. var remoteVideos = $(".videocontainer:not(#mixedstream)");
  750. if (remoteVideos.length > videoNumber) {
  751. remoteVideos[videoNumber].click();
  752. }
  753. };
  754. //Used by torture
  755. UI.showToolbar = function () {
  756. return ToolbarToggler.showToolbar();
  757. };
  758. //Used by torture
  759. UI.dockToolbar = function (isDock) {
  760. return ToolbarToggler.dockToolbar(isDock);
  761. };
  762. UI.setVideoMuteButtonsState = function (mute) {
  763. var video = $('#toolbar_button_camera');
  764. var communicativeClass = "icon-camera";
  765. var muteClass = "icon-camera icon-camera-disabled";
  766. if (mute) {
  767. video.removeClass(communicativeClass);
  768. video.addClass(muteClass);
  769. } else {
  770. video.removeClass(muteClass);
  771. video.addClass(communicativeClass);
  772. }
  773. };
  774. UI.userAvatarChanged = function (resourceJid, thumbUrl, contactListUrl) {
  775. VideoLayout.userAvatarChanged(resourceJid, thumbUrl);
  776. ContactList.userAvatarChanged(resourceJid, contactListUrl);
  777. if(resourceJid === APP.xmpp.myResource())
  778. SettingsMenu.changeAvatar(thumbUrl);
  779. };
  780. UI.setVideoMute = setVideoMute;
  781. module.exports = UI;