Adds a side panel toggler, settings menu, avatars, uuids.
This commit is contained in:
fo
parent
c438676eae
commit
1d4177faeb
62
app.js
62
app.js
|
|
@ -11,7 +11,7 @@ var recordingToken ='';
|
||||||
var roomUrl = null;
|
var roomUrl = null;
|
||||||
var roomName = null;
|
var roomName = null;
|
||||||
var ssrc2jid = {};
|
var ssrc2jid = {};
|
||||||
var mediaStreams = [];
|
var mediaStreams = {};
|
||||||
var bridgeIsDown = false;
|
var bridgeIsDown = false;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -100,8 +100,15 @@ function connect(jid, password) {
|
||||||
}
|
}
|
||||||
connection = new Strophe.Connection(document.getElementById('boshURL').value || config.bosh || '/http-bind');
|
connection = new Strophe.Connection(document.getElementById('boshURL').value || config.bosh || '/http-bind');
|
||||||
|
|
||||||
if (nickname) {
|
var email = SettingsMenu.getEmail();
|
||||||
connection.emuc.addDisplayNameToPresence(nickname);
|
var displayName = SettingsMenu.getDisplayName();
|
||||||
|
if(email) {
|
||||||
|
connection.emuc.addEmailToPresence(email);
|
||||||
|
} else {
|
||||||
|
connection.emuc.addUserIdToPresence(SettingsMenu.getUID());
|
||||||
|
}
|
||||||
|
if(displayName) {
|
||||||
|
connection.emuc.addDisplayNameToPresence(displayName);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (connection.disco) {
|
if (connection.disco) {
|
||||||
|
|
@ -335,7 +342,12 @@ function waitForPresence(data, sid) {
|
||||||
// NOTE(gp) now that we have simulcast, a media stream can have more than 1
|
// NOTE(gp) now that we have simulcast, a media stream can have more than 1
|
||||||
// ssrc. We should probably take that into account in our MediaStream
|
// ssrc. We should probably take that into account in our MediaStream
|
||||||
// wrapper.
|
// wrapper.
|
||||||
mediaStreams.push(new MediaStream(data, sid, thessrc));
|
var mediaStream = new MediaStream(data, sid, thessrc);
|
||||||
|
var jid = data.peerjid || connection.emuc.myroomjid;
|
||||||
|
if(!mediaStreams[jid]) {
|
||||||
|
mediaStreams[jid] = {};
|
||||||
|
}
|
||||||
|
mediaStreams[jid][mediaStream.type] = mediaStream;
|
||||||
|
|
||||||
var container;
|
var container;
|
||||||
var remotes = document.getElementById('remoteVideos');
|
var remotes = document.getElementById('remoteVideos');
|
||||||
|
|
@ -369,6 +381,8 @@ function waitForPresence(data, sid) {
|
||||||
data.stream,
|
data.stream,
|
||||||
data.peerjid,
|
data.peerjid,
|
||||||
thessrc);
|
thessrc);
|
||||||
|
if(isVideo && container.id !== 'mixedstream')
|
||||||
|
videoSrcToSsrc[$(container).find('>video')[0].src] = thessrc;
|
||||||
}
|
}
|
||||||
|
|
||||||
// an attempt to work around https://github.com/jitsi/jitmeet/issues/32
|
// an attempt to work around https://github.com/jitsi/jitmeet/issues/32
|
||||||
|
|
@ -699,7 +713,7 @@ $(document).bind('joined.muc', function (event, jid, info) {
|
||||||
VideoLayout.showFocusIndicator();
|
VideoLayout.showFocusIndicator();
|
||||||
|
|
||||||
// Add myself to the contact list.
|
// Add myself to the contact list.
|
||||||
ContactList.addContact(jid);
|
ContactList.addContact(jid, SettingsMenu.getEmail() || SettingsMenu.getUID());
|
||||||
|
|
||||||
// Once we've joined the muc show the toolbar
|
// Once we've joined the muc show the toolbar
|
||||||
ToolbarToggler.showToolbar();
|
ToolbarToggler.showToolbar();
|
||||||
|
|
@ -721,7 +735,12 @@ $(document).bind('entered.muc', function (event, jid, info, pres) {
|
||||||
console.log('is focus? ' + (focus ? 'true' : 'false'));
|
console.log('is focus? ' + (focus ? 'true' : 'false'));
|
||||||
|
|
||||||
// Add Peer's container
|
// Add Peer's container
|
||||||
VideoLayout.ensurePeerContainerExists(jid);
|
var id = $(pres).find('>userID').text();
|
||||||
|
var email = $(pres).find('>email');
|
||||||
|
if(email.length > 0) {
|
||||||
|
id = email.text();
|
||||||
|
}
|
||||||
|
VideoLayout.ensurePeerContainerExists(jid,id);
|
||||||
|
|
||||||
if(APIConnector.isEnabled() && APIConnector.isEventEnabled("participantJoined"))
|
if(APIConnector.isEnabled() && APIConnector.isEventEnabled("participantJoined"))
|
||||||
{
|
{
|
||||||
|
|
@ -879,6 +898,13 @@ $(document).bind('presence.muc', function (event, jid, info, pres) {
|
||||||
"Jitsi Videobridge is currently unavailable. Please try again later!");
|
"Jitsi Videobridge is currently unavailable. Please try again later!");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var id = $(pres).find('>userID').text();
|
||||||
|
var email = $(pres).find('>email');
|
||||||
|
if(email.length > 0) {
|
||||||
|
id = email.text();
|
||||||
|
}
|
||||||
|
Avatar.setUserAvatar(jid, id);
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
$(document).bind('presence.status.muc', function (event, jid, info, pres) {
|
$(document).bind('presence.status.muc', function (event, jid, info, pres) {
|
||||||
|
|
@ -1358,15 +1384,20 @@ $(document).ready(function () {
|
||||||
"showMethod": "fadeIn",
|
"showMethod": "fadeIn",
|
||||||
"hideMethod": "fadeOut",
|
"hideMethod": "fadeOut",
|
||||||
"reposition": function() {
|
"reposition": function() {
|
||||||
if(Chat.isVisible() || ContactList.isVisible()) {
|
if(PanelToggler.isVisible()) {
|
||||||
$("#toast-container").addClass("toast-bottom-right-center");
|
$("#toast-container").addClass("notification-bottom-right-center");
|
||||||
} else {
|
} else {
|
||||||
$("#toast-container").removeClass("toast-bottom-right-center");
|
$("#toast-container").removeClass("notification-bottom-right-center");
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"newestOnTop": false
|
"newestOnTop": false
|
||||||
}
|
};
|
||||||
|
|
||||||
|
$('#settingsmenu>input').keyup(function(event){
|
||||||
|
if(event.keyCode === 13) {//enter
|
||||||
|
SettingsMenu.update();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -1661,3 +1692,14 @@ function hangup() {
|
||||||
);
|
);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
$(document).on('videomuted.muc', function(event, jid, value) {
|
||||||
|
if(mediaStreams[jid] && mediaStreams[jid][MediaStream.VIDEO_TYPE]) {
|
||||||
|
var stream = mediaStreams[jid][MediaStream.VIDEO_TYPE];
|
||||||
|
var isMuted = (value === "true");
|
||||||
|
if (isMuted != stream.muted) {
|
||||||
|
stream.muted = isMuted;
|
||||||
|
Avatar.showUserAvatar(jid, isMuted);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,138 @@
|
||||||
|
var Avatar = (function(my) {
|
||||||
|
var users = {};
|
||||||
|
var activeSpeakerJid;
|
||||||
|
/**
|
||||||
|
* Sets the user's avatar in the settings menu(if local user), contact list
|
||||||
|
* and thumbnail
|
||||||
|
* @param jid jid of the user
|
||||||
|
* @param id email or userID to be used as a hash
|
||||||
|
*/
|
||||||
|
my.setUserAvatar = function(jid, id) {
|
||||||
|
if(id) {
|
||||||
|
if(users[jid] === id) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
users[jid] = id;
|
||||||
|
}
|
||||||
|
var url = getGravatarUrl(users[jid]);
|
||||||
|
var resourceJid = Strophe.getResourceFromJid(jid);
|
||||||
|
var thumbnail = $('#participant_' + resourceJid);
|
||||||
|
var avatar = $('#avatar_' + resourceJid);
|
||||||
|
|
||||||
|
// set the avatar in the settings menu if it is local user and get the
|
||||||
|
// local video container
|
||||||
|
if(jid === connection.emuc.myroomjid) {
|
||||||
|
$('#avatar').get(0).src = url;
|
||||||
|
thumbnail = $('#localVideoContainer');
|
||||||
|
}
|
||||||
|
|
||||||
|
// set the avatar in the contact list
|
||||||
|
var contact = $('#' + resourceJid + '>img');
|
||||||
|
if(contact && contact.length > 0) {
|
||||||
|
contact.get(0).src = url;
|
||||||
|
}
|
||||||
|
|
||||||
|
// set the avatar in the thumbnail
|
||||||
|
if(avatar && avatar.length > 0) {
|
||||||
|
avatar[0].src = url;
|
||||||
|
} else {
|
||||||
|
if (thumbnail && thumbnail.length > 0) {
|
||||||
|
avatar = document.createElement('img');
|
||||||
|
avatar.id = 'avatar_' + resourceJid;
|
||||||
|
avatar.className = 'userAvatar';
|
||||||
|
avatar.src = url;
|
||||||
|
thumbnail.append(avatar);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//if the user is the current active speaker - update the active speaker
|
||||||
|
// avatar
|
||||||
|
if(jid === activeSpeakerJid) {
|
||||||
|
Avatar.updateActiveSpeakerAvatarSrc(jid);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Hides or shows the user's avatar
|
||||||
|
* @param jid jid of the user
|
||||||
|
* @param show whether we should show the avatar or not
|
||||||
|
* video because there is no dominant speaker and no focused speaker
|
||||||
|
*/
|
||||||
|
my.showUserAvatar = function(jid, show) {
|
||||||
|
if(users[jid]) {
|
||||||
|
var resourceJid = Strophe.getResourceFromJid(jid);
|
||||||
|
var video = $('#participant_' + resourceJid + '>video');
|
||||||
|
var avatar = $('#avatar_' + resourceJid);
|
||||||
|
|
||||||
|
if(jid === connection.emuc.myroomjid) {
|
||||||
|
video = $('#localVideoWrapper>video');
|
||||||
|
}
|
||||||
|
if(show === undefined || show === null) {
|
||||||
|
show = isUserMuted(jid);
|
||||||
|
}
|
||||||
|
|
||||||
|
//if the user is the currently focused, the dominant speaker or if
|
||||||
|
//there is no focused and no dominant speaker
|
||||||
|
if (activeSpeakerJid === jid) {
|
||||||
|
setVisibility($("#largeVideo"), !show);
|
||||||
|
setVisibility($('#activeSpeakerAvatar'), show);
|
||||||
|
setVisibility(avatar, false);
|
||||||
|
setVisibility(video, false);
|
||||||
|
} else {
|
||||||
|
if (video && video.length > 0) {
|
||||||
|
setVisibility(video, !show);
|
||||||
|
setVisibility(avatar, show);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Updates the src of the active speaker avatar
|
||||||
|
* @param jid of the current active speaker
|
||||||
|
*/
|
||||||
|
my.updateActiveSpeakerAvatarSrc = function(jid) {
|
||||||
|
if(!jid) {
|
||||||
|
if (focusedVideoSrc) {
|
||||||
|
jid = getJidFromVideoSrc(focusedVideoSrc);
|
||||||
|
} else {
|
||||||
|
jid = connection.emuc.findJidFromResource(
|
||||||
|
VideoLayout.getDominantSpeakerResourceJid());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
var avatar = $("#activeSpeakerAvatar")[0];
|
||||||
|
var url = getGravatarUrl(users[jid],
|
||||||
|
interfaceConfig.ACTIVE_SPEAKER_AVATAR_SIZE);
|
||||||
|
if(jid === activeSpeakerJid && avatar.src === url) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
activeSpeakerJid = jid;
|
||||||
|
var isMuted = isUserMuted(jid);
|
||||||
|
if(jid && isMuted !== null) {
|
||||||
|
avatar.src = url;
|
||||||
|
setVisibility($("#largeVideo"), !isMuted);
|
||||||
|
Avatar.showUserAvatar(jid, isMuted);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function setVisibility(selector, show) {
|
||||||
|
if (selector && selector.length > 0) {
|
||||||
|
selector.css("visibility", show ? "visible" : "hidden");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function isUserMuted(jid) {
|
||||||
|
if(!mediaStreams[jid] || !mediaStreams[jid][MediaStream.VIDEO_TYPE]) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return mediaStreams[jid][MediaStream.VIDEO_TYPE].muted;
|
||||||
|
}
|
||||||
|
|
||||||
|
function getGravatarUrl(email, size) {
|
||||||
|
return 'https://www.gravatar.com/avatar/' +
|
||||||
|
(email ? MD5.hexdigest(email.trim().toLowerCase()) : SettingsMenu.getUID()) +
|
||||||
|
"?d=retro&size=" + (size || "30");
|
||||||
|
}
|
||||||
|
|
||||||
|
return my;
|
||||||
|
}(Avatar || {}));
|
||||||
|
|
@ -1,30 +1,10 @@
|
||||||
var BottomToolbar = (function (my) {
|
var BottomToolbar = (function (my) {
|
||||||
my.toggleChat = function() {
|
my.toggleChat = function() {
|
||||||
if (ContactList.isVisible()) {
|
PanelToggler.toggleChat();
|
||||||
buttonClick("#contactListButton", "active");
|
|
||||||
$('#contactlist').css('z-index', 4);
|
|
||||||
setTimeout(function() {
|
|
||||||
$('#contactlist').css('display', 'none');
|
|
||||||
$('#contactlist').css('z-index', 5);
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
|
|
||||||
Chat.toggleChat();
|
|
||||||
|
|
||||||
buttonClick("#chatBottomButton", "active");
|
|
||||||
};
|
};
|
||||||
|
|
||||||
my.toggleContactList = function() {
|
my.toggleContactList = function() {
|
||||||
if (Chat.isVisible()) {
|
PanelToggler.toggleContactList();
|
||||||
buttonClick("#chatBottomButton", "active");
|
|
||||||
setTimeout(function() {
|
|
||||||
$('#chatspace').css('display', 'none');
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
|
|
||||||
buttonClick("#contactListButton", "active");
|
|
||||||
|
|
||||||
ContactList.toggleContactList();
|
|
||||||
};
|
};
|
||||||
|
|
||||||
my.toggleFilmStrip = function() {
|
my.toggleFilmStrip = function() {
|
||||||
|
|
|
||||||
142
chat.js
142
chat.js
|
|
@ -57,7 +57,7 @@ var Chat = (function (my) {
|
||||||
|
|
||||||
var onTextAreaResize = function () {
|
var onTextAreaResize = function () {
|
||||||
resizeChatConversation();
|
resizeChatConversation();
|
||||||
scrollChatToBottom();
|
Chat.scrollChatToBottom();
|
||||||
};
|
};
|
||||||
$('#usermsg').autosize({callback: onTextAreaResize});
|
$('#usermsg').autosize({callback: onTextAreaResize});
|
||||||
|
|
||||||
|
|
@ -144,112 +144,7 @@ var Chat = (function (my) {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
|
||||||
* Opens / closes the chat area.
|
|
||||||
*/
|
|
||||||
my.toggleChat = function () {
|
|
||||||
var chatspace = $('#chatspace');
|
|
||||||
var videospace = $('#videospace');
|
|
||||||
|
|
||||||
var chatSize = (Chat.isVisible()) ? [0, 0] : Chat.getChatSize();
|
|
||||||
var videospaceWidth = window.innerWidth - chatSize[0];
|
|
||||||
var videospaceHeight = window.innerHeight;
|
|
||||||
var videoSize
|
|
||||||
= getVideoSize(null, null, videospaceWidth, videospaceHeight);
|
|
||||||
var videoWidth = videoSize[0];
|
|
||||||
var videoHeight = videoSize[1];
|
|
||||||
var videoPosition = getVideoPosition(videoWidth,
|
|
||||||
videoHeight,
|
|
||||||
videospaceWidth,
|
|
||||||
videospaceHeight);
|
|
||||||
var horizontalIndent = videoPosition[0];
|
|
||||||
var verticalIndent = videoPosition[1];
|
|
||||||
|
|
||||||
var thumbnailSize = VideoLayout.calculateThumbnailSize(videospaceWidth);
|
|
||||||
var thumbnailsWidth = thumbnailSize[0];
|
|
||||||
var thumbnailsHeight = thumbnailSize[1];
|
|
||||||
var completeFunction = Chat.isVisible() ?
|
|
||||||
function() {} : function () {
|
|
||||||
scrollChatToBottom();
|
|
||||||
chatspace.trigger('shown');
|
|
||||||
};
|
|
||||||
|
|
||||||
videospace.animate({right: chatSize[0],
|
|
||||||
width: videospaceWidth,
|
|
||||||
height: videospaceHeight},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500,
|
|
||||||
complete: completeFunction});
|
|
||||||
|
|
||||||
$('#remoteVideos').animate({height: thumbnailsHeight},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500});
|
|
||||||
|
|
||||||
$('#remoteVideos>span').animate({height: thumbnailsHeight,
|
|
||||||
width: thumbnailsWidth},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500,
|
|
||||||
complete: function() {
|
|
||||||
$(document).trigger(
|
|
||||||
"remotevideo.resized",
|
|
||||||
[thumbnailsWidth,
|
|
||||||
thumbnailsHeight]);
|
|
||||||
}});
|
|
||||||
|
|
||||||
$('#largeVideoContainer').animate({ width: videospaceWidth,
|
|
||||||
height: videospaceHeight},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#largeVideo').animate({ width: videoWidth,
|
|
||||||
height: videoHeight,
|
|
||||||
top: verticalIndent,
|
|
||||||
bottom: verticalIndent,
|
|
||||||
left: horizontalIndent,
|
|
||||||
right: horizontalIndent},
|
|
||||||
{ queue: false,
|
|
||||||
duration: 500
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
if (Chat.isVisible()) {
|
|
||||||
$("#toast-container").animate({right: '5px'},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500});
|
|
||||||
chatspace.hide("slide", { direction: "right",
|
|
||||||
queue: false,
|
|
||||||
duration: 500});
|
|
||||||
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
// Undock the toolbar when the chat is shown and if we're in a
|
|
||||||
// video mode.
|
|
||||||
if (VideoLayout.isLargeVideoVisible()) {
|
|
||||||
ToolbarToggler.dockToolbar(false);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
$("#toast-container").animate({right: (chatSize[0] + 5) + 'px'},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500});
|
|
||||||
chatspace.show("slide", { direction: "right",
|
|
||||||
queue: false,
|
|
||||||
duration: 500,
|
|
||||||
complete: function () {
|
|
||||||
// Request the focus in the nickname field or the chat input field.
|
|
||||||
if ($('#nickname').css('visibility') === 'visible') {
|
|
||||||
$('#nickinput').focus();
|
|
||||||
} else {
|
|
||||||
$('#usermsg').focus();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
Chat.resizeChat();
|
|
||||||
}
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Sets the chat conversation mode.
|
* Sets the chat conversation mode.
|
||||||
|
|
@ -268,7 +163,7 @@ var Chat = (function (my) {
|
||||||
* Resizes the chat area.
|
* Resizes the chat area.
|
||||||
*/
|
*/
|
||||||
my.resizeChat = function () {
|
my.resizeChat = function () {
|
||||||
var chatSize = Chat.getChatSize();
|
var chatSize = PanelToggler.getPanelSize();
|
||||||
|
|
||||||
$('#chatspace').width(chatSize[0]);
|
$('#chatspace').width(chatSize[0]);
|
||||||
$('#chatspace').height(chatSize[1]);
|
$('#chatspace').height(chatSize[1]);
|
||||||
|
|
@ -276,20 +171,6 @@ var Chat = (function (my) {
|
||||||
resizeChatConversation();
|
resizeChatConversation();
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
|
||||||
* Returns the size of the chat.
|
|
||||||
*/
|
|
||||||
my.getChatSize = function () {
|
|
||||||
var availableHeight = window.innerHeight;
|
|
||||||
var availableWidth = window.innerWidth;
|
|
||||||
|
|
||||||
var chatWidth = 200;
|
|
||||||
if (availableWidth * 0.2 < 200)
|
|
||||||
chatWidth = availableWidth * 0.2;
|
|
||||||
|
|
||||||
return [chatWidth, availableHeight];
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Indicates if the chat is currently visible.
|
* Indicates if the chat is currently visible.
|
||||||
*/
|
*/
|
||||||
|
|
@ -309,6 +190,16 @@ var Chat = (function (my) {
|
||||||
$('#usermsg').focus();
|
$('#usermsg').focus();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Scrolls chat to the bottom.
|
||||||
|
*/
|
||||||
|
my.scrollChatToBottom = function() {
|
||||||
|
setTimeout(function () {
|
||||||
|
$('#chatconversation').scrollTop(
|
||||||
|
$('#chatconversation')[0].scrollHeight);
|
||||||
|
}, 5);
|
||||||
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Adds the smileys container to the chat
|
* Adds the smileys container to the chat
|
||||||
*/
|
*/
|
||||||
|
|
@ -426,15 +317,6 @@ var Chat = (function (my) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Scrolls chat to the bottom.
|
|
||||||
*/
|
|
||||||
function scrollChatToBottom() {
|
|
||||||
setTimeout(function () {
|
|
||||||
$('#chatconversation').scrollTop(
|
|
||||||
$('#chatconversation')[0].scrollHeight);
|
|
||||||
}, 5);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Returns the current time in the format it is shown to the user
|
* Returns the current time in the format it is shown to the user
|
||||||
|
|
|
||||||
194
contact_list.js
194
contact_list.js
|
|
@ -20,22 +20,24 @@ var ContactList = (function (my) {
|
||||||
* Adds a contact for the given peerJid if such doesn't yet exist.
|
* Adds a contact for the given peerJid if such doesn't yet exist.
|
||||||
*
|
*
|
||||||
* @param peerJid the peerJid corresponding to the contact
|
* @param peerJid the peerJid corresponding to the contact
|
||||||
|
* @param id the user's email or userId used to get the user's avatar
|
||||||
*/
|
*/
|
||||||
my.ensureAddContact = function(peerJid) {
|
my.ensureAddContact = function(peerJid, id) {
|
||||||
var resourceJid = Strophe.getResourceFromJid(peerJid);
|
var resourceJid = Strophe.getResourceFromJid(peerJid);
|
||||||
|
|
||||||
var contact = $('#contactlist>ul>li[id="' + resourceJid + '"]');
|
var contact = $('#contactlist>ul>li[id="' + resourceJid + '"]');
|
||||||
|
|
||||||
if (!contact || contact.length <= 0)
|
if (!contact || contact.length <= 0)
|
||||||
ContactList.addContact(peerJid);
|
ContactList.addContact(peerJid,id);
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Adds a contact for the given peer jid.
|
* Adds a contact for the given peer jid.
|
||||||
*
|
*
|
||||||
* @param peerJid the jid of the contact to add
|
* @param peerJid the jid of the contact to add
|
||||||
|
* @param id the email or userId of the user
|
||||||
*/
|
*/
|
||||||
my.addContact = function(peerJid) {
|
my.addContact = function(peerJid, id) {
|
||||||
var resourceJid = Strophe.getResourceFromJid(peerJid);
|
var resourceJid = Strophe.getResourceFromJid(peerJid);
|
||||||
|
|
||||||
var contactlist = $('#contactlist>ul');
|
var contactlist = $('#contactlist>ul');
|
||||||
|
|
@ -51,7 +53,7 @@ var ContactList = (function (my) {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
newContact.appendChild(createAvatar());
|
newContact.appendChild(createAvatar(id));
|
||||||
newContact.appendChild(createDisplayNameParagraph("Participant"));
|
newContact.appendChild(createDisplayNameParagraph("Participant"));
|
||||||
|
|
||||||
var clElement = contactlist.get(0);
|
var clElement = contactlist.get(0);
|
||||||
|
|
@ -87,145 +89,7 @@ var ContactList = (function (my) {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
my.setVisualNotification = function(show, stopGlowingIn) {
|
||||||
* Opens / closes the contact list area.
|
|
||||||
*/
|
|
||||||
my.toggleContactList = function () {
|
|
||||||
var contactlist = $('#contactlist');
|
|
||||||
var videospace = $('#videospace');
|
|
||||||
|
|
||||||
var chatSize = (ContactList.isVisible()) ? [0, 0] : Chat.getChatSize();
|
|
||||||
var videospaceWidth = window.innerWidth - chatSize[0];
|
|
||||||
var videospaceHeight = window.innerHeight;
|
|
||||||
var videoSize
|
|
||||||
= getVideoSize(null, null, videospaceWidth, videospaceHeight);
|
|
||||||
var videoWidth = videoSize[0];
|
|
||||||
var videoHeight = videoSize[1];
|
|
||||||
var videoPosition = getVideoPosition(videoWidth,
|
|
||||||
videoHeight,
|
|
||||||
videospaceWidth,
|
|
||||||
videospaceHeight);
|
|
||||||
var horizontalIndent = videoPosition[0];
|
|
||||||
var verticalIndent = videoPosition[1];
|
|
||||||
|
|
||||||
var thumbnailSize = VideoLayout.calculateThumbnailSize(videospaceWidth);
|
|
||||||
var thumbnailsWidth = thumbnailSize[0];
|
|
||||||
var thumbnailsHeight = thumbnailSize[1];
|
|
||||||
var completeFunction = ContactList.isVisible() ?
|
|
||||||
function() {} : function () { contactlist.trigger('shown');};
|
|
||||||
|
|
||||||
videospace.animate({right: chatSize[0],
|
|
||||||
width: videospaceWidth,
|
|
||||||
height: videospaceHeight},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500,
|
|
||||||
complete: completeFunction
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#remoteVideos').animate({height: thumbnailsHeight},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500});
|
|
||||||
|
|
||||||
$('#remoteVideos>span').animate({height: thumbnailsHeight,
|
|
||||||
width: thumbnailsWidth},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500,
|
|
||||||
complete: function() {
|
|
||||||
$(document).trigger(
|
|
||||||
"remotevideo.resized",
|
|
||||||
[thumbnailsWidth,
|
|
||||||
thumbnailsHeight]);
|
|
||||||
}});
|
|
||||||
|
|
||||||
$('#largeVideoContainer').animate({ width: videospaceWidth,
|
|
||||||
height: videospaceHeight},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#largeVideo').animate({ width: videoWidth,
|
|
||||||
height: videoHeight,
|
|
||||||
top: verticalIndent,
|
|
||||||
bottom: verticalIndent,
|
|
||||||
left: horizontalIndent,
|
|
||||||
right: horizontalIndent},
|
|
||||||
{ queue: false,
|
|
||||||
duration: 500
|
|
||||||
});
|
|
||||||
|
|
||||||
if (ContactList.isVisible()) {
|
|
||||||
$("#toast-container").animate({right: '12px'},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500});
|
|
||||||
$('#contactlist').hide("slide", { direction: "right",
|
|
||||||
queue: false,
|
|
||||||
duration: 500});
|
|
||||||
} else {
|
|
||||||
// Undock the toolbar when the chat is shown and if we're in a
|
|
||||||
// video mode.
|
|
||||||
if (VideoLayout.isLargeVideoVisible())
|
|
||||||
ToolbarToggler.dockToolbar(false);
|
|
||||||
|
|
||||||
|
|
||||||
$("#toast-container").animate({right: '212px'},
|
|
||||||
{queue: false,
|
|
||||||
duration: 500});
|
|
||||||
$('#contactlist').show("slide", { direction: "right",
|
|
||||||
queue: false,
|
|
||||||
duration: 500});
|
|
||||||
|
|
||||||
//stop the glowing of the contact list icon
|
|
||||||
setVisualNotification(false);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Updates the number of participants in the contact list button and sets
|
|
||||||
* the glow
|
|
||||||
* @param delta indicates whether a new user has joined (1) or someone has
|
|
||||||
* left(-1)
|
|
||||||
*/
|
|
||||||
function updateNumberOfParticipants(delta) {
|
|
||||||
//when the user is alone we don't show the number of participants
|
|
||||||
if(numberOfContacts === 0) {
|
|
||||||
$("#numberOfParticipants").text('');
|
|
||||||
numberOfContacts += delta;
|
|
||||||
} else if(numberOfContacts !== 0 && !ContactList.isVisible()) {
|
|
||||||
setVisualNotification(true);
|
|
||||||
numberOfContacts += delta;
|
|
||||||
$("#numberOfParticipants").text(numberOfContacts);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Creates the avatar element.
|
|
||||||
*
|
|
||||||
* @return the newly created avatar element
|
|
||||||
*/
|
|
||||||
function createAvatar() {
|
|
||||||
var avatar = document.createElement('i');
|
|
||||||
avatar.className = "icon-avatar avatar";
|
|
||||||
|
|
||||||
return avatar;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Creates the display name paragraph.
|
|
||||||
*
|
|
||||||
* @param displayName the display name to set
|
|
||||||
*/
|
|
||||||
function createDisplayNameParagraph(displayName) {
|
|
||||||
var p = document.createElement('p');
|
|
||||||
p.innerText = displayName;
|
|
||||||
|
|
||||||
return p;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Shows/hides a visual notification, indicating that a new user has joined
|
|
||||||
* the conference.
|
|
||||||
*/
|
|
||||||
function setVisualNotification(show, stopGlowingIn) {
|
|
||||||
var glower = $('#contactListButton');
|
var glower = $('#contactListButton');
|
||||||
function stopGlowing() {
|
function stopGlowing() {
|
||||||
window.clearInterval(notificationInterval);
|
window.clearInterval(notificationInterval);
|
||||||
|
|
@ -247,8 +111,52 @@ var ContactList = (function (my) {
|
||||||
if(stopGlowingIn) {
|
if(stopGlowingIn) {
|
||||||
setTimeout(stopGlowing, stopGlowingIn);
|
setTimeout(stopGlowing, stopGlowingIn);
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Updates the number of participants in the contact list button and sets
|
||||||
|
* the glow
|
||||||
|
* @param delta indicates whether a new user has joined (1) or someone has
|
||||||
|
* left(-1)
|
||||||
|
*/
|
||||||
|
function updateNumberOfParticipants(delta) {
|
||||||
|
//when the user is alone we don't show the number of participants
|
||||||
|
if(numberOfContacts === 0) {
|
||||||
|
$("#numberOfParticipants").text('');
|
||||||
|
numberOfContacts += delta;
|
||||||
|
} else if(numberOfContacts !== 0 && !ContactList.isVisible()) {
|
||||||
|
ContactList.setVisualNotification(true);
|
||||||
|
numberOfContacts += delta;
|
||||||
|
$("#numberOfParticipants").text(numberOfContacts);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Creates the avatar element.
|
||||||
|
*
|
||||||
|
* @return the newly created avatar element
|
||||||
|
*/
|
||||||
|
function createAvatar(id) {
|
||||||
|
var avatar = document.createElement('img');
|
||||||
|
avatar.className = "icon-avatar avatar";
|
||||||
|
avatar.src = "https://www.gravatar.com/avatar/" + id + "?d=retro&size=30";
|
||||||
|
|
||||||
|
return avatar;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Creates the display name paragraph.
|
||||||
|
*
|
||||||
|
* @param displayName the display name to set
|
||||||
|
*/
|
||||||
|
function createDisplayNameParagraph(displayName) {
|
||||||
|
var p = document.createElement('p');
|
||||||
|
p.innerText = displayName;
|
||||||
|
|
||||||
|
return p;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Indicates that the display name has changed.
|
* Indicates that the display name has changed.
|
||||||
*/
|
*/
|
||||||
|
|
|
||||||
|
|
@ -34,6 +34,7 @@
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
font-size: 22pt;
|
font-size: 22pt;
|
||||||
|
border-radius: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#contactlist .clickable {
|
#contactlist .clickable {
|
||||||
|
|
|
||||||
|
|
@ -113,3 +113,7 @@
|
||||||
line-height: normal;
|
line-height: normal;
|
||||||
content: "\e61a";
|
content: "\e61a";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.icon-settings:before {
|
||||||
|
content: "\e61b";
|
||||||
|
}
|
||||||
|
|
@ -13,8 +13,7 @@ html, body{
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
#chatspace,
|
.right-panel {
|
||||||
#contactlist {
|
|
||||||
display:none;
|
display:none;
|
||||||
position:absolute;
|
position:absolute;
|
||||||
float: right;
|
float: right;
|
||||||
|
|
@ -38,10 +37,6 @@ html, body{
|
||||||
display:none;
|
display:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
#settingsButton {
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.toolbar_span {
|
.toolbar_span {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,45 @@
|
||||||
|
#settingsmenu {
|
||||||
|
background: black;
|
||||||
|
color: #00ccff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#settingsmenu input {
|
||||||
|
margin-top: 10px;
|
||||||
|
margin-left: 10%;
|
||||||
|
width: 80%;
|
||||||
|
font-size: 14px;
|
||||||
|
background: #3a3a3a;
|
||||||
|
border: none;
|
||||||
|
box-shadow: none;
|
||||||
|
color: #a7a7a7;
|
||||||
|
}
|
||||||
|
|
||||||
|
#settingsmenu .arrow-up {
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-left: 5px solid transparent;
|
||||||
|
border-right: 5px solid transparent;
|
||||||
|
border-bottom: 5px solid #3a3a3a;
|
||||||
|
position: relative;
|
||||||
|
top: 10px;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
#settingsmenu button {
|
||||||
|
width: 36%;
|
||||||
|
left: 32%;
|
||||||
|
padding: 0;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#settingsmenu #avatar {
|
||||||
|
width: 24%;
|
||||||
|
left: 38%;
|
||||||
|
border-radius: 25px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
#settingsmenu .icon-settings {
|
||||||
|
padding: 34px;
|
||||||
|
}
|
||||||
|
|
@ -35,7 +35,9 @@
|
||||||
|
|
||||||
#remoteVideos .videocontainer {
|
#remoteVideos .videocontainer {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
background-image:url(../images/avatar1.png);
|
background-color: black;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: 45;
|
||||||
background-size: contain;
|
background-size: contain;
|
||||||
border-radius:8px;
|
border-radius:8px;
|
||||||
border: 2px solid #212425;
|
border: 2px solid #212425;
|
||||||
|
|
@ -115,10 +117,6 @@
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dominantspeaker {
|
|
||||||
background: #000 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#etherpad,
|
#etherpad,
|
||||||
#presentation {
|
#presentation {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
@ -378,3 +376,19 @@
|
||||||
#mixedstream {
|
#mixedstream {
|
||||||
display:none !important;
|
display:none !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#activeSpeakerAvatar {
|
||||||
|
visibility: hidden;
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
margin: auto;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.userAvatar {
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
left: 35px;
|
||||||
|
border-radius: 200px;
|
||||||
|
}
|
||||||
|
|
|
||||||
BIN
fonts/jitsi.eot
BIN
fonts/jitsi.eot
Binary file not shown.
|
|
@ -34,4 +34,5 @@
|
||||||
<glyph unicode="" d="M797.086 112.301c-0.059 0.163-0.119 0.328-0.16 0.485-71.399-45.638-151.782-69.931-234.023-69.931-0.013 0-0.021 0-0.028 0-122.52 0-237.501 52.772-315.469 144.741-99.778 117.698-134.252 329.954-73.022 427.789 4.004-1.662 7.875-3.233 11.68-4.773 13.585-5.511 26.413-10.716 42.305-19.096 6.063-3.202 12.338-4.812 18.673-4.812 11.714 0 22.6 5.648 29.848 15.486 7.815 10.617 10.313 24.778 6.538 36.951l-3.525 11.41c-10.687 34.59-21.723 70.354-34.211 105.078-9.983 27.765-22.399 62.327-59.226 62.327-12.057 0-26.037-3.656-46.73-12.204-44.294-18.319-71.058-29.961-114.534-49.81-15.102-6.887-25.234-22.698-25.203-39.343 0.028-15.842 8.992-29.337 23.975-36.115 18.208-8.257 30.536-13.716 43.468-19.447l10.687-4.753c-101.938-259.102 24.803-526.458 211.314-639.212 83.497-50.474 178.5-77.14 274.769-77.14h0.041c102.72 0 205.561 31.099 284.501 85.198-31.729 28.803-45.566 69.167-51.671 87.171zM1098.203 210.090c-18.113 8.577-30.356 14.258-43.221 20.244l-10.496 4.892c106.448 257.268-15.569 526.801-200.067 642.788-85.36 53.663-183.123 82.032-282.716 82.032-104.848 0-206.41-30.593-285.967-86.165l-5.385-3.764c31.597-27.564 45.86-66.788 52.917-86.41 72.926 47.94 155.675 73.409 239.895 73.409 125.407 0 242.142-54.785 320.294-150.316 97.683-119.447 128.439-332.255 65.498-429.015-3.989 1.736-7.815 3.385-11.624 4.998-13.471 5.759-26.204 11.18-41.954 19.821-6.203 3.424-12.645 5.155-19.212 5.155-11.585 0-22.399-5.558-29.69-15.267-7.813-10.434-10.478-24.432-6.966-36.515l3.279-11.301c10.096-34.845 20.531-70.857 32.412-105.842 9.588-28.238 21.514-63.382 59.179-63.382 11.843 0 25.577 3.424 45.881 11.399 44.351 17.439 71.319 28.601 115.409 47.777 15.19 6.623 25.601 22.252 25.859 38.894 0.281 15.822-8.445 29.499-23.325 36.569z" horiz-adv-x="1122" />
|
<glyph unicode="" d="M797.086 112.301c-0.059 0.163-0.119 0.328-0.16 0.485-71.399-45.638-151.782-69.931-234.023-69.931-0.013 0-0.021 0-0.028 0-122.52 0-237.501 52.772-315.469 144.741-99.778 117.698-134.252 329.954-73.022 427.789 4.004-1.662 7.875-3.233 11.68-4.773 13.585-5.511 26.413-10.716 42.305-19.096 6.063-3.202 12.338-4.812 18.673-4.812 11.714 0 22.6 5.648 29.848 15.486 7.815 10.617 10.313 24.778 6.538 36.951l-3.525 11.41c-10.687 34.59-21.723 70.354-34.211 105.078-9.983 27.765-22.399 62.327-59.226 62.327-12.057 0-26.037-3.656-46.73-12.204-44.294-18.319-71.058-29.961-114.534-49.81-15.102-6.887-25.234-22.698-25.203-39.343 0.028-15.842 8.992-29.337 23.975-36.115 18.208-8.257 30.536-13.716 43.468-19.447l10.687-4.753c-101.938-259.102 24.803-526.458 211.314-639.212 83.497-50.474 178.5-77.14 274.769-77.14h0.041c102.72 0 205.561 31.099 284.501 85.198-31.729 28.803-45.566 69.167-51.671 87.171zM1098.203 210.090c-18.113 8.577-30.356 14.258-43.221 20.244l-10.496 4.892c106.448 257.268-15.569 526.801-200.067 642.788-85.36 53.663-183.123 82.032-282.716 82.032-104.848 0-206.41-30.593-285.967-86.165l-5.385-3.764c31.597-27.564 45.86-66.788 52.917-86.41 72.926 47.94 155.675 73.409 239.895 73.409 125.407 0 242.142-54.785 320.294-150.316 97.683-119.447 128.439-332.255 65.498-429.015-3.989 1.736-7.815 3.385-11.624 4.998-13.471 5.759-26.204 11.18-41.954 19.821-6.203 3.424-12.645 5.155-19.212 5.155-11.585 0-22.399-5.558-29.69-15.267-7.813-10.434-10.478-24.432-6.966-36.515l3.279-11.301c10.096-34.845 20.531-70.857 32.412-105.842 9.588-28.238 21.514-63.382 59.179-63.382 11.843 0 25.577 3.424 45.881 11.399 44.351 17.439 71.319 28.601 115.409 47.777 15.19 6.623 25.601 22.252 25.859 38.894 0.281 15.822-8.445 29.499-23.325 36.569z" horiz-adv-x="1122" />
|
||||||
<glyph unicode="" d="M46.993 961.7c461.234 0 553.793 0 1015.024 0 35.919 0 53.356-25.959 53.356-57.959-0.581-303.259-0.325-606.488-0.449-909.809 0-43.984-13.203-57.058-57.703-57.058-443.072-0.126-556.453-0.126-999.553 0-44.534 0-57.799 13.009-57.799 57.058-0.098 303.257 0.485 608.072-0.093 911.329-0.034 26.21 11.301 53.761 47.217 56.439zM311.405 450.298c0-119.045-0.072-172.168 0.057-291.249 0.036-50.043 11.208-61.050 62.12-61.050 233.352 0 137.075 0 370.522 0 47.075 0 59.249 11.982 59.249 58.095 0.126 239.111 0.126 346.338 0 585.389 0 48.138-10.687 58.991-57.768 58.991-235.323 0.101-140.844 0.101-376.157 0-47.044 0-57.93-11.043-57.966-58.89-0.129-119.109-0.057-172.209-0.057-291.287zM153.944 838.566c-74.929-0.062-66.687 5.958-66.845-66.685-0.201-63.95-7.054-63.534 62.528-63.372 72.999 0.194 67.201-3.764 67.302 67.554 0 67.722 4.087 62.595-62.985 62.502zM963.644 838.566c-71.159-0.034-65.56 6.185-65.751-65.364-0.129-67.302-4.508-64.693 64.528-64.693 73.089 0 65.299-2.031 65.299 66.238-0.003 68.646 6.956 63.911-64.076 63.818zM216.828 122.408c0.359 73.094 4.639 66.914-67.358 67.17-68.104 0.191-62.569 2.763-62.407-63.31 0.129-73.476-6.954-66.52 67.074-66.649 66.042-0.065 63.142-6.056 62.691 62.789zM1027.718 124.4c0.134 68.334 6.443 65.304-63.297 65.178-70.132-0.132-66.656 5.793-66.527-65.304 0.129-70.645-4.384-64.721 63.756-64.657 71.995 0.132 66.202-6.698 66.068 64.783zM1027.718 342.077c0 70.55 7.219 66.842-67.485 66.522-0.898 0-1.873 0-2.838 0-59.375 0-59.375 0-59.375-58.023 0-77.922-6.443-69.936 69.293-70.196 66.076-0.387 60.539-3.091 60.405 61.697zM151.307 489.873c68.295-0.163 65.815-5.568 65.624 62.982-0.194 71.128 4.895 64.917-66.014 65.010-69.905 0.101-63.813 4.704-63.885-63.978-0.062-67.431-5.7-64.463 64.275-64.014zM961.263 489.873c72.511-0.258 66.589-4.603 66.455 64.494 0 68.558 6.185 63.537-64.267 63.498-70.196-0.028-65.686 6.053-65.498-65.493 0.132-62.5 0.067-62.5 63.31-62.5zM150.399 280.38c71.004 0 66.659-6.567 66.466 64.528-0.163 63.694-0.036 63.501-65.013 63.756-70.805 0.258-64.822 2.673-64.822-63.756 0.036-69.167-5.919-64.788 63.369-64.528z" horiz-adv-x="1115" />
|
<glyph unicode="" d="M46.993 961.7c461.234 0 553.793 0 1015.024 0 35.919 0 53.356-25.959 53.356-57.959-0.581-303.259-0.325-606.488-0.449-909.809 0-43.984-13.203-57.058-57.703-57.058-443.072-0.126-556.453-0.126-999.553 0-44.534 0-57.799 13.009-57.799 57.058-0.098 303.257 0.485 608.072-0.093 911.329-0.034 26.21 11.301 53.761 47.217 56.439zM311.405 450.298c0-119.045-0.072-172.168 0.057-291.249 0.036-50.043 11.208-61.050 62.12-61.050 233.352 0 137.075 0 370.522 0 47.075 0 59.249 11.982 59.249 58.095 0.126 239.111 0.126 346.338 0 585.389 0 48.138-10.687 58.991-57.768 58.991-235.323 0.101-140.844 0.101-376.157 0-47.044 0-57.93-11.043-57.966-58.89-0.129-119.109-0.057-172.209-0.057-291.287zM153.944 838.566c-74.929-0.062-66.687 5.958-66.845-66.685-0.201-63.95-7.054-63.534 62.528-63.372 72.999 0.194 67.201-3.764 67.302 67.554 0 67.722 4.087 62.595-62.985 62.502zM963.644 838.566c-71.159-0.034-65.56 6.185-65.751-65.364-0.129-67.302-4.508-64.693 64.528-64.693 73.089 0 65.299-2.031 65.299 66.238-0.003 68.646 6.956 63.911-64.076 63.818zM216.828 122.408c0.359 73.094 4.639 66.914-67.358 67.17-68.104 0.191-62.569 2.763-62.407-63.31 0.129-73.476-6.954-66.52 67.074-66.649 66.042-0.065 63.142-6.056 62.691 62.789zM1027.718 124.4c0.134 68.334 6.443 65.304-63.297 65.178-70.132-0.132-66.656 5.793-66.527-65.304 0.129-70.645-4.384-64.721 63.756-64.657 71.995 0.132 66.202-6.698 66.068 64.783zM1027.718 342.077c0 70.55 7.219 66.842-67.485 66.522-0.898 0-1.873 0-2.838 0-59.375 0-59.375 0-59.375-58.023 0-77.922-6.443-69.936 69.293-70.196 66.076-0.387 60.539-3.091 60.405 61.697zM151.307 489.873c68.295-0.163 65.815-5.568 65.624 62.982-0.194 71.128 4.895 64.917-66.014 65.010-69.905 0.101-63.813 4.704-63.885-63.978-0.062-67.431-5.7-64.463 64.275-64.014zM961.263 489.873c72.511-0.258 66.589-4.603 66.455 64.494 0 68.558 6.185 63.537-64.267 63.498-70.196-0.028-65.686 6.053-65.498-65.493 0.132-62.5 0.067-62.5 63.31-62.5zM150.399 280.38c71.004 0 66.659-6.567 66.466 64.528-0.163 63.694-0.036 63.501-65.013 63.756-70.805 0.258-64.822 2.673-64.822-63.756 0.036-69.167-5.919-64.788 63.369-64.528z" horiz-adv-x="1115" />
|
||||||
<glyph unicode="" d="M3.881 146.835h220.26v-210.835h-220.26v210.835zM308.817 350.143h220.27v-414.143h-220.27v414.143zM613.764 553.412h220.268v-617.412h-220.268v617.412zM918.685 756.715h220.265v-820.715h-220.265v820.715zM1223.629 960h220.263v-1024h-220.263v1024z" horiz-adv-x="1444" />
|
<glyph unicode="" d="M3.881 146.835h220.26v-210.835h-220.26v210.835zM308.817 350.143h220.27v-414.143h-220.27v414.143zM613.764 553.412h220.268v-617.412h-220.268v617.412zM918.685 756.715h220.265v-820.715h-220.265v820.715zM1223.629 960h220.263v-1024h-220.263v1024z" horiz-adv-x="1444" />
|
||||||
|
<glyph unicode="" d="M526.071 234.749c-28.637-30.869-56.465-60.861-84.282-90.859-51.578-55.636-103.047-111.376-154.842-166.832-7.606-8.135-15.958-16.1-25.317-22.012-28.075-17.708-58.31-18.090-88.472-6.492-59.84 23.028-80.004 90.727-59.734 139.234 5.413 12.95 13.721 23.601 23.709 33.173 70.256 67.351 140.506 134.717 210.76 202.077 15.638 14.993 31.264 29.995 47.364 45.45-9.302 9.529-18.386 18.833-27.451 28.137-12.122 12.442-13.234 20.28-5.067 35.498 4.735 8.816 4.789 8.878-2.627 16.198-20.012 19.72-40.168 39.198-63.498 55.188-27.167 18.624-57.161 24.233-89.083 19.849-53.402-7.328-91.609-38.372-121.413-81.046-12.774-18.299-15.365-40.313-17.517-61.875-3.23-32.245-2.415-64.479 2.209-96.597 1.654-11.515-3.863-16.539-13.835-11.175-8.306 4.448-16.095 11.048-22.115 18.353-15.574 18.89-22.223 42.042-27.474 65.395-12.955 57.652-8.86 114.49 12.191 169.495 32.345 84.537 79.743 159.571 145.953 221.932 13.659 12.857 176.841 180.564 202.944 207.021 7.493 7.599 14.895 7.635 22.393 0.028 43.009-43.641 85.985-87.316 128.927-131.029 8.117-8.267 8.019-15.097-0.222-23.49-26.339-26.834-52.726-53.627-79.106-80.419-6.244-6.334-97.34-82.437-73.027-128.816 22.693-25.090 46.196-49.449 69.575-73.904 1.189-1.238 4.686-1.386 6.523-0.632 3.63 1.499 6.848 3.997 10.248 6.066 9.745 5.94 19.545 4.918 27.812-3.083 11.755-11.381 23.405-22.858 35.392-34.59 4.807 4.575 9.939 9.41 15.027 14.294 27.128 26.039 54.272 52.071 81.351 78.146 16.413 15.778 18.652 28.418 11.038 49.658-10.473 29.221-14.356 59.677-13.85 90.624 1.017 61.045 20.438 115.334 61.003 161.416 32.825 37.286 72.054 64.311 121.643 74.325 35.227 7.101 69.139 4.513 100.663-14.026 6.365-3.752 11.908-9.007 17.455-14.005 3.491-3.125 3.153-6.236-0.565-9.98-42.503-42.885-84.772-86.013-127.154-129.035-12.442-12.638-12.356-23.167 0.196-35.914 40.344-40.978 80.597-82.050 120.936-123.052 10.076-10.233 19.537-10.021 29.504 0.134 43.195 44.077 86.449 88.090 129.706 132.118 1.21 1.233 2.572 2.322 5.135 4.624 5.491-5.893 11.895-10.924 15.961-17.406 19.452-30.944 22.608-64.83 17.073-100.25-14.253-91.080-97.188-175.638-197.712-190.123-39.977-5.764-79.372-2.562-118.067 9.031-5.898 1.775-11.541 4.629-17.538 5.829-12.47 2.474-23.872-0.366-32.74-9.877-30.921-33.168-61.674-66.484-92.474-99.758-0.73-0.805-1.349-1.718-0.181-1.099 8.992-10.006 17.354-20.662 27.061-29.94 81.064-77.54 164.91-151.986 250.882-224.063 9.936-8.347 10.274-15.695 1.040-25.1-42.338-43.068-84.689-86.111-127.059-129.154-9.413-9.575-16.846-9.152-25.291 1.295-76.686 94.78-156.8 186.609-239.707 276.002-1.334 1.453-2.562 3.029-4.257 5.042z" horiz-adv-x="1105" />
|
||||||
</font></defs></svg>
|
</font></defs></svg>
|
||||||
|
Before Width: | Height: | Size: 30 KiB After Width: | Height: | Size: 33 KiB |
BIN
fonts/jitsi.ttf
BIN
fonts/jitsi.ttf
Binary file not shown.
BIN
fonts/jitsi.woff
BIN
fonts/jitsi.woff
Binary file not shown.
|
|
@ -1,12 +1,46 @@
|
||||||
{
|
{
|
||||||
"IcoMoonType": "selection",
|
"IcoMoonType": "selection",
|
||||||
"icons": [
|
"icons": [
|
||||||
|
{
|
||||||
|
"icon": {
|
||||||
|
"paths": [
|
||||||
|
"M526.071 725.251c-28.637 30.869-56.465 60.861-84.282 90.859-51.578 55.636-103.047 111.376-154.842 166.832-7.606 8.135-15.958 16.1-25.317 22.012-28.075 17.708-58.31 18.090-88.472 6.492-59.84-23.028-80.004-90.727-59.734-139.234 5.413-12.95 13.721-23.601 23.709-33.173 70.256-67.351 140.506-134.717 210.76-202.077 15.638-14.993 31.264-29.995 47.364-45.45-9.302-9.529-18.386-18.833-27.451-28.137-12.122-12.442-13.234-20.28-5.067-35.498 4.735-8.816 4.789-8.878-2.627-16.198-20.012-19.72-40.168-39.198-63.498-55.188-27.167-18.624-57.161-24.233-89.083-19.849-53.402 7.328-91.609 38.372-121.413 81.046-12.774 18.299-15.365 40.313-17.517 61.875-3.23 32.245-2.415 64.479 2.209 96.597 1.654 11.515-3.863 16.539-13.835 11.175-8.306-4.448-16.095-11.048-22.115-18.353-15.574-18.89-22.223-42.042-27.474-65.395-12.955-57.652-8.86-114.49 12.191-169.495 32.345-84.537 79.743-159.571 145.953-221.932 13.659-12.857 176.841-180.564 202.944-207.021 7.493-7.599 14.895-7.635 22.393-0.028 43.009 43.641 85.985 87.316 128.927 131.029 8.117 8.267 8.019 15.097-0.222 23.49-26.339 26.834-52.726 53.627-79.106 80.419-6.244 6.334-97.34 82.437-73.027 128.816 22.693 25.090 46.196 49.449 69.575 73.904 1.189 1.238 4.686 1.386 6.523 0.632 3.63-1.499 6.848-3.997 10.248-6.066 9.745-5.94 19.545-4.918 27.812 3.083 11.755 11.381 23.405 22.858 35.392 34.59 4.807-4.575 9.939-9.41 15.027-14.294 27.128-26.039 54.272-52.071 81.351-78.146 16.413-15.778 18.652-28.418 11.038-49.658-10.473-29.221-14.356-59.677-13.85-90.624 1.017-61.045 20.438-115.334 61.003-161.416 32.825-37.286 72.054-64.311 121.643-74.325 35.227-7.101 69.139-4.513 100.663 14.026 6.365 3.752 11.908 9.007 17.455 14.005 3.491 3.125 3.153 6.236-0.565 9.98-42.503 42.885-84.772 86.013-127.154 129.035-12.442 12.638-12.356 23.167 0.196 35.914 40.344 40.978 80.597 82.050 120.936 123.052 10.076 10.233 19.537 10.021 29.504-0.134 43.195-44.077 86.449-88.090 129.706-132.118 1.21-1.233 2.572-2.322 5.135-4.624 5.491 5.893 11.895 10.924 15.961 17.406 19.452 30.944 22.608 64.83 17.073 100.25-14.253 91.080-97.188 175.638-197.712 190.123-39.977 5.764-79.372 2.562-118.067-9.031-5.898-1.775-11.541-4.629-17.538-5.829-12.47-2.474-23.872 0.366-32.74 9.877-30.921 33.168-61.674 66.484-92.474 99.758-0.73 0.805-1.349 1.718-0.181 1.099 8.992 10.006 17.354 20.662 27.061 29.94 81.064 77.54 164.91 151.986 250.882 224.063 9.936 8.347 10.274 15.695 1.040 25.1-42.338 43.068-84.689 86.111-127.059 129.154-9.413 9.575-16.846 9.152-25.291-1.295-76.686-94.78-156.8-186.609-239.707-276.002-1.334-1.453-2.562-3.029-4.257-5.042z"
|
||||||
|
],
|
||||||
|
"attrs": [
|
||||||
|
{
|
||||||
|
"opacity": 1,
|
||||||
|
"visibility": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"width": 1105,
|
||||||
|
"grid": 0,
|
||||||
|
"tags": [
|
||||||
|
"settings"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"attrs": [
|
||||||
|
{
|
||||||
|
"opacity": 1,
|
||||||
|
"visibility": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"properties": {
|
||||||
|
"order": 1,
|
||||||
|
"id": 33,
|
||||||
|
"prevSize": 32,
|
||||||
|
"code": 58907,
|
||||||
|
"name": "settings"
|
||||||
|
},
|
||||||
|
"setIdx": 0,
|
||||||
|
"iconIdx": 0
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"icon": {
|
"icon": {
|
||||||
"paths": [
|
"paths": [
|
||||||
"M1223.129 242.783l-180.128 175.796v-217.716c0-74.673-59.512-135.496-132.599-135.496h-634.716c-73.084 0-132.596 60.823-132.596 135.496v609.237c0 74.673 59.512 135.496 132.596 135.496h634.716c73.084 0 132.599-60.82 132.599-135.496v-172.679l193.45 153.712c48.784 35.558 96.695-5.178 96.695-40.424v-483.533c-0.003-35.248-55.897-71.306-110.017-24.393zM601.169 760.065c-141.111 0-255.524-114.411-255.524-255.521s114.411-255.521 255.524-255.521c141.108 0 255.519 114.411 255.519 255.521-0 141.113-114.408 255.521-255.519 255.521z",
|
"M1223.129 242.783l-180.128 175.796v-217.716c0-74.673-59.512-135.496-132.599-135.496h-634.716c-73.084 0-132.596 60.823-132.596 135.496v609.237c0 74.673 59.512 135.496 132.596 135.496h634.716c73.084 0 132.599-60.82 132.599-135.496v-172.679l193.45 153.712c48.784 35.558 96.695-5.178 96.695-40.424v-483.533c-0.003-35.248-55.897-71.306-110.017-24.393zM601.169 760.065c-141.111 0-255.524-114.411-255.524-255.521s114.411-255.521 255.524-255.521c141.108 0 255.519 114.411 255.519 255.521-0 141.113-114.408 255.521-255.519 255.521z",
|
||||||
"M599.045 359.751c-80.474 0-145.727 65.253-145.727 145.729 0 80.471 65.25 145.727 145.727 145.727s145.729-65.256 145.729-145.727c0-80.474-65.253-145.729-145.729-145.729z"
|
"M599.045 359.751c-80.474 0-145.727 65.253-145.727 145.729 0 80.471 65.25 145.727 145.727 145.727s145.729-65.256 145.729-145.727c0-80.474-65.253-145.729-145.729-145.729z"
|
||||||
],
|
],
|
||||||
|
"width": 1334,
|
||||||
"attrs": [
|
"attrs": [
|
||||||
{
|
{
|
||||||
"opacity": 1,
|
"opacity": 1,
|
||||||
|
|
@ -17,11 +51,10 @@
|
||||||
"visibility": false
|
"visibility": false
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"width": 1334,
|
|
||||||
"grid": 0,
|
|
||||||
"tags": [
|
"tags": [
|
||||||
"webCam"
|
"webCam"
|
||||||
]
|
],
|
||||||
|
"grid": 0
|
||||||
},
|
},
|
||||||
"attrs": [
|
"attrs": [
|
||||||
{
|
{
|
||||||
|
|
@ -714,7 +747,7 @@
|
||||||
"ligatures": ""
|
"ligatures": ""
|
||||||
},
|
},
|
||||||
"setIdx": 0,
|
"setIdx": 0,
|
||||||
"iconIdx": 26
|
"iconIdx": 25
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"icon": {
|
"icon": {
|
||||||
|
|
@ -740,7 +773,7 @@
|
||||||
"ligatures": ""
|
"ligatures": ""
|
||||||
},
|
},
|
||||||
"setIdx": 0,
|
"setIdx": 0,
|
||||||
"iconIdx": 27
|
"iconIdx": 26
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"icon": {
|
"icon": {
|
||||||
|
|
@ -765,7 +798,7 @@
|
||||||
"ligatures": ""
|
"ligatures": ""
|
||||||
},
|
},
|
||||||
"setIdx": 0,
|
"setIdx": 0,
|
||||||
"iconIdx": 28
|
"iconIdx": 27
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"height": 1024,
|
"height": 1024,
|
||||||
|
|
@ -775,6 +808,7 @@
|
||||||
"preferences": {
|
"preferences": {
|
||||||
"showGlyphs": true,
|
"showGlyphs": true,
|
||||||
"showQuickUse": true,
|
"showQuickUse": true,
|
||||||
|
"showQuickUse2": true,
|
||||||
"showSVGs": true,
|
"showSVGs": true,
|
||||||
"fontPref": {
|
"fontPref": {
|
||||||
"prefix": "icon-",
|
"prefix": "icon-",
|
||||||
|
|
@ -791,7 +825,8 @@
|
||||||
},
|
},
|
||||||
"imagePref": {
|
"imagePref": {
|
||||||
"prefix": "icon-",
|
"prefix": "icon-",
|
||||||
"png": true
|
"png": true,
|
||||||
|
"useClassSelector": true
|
||||||
},
|
},
|
||||||
"historySize": 100,
|
"historySize": 100,
|
||||||
"showCodes": true,
|
"showCodes": true,
|
||||||
|
|
|
||||||
49
index.html
49
index.html
|
|
@ -28,17 +28,18 @@
|
||||||
<script src="libs/rayo.js?v=1"></script>
|
<script src="libs/rayo.js?v=1"></script>
|
||||||
<script src="libs/tooltip.js?v=1"></script><!-- bootstrap tooltip lib -->
|
<script src="libs/tooltip.js?v=1"></script><!-- bootstrap tooltip lib -->
|
||||||
<script src="libs/popover.js?v=1"></script><!-- bootstrap tooltip lib -->
|
<script src="libs/popover.js?v=1"></script><!-- bootstrap tooltip lib -->
|
||||||
<script src="interface_config.js?v=3"></script>
|
|
||||||
<script src="libs/toastr.js?v=1"></script><!-- notifications lib -->
|
<script src="libs/toastr.js?v=1"></script><!-- notifications lib -->
|
||||||
<script src="muc.js?v=16"></script><!-- simple MUC library -->
|
<script src="interface_config.js?v=4"></script>
|
||||||
|
<script src="muc.js?v=17"></script><!-- simple MUC library -->
|
||||||
<script src="estos_log.js?v=2"></script><!-- simple stanza logger -->
|
<script src="estos_log.js?v=2"></script><!-- simple stanza logger -->
|
||||||
<script src="desktopsharing.js?v=3"></script><!-- desktop sharing -->
|
<script src="desktopsharing.js?v=3"></script><!-- desktop sharing -->
|
||||||
<script src="data_channels.js?v=3"></script><!-- data channels -->
|
<script src="data_channels.js?v=3"></script><!-- data channels -->
|
||||||
<script src="app.js?v=20"></script><!-- application logic -->
|
<script src="app.js?v=21"></script><!-- application logic -->
|
||||||
<script src="commands.js?v=1"></script><!-- application logic -->
|
<script src="commands.js?v=1"></script><!-- application logic -->
|
||||||
<script src="chat.js?v=14"></script><!-- chat logic -->
|
<script src="chat.js?v=15"></script><!-- chat logic -->
|
||||||
<script src="contact_list.js?v=6"></script><!-- contact list logic -->
|
<script src="contact_list.js?v=7"></script><!-- contact list logic -->
|
||||||
<script src="util.js?v=6"></script><!-- utility functions -->
|
<script src="side_panel_toggler.js?v=1"></script>
|
||||||
|
<script src="util.js?v=7"></script><!-- utility functions -->
|
||||||
<script src="etherpad.js?v=9"></script><!-- etherpad plugin -->
|
<script src="etherpad.js?v=9"></script><!-- etherpad plugin -->
|
||||||
<script src="prezi.js?v=6"></script><!-- prezi plugin -->
|
<script src="prezi.js?v=6"></script><!-- prezi plugin -->
|
||||||
<script src="smileys.js?v=3"></script><!-- smiley images -->
|
<script src="smileys.js?v=3"></script><!-- smiley images -->
|
||||||
|
|
@ -47,33 +48,36 @@
|
||||||
<script src="analytics.js?v=1"></script><!-- google analytics plugin -->
|
<script src="analytics.js?v=1"></script><!-- google analytics plugin -->
|
||||||
<script src="rtp_sts.js?v=5"></script><!-- RTP stats processing -->
|
<script src="rtp_sts.js?v=5"></script><!-- RTP stats processing -->
|
||||||
<script src="local_sts.js?v=2"></script><!-- Local stats processing -->
|
<script src="local_sts.js?v=2"></script><!-- Local stats processing -->
|
||||||
<script src="videolayout.js?v=28"></script><!-- video ui -->
|
<script src="videolayout.js?v=29"></script><!-- video ui -->
|
||||||
<script src="connectionquality.js?v=1"></script>
|
<script src="connectionquality.js?v=1"></script>
|
||||||
<script src="toolbar.js?v=6"></script><!-- toolbar ui -->
|
<script src="toolbar.js?v=6"></script><!-- toolbar ui -->
|
||||||
<script src="toolbar_toggler.js?v=2"></script>
|
<script src="toolbar_toggler.js?v=2"></script>
|
||||||
<script src="canvas_util.js?v=1"></script><!-- canvas drawing utils -->
|
<script src="canvas_util.js?v=1"></script><!-- canvas drawing utils -->
|
||||||
<script src="audio_levels.js?v=2"></script><!-- audio levels plugin -->
|
<script src="audio_levels.js?v=2"></script><!-- audio levels plugin -->
|
||||||
<script src="media_stream.js?v=1"></script><!-- media stream -->
|
<script src="media_stream.js?v=2"></script><!-- media stream -->
|
||||||
<script src="bottom_toolbar.js?v=5"></script><!-- media stream -->
|
<script src="bottom_toolbar.js?v=6"></script><!-- media stream -->
|
||||||
<script src="roomname_generator.js?v=1"></script><!-- generator for random room names -->
|
<script src="roomname_generator.js?v=1"></script><!-- generator for random room names -->
|
||||||
<script src="keyboard_shortcut.js?v=3"></script>
|
<script src="keyboard_shortcut.js?v=3"></script>
|
||||||
<script src="tracking.js?v=1"></script><!-- tracking -->
|
<script src="tracking.js?v=1"></script><!-- tracking -->
|
||||||
<script src="jitsipopover.js?v=3"></script>
|
<script src="jitsipopover.js?v=3"></script>
|
||||||
<script src="message_handler.js?v=2"></script>
|
<script src="message_handler.js?v=2"></script>
|
||||||
<script src="api_connector.js?v=2"></script>
|
<script src="api_connector.js?v=2"></script>
|
||||||
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
|
<script src="settings_menu.js?v=1"></script>
|
||||||
<link rel="stylesheet" href="css/font.css?v=5"/>
|
<script src="avatar.js?v=1"></script><!-- avatars -->
|
||||||
|
<link rel="stylesheet" href="css/font.css?v=6"/>
|
||||||
<link rel="stylesheet" href="css/toastr.css?v=1">
|
<link rel="stylesheet" href="css/toastr.css?v=1">
|
||||||
<link rel="stylesheet" type="text/css" media="screen" href="css/main.css?v=29"/>
|
<link rel="stylesheet" type="text/css" media="screen" href="css/main.css?v=30"/>
|
||||||
<link rel="stylesheet" type="text/css" media="screen" href="css/videolayout_default.css?v=13" id="videolayout_default"/>
|
<link rel="stylesheet" type="text/css" media="screen" href="css/videolayout_default.css?v=14" id="videolayout_default"/>
|
||||||
|
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
|
||||||
<link rel="stylesheet" href="css/jquery-impromptu.css?v=4">
|
<link rel="stylesheet" href="css/jquery-impromptu.css?v=4">
|
||||||
<link rel="stylesheet" href="css/modaldialog.css?v=3">
|
<link rel="stylesheet" href="css/modaldialog.css?v=3">
|
||||||
<link rel="stylesheet" href="css/popup_menu.css?v=4">
|
<link rel="stylesheet" href="css/popup_menu.css?v=4">
|
||||||
<link rel="stylesheet" href="css/popover.css?v=2">
|
<link rel="stylesheet" href="css/popover.css?v=2">
|
||||||
<link rel="stylesheet" href="css/jitsi_popover.css?v=2">
|
<link rel="stylesheet" href="css/jitsi_popover.css?v=2">
|
||||||
<link rel="stylesheet" href="css/contact_list.css?v=3">
|
<link rel="stylesheet" href="css/contact_list.css?v=4">
|
||||||
<link rel="stylesheet" href="css/chat.css?v=5">
|
<link rel="stylesheet" href="css/chat.css?v=5">
|
||||||
<link rel="stylesheet" href="css/welcome_page.css?v=2">
|
<link rel="stylesheet" href="css/welcome_page.css?v=2">
|
||||||
|
<link rel="stylesheet" href="css/settingsmenu.css?v=1">
|
||||||
<!--
|
<!--
|
||||||
Link used for inline installation of chrome desktop streaming extension,
|
Link used for inline installation of chrome desktop streaming extension,
|
||||||
is updated automatically from the code with the value defined in config.js -->
|
is updated automatically from the code with the value defined in config.js -->
|
||||||
|
|
@ -227,6 +231,10 @@
|
||||||
<i class="icon-telephone"></i></a>
|
<i class="icon-telephone"></i></a>
|
||||||
</span>
|
</span>
|
||||||
<div class="header_button_separator"></div>
|
<div class="header_button_separator"></div>
|
||||||
|
<a class="button" data-container="body" data-toggle="popover" data-placement="bottom" content="Settings" onclick='PanelToggler.toggleSettingsMenu();'>
|
||||||
|
<i id="settingsButton" class="icon-settings"></i>
|
||||||
|
</a>
|
||||||
|
<div class="header_button_separator"></div>
|
||||||
<span id="hangup">
|
<span id="hangup">
|
||||||
<a class="button" data-container="body" data-toggle="popover" data-placement="bottom" content="Hang Up" onclick='hangup();'>
|
<a class="button" data-container="body" data-toggle="popover" data-placement="bottom" content="Hang Up" onclick='hangup();'>
|
||||||
<i class="icon-hangup" style="color:#ff0000;font-size: 1.4em;"></i>
|
<i class="icon-hangup" style="color:#ff0000;font-size: 1.4em;"></i>
|
||||||
|
|
@ -253,6 +261,7 @@
|
||||||
<a target="_new"><div class="watermark leftwatermark"></div></a>
|
<a target="_new"><div class="watermark leftwatermark"></div></a>
|
||||||
<a target="_new"><div class="watermark rightwatermark"></div></a>
|
<a target="_new"><div class="watermark rightwatermark"></div></a>
|
||||||
<a class="poweredby" href="http://jitsi.org" target="_new" >powered by jitsi.org</a>
|
<a class="poweredby" href="http://jitsi.org" target="_new" >powered by jitsi.org</a>
|
||||||
|
<img id="activeSpeakerAvatar" src=""/>
|
||||||
<video id="largeVideo" autoplay oncontextmenu="return false;"></video>
|
<video id="largeVideo" autoplay oncontextmenu="return false;"></video>
|
||||||
</div>
|
</div>
|
||||||
<div id="remoteVideos">
|
<div id="remoteVideos">
|
||||||
|
|
@ -296,7 +305,7 @@
|
||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div id="chatspace">
|
<div id="chatspace" class="right-panel">
|
||||||
<div id="nickname">
|
<div id="nickname">
|
||||||
Enter a nickname in the box below
|
Enter a nickname in the box below
|
||||||
<form>
|
<form>
|
||||||
|
|
@ -314,11 +323,19 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="contactlist">
|
<div id="contactlist" class="right-panel">
|
||||||
<ul>
|
<ul>
|
||||||
<li class="title"><i class="icon-contact-list"></i> CONTACT LIST</li>
|
<li class="title"><i class="icon-contact-list"></i> CONTACT LIST</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="settingsmenu" class="right-panel">
|
||||||
|
<div class="icon-settings"> SETTINGS</div>
|
||||||
|
<img id="avatar" src="https://www.gravatar.com/avatar/87291c37c25be69a072a4514931b1749?d=retro&size=30"/>
|
||||||
|
<div class="arrow-up"></div>
|
||||||
|
<input type="text" id="setDisplayName" placeholder="Name">
|
||||||
|
<input type="text" id="setEmail" placeholder="E-Mail">
|
||||||
|
<button onclick="SettingsMenu.update()" id="updateSettings">Update</button>
|
||||||
|
</div>
|
||||||
<a id="downloadlog" onclick='dump(event.target);' data-container="body" data-toggle="popover" data-placement="right" data-content="Download logs" ><i class="fa fa-cloud-download"></i></a>
|
<a id="downloadlog" onclick='dump(event.target);' data-container="body" data-toggle="popover" data-placement="right" data-content="Download logs" ><i class="fa fa-cloud-download"></i></a>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
|
||||||
|
|
@ -6,11 +6,13 @@ var interfaceConfig = {
|
||||||
TOOLBAR_TIMEOUT: 4000,
|
TOOLBAR_TIMEOUT: 4000,
|
||||||
DEFAULT_REMOTE_DISPLAY_NAME: "Fellow Jitster",
|
DEFAULT_REMOTE_DISPLAY_NAME: "Fellow Jitster",
|
||||||
DEFAULT_DOMINANT_SPEAKER_DISPLAY_NAME: "Speaker",
|
DEFAULT_DOMINANT_SPEAKER_DISPLAY_NAME: "Speaker",
|
||||||
|
DEFAULT_LOCAL_DISPLAY_NAME: "me",
|
||||||
SHOW_JITSI_WATERMARK: true,
|
SHOW_JITSI_WATERMARK: true,
|
||||||
JITSI_WATERMARK_LINK: "http://jitsi.org",
|
JITSI_WATERMARK_LINK: "http://jitsi.org",
|
||||||
SHOW_BRAND_WATERMARK: false,
|
SHOW_BRAND_WATERMARK: false,
|
||||||
BRAND_WATERMARK_LINK: "",
|
BRAND_WATERMARK_LINK: "",
|
||||||
SHOW_POWERED_BY: false,
|
SHOW_POWERED_BY: false,
|
||||||
GENERATE_ROOMNAMES_ON_WELCOME_PAGE: true,
|
GENERATE_ROOMNAMES_ON_WELCOME_PAGE: true,
|
||||||
APP_NAME: "Jitsi Meet"
|
APP_NAME: "Jitsi Meet",
|
||||||
|
ACTIVE_SPEAKER_AVATAR_SIZE: 100
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -16,15 +16,17 @@ var MediaStream = (function() {
|
||||||
* @constructor
|
* @constructor
|
||||||
*/
|
*/
|
||||||
function MediaStreamProto(data, sid, ssrc) {
|
function MediaStreamProto(data, sid, ssrc) {
|
||||||
this.VIDEO_TYPE = "Video";
|
|
||||||
this.AUDIO_TYPE = "Audio";
|
|
||||||
this.stream = data.stream;
|
this.stream = data.stream;
|
||||||
this.peerjid = data.peerjid;
|
this.peerjid = data.peerjid;
|
||||||
this.ssrc = ssrc;
|
this.ssrc = ssrc;
|
||||||
this.session = connection.jingle.sessions[sid];
|
this.session = connection.jingle.sessions[sid];
|
||||||
this.type = (this.stream.getVideoTracks().length > 0)
|
this.type = (this.stream.getVideoTracks().length > 0)
|
||||||
? this.VIDEO_TYPE : this.AUDIO_TYPE;
|
? MediaStream.VIDEO_TYPE : MediaStream.AUDIO_TYPE;
|
||||||
|
this.muted = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
return MediaStreamProto;
|
return MediaStreamProto;
|
||||||
})();
|
})();
|
||||||
|
|
||||||
|
MediaStream.VIDEO_TYPE = 'Video';
|
||||||
|
MediaStream.AUDIO_TYPE = 'Audio';
|
||||||
14
muc.js
14
muc.js
|
|
@ -335,6 +335,14 @@ Strophe.addConnectionPlugin('emuc', {
|
||||||
pres.c('bridgeIsDown').up();
|
pres.c('bridgeIsDown').up();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if(this.presMap['email']) {
|
||||||
|
pres.c('email').t(this.presMap['email']).up();
|
||||||
|
}
|
||||||
|
|
||||||
|
if(this.presMap['userId']) {
|
||||||
|
pres.c('userId').t(this.presMap['userId']).up();
|
||||||
|
}
|
||||||
|
|
||||||
if (this.presMap['displayName']) {
|
if (this.presMap['displayName']) {
|
||||||
// XEP-0172
|
// XEP-0172
|
||||||
pres.c('nick', {xmlns: 'http://jabber.org/protocol/nick'})
|
pres.c('nick', {xmlns: 'http://jabber.org/protocol/nick'})
|
||||||
|
|
@ -456,5 +464,11 @@ Strophe.addConnectionPlugin('emuc', {
|
||||||
},
|
},
|
||||||
addBridgeIsDownToPresence: function() {
|
addBridgeIsDownToPresence: function() {
|
||||||
this.presMap['bridgeIsDown'] = true;
|
this.presMap['bridgeIsDown'] = true;
|
||||||
|
},
|
||||||
|
addEmailToPresence: function(email) {
|
||||||
|
this.presMap['email'] = email;
|
||||||
|
},
|
||||||
|
addUserIdToPresence: function(userId) {
|
||||||
|
this.presMap['userId'] = userId;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,83 @@
|
||||||
|
var SettingsMenu = (function(my) {
|
||||||
|
|
||||||
|
var email = '';
|
||||||
|
var displayName = '';
|
||||||
|
var userId;
|
||||||
|
|
||||||
|
if(supportsLocalStorage()) {
|
||||||
|
if(!window.localStorage.jitsiMeetId) {
|
||||||
|
window.localStorage.jitsiMeetId = generateUniqueId();
|
||||||
|
console.log("generated id", window.localStorage.jitsiMeetId);
|
||||||
|
}
|
||||||
|
userId = window.localStorage.jitsiMeetId || '';
|
||||||
|
email = window.localStorage.email || '';
|
||||||
|
displayName = window.localStorage.displayname || '';
|
||||||
|
} else {
|
||||||
|
console.log("local storage is not supported");
|
||||||
|
userId = generateUniqueId();
|
||||||
|
}
|
||||||
|
|
||||||
|
my.update = function() {
|
||||||
|
var newDisplayName = Util.escapeHtml($('#setDisplayName').get(0).value);
|
||||||
|
if(newDisplayName) {
|
||||||
|
displayName = newDisplayName;
|
||||||
|
connection.emuc.addDisplayNameToPresence(displayName);
|
||||||
|
window.localStorage.displayname = displayName;
|
||||||
|
}
|
||||||
|
|
||||||
|
var newEmail = Util.escapeHtml($('#setEmail').get(0).value);
|
||||||
|
connection.emuc.addEmailToPresence(newEmail);
|
||||||
|
email = newEmail;
|
||||||
|
window.localStorage.email = newEmail;
|
||||||
|
|
||||||
|
connection.emuc.sendPresence();
|
||||||
|
Avatar.setUserAvatar(connection.emuc.myroomjid, email);
|
||||||
|
};
|
||||||
|
|
||||||
|
my.isVisible = function() {
|
||||||
|
return $('#settingsmenu').is(':visible');
|
||||||
|
};
|
||||||
|
|
||||||
|
my.getUID = function() {
|
||||||
|
return userId;
|
||||||
|
};
|
||||||
|
|
||||||
|
my.getEmail = function() {
|
||||||
|
return email;
|
||||||
|
};
|
||||||
|
|
||||||
|
my.getDisplayName = function() {
|
||||||
|
return displayName;
|
||||||
|
};
|
||||||
|
|
||||||
|
my.setDisplayName = function(newDisplayName) {
|
||||||
|
displayName = newDisplayName;
|
||||||
|
window.localStorage.displayname = displayName;
|
||||||
|
$('#setDisplayName').get(0).value = displayName;
|
||||||
|
};
|
||||||
|
|
||||||
|
function supportsLocalStorage() {
|
||||||
|
try {
|
||||||
|
return 'localStorage' in window && window.localStorage !== null;
|
||||||
|
} catch (e) {
|
||||||
|
console.log("localstorage is not supported");
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function generateUniqueId() {
|
||||||
|
function _p8() {
|
||||||
|
return (Math.random().toString(16)+"000000000").substr(2,8);
|
||||||
|
}
|
||||||
|
return _p8() + _p8() + _p8() + _p8();
|
||||||
|
}
|
||||||
|
|
||||||
|
$(document).bind('displaynamechanged', function(event, peerJid, newDisplayName) {
|
||||||
|
if(peerJid === 'localVideoContainer' ||
|
||||||
|
peerJid === connection.emuc.myroomjid) {
|
||||||
|
SettingsMenu.setDisplayName(newDisplayName);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return my;
|
||||||
|
}(SettingsMenu || {}));
|
||||||
|
|
@ -0,0 +1,245 @@
|
||||||
|
/**
|
||||||
|
* Toggler for the chat, contact list, settings menu, etc..
|
||||||
|
*/
|
||||||
|
var PanelToggler = (function(my) {
|
||||||
|
|
||||||
|
var currentlyOpen = null;
|
||||||
|
var buttons = {
|
||||||
|
'#chatspace': '#chatBottomButton',
|
||||||
|
'#contactlist': '#contactListButton',
|
||||||
|
'#settingsmenu': '#settingsButton'
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Resizes the video area
|
||||||
|
* @param isClosing whether the side panel is going to be closed or is going to open / remain opened
|
||||||
|
* @param completeFunction a function to be called when the video space is resized
|
||||||
|
*/
|
||||||
|
var resizeVideoArea = function(isClosing, completeFunction) {
|
||||||
|
var videospace = $('#videospace');
|
||||||
|
|
||||||
|
var panelSize = isClosing ? [0, 0] : PanelToggler.getPanelSize();
|
||||||
|
var videospaceWidth = window.innerWidth - panelSize[0];
|
||||||
|
var videospaceHeight = window.innerHeight;
|
||||||
|
var videoSize
|
||||||
|
= getVideoSize(null, null, videospaceWidth, videospaceHeight);
|
||||||
|
var videoWidth = videoSize[0];
|
||||||
|
var videoHeight = videoSize[1];
|
||||||
|
var videoPosition = getVideoPosition(videoWidth,
|
||||||
|
videoHeight,
|
||||||
|
videospaceWidth,
|
||||||
|
videospaceHeight);
|
||||||
|
var horizontalIndent = videoPosition[0];
|
||||||
|
var verticalIndent = videoPosition[1];
|
||||||
|
|
||||||
|
var thumbnailSize = VideoLayout.calculateThumbnailSize(videospaceWidth);
|
||||||
|
var thumbnailsWidth = thumbnailSize[0];
|
||||||
|
var thumbnailsHeight = thumbnailSize[1];
|
||||||
|
//for chat
|
||||||
|
|
||||||
|
videospace.animate({
|
||||||
|
right: panelSize[0],
|
||||||
|
width: videospaceWidth,
|
||||||
|
height: videospaceHeight
|
||||||
|
},
|
||||||
|
{
|
||||||
|
queue: false,
|
||||||
|
duration: 500,
|
||||||
|
complete: completeFunction
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#remoteVideos').animate({
|
||||||
|
height: thumbnailsHeight
|
||||||
|
},
|
||||||
|
{
|
||||||
|
queue: false,
|
||||||
|
duration: 500
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#remoteVideos>span').animate({
|
||||||
|
height: thumbnailsHeight,
|
||||||
|
width: thumbnailsWidth
|
||||||
|
},
|
||||||
|
{
|
||||||
|
queue: false,
|
||||||
|
duration: 500,
|
||||||
|
complete: function () {
|
||||||
|
$(document).trigger(
|
||||||
|
"remotevideo.resized",
|
||||||
|
[thumbnailsWidth,
|
||||||
|
thumbnailsHeight]);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#largeVideoContainer').animate({
|
||||||
|
width: videospaceWidth,
|
||||||
|
height: videospaceHeight
|
||||||
|
},
|
||||||
|
{
|
||||||
|
queue: false,
|
||||||
|
duration: 500
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#largeVideo').animate({
|
||||||
|
width: videoWidth,
|
||||||
|
height: videoHeight,
|
||||||
|
top: verticalIndent,
|
||||||
|
bottom: verticalIndent,
|
||||||
|
left: horizontalIndent,
|
||||||
|
right: horizontalIndent
|
||||||
|
},
|
||||||
|
{
|
||||||
|
queue: false,
|
||||||
|
duration: 500
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Toggles the windows in the side panel
|
||||||
|
* @param object the window that should be shown
|
||||||
|
* @param selector the selector for the element containing the panel
|
||||||
|
* @param onOpenComplete function to be called when the panel is opened
|
||||||
|
* @param onOpen function to be called if the window is going to be opened
|
||||||
|
* @param onClose function to be called if the window is going to be closed
|
||||||
|
*/
|
||||||
|
var toggle = function(object, selector, onOpenComplete, onOpen, onClose) {
|
||||||
|
buttonClick(buttons[selector], "active");
|
||||||
|
|
||||||
|
if (object.isVisible()) {
|
||||||
|
$("#toast-container").animate({
|
||||||
|
right: '5px'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
queue: false,
|
||||||
|
duration: 500
|
||||||
|
});
|
||||||
|
$(selector).hide("slide", {
|
||||||
|
direction: "right",
|
||||||
|
queue: false,
|
||||||
|
duration: 500
|
||||||
|
});
|
||||||
|
if(typeof onClose === "function") {
|
||||||
|
onClose();
|
||||||
|
}
|
||||||
|
|
||||||
|
currentlyOpen = null;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
// Undock the toolbar when the chat is shown and if we're in a
|
||||||
|
// video mode.
|
||||||
|
if (VideoLayout.isLargeVideoVisible()) {
|
||||||
|
ToolbarToggler.dockToolbar(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
if(currentlyOpen) {
|
||||||
|
var current = $(currentlyOpen);
|
||||||
|
buttonClick(buttons[currentlyOpen], "active");
|
||||||
|
current.css('z-index', 4);
|
||||||
|
setTimeout(function () {
|
||||||
|
current.css('display', 'none');
|
||||||
|
current.css('z-index', 5);
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
|
||||||
|
$("#toast-container").animate({
|
||||||
|
right: (PanelToggler.getPanelSize()[0] + 5) + 'px'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
queue: false,
|
||||||
|
duration: 500
|
||||||
|
});
|
||||||
|
$(selector).show("slide", {
|
||||||
|
direction: "right",
|
||||||
|
queue: false,
|
||||||
|
duration: 500,
|
||||||
|
complete: onOpenComplete
|
||||||
|
});
|
||||||
|
if(typeof onOpen === "function") {
|
||||||
|
onOpen();
|
||||||
|
}
|
||||||
|
|
||||||
|
currentlyOpen = selector;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Opens / closes the chat area.
|
||||||
|
*/
|
||||||
|
my.toggleChat = function() {
|
||||||
|
var chatCompleteFunction = Chat.isVisible() ?
|
||||||
|
function() {} : function () {
|
||||||
|
Chat.scrollChatToBottom();
|
||||||
|
$('#chatspace').trigger('shown');
|
||||||
|
};
|
||||||
|
|
||||||
|
resizeVideoArea(Chat.isVisible(), chatCompleteFunction);
|
||||||
|
|
||||||
|
toggle(Chat,
|
||||||
|
'#chatspace',
|
||||||
|
function () {
|
||||||
|
// Request the focus in the nickname field or the chat input field.
|
||||||
|
if ($('#nickname').css('visibility') === 'visible') {
|
||||||
|
$('#nickinput').focus();
|
||||||
|
} else {
|
||||||
|
$('#usermsg').focus();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
null,
|
||||||
|
Chat.resizeChat,
|
||||||
|
null);
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Opens / closes the contact list area.
|
||||||
|
*/
|
||||||
|
my.toggleContactList = function () {
|
||||||
|
var completeFunction = ContactList.isVisible() ?
|
||||||
|
function() {} : function () { $('#contactlist').trigger('shown');};
|
||||||
|
resizeVideoArea(ContactList.isVisible(), completeFunction);
|
||||||
|
|
||||||
|
toggle(ContactList,
|
||||||
|
'#contactlist',
|
||||||
|
null,
|
||||||
|
function() {
|
||||||
|
ContactList.setVisualNotification(false);
|
||||||
|
},
|
||||||
|
null);
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Opens / closes the settings menu
|
||||||
|
*/
|
||||||
|
my.toggleSettingsMenu = function() {
|
||||||
|
resizeVideoArea(SettingsMenu.isVisible(), function (){});
|
||||||
|
toggle(SettingsMenu,
|
||||||
|
'#settingsmenu',
|
||||||
|
null,
|
||||||
|
function() {
|
||||||
|
$('#setDisplayName').get(0).value = SettingsMenu.getDisplayName();
|
||||||
|
$('#setEmail').get(0).value = SettingsMenu.getEmail();
|
||||||
|
},
|
||||||
|
null);
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Returns the size of the side panel.
|
||||||
|
*/
|
||||||
|
my.getPanelSize = function () {
|
||||||
|
var availableHeight = window.innerHeight;
|
||||||
|
var availableWidth = window.innerWidth;
|
||||||
|
|
||||||
|
var panelWidth = 200;
|
||||||
|
if (availableWidth * 0.2 < 200) {
|
||||||
|
panelWidth = availableWidth * 0.2;
|
||||||
|
}
|
||||||
|
|
||||||
|
return [panelWidth, availableHeight];
|
||||||
|
};
|
||||||
|
|
||||||
|
my.isVisible = function() {
|
||||||
|
return (Chat.isVisible() || ContactList.isVisible() || SettingsMenu.isVisible());
|
||||||
|
};
|
||||||
|
|
||||||
|
return my;
|
||||||
|
|
||||||
|
}(PanelToggler || {}));
|
||||||
8
util.js
8
util.js
|
|
@ -51,12 +51,10 @@ var Util = (function (my) {
|
||||||
* Returns the available video width.
|
* Returns the available video width.
|
||||||
*/
|
*/
|
||||||
my.getAvailableVideoWidth = function () {
|
my.getAvailableVideoWidth = function () {
|
||||||
var chatspaceWidth
|
var rightPanelWidth
|
||||||
= (Chat.isVisible() || ContactList.isVisible())
|
= PanelToggler.isVisible() ? PanelToggler.getPanelSize()[0] : 0;
|
||||||
? $('#chatspace').width()
|
|
||||||
: 0;
|
|
||||||
|
|
||||||
return window.innerWidth - chatspaceWidth;
|
return window.innerWidth - rightPanelWidth;
|
||||||
};
|
};
|
||||||
|
|
||||||
my.imageToGrayScale = function (canvas) {
|
my.imageToGrayScale = function (canvas) {
|
||||||
|
|
|
||||||
|
|
@ -123,6 +123,7 @@ var VideoLayout = (function (my) {
|
||||||
|
|
||||||
if ($('#largeVideo').attr('src') != newSrc) {
|
if ($('#largeVideo').attr('src') != newSrc) {
|
||||||
|
|
||||||
|
$('#activeSpeakerAvatar').css('visibility', 'hidden');
|
||||||
// Due to the simulcast the localVideoSrc may have changed when the
|
// Due to the simulcast the localVideoSrc may have changed when the
|
||||||
// fadeOut event triggers. In that case the getJidFromVideoSrc and
|
// fadeOut event triggers. In that case the getJidFromVideoSrc and
|
||||||
// isVideoSrcDesktop methods will not function correctly.
|
// isVideoSrcDesktop methods will not function correctly.
|
||||||
|
|
@ -155,6 +156,8 @@ var VideoLayout = (function (my) {
|
||||||
|
|
||||||
var doUpdate = function () {
|
var doUpdate = function () {
|
||||||
|
|
||||||
|
Avatar.updateActiveSpeakerAvatarSrc(largeVideoState.userJid);
|
||||||
|
|
||||||
if (!userChanged && largeVideoState.preload
|
if (!userChanged && largeVideoState.preload
|
||||||
&& largeVideoState.preload != null
|
&& largeVideoState.preload != null
|
||||||
&& $(largeVideoState.preload).attr('src') == newSrc) {
|
&& $(largeVideoState.preload).attr('src') == newSrc) {
|
||||||
|
|
@ -227,6 +230,10 @@ var VideoLayout = (function (my) {
|
||||||
$(this).fadeIn(300);
|
$(this).fadeIn(300);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if(userChanged) {
|
||||||
|
Avatar.showUserAvatar(largeVideoState.oldJid);
|
||||||
|
}
|
||||||
|
|
||||||
largeVideoState.updateInProgress = false;
|
largeVideoState.updateInProgress = false;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -368,12 +375,13 @@ var VideoLayout = (function (my) {
|
||||||
* in the document and creates it eventually.
|
* in the document and creates it eventually.
|
||||||
*
|
*
|
||||||
* @param peerJid peer Jid to check.
|
* @param peerJid peer Jid to check.
|
||||||
|
* @param userId user email or id for setting the avatar
|
||||||
*
|
*
|
||||||
* @return Returns <tt>true</tt> if the peer container exists,
|
* @return Returns <tt>true</tt> if the peer container exists,
|
||||||
* <tt>false</tt> - otherwise
|
* <tt>false</tt> - otherwise
|
||||||
*/
|
*/
|
||||||
my.ensurePeerContainerExists = function(peerJid) {
|
my.ensurePeerContainerExists = function(peerJid, userId) {
|
||||||
ContactList.ensureAddContact(peerJid);
|
ContactList.ensureAddContact(peerJid, userId);
|
||||||
|
|
||||||
var resourceJid = Strophe.getResourceFromJid(peerJid);
|
var resourceJid = Strophe.getResourceFromJid(peerJid);
|
||||||
|
|
||||||
|
|
@ -382,14 +390,15 @@ var VideoLayout = (function (my) {
|
||||||
if ($('#' + videoSpanId).length > 0) {
|
if ($('#' + videoSpanId).length > 0) {
|
||||||
// If there's been a focus change, make sure we add focus related
|
// If there's been a focus change, make sure we add focus related
|
||||||
// interface!!
|
// interface!!
|
||||||
if (focus && $('#remote_popupmenu_' + resourceJid).length <= 0)
|
if (focus && $('#remote_popupmenu_' + resourceJid).length <= 0) {
|
||||||
addRemoteVideoMenu( peerJid,
|
addRemoteVideoMenu(peerJid,
|
||||||
document.getElementById(videoSpanId));
|
document.getElementById(videoSpanId));
|
||||||
|
}
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
var container
|
var container =
|
||||||
= VideoLayout.addRemoteVideoContainer(peerJid, videoSpanId);
|
VideoLayout.addRemoteVideoContainer(peerJid, videoSpanId, userId);
|
||||||
|
Avatar.setUserAvatar(peerJid, userId);
|
||||||
// Set default display name.
|
// Set default display name.
|
||||||
setDisplayName(videoSpanId);
|
setDisplayName(videoSpanId);
|
||||||
|
|
||||||
|
|
@ -468,8 +477,10 @@ var VideoLayout = (function (my) {
|
||||||
var videoStream = simulcast.getReceivingVideoStream(stream);
|
var videoStream = simulcast.getReceivingVideoStream(stream);
|
||||||
RTC.attachMediaStream(sel, videoStream);
|
RTC.attachMediaStream(sel, videoStream);
|
||||||
|
|
||||||
if (isVideo)
|
if (isVideo) {
|
||||||
waitForRemoteVideo(sel, thessrc, stream);
|
waitForRemoteVideo(sel, thessrc, stream);
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
stream.onended = function () {
|
stream.onended = function () {
|
||||||
|
|
@ -619,7 +630,7 @@ var VideoLayout = (function (my) {
|
||||||
*/
|
*/
|
||||||
function setDisplayName(videoSpanId, displayName) {
|
function setDisplayName(videoSpanId, displayName) {
|
||||||
var nameSpan = $('#' + videoSpanId + '>span.displayname');
|
var nameSpan = $('#' + videoSpanId + '>span.displayname');
|
||||||
var defaultLocalDisplayName = "Me";
|
var defaultLocalDisplayName = interfaceConfig.DEFAULT_LOCAL_DISPLAY_NAME;
|
||||||
|
|
||||||
// If we already have a display name for this video.
|
// If we already have a display name for this video.
|
||||||
if (nameSpan.length > 0) {
|
if (nameSpan.length > 0) {
|
||||||
|
|
@ -680,6 +691,7 @@ var VideoLayout = (function (my) {
|
||||||
.bind("click", function (e) {
|
.bind("click", function (e) {
|
||||||
|
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
e.stopPropagation();
|
||||||
$('#localDisplayName').hide();
|
$('#localDisplayName').hide();
|
||||||
$('#editDisplayName').show();
|
$('#editDisplayName').show();
|
||||||
$('#editDisplayName').focus();
|
$('#editDisplayName').focus();
|
||||||
|
|
@ -698,7 +710,7 @@ var VideoLayout = (function (my) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
my.inputDisplayNameHandler = function (name) {
|
my.inputDisplayNameHandler = function (name) {
|
||||||
if (nickname !== name) {
|
if (nickname !== name) {
|
||||||
|
|
@ -715,7 +727,7 @@ var VideoLayout = (function (my) {
|
||||||
$('#localDisplayName').text(nickname + " (me)");
|
$('#localDisplayName').text(nickname + " (me)");
|
||||||
else
|
else
|
||||||
$('#localDisplayName')
|
$('#localDisplayName')
|
||||||
.text(defaultLocalDisplayName);
|
.text(interfaceConfig.DEFAULT_LOCAL_DISPLAY_NAME);
|
||||||
$('#localDisplayName').show();
|
$('#localDisplayName').show();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -911,6 +923,10 @@ var VideoLayout = (function (my) {
|
||||||
$('#largeVideoContainer').width(availableWidth);
|
$('#largeVideoContainer').width(availableWidth);
|
||||||
$('#largeVideoContainer').height(availableHeight);
|
$('#largeVideoContainer').height(availableHeight);
|
||||||
|
|
||||||
|
|
||||||
|
$('#activeSpeakerAvatar').css('top',
|
||||||
|
(availableHeight - interfaceConfig.ACTIVE_SPEAKER_AVATAR_SIZE) / 2);
|
||||||
|
|
||||||
VideoLayout.resizeThumbnails();
|
VideoLayout.resizeThumbnails();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -930,6 +946,8 @@ var VideoLayout = (function (my) {
|
||||||
$('#remoteVideos>span').width(width);
|
$('#remoteVideos>span').width(width);
|
||||||
$('#remoteVideos>span').height(height);
|
$('#remoteVideos>span').height(height);
|
||||||
|
|
||||||
|
$('.userAvatar').css('left', (width - height) / 2);
|
||||||
|
|
||||||
$(document).trigger("remotevideo.resized", [width, height]);
|
$(document).trigger("remotevideo.resized", [width, height]);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -1527,36 +1545,27 @@ var VideoLayout = (function (my) {
|
||||||
if (!isVisible) {
|
if (!isVisible) {
|
||||||
console.log("Add to last N", resourceJid);
|
console.log("Add to last N", resourceJid);
|
||||||
|
|
||||||
mediaStreams.some(function (mediaStream) {
|
var jid = connection.emuc.findJidFromResource(resourceJid);
|
||||||
if (mediaStream.peerjid
|
var mediaStream = mediaStreams[jid][MediaStream.VIDEO_TYPE];
|
||||||
&& Strophe.getResourceFromJid(mediaStream.peerjid)
|
var sel = $('#participant_' + resourceJid + '>video');
|
||||||
=== resourceJid
|
|
||||||
&& mediaStream.type === mediaStream.VIDEO_TYPE) {
|
|
||||||
var sel = $('#participant_' + resourceJid + '>video');
|
|
||||||
|
|
||||||
var videoStream = simulcast.getReceivingVideoStream(mediaStream.stream);
|
var videoStream = simulcast.getReceivingVideoStream(
|
||||||
RTC.attachMediaStream(sel, videoStream);
|
mediaStream.stream);
|
||||||
videoSrcToSsrc[sel.attr('src')] = mediaStream.ssrc;
|
RTC.attachMediaStream(sel, videoStream);
|
||||||
if (lastNPickupJid == mediaStream.peerjid) {
|
videoSrcToSsrc[sel.attr('src')] = mediaStream.ssrc;
|
||||||
// Clean up the lastN pickup jid.
|
if (lastNPickupJid == mediaStream.peerjid) {
|
||||||
lastNPickupJid = null;
|
// Clean up the lastN pickup jid.
|
||||||
|
lastNPickupJid = null;
|
||||||
|
|
||||||
// Don't fire the events again, they've already
|
// Don't fire the events again, they've already
|
||||||
// been fired in the contact list click handler.
|
// been fired in the contact list click handler.
|
||||||
VideoLayout.handleVideoThumbClicked($(sel).attr('src'), false);
|
VideoLayout.handleVideoThumbClicked($(sel).attr('src'), false);
|
||||||
|
|
||||||
updateLargeVideo = false;
|
updateLargeVideo = false;
|
||||||
}
|
}
|
||||||
|
waitForRemoteVideo(sel, mediaStream.ssrc, mediaStream.stream);
|
||||||
waitForRemoteVideo(
|
|
||||||
sel,
|
|
||||||
mediaStream.ssrc,
|
|
||||||
mediaStream.stream);
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
// The endpoint that was being shown in the large video has dropped out
|
// The endpoint that was being shown in the large video has dropped out
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue