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.

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352
  1. var Prezi = (function (my) {
  2. var preziPlayer = null;
  3. /**
  4. * Reloads the current presentation.
  5. */
  6. my.reloadPresentation = function() {
  7. var iframe = document.getElementById(preziPlayer.options.preziId);
  8. iframe.src = iframe.src;
  9. };
  10. /**
  11. * Shows/hides a presentation.
  12. */
  13. my.setPresentationVisible = function (visible) {
  14. if (visible) {
  15. // Trigger the video.selected event to indicate a change in the
  16. // large video.
  17. $(document).trigger("video.selected", [true]);
  18. $('#largeVideo').fadeOut(300, function () {
  19. setLargeVideoVisible(false);
  20. $('#presentation>iframe').fadeIn(300, function() {
  21. $('#presentation>iframe').css({opacity:'1'});
  22. dockToolbar(true);
  23. });
  24. });
  25. }
  26. else {
  27. if ($('#presentation>iframe').css('opacity') == '1') {
  28. $('#presentation>iframe').fadeOut(300, function () {
  29. $('#presentation>iframe').css({opacity:'0'});
  30. $('#reloadPresentation').css({display:'none'});
  31. $('#largeVideo').fadeIn(300, function() {
  32. setLargeVideoVisible(true);
  33. dockToolbar(false);
  34. });
  35. });
  36. }
  37. }
  38. };
  39. /**
  40. * Returns <tt>true</tt> if the presentation is visible, <tt>false</tt> -
  41. * otherwise.
  42. */
  43. my.isPresentationVisible = function () {
  44. return ($('#presentation>iframe') != null
  45. && $('#presentation>iframe').css('opacity') == 1);
  46. };
  47. /**
  48. * Opens the Prezi dialog, from which the user could choose a presentation
  49. * to load.
  50. */
  51. my.openPreziDialog = function() {
  52. var myprezi = connection.emuc.getPrezi(connection.emuc.myroomjid);
  53. if (myprezi) {
  54. $.prompt("Are you sure you would like to remove your Prezi?",
  55. {
  56. title: "Remove Prezi",
  57. buttons: { "Remove": true, "Cancel": false},
  58. defaultButton: 1,
  59. submit: function(e,v,m,f){
  60. if(v)
  61. {
  62. connection.emuc.removePreziFromPresence();
  63. connection.emuc.sendPresence();
  64. }
  65. }
  66. });
  67. }
  68. else if (preziPlayer != null) {
  69. $.prompt("Another participant is already sharing a Prezi." +
  70. "This conference allows only one Prezi at a time.",
  71. {
  72. title: "Share a Prezi",
  73. buttons: { "Ok": true},
  74. defaultButton: 0,
  75. submit: function(e,v,m,f){
  76. $.prompt.close();
  77. }
  78. });
  79. }
  80. else {
  81. var openPreziState = {
  82. state0: {
  83. html: '<h2>Share a Prezi</h2>' +
  84. '<input id="preziUrl" type="text" ' +
  85. 'placeholder="e.g. ' +
  86. 'http://prezi.com/wz7vhjycl7e6/my-prezi" autofocus>',
  87. persistent: false,
  88. buttons: { "Share": true , "Cancel": false},
  89. defaultButton: 1,
  90. submit: function(e,v,m,f){
  91. e.preventDefault();
  92. if(v)
  93. {
  94. var preziUrl = document.getElementById('preziUrl');
  95. if (preziUrl.value)
  96. {
  97. var urlValue
  98. = encodeURI(Util.escapeHtml(preziUrl.value));
  99. if (urlValue.indexOf('http://prezi.com/') != 0
  100. && urlValue.indexOf('https://prezi.com/') != 0)
  101. {
  102. $.prompt.goToState('state1');
  103. return false;
  104. }
  105. else {
  106. var presIdTmp = urlValue.substring(
  107. urlValue.indexOf("prezi.com/") + 10);
  108. if (!isAlphanumeric(presIdTmp)
  109. || presIdTmp.indexOf('/') < 2) {
  110. $.prompt.goToState('state1');
  111. return false;
  112. }
  113. else {
  114. connection.emuc
  115. .addPreziToPresence(urlValue, 0);
  116. connection.emuc.sendPresence();
  117. $.prompt.close();
  118. }
  119. }
  120. }
  121. }
  122. else
  123. $.prompt.close();
  124. }
  125. },
  126. state1: {
  127. html: '<h2>Share a Prezi</h2>' +
  128. 'Please provide a correct prezi link.',
  129. persistent: false,
  130. buttons: { "Back": true, "Cancel": false },
  131. defaultButton: 1,
  132. submit:function(e,v,m,f) {
  133. e.preventDefault();
  134. if(v==0)
  135. $.prompt.close();
  136. else
  137. $.prompt.goToState('state0');
  138. }
  139. }
  140. };
  141. var myPrompt = jQuery.prompt(openPreziState);
  142. myPrompt.on('impromptu:loaded', function(e) {
  143. document.getElementById('preziUrl').focus();
  144. });
  145. myPrompt.on('impromptu:statechanged', function(e) {
  146. document.getElementById('preziUrl').focus();
  147. });
  148. }
  149. };
  150. /**
  151. * A new presentation has been added.
  152. *
  153. * @param event the event indicating the add of a presentation
  154. * @param jid the jid from which the presentation was added
  155. * @param presUrl url of the presentation
  156. * @param currentSlide the current slide to which we should move
  157. */
  158. var presentationAdded = function(event, jid, presUrl, currentSlide) {
  159. console.log("presentation added", presUrl);
  160. var presId = getPresentationId(presUrl);
  161. var elementId = 'participant_'
  162. + Strophe.getResourceFromJid(jid)
  163. + '_' + presId;
  164. // We explicitly don't specify the peer jid here, because we don't want
  165. // this video to be dealt with as a peer related one (for example we
  166. // don't want to show a mute/kick menu for this one, etc.).
  167. addRemoteVideoContainer(null, elementId);
  168. resizeThumbnails();
  169. var controlsEnabled = false;
  170. if (jid === connection.emuc.myroomjid)
  171. controlsEnabled = true;
  172. Prezi.setPresentationVisible(true);
  173. $('#largeVideoContainer').hover(
  174. function (event) {
  175. if (Prezi.isPresentationVisible()) {
  176. var reloadButtonRight = window.innerWidth
  177. - $('#presentation>iframe').offset().left
  178. - $('#presentation>iframe').width();
  179. $('#reloadPresentation').css({ right: reloadButtonRight,
  180. display:'inline-block'});
  181. }
  182. },
  183. function (event) {
  184. if (!Prezi.isPresentationVisible())
  185. $('#reloadPresentation').css({display:'none'});
  186. else {
  187. var e = event.toElement || event.relatedTarget;
  188. if (e && e.id != 'reloadPresentation' && e.id != 'header')
  189. $('#reloadPresentation').css({display:'none'});
  190. }
  191. });
  192. preziPlayer = new PreziPlayer(
  193. 'presentation',
  194. {preziId: presId,
  195. width: getPresentationWidth(),
  196. height: getPresentationHeihgt(),
  197. controls: controlsEnabled,
  198. debug: true
  199. });
  200. $('#presentation>iframe').attr('id', preziPlayer.options.preziId);
  201. preziPlayer.on(PreziPlayer.EVENT_STATUS, function(event) {
  202. console.log("prezi status", event.value);
  203. if (event.value == PreziPlayer.STATUS_CONTENT_READY) {
  204. if (jid != connection.emuc.myroomjid)
  205. preziPlayer.flyToStep(currentSlide);
  206. }
  207. });
  208. preziPlayer.on(PreziPlayer.EVENT_CURRENT_STEP, function(event) {
  209. console.log("event value", event.value);
  210. connection.emuc.addCurrentSlideToPresence(event.value);
  211. connection.emuc.sendPresence();
  212. });
  213. $("#" + elementId).css( 'background-image',
  214. 'url(../images/avatarprezi.png)');
  215. $("#" + elementId).click(
  216. function () {
  217. Prezi.setPresentationVisible(true);
  218. }
  219. );
  220. };
  221. /**
  222. * A presentation has been removed.
  223. *
  224. * @param event the event indicating the remove of a presentation
  225. * @param jid the jid for which the presentation was removed
  226. * @param the url of the presentation
  227. */
  228. var presentationRemoved = function (event, jid, presUrl) {
  229. console.log('presentation removed', presUrl);
  230. var presId = getPresentationId(presUrl);
  231. Prezi.setPresentationVisible(false);
  232. $('#participant_'
  233. + Strophe.getResourceFromJid(jid)
  234. + '_' + presId).remove();
  235. $('#presentation>iframe').remove();
  236. if (preziPlayer != null) {
  237. preziPlayer.destroy();
  238. preziPlayer = null;
  239. }
  240. };
  241. /**
  242. * Indicates if the given string is an alphanumeric string.
  243. * Note that some special characters are also allowed (-, _ , /, &, ?, =, ;) for the
  244. * purpose of checking URIs.
  245. */
  246. function isAlphanumeric(unsafeText) {
  247. var regex = /^[a-z0-9-_\/&\?=;]+$/i;
  248. return regex.test(unsafeText);
  249. }
  250. /**
  251. * Returns the presentation id from the given url.
  252. */
  253. function getPresentationId (presUrl) {
  254. var presIdTmp = presUrl.substring(presUrl.indexOf("prezi.com/") + 10);
  255. return presIdTmp.substring(0, presIdTmp.indexOf('/'));
  256. }
  257. /**
  258. * Returns the presentation width.
  259. */
  260. function getPresentationWidth() {
  261. var availableWidth = Util.getAvailableVideoWidth();
  262. var availableHeight = getPresentationHeihgt();
  263. var aspectRatio = 16.0 / 9.0;
  264. if (availableHeight < availableWidth / aspectRatio) {
  265. availableWidth = Math.floor(availableHeight * aspectRatio);
  266. }
  267. return availableWidth;
  268. }
  269. /**
  270. * Returns the presentation height.
  271. */
  272. function getPresentationHeihgt() {
  273. var remoteVideos = $('#remoteVideos');
  274. return window.innerHeight - remoteVideos.outerHeight();
  275. }
  276. /**
  277. * Resizes the presentation iframe.
  278. */
  279. function resize() {
  280. if ($('#presentation>iframe')) {
  281. $('#presentation>iframe').width(getPresentationWidth());
  282. $('#presentation>iframe').height(getPresentationHeihgt());
  283. }
  284. }
  285. /**
  286. * Presentation has been removed.
  287. */
  288. $(document).bind('presentationremoved.muc', presentationRemoved);
  289. /**
  290. * Presentation has been added.
  291. */
  292. $(document).bind('presentationadded.muc', presentationAdded);
  293. /*
  294. * Indicates presentation slide change.
  295. */
  296. $(document).bind('gotoslide.muc', function (event, jid, presUrl, current) {
  297. if (preziPlayer && preziPlayer.getCurrentStep() != current) {
  298. preziPlayer.flyToStep(current);
  299. var animationStepsArray = preziPlayer.getAnimationCountOnSteps();
  300. for (var i = 0; i < parseInt(animationStepsArray[current]); i++) {
  301. preziPlayer.flyToStep(current, i);
  302. }
  303. }
  304. });
  305. /**
  306. * On video selected event.
  307. */
  308. $(document).bind('video.selected', function (event, isPresentation) {
  309. if (!isPresentation && $('#presentation>iframe'))
  310. Prezi.setPresentationVisible(false);
  311. });
  312. $(window).resize(function () {
  313. resize();
  314. });
  315. return my;
  316. }(Prezi || {}));