Term 2 – Week 4

This week I have managed to complete the audio failure notification task using events.

One thing that stood out when working with the events was related to the listeners. When adding an event listener to componentWillMount() it is best to remove the listener in componentWillUnmount(). eg :

componentDidMount() {
window.addEventListener(“webrtc.failed”, this.handleAudioFailure);
window.addEventListener(“webrtc.mediaFailed”, this.handleMediaFailure);
}

componentWillUnmount() {
window.removeEventListener(“webrtc.failed”, this.handleAudioFailure);
window.removeEventListener(“webrtc.mediaFailed”, this.handleMediaFailure);
}

Next I moved on to shrinking the size of the audio modal. This happened to be nothing more than a simple css change to make a background transparent. The only trick here was figuring out how to change the style for a specific modal and not affect the styles for the other modals. To do this I create a new property for the modal base ‘isTransparent’
and set this to a Boolean. By doing this I can then use that property to select a particular style. This task was relatively straight forward.

There is a mute button that I need to make “glow”, the idea is to indicate to the user when they are speaking through their mic. There is a voiceUser object and inside is a Boolean variable which indicates weather or not the user is speaking through the Mic. The way i went about this was to create a service to get the current user and fetch the value for the ‘isTalking’. Taking that variable and passing it down as a property to the mute button component i could then use it to affect the different styles to be applied.

The tasks i have been working on since the audio failure notifications have been relatively simple UI updates.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s