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.

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