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.

Toolbar.js 16KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518
  1. /* global $, buttonClick, config, lockRoom,
  2. setSharedKey, Util */
  3. var messageHandler = require("../util/MessageHandler");
  4. var BottomToolbar = require("./BottomToolbar");
  5. var Prezi = require("../prezi/Prezi");
  6. var Etherpad = require("../etherpad/Etherpad");
  7. var PanelToggler = require("../side_pannels/SidePanelToggler");
  8. var Authentication = require("../authentication/Authentication");
  9. var UIUtil = require("../util/UIUtil");
  10. var roomUrl = null;
  11. var sharedKey = '';
  12. var UI = null;
  13. var buttonHandlers =
  14. {
  15. "toolbar_button_mute": function () {
  16. return APP.UI.toggleAudio();
  17. },
  18. "toolbar_button_camera": function () {
  19. return APP.UI.toggleVideo();
  20. },
  21. "toolbar_button_authentication": function () {
  22. return Toolbar.authenticateClicked();
  23. },
  24. "toolbar_button_record": function () {
  25. return toggleRecording();
  26. },
  27. "toolbar_button_security": function () {
  28. return Toolbar.openLockDialog();
  29. },
  30. "toolbar_button_link": function () {
  31. return Toolbar.openLinkDialog();
  32. },
  33. "toolbar_button_chat": function () {
  34. return BottomToolbar.toggleChat();
  35. },
  36. "toolbar_button_prezi": function () {
  37. return Prezi.openPreziDialog();
  38. },
  39. "toolbar_button_etherpad": function () {
  40. return Etherpad.toggleEtherpad(0);
  41. },
  42. "toolbar_button_desktopsharing": function () {
  43. return APP.desktopsharing.toggleScreenSharing();
  44. },
  45. "toolbar_button_fullScreen": function()
  46. {
  47. UIUtil.buttonClick("#fullScreen", "icon-full-screen icon-exit-full-screen");
  48. return Toolbar.toggleFullScreen();
  49. },
  50. "toolbar_button_sip": function () {
  51. return callSipButtonClicked();
  52. },
  53. "toolbar_button_settings": function () {
  54. PanelToggler.toggleSettingsMenu();
  55. },
  56. "toolbar_button_hangup": function () {
  57. return hangup();
  58. }
  59. };
  60. function hangup() {
  61. APP.xmpp.disposeConference();
  62. if(config.enableWelcomePage)
  63. {
  64. setTimeout(function()
  65. {
  66. window.localStorage.welcomePageDisabled = false;
  67. window.location.pathname = "/";
  68. }, 10000);
  69. }
  70. UI.messageHandler.openDialog(
  71. "Session Terminated",
  72. "You hung up the call",
  73. true,
  74. { "Join again": true },
  75. function(event, value, message, formVals)
  76. {
  77. window.location.reload();
  78. return false;
  79. }
  80. );
  81. }
  82. /**
  83. * Starts or stops the recording for the conference.
  84. */
  85. function toggleRecording() {
  86. xmpp.toggleRecording(function (callback) {
  87. APP.UI.messageHandler.openTwoButtonDialog(null,
  88. '<h2>Enter recording token</h2>' +
  89. '<input id="recordingToken" type="text" ' +
  90. 'placeholder="token" autofocus>',
  91. false,
  92. "Save",
  93. function (e, v, m, f) {
  94. if (v) {
  95. var token = document.getElementById('recordingToken');
  96. if (token.value) {
  97. callback(UIUtil.escapeHtml(token.value));
  98. }
  99. }
  100. },
  101. function (event) {
  102. document.getElementById('recordingToken').focus();
  103. },
  104. function () {
  105. }
  106. );
  107. }, Toolbar.setRecordingButtonState, Toolbar.setRecordingButtonState);
  108. }
  109. /**
  110. * Locks / unlocks the room.
  111. */
  112. function lockRoom(lock) {
  113. var currentSharedKey = '';
  114. if (lock)
  115. currentSharedKey = sharedKey;
  116. xmpp.lockRoom(currentSharedKey, function (res) {
  117. // password is required
  118. if (sharedKey)
  119. {
  120. console.log('set room password');
  121. Toolbar.lockLockButton();
  122. }
  123. else
  124. {
  125. console.log('removed room password');
  126. Toolbar.unlockLockButton();
  127. }
  128. }, function (err) {
  129. console.warn('setting password failed', err);
  130. messageHandler.showError('Lock failed',
  131. 'Failed to lock conference.',
  132. err);
  133. Toolbar.setSharedKey('');
  134. }, function () {
  135. console.warn('room passwords not supported');
  136. messageHandler.showError('Warning',
  137. 'Room passwords are currently not supported.');
  138. Toolbar.setSharedKey('');
  139. });
  140. };
  141. /**
  142. * Invite participants to conference.
  143. */
  144. function inviteParticipants() {
  145. if (roomUrl === null)
  146. return;
  147. var sharedKeyText = "";
  148. if (sharedKey && sharedKey.length > 0) {
  149. sharedKeyText =
  150. "This conference is password protected. Please use the " +
  151. "following pin when joining:%0D%0A%0D%0A" +
  152. sharedKey + "%0D%0A%0D%0A";
  153. }
  154. var conferenceName = roomUrl.substring(roomUrl.lastIndexOf('/') + 1);
  155. var subject = "Invitation to a " + interfaceConfig.APP_NAME + " (" + conferenceName + ")";
  156. var body = "Hey there, I%27d like to invite you to a " + interfaceConfig.APP_NAME +
  157. " conference I%27ve just set up.%0D%0A%0D%0A" +
  158. "Please click on the following link in order" +
  159. " to join the conference.%0D%0A%0D%0A" +
  160. roomUrl +
  161. "%0D%0A%0D%0A" +
  162. sharedKeyText +
  163. "Note that " + interfaceConfig.APP_NAME + " is currently" +
  164. " only supported by Chromium," +
  165. " Google Chrome and Opera, so you need" +
  166. " to be using one of these browsers.%0D%0A%0D%0A" +
  167. "Talk to you in a sec!";
  168. if (window.localStorage.displayname) {
  169. body += "%0D%0A%0D%0A" + window.localStorage.displayname;
  170. }
  171. if (interfaceConfig.INVITATION_POWERED_BY) {
  172. body += "%0D%0A%0D%0A--%0D%0Apowered by jitsi.org";
  173. }
  174. window.open("mailto:?subject=" + subject + "&body=" + body, '_blank');
  175. }
  176. function callSipButtonClicked()
  177. {
  178. var defaultNumber
  179. = config.defaultSipNumber ? config.defaultSipNumber : '';
  180. messageHandler.openTwoButtonDialog(null,
  181. '<h2>Enter SIP number</h2>' +
  182. '<input id="sipNumber" type="text"' +
  183. ' value="' + defaultNumber + '" autofocus>',
  184. false,
  185. "Dial",
  186. function (e, v, m, f) {
  187. if (v) {
  188. var numberInput = document.getElementById('sipNumber');
  189. if (numberInput.value) {
  190. xmpp.dial(numberInput.value, 'fromnumber',
  191. UI.getRoomName(), sharedKey);
  192. }
  193. }
  194. },
  195. function (event) {
  196. document.getElementById('sipNumber').focus();
  197. }
  198. );
  199. }
  200. var Toolbar = (function (my) {
  201. my.init = function (ui) {
  202. for(var k in buttonHandlers)
  203. $("#" + k).click(buttonHandlers[k]);
  204. UI = ui;
  205. }
  206. /**
  207. * Sets shared key
  208. * @param sKey the shared key
  209. */
  210. my.setSharedKey = function (sKey) {
  211. sharedKey = sKey;
  212. };
  213. my.authenticateClicked = function () {
  214. Authentication.focusAuthenticationWindow();
  215. // Get authentication URL
  216. APP.xmpp.getAuthUrl(APP.UI.getRoomName(), function (url) {
  217. // Open popup with authentication URL
  218. var authenticationWindow = Authentication.createAuthenticationWindow(function () {
  219. // On popup closed - retry room allocation
  220. xAPP.mpp.allocateConferenceFocus(APP.UI.getRoomName(), APP.UI.checkForNicknameAndJoin);
  221. }, url);
  222. if (!authenticationWindow) {
  223. Toolbar.showAuthenticateButton(true);
  224. messageHandler.openMessageDialog(
  225. null, "Your browser is blocking popup windows from this site." +
  226. " Please enable popups in your browser security settings" +
  227. " and try again.");
  228. }
  229. });
  230. };
  231. /**
  232. * Updates the room invite url.
  233. */
  234. my.updateRoomUrl = function (newRoomUrl) {
  235. roomUrl = newRoomUrl;
  236. // If the invite dialog has been already opened we update the information.
  237. var inviteLink = document.getElementById('inviteLinkRef');
  238. if (inviteLink) {
  239. inviteLink.value = roomUrl;
  240. inviteLink.select();
  241. document.getElementById('jqi_state0_buttonInvite').disabled = false;
  242. }
  243. };
  244. /**
  245. * Disables and enables some of the buttons.
  246. */
  247. my.setupButtonsFromConfig = function () {
  248. if (config.disablePrezi)
  249. {
  250. $("#prezi_button").css({display: "none"});
  251. }
  252. };
  253. /**
  254. * Opens the lock room dialog.
  255. */
  256. my.openLockDialog = function () {
  257. // Only the focus is able to set a shared key.
  258. if (!APP.xmpp.isModerator()) {
  259. if (sharedKey) {
  260. messageHandler.openMessageDialog(null,
  261. "This conversation is currently protected by" +
  262. " a password. Only the owner of the conference" +
  263. " could set a password.",
  264. false,
  265. "Password");
  266. } else {
  267. messageHandler.openMessageDialog(null,
  268. "This conversation isn't currently protected by" +
  269. " a password. Only the owner of the conference" +
  270. " could set a password.",
  271. false,
  272. "Password");
  273. }
  274. } else {
  275. if (sharedKey) {
  276. messageHandler.openTwoButtonDialog(null,
  277. "Are you sure you would like to remove your password?",
  278. false,
  279. "Remove",
  280. function (e, v) {
  281. if (v) {
  282. Toolbar.setSharedKey('');
  283. lockRoom(false);
  284. }
  285. });
  286. } else {
  287. messageHandler.openTwoButtonDialog(null,
  288. '<h2>Set a password to lock your room</h2>' +
  289. '<input id="lockKey" type="text"' +
  290. 'placeholder="your password" autofocus>',
  291. false,
  292. "Save",
  293. function (e, v) {
  294. if (v) {
  295. var lockKey = document.getElementById('lockKey');
  296. if (lockKey.value) {
  297. Toolbar.setSharedKey(UIUtil.escapeHtml(lockKey.value));
  298. lockRoom(true);
  299. }
  300. }
  301. },
  302. function () {
  303. document.getElementById('lockKey').focus();
  304. }
  305. );
  306. }
  307. }
  308. };
  309. /**
  310. * Opens the invite link dialog.
  311. */
  312. my.openLinkDialog = function () {
  313. var inviteLink;
  314. if (roomUrl === null) {
  315. inviteLink = "Your conference is currently being created...";
  316. } else {
  317. inviteLink = encodeURI(roomUrl);
  318. }
  319. messageHandler.openTwoButtonDialog(
  320. "Share this link with everyone you want to invite",
  321. '<input id="inviteLinkRef" type="text" value="' +
  322. inviteLink + '" onclick="this.select();" readonly>',
  323. false,
  324. "Invite",
  325. function (e, v) {
  326. if (v) {
  327. if (roomUrl) {
  328. inviteParticipants();
  329. }
  330. }
  331. },
  332. function () {
  333. if (roomUrl) {
  334. document.getElementById('inviteLinkRef').select();
  335. } else {
  336. document.getElementById('jqi_state0_buttonInvite')
  337. .disabled = true;
  338. }
  339. }
  340. );
  341. };
  342. /**
  343. * Opens the settings dialog.
  344. */
  345. my.openSettingsDialog = function () {
  346. messageHandler.openTwoButtonDialog(
  347. '<h2>Configure your conference</h2>' +
  348. '<input type="checkbox" id="initMuted">' +
  349. 'Participants join muted<br/>' +
  350. '<input type="checkbox" id="requireNicknames">' +
  351. 'Require nicknames<br/><br/>' +
  352. 'Set a password to lock your room:' +
  353. '<input id="lockKey" type="text" placeholder="your password"' +
  354. 'autofocus>',
  355. null,
  356. false,
  357. "Save",
  358. function () {
  359. document.getElementById('lockKey').focus();
  360. },
  361. function (e, v) {
  362. if (v) {
  363. if ($('#initMuted').is(":checked")) {
  364. // it is checked
  365. }
  366. if ($('#requireNicknames').is(":checked")) {
  367. // it is checked
  368. }
  369. /*
  370. var lockKey = document.getElementById('lockKey');
  371. if (lockKey.value) {
  372. setSharedKey(lockKey.value);
  373. lockRoom(true);
  374. }
  375. */
  376. }
  377. }
  378. );
  379. };
  380. /**
  381. * Toggles the application in and out of full screen mode
  382. * (a.k.a. presentation mode in Chrome).
  383. */
  384. my.toggleFullScreen = function () {
  385. var fsElement = document.documentElement;
  386. if (!document.mozFullScreen && !document.webkitIsFullScreen) {
  387. //Enter Full Screen
  388. if (fsElement.mozRequestFullScreen) {
  389. fsElement.mozRequestFullScreen();
  390. }
  391. else {
  392. fsElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
  393. }
  394. } else {
  395. //Exit Full Screen
  396. if (document.mozCancelFullScreen) {
  397. document.mozCancelFullScreen();
  398. } else {
  399. document.webkitCancelFullScreen();
  400. }
  401. }
  402. };
  403. /**
  404. * Unlocks the lock button state.
  405. */
  406. my.unlockLockButton = function () {
  407. if ($("#lockIcon").hasClass("icon-security-locked"))
  408. UIUtil.buttonClick("#lockIcon", "icon-security icon-security-locked");
  409. };
  410. /**
  411. * Updates the lock button state to locked.
  412. */
  413. my.lockLockButton = function () {
  414. if ($("#lockIcon").hasClass("icon-security"))
  415. UIUtil.buttonClick("#lockIcon", "icon-security icon-security-locked");
  416. };
  417. /**
  418. * Shows or hides authentication button
  419. * @param show <tt>true</tt> to show or <tt>false</tt> to hide
  420. */
  421. my.showAuthenticateButton = function (show) {
  422. if (show) {
  423. $('#authentication').css({display: "inline"});
  424. }
  425. else {
  426. $('#authentication').css({display: "none"});
  427. }
  428. };
  429. // Shows or hides the 'recording' button.
  430. my.showRecordingButton = function (show) {
  431. if (!config.enableRecording) {
  432. return;
  433. }
  434. if (show) {
  435. $('#recording').css({display: "inline"});
  436. }
  437. else {
  438. $('#recording').css({display: "none"});
  439. }
  440. };
  441. // Sets the state of the recording button
  442. my.setRecordingButtonState = function (isRecording) {
  443. if (isRecording) {
  444. $('#recordButton').removeClass("icon-recEnable");
  445. $('#recordButton').addClass("icon-recEnable active");
  446. } else {
  447. $('#recordButton').removeClass("icon-recEnable active");
  448. $('#recordButton').addClass("icon-recEnable");
  449. }
  450. };
  451. // Shows or hides SIP calls button
  452. my.showSipCallButton = function (show) {
  453. if (APP.xmpp.isSipGatewayEnabled() && show) {
  454. $('#sipCallButton').css({display: "inline"});
  455. } else {
  456. $('#sipCallButton').css({display: "none"});
  457. }
  458. };
  459. /**
  460. * Sets the state of the button. The button has blue glow if desktop
  461. * streaming is active.
  462. * @param active the state of the desktop streaming.
  463. */
  464. my.changeDesktopSharingButtonState = function (active) {
  465. var button = $("#desktopsharing > a");
  466. if (active)
  467. {
  468. button.addClass("glow");
  469. }
  470. else
  471. {
  472. button.removeClass("glow");
  473. }
  474. };
  475. return my;
  476. }(Toolbar || {}));
  477. module.exports = Toolbar;