jam-cloud/web/app/assets/javascripts/react-components/SessionOtherTracks.js.jsx.c...

83 lines
2.5 KiB
CoffeeScript

context = window
ReactCSSTransitionGroup = React.addons.CSSTransitionGroup
@SessionOtherTracks = React.createClass({
mixins: [Reflux.listenTo(@SessionOtherTracksStore,"onInputsChanged"), Reflux.listenTo(@AppStore,"onAppInit")]
onInputsChanged: (sessionMixers) ->
session = sessionMixers.session
mixers = sessionMixers.mixers
noAudioUsers = mixers.noAudioUsers
participants = []
if session.inSession()
for participant in session.otherParticipants()
tracks = []
name = participant.user.name;
firstTrack = participant.tracks[0]
hasMixer = false
for track in participant.tracks
# try to find mixer info for this track
mixerFinder = [participant.client_id, track, false] # so that other callers can re-find their mixer data
mixerData = mixers.findMixerForTrack(participant.client_id, track, false, @props.mode)
if mixerData.mixer?
hasMixer = true
tracks.push(track: track, mixers: mixerData, mixerFinder: mixerFinder)
# todo: sessionModel.setAudioEstablished
instrumentIcon = context.JK.getInstrumentIcon45(firstTrack.instrument_id)
photoUrl = context.JK.resolveAvatarUrl(participant.user.photo_url)
participantState = {
participant: participant,
tracks: tracks,
name: name,
instrumentIcon: instrumentIcon,
photoUrl: photoUrl,
hasMixer: hasMixer,
noAudio: noAudioUsers[participant.client_id]
}
participants.push(participantState)
this.setState(participants: participants, session: session)
render: () ->
content = null
participants = []
noOthers = `<div className="when-empty">No other musicians are in your session.</div>`
if this.state.participants.length > 0
for participant in this.state.participants
participants.push(`<SessionOtherTrack key={participant.client_id} {...participant} />`)
else if this.state.session? && this.state.session.inSession()
content = noOthers
`<div className="session-other-tracks">
<h2>other live tracks</h2>
<SessionInviteMusiciansBtn />
<div className="session-tracks-scroller">
{content}
<ReactCSSTransitionGroup transitionName="session-track-list" transitionAppear={true}>
{participants}
</ReactCSSTransitionGroup>
</div>
</div>`
getInitialState:() ->
{participants:[], session: null}
onAppInit: (app) ->
@app = app
})