From 325af308f53823c7cb328627d34200ac9667b1f3 Mon Sep 17 00:00:00 2001 From: paweldomas Date: Fri, 22 Aug 2014 16:20:33 +0200 Subject: [PATCH] Separates display name and presence status. Triggers separate event for presence status. --- app.js | 9 +++++++- muc.js | 6 +++++ videolayout.js | 60 +++++++++++++++++++++++++++++--------------------- 3 files changed, 49 insertions(+), 26 deletions(-) diff --git a/app.js b/app.js index 4d7828a16..964aecde1 100644 --- a/app.js +++ b/app.js @@ -824,7 +824,7 @@ $(document).bind('presence.muc', function (event, jid, info, pres) { VideoLayout.ensurePeerContainerExists(jid); VideoLayout.setDisplayName( 'participant_' + Strophe.getResourceFromJid(jid), - info.displayName, info.status); + info.displayName); } if (focus !== null && info.displayName !== null) { @@ -832,6 +832,13 @@ $(document).bind('presence.muc', function (event, jid, info, pres) { } }); +$(document).bind('presence.status.muc', function (event, jid, info, pres) { + + VideoLayout.setPresenceStatus( + 'participant_' + Strophe.getResourceFromJid(jid), info.status); + +}); + $(document).bind('passwordrequired.muc', function (event, jid) { console.log('on password required', jid); diff --git a/muc.js b/muc.js index 9ef44de53..ae45b0ee0 100644 --- a/muc.js +++ b/muc.js @@ -131,6 +131,12 @@ Strophe.addConnectionPlugin('emuc', { // Always trigger presence to update bindings console.log('presence change from', from); $(document).trigger('presence.muc', [from, member, pres]); + + // Trigger status message update + if (member.status) { + $(document).trigger('presence.status.muc', [from, member, pres]); + } + return true; }, onPresenceUnavailable: function (pres) { diff --git a/videolayout.js b/videolayout.js index 5665efa3f..d20110e9e 100644 --- a/videolayout.js +++ b/videolayout.js @@ -323,35 +323,11 @@ var VideoLayout = (function (my) { /** * Shows the display name for the given video. */ - my.setDisplayName = function(videoSpanId, displayName, statusMsg) { + my.setDisplayName = function(videoSpanId, displayName) { var nameSpan = $('#' + videoSpanId + '>span.displayname'); var defaultLocalDisplayName = "Me"; var defaultRemoteDisplayName = "Speaker"; - var statusSpan = $('#' + videoSpanId + '>span.status'); - if (!statusSpan.length) - { - //Add status span - statusSpan = document.createElement('span'); - statusSpan.className = 'status'; - statusSpan.id = videoSpanId + '_status'; - $('#' + videoSpanId)[0].appendChild(statusSpan); - - statusSpan = $('#' + videoSpanId + '>span.status'); - } - - // Display status - if (statusMsg && statusMsg.length) - { - $('#' + videoSpanId + '_status').text(statusMsg); - statusSpan.get(0).setAttribute("style", "display:inline-block;"); - } - else - { - // Hide - statusSpan.get(0).setAttribute("style", "display:none;"); - } - // If we already have a display name for this video. if (nameSpan.length > 0) { var nameSpanElement = nameSpan.get(0); @@ -473,6 +449,40 @@ var VideoLayout = (function (my) { } }; + /** + * Shows the presence status message for the given video. + */ + my.setPresenceStatus = function (videoSpanId, statusMsg) { + + if (!$('#' + videoSpanId).length) { + // No container + return; + } + + var nameSpan = $('#' + videoSpanId + '>span.displayname'); + + var statusSpan = $('#' + videoSpanId + '>span.status'); + if (!statusSpan.length) { + //Add status span + statusSpan = document.createElement('span'); + statusSpan.className = 'status'; + statusSpan.id = videoSpanId + '_status'; + $('#' + videoSpanId)[0].appendChild(statusSpan); + + statusSpan = $('#' + videoSpanId + '>span.status'); + } + + // Display status + if (statusMsg && statusMsg.length) { + $('#' + videoSpanId + '_status').text(statusMsg); + statusSpan.get(0).setAttribute("style", "display:inline-block;"); + } + else { + // Hide + statusSpan.get(0).setAttribute("style", "display:none;"); + } + }; + /** * Shows a visual indicator for the focus of the conference. * Currently if we're not the owner of the conference we obtain the focus