haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactoring

This commit is contained in:
isymchych 2015-12-14 17:40:30 +02:00
parent 2af591f6d9
commit 4f91ac01fd
6 changed files with 57 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
modules/UI/UI.js
View File

@ -14,11 +14,11 @@ import UIUtil from "./util/UIUtil";
import UIEvents from "../../service/UI/UIEvents";
import VideoLayout from "./videolayout/VideoLayout";
import SettingsMenu from "./side_pannels/settings/SettingsMenu";
var Prezi = require("./prezi/Prezi");
var Etherpad = require("./etherpad/Etherpad");
var EventEmitter = require("events");
var SettingsMenu = require("./side_pannels/settings/SettingsMenu");
var Settings = require("./../settings/Settings");
UI.messageHandler = require("./util/MessageHandler");
var messageHandler = UI.messageHandler;
@ -255,6 +255,7 @@ UI.start = function () {
registerListeners();
VideoLayout.init(eventEmitter);
ContactList.init(eventEmitter);
bindEvents();
setupPrezi();
@ -355,6 +356,8 @@ function initEtherpad(name) {
}
UI.addUser = function (id, displayName) {
ContactList.addContact(id);
messageHandler.notify(
displayName,'notify.somebody', 'connected', 'notify.connected'
);
@ -367,22 +370,21 @@ UI.addUser = function (id, displayName) {
UI.setUserAvatar(id, displayName);
// Add Peer's container
VideoLayout.ensurePeerContainerExists(id);
VideoLayout.addParticipantContainer(id);
};
UI.removeUser = function (id, displayName) {
console.log('left.muc', id);
messageHandler.notify(displayName,'notify.somebody',
'disconnected',
'notify.disconnected');
if (!config.startAudioMuted ||
config.startAudioMuted > APP.conference.membersCount) {
ContactList.removeContact(id);
messageHandler.notify(
displayName,'notify.somebody', 'disconnected', 'notify.disconnected'
);
if (!config.startAudioMuted || config.startAudioMuted > APP.conference.membersCount) {
UIUtil.playSoundNotification('userLeft');
}
ContactList.removeContact(id);
VideoLayout.participantLeft(id);
VideoLayout.removeParticipantContainer(id);
};
function onMucPresenceStatus(jid, info) {

55
modules/UI/side_pannels/contactlist/ContactList.js
View File

@ -1,8 +1,9 @@
/* global $, APP */
import Avatar from '../../avatar/Avatar';
import UIEvents from '../../../../service/UI/UIEvents';
var numberOfContacts = 0;
var notificationInterval;
let numberOfContacts = 0;
let notificationInterval;
/**
* Updates the number of participants in the contact list button and sets
@ -30,7 +31,7 @@ function updateNumberOfParticipants(delta) {
* @return {object} the newly created avatar element
*/
function createAvatar(jid) {
var avatar = document.createElement('img');
let avatar = document.createElement('img');
avatar.className = "icon-avatar avatar";
avatar.src = Avatar.getContactListUrl(jid);
@ -43,7 +44,7 @@ function createAvatar(jid) {
* @param displayName the display name to set
*/
function createDisplayNameParagraph(key, displayName) {
var p = document.createElement('p');
let p = document.createElement('p');
if (displayName) {
p.innerText = displayName;
} else if(key) {
@ -76,39 +77,32 @@ function contactElExists (id) {
* Contact list.
*/
var ContactList = {
init (emitter) {
this.emitter = emitter;
},
/**
* Indicates if the chat is currently visible.
*
* @return <tt>true</tt> if the chat is currently visible, <tt>false</tt> -
* otherwise
*/
isVisible: function () {
isVisible () {
return $('#contactlist').is(":visible");
},
/**
* Adds a contact for the given id if such doesn't yet exist.
*
*/
ensureAddContact: function (id) {
if (!contactElExists(id)) {
ContactList.addContact(id);
}
},
/**
* Adds a contact for the given id.
*
*/
addContact: function (id) {
var contactlist = $('#contacts');
addContact (id) {
let contactlist = $('#contacts');
var newContact = document.createElement('li');
let newContact = document.createElement('li');
newContact.id = id;
newContact.className = "clickable";
newContact.onclick = function (event) {
newContact.onclick = (event) => {
if (event.currentTarget.className === "clickable") {
$(ContactList).trigger('contactclicked', [id]);
this.emitter.emit(UIEvents.CONTACT_CLICKED, id);
}
};
@ -127,7 +121,7 @@ var ContactList = {
* Removes a contact for the given id.
*
*/
removeContact: function (id) {
removeContact (id) {
let contact = getContactEl(id);
if (contact.length > 0) {
@ -136,15 +130,14 @@ var ContactList = {
}
},
setVisualNotification: function (show, stopGlowingIn) {
var glower = $('#contactListButton');
setVisualNotification (show, stopGlowingIn) {
let glower = $('#contactListButton');
if (show && !notificationInterval) {
notificationInterval = window.setInterval(function () {
glower.toggleClass('active glowing');
}, 800);
}
else if (!show && notificationInterval) {
} else if (!show && notificationInterval) {
stopGlowing(glower);
}
if (stopGlowingIn) {
@ -154,28 +147,28 @@ var ContactList = {
}
},
setClickable: function (id, isClickable) {
setClickable (id, isClickable) {
getContactEl(id).toggleClass('clickable', isClickable);
},
onDisplayNameChange: function (id, displayName) {
onDisplayNameChange (id, displayName) {
if (id === 'localVideoContainer') {
id = APP.conference.localId;
}
var contactName = $(`#contacts #${id}>p`);
let contactName = $(`#contacts #${id}>p`);
if (displayName) {
contactName.html(displayName);
}
},
changeUserAvatar: function (id, contactListUrl) {
changeUserAvatar (id, contactListUrl) {
// set the avatar in the contact list
var contact = $(`#${id}>img`);
let contact = $(`#${id}>img`);
if (contact.length > 0) {
contact.attr('src', contactListUrl);
}
}
};
module.exports = ContactList;
export default ContactList;

5
modules/UI/side_pannels/settings/SettingsMenu.js
View File

@ -21,7 +21,7 @@ function generateLanguagesSelectBox() {
}
var SettingsMenu = {
const SettingsMenu = {
init: function (emitter) {
this.emitter = emitter;
@ -97,5 +97,4 @@ var SettingsMenu = {
}
};
module.exports = SettingsMenu;
export default SettingsMenu;

3
modules/UI/videolayout/ConnectionIndicator.js
View File

@ -365,7 +365,8 @@ ConnectionIndicator.prototype.updateResolution = function (resolution) {
*/
ConnectionIndicator.prototype.updatePopoverData = function () {
this.popover.updateContent(
"<div class=\"connection_info\">" + this.generateText() + "</div>");
`<div class="connection_info">${this.generateText()}</div>`
);
APP.translation.translateElement($(".connection_info"));
};

45
modules/UI/videolayout/VideoLayout.js
View File

@ -2,7 +2,6 @@
/* jshint -W101 */
import AudioLevels from "../audio_levels/AudioLevels";
import ContactList from "../side_pannels/contactlist/ContactList";
import UIEvents from "../../../service/UI/UIEvents";
import UIUtil from "../util/UIUtil";
@ -36,19 +35,15 @@ var focusedVideoResourceJid = null;
/**
* On contact list item clicked.
*/
$(ContactList).bind('contactclicked', function(event, id) {
if (!id) {
return;
}
function onContactClicked (id) {
if (APP.conference.isLocalId(id)) {
$("#localVideoContainer").click();
return;
}
var remoteVideo = remoteVideos[id];
let remoteVideo = remoteVideos[id];
if (remoteVideo && remoteVideo.selectVideoElement().length) {
var videoThumb = remoteVideo.selectVideoElement()[0];
let videoThumb = remoteVideo.selectVideoElement()[0];
// It is not always the case that a videoThumb exists (if there is
// no actual video).
if (RTC.getVideoSrc(videoThumb)) {
@ -72,7 +67,7 @@ $(ContactList).bind('contactclicked', function(event, id) {
eventEmitter.emit(UIEvents.PINNED_ENDPOINT, id);
}
}
});
}
/**
* Returns the corresponding resource id to the given peer container
@ -106,6 +101,7 @@ var VideoLayout = {
VideoLayout.resizeLargeVideoContainer();
emitter.addListener(UIEvents.CONTACT_CLICKED, onContactClicked);
},
isInLastN (resource) {
@ -242,7 +238,6 @@ var VideoLayout = {
onRemoteStreamAdded (stream) {
let id = stream.getParticipantId();
VideoLayout.ensurePeerContainerExists(id);
remoteVideos[id].addRemoteStreamElement(stream);
},
@ -340,13 +335,7 @@ var VideoLayout = {
* @return Returns <tt>true</tt> if the peer container exists,
* <tt>false</tt> - otherwise
*/
ensurePeerContainerExists (id) {
ContactList.ensureAddContact(id);
if (remoteVideos[id]) {
return;
}
addParticipantContainer (id) {
let remoteVideo = new RemoteVideo(id, VideoLayout, eventEmitter);
remoteVideos[id] = remoteVideo;
@ -534,7 +523,6 @@ var VideoLayout = {
if (resourceJid === APP.xmpp.myResource()) {
localVideoThumbnail.showAudioIndicator(isMuted);
} else {
VideoLayout.ensurePeerContainerExists(jid);
remoteVideos[resourceJid].showAudioIndicator(isMuted);
if (APP.xmpp.isModerator()) {
remoteVideos[resourceJid].updateRemoteVideoMenu(isMuted);
@ -555,7 +543,6 @@ var VideoLayout = {
} else {
var resource = Strophe.getResourceFromJid(jid);
VideoLayout.ensurePeerContainerExists(jid);
var remoteVideo = remoteVideos[resource];
remoteVideo.showVideoIndicator(value);
@ -575,7 +562,6 @@ var VideoLayout = {
APP.conference.isLocalId(id)) {
localVideoThumbnail.setDisplayName(displayName);
} else {
VideoLayout.ensurePeerContainerExists(id);
remoteVideos[id].setDisplayName(displayName, status);
}
},
@ -801,23 +787,22 @@ var VideoLayout = {
/**
* Updates remote stats.
* @param jid the jid associated with the stats
* @param id the id associated with the stats
* @param percent the connection quality percent
* @param object the stats data
*/
updateConnectionStats (jid, percent, object) {
var resourceJid = Strophe.getResourceFromJid(jid);
if (remoteVideos[resourceJid])
remoteVideos[resourceJid].updateStatsIndicator(percent, object);
updateConnectionStats (id, percent, object) {
if (remoteVideos[id]) {
remoteVideos[id].updateStatsIndicator(percent, object);
}
},
/**
* Hides the connection indicator
* @param jid
* @param id
*/
hideConnectionIndicator (jid) {
remoteVideos[Strophe.getResourceFromJid(jid)].hideConnectionIndicator();
hideConnectionIndicator (id) {
remoteVideos[id].hideConnectionIndicator();
},
/**
@ -830,7 +815,7 @@ var VideoLayout = {
localVideoThumbnail.hideIndicator();
},
participantLeft (id) {
removeParticipantContainer (id) {
// Unlock large video
if (focusedVideoResourceJid === id) {
console.info("Focused video owner has left the conference");

1
service/UI/UIEvents.js
View File

@ -32,6 +32,7 @@ export default {
TOGGLE_SETTINGS: "UI.toggle_settings",
TOGGLE_CONTACT_LIST: "UI.toggle_contact_list",
TOGGLE_FILM_STRIP: "UI.toggle_film_strip",
CONTACT_CLICKED: "UI.contact_clicked",
HANGUP: "UI.hangup",
LOGOUT: "UI.logout",
RECORDING_TOGGLE: "UI.recording_toggle",