59 lines
1.4 KiB
JavaScript

const Alert = require('./alert.js');
const Input = require('./input.js');
const Notifications = require('./notifications.js');
const React = require('react');
const _ = require('underscore');
const activeStore = require('../store/activeStore.js');
const debug = require('debug')('peer-calls:app');
const dispatcher = require('../dispatcher/dispatcher.js');
const streamStore = require('../store/streamStore.js');
function app() {
let streams = streamStore.getStreams();
function play(event) {
try {
event.target.play();
} catch (e) {
debug('error starting video: %s', e.name);
}
}
let videos = _.map(streams, (stream, userId) => {
let url = stream.url;
function markActive(event) {
play(event);
dispatcher.dispatch({
type: 'mark-active',
userId: activeStore.isActive(userId) ? undefined : userId
});
}
let className = 'video-container';
className += activeStore.isActive(userId) ? ' active' : '';
return (
<div className={className} key={userId}>
<video
muted={userId === '_me_'}
onClick={markActive}
onLoadedMetadata={play}
src={url}
/>
</div>
);
});
return (<div className="app">
<Alert />
<Notifications />
<Input />
<div className="videos">
{videos}
</div>
</div>);
}
module.exports = app;