您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

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