ensl_gathers/lib/react/sound.jsx

108 lines
2.1 KiB
React
Raw Normal View History

2015-08-27 16:54:34 +00:00
"use strict";
class SoundController {
constructor () {
if (Howl === undefined) {
throw new Error("Howl.js required to created sound controller");
}
this.minPlayInterval = 300000; // 5 minutes
this.isMuted = Howler._muted;
this.volume = Howler._volume;
2015-09-18 11:47:26 +00:00
this.tunes = {
"classic": {
description: "Classic",
url: 'http://www.ensl.org/sounds/gather-1.mp3'
},
"eyeofthegorgie": {
description: "Eye of the Gorgie",
url: 'http://www.ensl.org/files/audio/eyeofthegorgie.mp3'
}
}
this.setupGatherMusic("classic");
2015-08-27 16:54:34 +00:00
}
volume(val) {
if (typeof val === 'number' && Math.abs(val) <= 1) {
this.volume = val;
return Howler.volume(val)
}
}
mute() {
this.isMuted = true;
return Howler.mute();
}
unMute() {
this.isMuted = false;
return Howler.unmute();
}
2015-09-18 11:47:26 +00:00
setupGatherMusic (musicName) {
let self = this;
let gatherMusic = this.tunes[musicName];
if (!gatherMusic) return;
if (self.gather && self.gather.name === musicName) return;
// Stop if already playing
if (self.gather && self.gather.music) {
self.gather.music.stop();
}
let tune = self.tunes[musicName];
self.gather = {
name: musicName,
description: tune.description,
music: new Howl({
urls: [tune.url]
}),
playable: true
};
}
playGatherMusic (options) {
2015-08-27 16:54:34 +00:00
var self = this;
2015-09-18 11:47:26 +00:00
options = options || {};
2015-08-27 16:54:34 +00:00
if (!self.gather.playable) return;
self.gather.music.play();
2015-09-14 17:40:27 +00:00
self.gather.playable = false;
2015-09-18 11:47:26 +00:00
if (options.throttle === false) {
setTimeout(function () {
self.gather.playable = true;
}, self.minPlayInterval);
}
2015-08-27 16:54:34 +00:00
}
}
var SoundPanel = React.createClass({
mute() {
soundController.mute();
this.forceUpdate();
},
unMute() {
soundController.unMute();
this.forceUpdate();
},
render() {
if (soundController.isMuted) {
return (
<li>
<a href="#" onClick={this.unMute}>
2015-09-17 11:40:11 +00:00
Muted&nbsp;<i className="fa fa-volume-off fa-fw"></i>
2015-08-27 16:54:34 +00:00
</a>
</li>
);
} else {
return (
<li>
<a href="#" onClick={this.mute}>
2015-09-17 11:40:11 +00:00
Unmuted&nbsp;<i className="fa fa-volume-up fa-fw"></i>
2015-08-27 16:54:34 +00:00
</a>
</li>
);
}
}
})