From 6945aa802c3068856a0cc9685e6531bd493d6a50 Mon Sep 17 00:00:00 2001 From: Yana Stamcheva Date: Fri, 24 Jan 2014 11:24:18 +0100 Subject: [PATCH] Adds presentations with Prezi. --- app.js | 374 ++++++++++++++++++++++++++++++++++++----- css/main.css | 39 +++-- css/modaldialog.css | 5 +- images/avatarprezi.png | Bin 0 -> 8579 bytes index.html | 17 +- libs/prezi_player.js | 259 ++++++++++++++++++++++++++++ muc.js | 84 ++++++++- 7 files changed, 720 insertions(+), 58 deletions(-) create mode 100644 images/avatarprezi.png create mode 100644 libs/prezi_player.js diff --git a/app.js b/app.js index f2495af17..38b694dc3 100644 --- a/app.js +++ b/app.js @@ -9,6 +9,7 @@ var sharedKey = ''; var roomUrl = null; var ssrc2jid = {}; var localVideoSrc = null; +var preziPlayer = null; /* window.onbeforeunload = closePageWarning; */ @@ -140,16 +141,14 @@ $(document).bind('remotestreamadded.jingle', function (event, data, sid) { var container; var remotes = document.getElementById('remoteVideos'); + if (data.peerjid) { container = document.getElementById('participant_' + Strophe.getResourceFromJid(data.peerjid)); if (!container) { console.warn('no container for', data.peerjid); // create for now... // FIXME: should be removed - container = document.createElement('span'); - container.id = 'participant_' + Strophe.getResourceFromJid(data.peerjid); - container.className = 'videocontainer'; - remotes.appendChild(container); + container = addRemoteVideoContainer('participant_' + Strophe.getResourceFromJid(data.peerjid)); } else { //console.log('found container for', data.peerjid); } @@ -173,6 +172,7 @@ $(document).bind('remotestreamadded.jingle', function (event, data, sid) { container.id = 'mixedstream'; $(container).hide(); } + var sel = $('#' + id); sel.hide(); RTC.attachMediaStream(sel, data.stream); @@ -187,10 +187,12 @@ $(document).bind('remotestreamadded.jingle', function (event, data, sid) { var pick = $('#remoteVideos>span[id!="mixedstream"]:visible:last>video').get(0); // mute if localvideo var isLocalVideo = false; - if (pick.src === localVideoSrc) + if (pick) { + if (pick.src === localVideoSrc) isLocalVideo = true; - - updateLargeVideo(pick.src, isLocalVideo, pick.volume); + + updateLargeVideo(pick.src, isLocalVideo, pick.volume); + } } $('#' + id).parent().remove(); resizeThumbnails(); @@ -217,7 +219,7 @@ $(document).bind('callactive.jingle', function (event, videoelem, sid) { resizeThumbnails(); updateLargeVideo(videoelem.attr('src'), false, 1); - + showFocusIndicator(); } }); @@ -238,16 +240,13 @@ $(document).bind('setLocalDescription.jingle', function (event, sid) { newssrcs[type] = ssrc; }); console.log('new ssrcs', newssrcs); - // just blast off presence for everything -- TODO: optimize - var pres = $pres({to: connection.emuc.myroomjid }); - pres.c('x', {xmlns: 'http://jabber.org/protocol/muc'}).up(); - pres.c('media', {xmlns: 'http://estos.de/ns/mjs'}); + var i = 0; Object.keys(newssrcs).forEach(function (mtype) { - pres.c('source', {type: mtype, ssrc: newssrcs[mtype]}).up(); + i++; + connection.emuc.addMediaToPresence(i, mtype, newssrcs[mtype]); }); - pres.up(); - connection.send(pres); + connection.emuc.sendPresence(); }); $(document).bind('joined.muc', function (event, jid, info) { @@ -256,22 +255,19 @@ $(document).bind('joined.muc', function (event, jid, info) { document.createTextNode(Strophe.getResourceFromJid(jid) + ' (you)') ); - // Once we've joined the muc show the toolbar - showToolbar(); - if (Object.keys(connection.emuc.members).length < 1) { focus = new ColibriFocus(connection, config.hosts.bridge); } + + // Once we've joined the muc show the toolbar + showToolbar(); }); $(document).bind('entered.muc', function (event, jid, info, pres) { console.log('entered', jid, info); console.log(focus); - var container = document.createElement('span'); - container.id = 'participant_' + Strophe.getResourceFromJid(jid); - container.className = 'videocontainer'; - var remotes = document.getElementById('remoteVideos'); - remotes.appendChild(container); + + var container = addRemoteVideoContainer('participant_' + Strophe.getResourceFromJid(jid)); var nickfield = document.createElement('span'); nickfield.appendChild(document.createTextNode(Strophe.getResourceFromJid(jid))); @@ -304,7 +300,7 @@ $(document).bind('left.muc', function (event, jid) { var container = document.getElementById('participant_' + Strophe.getResourceFromJid(jid)); if (container) { // hide here, wait for video to close before removing - $(container).hide(); + $(container).hide(); resizeThumbnails(); } @@ -319,6 +315,10 @@ $(document).bind('left.muc', function (event, jid) { focus = new ColibriFocus(connection, config.hosts.bridge); } } + + if (connection.emuc.getPrezi(jid)) { + $(document).trigger('presentationremoved.muc', [jid, connection.emuc.getPrezi(jid)]); + } }); $(document).bind('presence.muc', function (event, jid, info, pres) { @@ -355,11 +355,156 @@ $(document).bind('passwordrequired.muc', function (event, jid) { }); }); +/* + * Presentation has been removed. + */ +$(document).bind('presentationremoved.muc', function(event, jid, presUrl) { + console.log('presentation removed', presUrl); + var presId = getPresentationId(presUrl); + setPresentationVisible(false); + $('#participant_' + Strophe.getResourceFromJid(jid) + '_' + presId).remove(); + $('#presentation>iframe').remove(); + if (preziPlayer != null) { + preziPlayer.destroy(); + preziPlayer = null; + } +}); + +/* + * Presentation has been added. + */ +$(document).bind('presentationadded.muc', function (event, jid, presUrl, currentSlide) { + console.log("presentation added", presUrl); + + var presId = getPresentationId(presUrl); + var elementId = 'participant_' + Strophe.getResourceFromJid(jid) + '_' + presId; + + var container = addRemoteVideoContainer(elementId); + resizeThumbnails(); + + var controlsEnabled = false; + if (jid === connection.emuc.myroomjid) + controlsEnabled = true; + + setPresentationVisible(true); + $('#largeVideoContainer').hover( + function (event) { + if ($('#largeVideo').css('visibility') == 'hidden') + $('#reloadPresentation').css({display:'inline-block'}); + }, + function (event) { + if ($('#largeVideo').css('visibility') == 'visible') + $('#reloadPresentation').css({display:'none'}); + else { + var e = event.toElement || event.relatedTarget; + + while(e && e.parentNode && e.parentNode != window) { + if (e.parentNode == this || e == this) { + return false; + } + e = e.parentNode; + } + $('#reloadPresentation').css({display:'none'}); + } + }); + + preziPlayer = new PreziPlayer( + 'presentation', + {preziId: presId, + width: $('#largeVideoContainer').width(), + height: $('#largeVideoContainer').height(), + controls: controlsEnabled, + debug: true + }); + + $('#presentation>iframe').attr('id', preziPlayer.options.preziId); + +// $('#presentation>iframe').load(function (){ +// console.log("IFRAME LOADED!!!!!!!!!!!!!!!!"); +// }); +// $('#presentation>iframe').ready(function (){ +// console.log("IFRAME READY!!!!!!!!!!!!!!!!"); +// }); + + preziPlayer.on(PreziPlayer.EVENT_STATUS, function(event) { + console.log("prezi status", event.value); + if (event.value == PreziPlayer.STATUS_CONTENT_READY) { + if (jid != connection.emuc.myroomjid) + preziPlayer.flyToStep(currentSlide); + } + }); + + preziPlayer.on(PreziPlayer.EVENT_CURRENT_STEP, function(event) { + console.log("event value", event.value); + connection.emuc.addCurrentSlideToPresence(event.value); + connection.emuc.sendPresence(); + }); + + $("#" + elementId).css('background-image','url(../images/avatarprezi.png)'); + $("#" + elementId).click( + function () { + setPresentationVisible(true); + } + ); +}); + +/* + * Indicates presentation slide change. + */ +$(document).bind('gotoslide.muc', function (event, jid, presUrl, current) { + if (preziPlayer) { + preziPlayer.flyToStep(current); + } +}); + +/** + * Returns the presentation id from the given url. + */ +function getPresentationId (presUrl) { + var presIdTmp = presUrl.substring(presUrl.indexOf("prezi.com/") + 10); + return presIdTmp.substring(0, presIdTmp.indexOf('/')); +} + +/* + * Reloads the current presentation. + */ +function reloadPresentation() { + var iframe = document.getElementById(preziPlayer.options.preziId); + iframe.src = iframe.src; +} + +/* + * Shows/hides a presentation. + */ +function setPresentationVisible(visible) { + if (visible) { + $('#largeVideo').fadeOut(300, function () { + $('#largeVideo').css({visibility:'hidden'}); + $('#presentation>iframe').fadeIn(300, function() { + $('#presentation>iframe').css({opacity:'1'}); + }); + }); + } + else { + if ($('#presentation>iframe')) { + $('#presentation>iframe').fadeOut(300, function () { + $('#presentation>iframe').css({opacity:'0'}); + $('#largeVideo').fadeIn(300, function() { + $('#largeVideo').css({visibility:'visible'}); + }); + }); + } + } +} + /** * Updates the large video with the given new video source. */ function updateLargeVideo(newSrc, localVideo, vol) { console.log('hover in', newSrc); + + setPresentationVisible(false); + if ($('#largeVideo').attr('src') != newSrc) { document.getElementById('largeVideo').volume = vol; @@ -413,6 +558,9 @@ function resizeLarge() { if (availableWidth < 0 || availableHeight < 0) return; $('#largeVideo').parent().width(availableWidth); $('#largeVideo').parent().height(availableWidth / aspectRatio); + $('#presentation>iframe').width(availableWidth); + $('#presentation>iframe').height(availableWidth / aspectRatio); + resizeThumbnails(); } @@ -466,6 +614,9 @@ $(document).ready(function () { $('#usermsg').autosize(); + // Set the defaults for prompt dialogs. + jQuery.prompt.setDefaults({persistent: false}); + resizeLarge(); $(window).resize(function () { resizeLarge(); @@ -513,15 +664,8 @@ function dump(elem, filename){ var session = connection.jingle.sessions[sid]; if (session.peerconnection && session.peerconnection.updateLog) { // FIXME: should probably be a .dump call - /* well, if I need to modify the output format anyway... - var stats = JSON.parse(JSON.stringify(session.peerconnection.stats)); - Object.keys(stats).forEach(function (name) { - stats[name].values = JSON.stringify(stats[name].values); - }); - */ data["jingle_" + session.sid] = { updateLog: session.peerconnection.updateLog, - stats: session.peerconnection.stats, url: window.location.href} ; } @@ -609,16 +753,16 @@ function openLockDialog() { submit: function(e,v,m,f){ if(v) { - var lockKey = document.getElementById('lockKey'); + var lockKey = document.getElementById('lockKey'); - if (lockKey.value) - { - setSharedKey(lockKey.value); - lockRoom(true); + if (lockKey.value) + { + setSharedKey(lockKey.value); + lockRoom(true); + } } } - } - }); + }); } } @@ -637,11 +781,149 @@ function openLinkDialog() { }); } +/* + * Opens the settings dialog. + */ +function openSettingsDialog() { + $.prompt('

Configure your conference

' + + ' Participants join muted
' + + ' Require nicknames

' + + 'Set a secrect key to lock your room: ', + { + persistent: false, + buttons: { "Save": true , "Cancel": false}, + defaultButton: 1, + loaded: function(event) { + document.getElementById('lockKey').focus(); + }, + submit: function(e,v,m,f){ + if(v) + { + if ($('#initMuted').is(":checked")) + { + // it is checked + } + + if ($('#requireNicknames').is(":checked")) + { + // it is checked + } + /* + var lockKey = document.getElementById('lockKey'); + + if (lockKey.value) + { + setSharedKey(lockKey.value); + lockRoom(true); + } + */ + } + } + }); +} + +/* + * Opens the Prezi dialog, from which the user could choose a presentation to load. + */ +function openPreziDialog() { + var myprezi = connection.emuc.getPrezi(connection.emuc.myroomjid); + if (myprezi) { + $.prompt("Are you sure you would like to remove your Prezi?", + { + title: "Remove Prezi", + buttons: { "Remove": true, "Cancel": false}, + defaultButton: 1, + submit: function(e,v,m,f){ + if(v) + { + connection.emuc.removePreziFromPresence(); + connection.emuc.sendPresence(); + } + } + }); + } + else if (preziPlayer != null) { + $.prompt("Another participant is already sharing a Prezi. This conference allows only one Prezi at a time.", + { + title: "Share a Prezi", + buttons: { "Ok": true}, + defaultButton: 0, + submit: function(e,v,m,f){ + $.prompt.close(); + } + }); + } + else { + var openPreziState = { + state0: { + html: '

Share a Prezi

' + + '', + persistent: false, + buttons: { "Share": true , "Cancel": false}, + defaultButton: 1, + submit: function(e,v,m,f){ + e.preventDefault(); + if(v) + { + var preziUrl = document.getElementById('preziUrl'); + + if (preziUrl.value) + { + if (preziUrl.value.indexOf('http://prezi.com/') != 0 + && preziUrl.value.indexOf('https://prezi.com/') != 0) + { + $.prompt.goToState('state1'); + return false; + } + else { + var presIdTmp = preziUrl.value.substring(preziUrl.value.indexOf("prezi.com/") + 10); + if (presIdTmp.indexOf('/') < 2) { + $.prompt.goToState('state1'); + return false; + } + else { + connection.emuc.addPreziToPresence(preziUrl.value, 0); + connection.emuc.sendPresence(); + $.prompt.close(); + } + } + } + } + else + $.prompt.close(); + } + }, + state1: { + html: '

Share a Prezi

' + + 'Please provide a correct prezi link.', + persistent: false, + buttons: { "Back": true, "Cancel": false }, + defaultButton: 1, + submit:function(e,v,m,f) { + e.preventDefault(); + if(v==0) + $.prompt.close(); + else + $.prompt.goToState('state0'); + } + } + }; + + var myPrompt = jQuery.prompt(openPreziState); + + myPrompt.on('impromptu:loaded', function(e) { + document.getElementById('preziUrl').focus(); + }); + myPrompt.on('impromptu:statechanged', function(e) { + document.getElementById('preziUrl').focus(); + }); + } +} + /* * Locks / unlocks the room. */ function lockRoom(lock) { - console.log("LOCK", sharedKey); if (lock) connection.emuc.lockRoom(sharedKey); else @@ -695,6 +977,11 @@ function openChat() { */ function showToolbar() { $('#toolbar').css({visibility:"visible"}); + if (focus != null) + { +// TODO: Enable settings functionality. Need to uncomment the settings button in index.html. +// $('#settingsButton').css({visibility:"visible"}); + } } /* @@ -745,6 +1032,15 @@ function showFocusIndicator() { } } +function addRemoteVideoContainer(id) { + var container = document.createElement('span'); + container.id = id; + container.className = 'videocontainer'; + var remotes = document.getElementById('remoteVideos'); + remotes.appendChild(container); + return container; +} + /* * Creates the element indicating the focus of the conference. */ diff --git a/css/main.css b/css/main.css index 4dcdd02d4..10e499424 100644 --- a/css/main.css +++ b/css/main.css @@ -21,14 +21,15 @@ html, body{ margin-left: auto; margin-right: auto; } -.videocontainer>video { +#presentation, .videocontainer>video { position: absolute; left: 0px; top: 0px; - z-index: 0; + z-index: 1; width: 100%; height: 100%; } + .videocontainer>span { display: none; /* enable when you want nicks to be shown */ position: absolute; @@ -39,9 +40,6 @@ html, body{ font-size: 10pt; } -#largeVideo { -} - #localVideo { -moz-transform: scaleX(-1); -webkit-transform: scaleX(-1); @@ -168,11 +166,6 @@ html, body{ background-color:#087dba; } -#toolbar { - visibility:hidden; - height:39px; -} - #left { display:block; position: absolute; @@ -207,6 +200,10 @@ html, body{ visibility: hidden; } +#settingsButton { + visibility: hidden; +} + .button { display: inline-block; position: relative; @@ -274,7 +271,7 @@ a.button:hover { z-index:1; } -input, textarea { +input[type='text'], textarea { border: 0px none; display: inline-block; font-size: 14px; @@ -292,7 +289,7 @@ input, textarea { resize: none; /* prevents the user-resizing, adjust to taste */ } -input, textarea:focus { +input[type='text'], textarea:focus { box-shadow: inset 0 0 3px 2px #ACD8F0; /* provides a more style-able replacement to the outline */ } @@ -359,4 +356,22 @@ form { font-size: 11pt; text-shadow: 0px 1px 0px rgba(255,255,255,.3), 0px -1px 0px rgba(0,0,0,.7); border: 0px; + z-index: 2; +} + +#reloadPresentation { + display: none; + position: absolute; + color: #FFFFFF; + top: 0; + right: 0; + padding: 10px 10px; + font-size: 11pt; + cursor: pointer; + background: rgba(0, 0, 0, 0.3); + border-radius: 5px; + background-clip: padding-box; + -webkit-border-radius: 5px; + -webkit-background-clip: padding-box; + z-index: 2; } diff --git a/css/modaldialog.css b/css/modaldialog.css index d328940e1..97afbeb57 100644 --- a/css/modaldialog.css +++ b/css/modaldialog.css @@ -12,8 +12,11 @@ } .jqistates input { + margin: 10px 0; +} + +.jqistates input[type="text"] { width: 100%; - margin: 20px 0; } .jqibuttons button { diff --git a/images/avatarprezi.png b/images/avatarprezi.png new file mode 100644 index 0000000000000000000000000000000000000000..99e23af2d3292512094bdee6bc1e3e3ebd7e3ee0 GIT binary patch literal 8579 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 literal 0 HcmV?d00001 diff --git a/index.html b/index.html index 1062e10b4..0b7adef0e 100644 --- a/index.html +++ b/index.html @@ -6,14 +6,15 @@ - + - + +
@@ -43,8 +50,10 @@
-
- +
+
+
+
diff --git a/libs/prezi_player.js b/libs/prezi_player.js new file mode 100644 index 000000000..dc8e0cc7c --- /dev/null +++ b/libs/prezi_player.js @@ -0,0 +1,259 @@ +(function() { + "use strict"; + var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; }; + + window.PreziPlayer = (function() { + + PreziPlayer.API_VERSION = 1; + PreziPlayer.CURRENT_STEP = 'currentStep'; + PreziPlayer.CURRENT_OBJECT = 'currentObject'; + PreziPlayer.STATUS_LOADING = 'loading'; + PreziPlayer.STATUS_READY = 'ready'; + PreziPlayer.STATUS_CONTENT_READY = 'contentready'; + PreziPlayer.EVENT_CURRENT_STEP = "currentStepChange"; + PreziPlayer.EVENT_CURRENT_OBJECT = "currentObjectChange"; + PreziPlayer.EVENT_STATUS = "statusChange"; + PreziPlayer.EVENT_PLAYING = "isAutoPlayingChange"; + PreziPlayer.EVENT_IS_MOVING = "isMovingChange"; + PreziPlayer.domain = "http://prezi.com"; + PreziPlayer.path = "/player/"; + PreziPlayer.players = {}; + PreziPlayer.binded_methods = ['changesHandler']; + + PreziPlayer.createMultiplePlayers = function(optionArray){ + for(var i=0; iprezi'); + if (presentation.length) + { + var url = presentation.attr('url'); + var current = presentation.find('>current').text(); + console.log('presentation info received from', from, url); + + if (this.preziMap[from] == null) { + this.preziMap[from] = url; + + $(document).trigger('presentationadded.muc', [from, url, current]); + } + else { + $(document).trigger('gotoslide.muc', [from, url, current]); + } + } + else if (this.preziMap[from] != null) { + var url = this.preziMap[from]; + delete this.preziMap[from]; + $(document).trigger('presentationremoved.muc', [from, url]); + } + if ($(pres).find('>x[xmlns="http://jabber.org/protocol/muc#user"]>status[code="201"]').length) { // http://xmpp.org/extensions/xep-0045.html#createroom-instant this.isOwner = true; @@ -110,7 +142,6 @@ Strophe.addConnectionPlugin('emuc', { var formsubmit = $iq({to: ob.roomjid, type: 'set'}).c('query', {xmlns: 'http://jabber.org/protocol/muc#owner'}); formsubmit.c('x', {xmlns: 'jabber:x:data', type: 'submit'}); formsubmit.c('field', {'var': 'FORM_TYPE'}).c('value').t('http://jabber.org/protocol/muc#roomconfig').up().up(); - console.log("THE KEY TO SET", key); formsubmit.c('field', {'var': 'muc#roomconfig_roomsecret'}).c('value').t(key).up().up(); // FIXME: is muc#roomconfig_passwordprotectedroom required? this.connection.sendIQ(formsubmit, @@ -129,6 +160,55 @@ Strophe.addConnectionPlugin('emuc', { console.warn('setting password failed', err); } ); + }, + sendPresence: function () { + var pres = $pres({to: this.presMap['to'] }); + pres.c('x', {xmlns: this.presMap['xns']}).up(); + if (this.presMap['prezins']) { + pres.c('prezi', {xmlns: this.presMap['prezins'], 'url': this.presMap['preziurl']}). + c('current').t(this.presMap['prezicurrent']).up().up(); + } + + if (this.presMap['medians']) + { + pres.c('media', {xmlns: this.presMap['medians']}); + var sourceNumber = 0; + Object.keys(this.presMap).forEach(function (key) { + if (key.indexOf('source') >= 0) { + sourceNumber++; + } + }); + if (sourceNumber > 0) + for (var i = 1; i <= sourceNumber/2; i ++) { + pres.c('source', + {type: this.presMap['source' + i + '_type'], + ssrc: this.presMap['source' + i + '_ssrc']}).up(); + } + } + pres.up(); + connection.send(pres); + }, + addMediaToPresence: function (sourceNumber, mtype, ssrcs) { + if (!this.presMap['medians']) + this.presMap['medians'] = 'http://estos.de/ns/mjs'; + + this.presMap['source' + sourceNumber + '_type'] = mtype; + this.presMap['source' + sourceNumber + '_ssrc'] = ssrcs; + }, + addPreziToPresence: function (url, currentSlide) { + this.presMap['prezins'] = 'http://jitsi.org/jitmeet/prezi'; + this.presMap['preziurl'] = url; + this.presMap['prezicurrent'] = currentSlide; + }, + removePreziFromPresence: function () { + delete this.presMap['prezins']; + delete this.presMap['preziurl']; + delete this.presMap['prezicurrent']; + }, + addCurrentSlideToPresence: function (currentSlide) { + this.presMap['prezicurrent'] = currentSlide; + }, + getPrezi: function (roomjid) { + return this.preziMap[roomjid]; } }); -