STEINNI
116 lines
4.4 KiB
JavaScript
Executable File
116 lines
4.4 KiB
JavaScript
Executable File
class SamplerView extends EICDomContent {
|
|
// all mpeg preloading not in dependency anymore,
|
|
// but here, when you're really about to use then
|
|
|
|
sounds = [
|
|
{"name": "98.mp3","path": "/app/assets/sfx/sampler/", 'label': '98'},
|
|
{"name": "quenouilles.mp3","path": "/app/assets/sfx/sampler/", 'label': 'As-tu vu?'},
|
|
{"name": "celebrate.mp3","path": "/app/assets/sfx/sampler/", 'label': 'party'},
|
|
{"name": "paillettes.mp3","path": "/app/assets/sfx/sampler/", 'label': 'paillettes'},
|
|
{"name": "manu.mp3","path": "/app/assets/sfx/sampler/", 'label': 'Manu'},
|
|
{"name": "projet.mp3","path": "/app/assets/sfx/sampler/", 'label': 'Projet'},
|
|
{"name": "judgenot.mp3","path": "/app/assets/sfx/sampler/", 'label': 'Judge not!'},
|
|
{"name": "metaphore.mp3","path": "/app/assets/sfx/sampler/", 'label': 'Metaphore'},
|
|
{"name": "gamin.mp3","path": "/app/assets/sfx/sampler/", 'label': 'Gamin!'},
|
|
{"name": "jcvd.mp3","path": "/app/assets/sfx/sampler/", 'label': '1+1=11'},
|
|
{"name": "balladur.mp3","path": "/app/assets/sfx/sampler/", 'label': 'Arretez!'},
|
|
{"name": "guingamp.mp3","path": "/app/assets/sfx/sampler/", 'label': 'En avant !'},
|
|
{"name": "phrases.mp3","path": "/app/assets/sfx/sampler/", 'label': 'Phrases...'},
|
|
{"name": "bourpif.mp3","path": "/app/assets/sfx/sampler/", 'label': 'Raoul'},
|
|
{"name": "fairplay.mp3","path": "/app/assets/sfx/sampler/", 'label': 'Fairplay'},
|
|
{"name": "neanderthal.mp3","path": "/app/assets/sfx/sampler/", 'label': 'Neanderthal'},
|
|
{"name": "hassancehef.mp3","path": "/app/assets/sfx/sampler/", 'label': 'C\'est possible !'}
|
|
];
|
|
|
|
mixer = null;
|
|
|
|
constructor() {
|
|
super();
|
|
}
|
|
|
|
DOMContentLoaded() {
|
|
this.pads = this.findAll('.pad');
|
|
this.init();
|
|
this.preloadSounds(this.sounds);
|
|
}
|
|
|
|
DOMContentRemoved() { window.removeEventListener('keyup',this.keyHandler); }
|
|
|
|
init() {
|
|
for(let i = 0; i < this.sounds.length; i++) {
|
|
let data = this.sounds[i];
|
|
this.pads[i].name = data.name;
|
|
this.pads[i].querySelector('label').innerText = data.label;
|
|
let button = this.pads[i].querySelector('button');
|
|
button.addEventListener('click', this.play.bind(this, data.name));
|
|
}
|
|
this.keyHandler = this.onKeyPressed.bind(this);
|
|
window.addEventListener('keyup', this.keyHandler);
|
|
}
|
|
|
|
preloadSounds(sndList){
|
|
for(let snd of sndList){
|
|
app.Assets.loadSound({
|
|
'id': snd.name,
|
|
'name': snd.name,
|
|
'path': snd.path
|
|
}).then(audioEl => {
|
|
audioEl.addEventListener("play", this.playBoy.bind(this));
|
|
audioEl.addEventListener("pause", this.pauseBoy.bind(this));
|
|
let pad, idx;
|
|
for([idx, pad] of this.pads.entries()){
|
|
if(pad.name==audioEl.getAttribute('aid')) {
|
|
pad.querySelector('button').classList.add('assigned');
|
|
break;
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
playBoy(event){
|
|
let aid = event.target.getAttribute('aid');
|
|
let pad, idx;
|
|
for([idx, pad] of this.pads.entries()){
|
|
if(pad.name==aid) {
|
|
pad.querySelector('button').classList.remove('assigned')
|
|
pad.querySelector('button').classList.add('playing');
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
|
|
pauseBoy(event){
|
|
let aid = event.target.getAttribute('aid');
|
|
let pad, idx;
|
|
for([idx, pad] of this.pads.entries()){
|
|
if(pad.name==aid) {
|
|
pad.querySelector('button').classList.remove('playing')
|
|
pad.querySelector('button').classList.add('assigned');
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
|
|
play(audioid, event) {
|
|
event.stopPropagation();
|
|
|
|
if(this.mixer) {
|
|
this.mixer.pause();
|
|
this.mixer.currentTime = 0;
|
|
}
|
|
this.mixer = app.Assets.Store.sfx[audioid];
|
|
this.mixer.play();
|
|
}
|
|
|
|
stop() {}
|
|
|
|
onKeyPressed(event) {
|
|
let btn = document.querySelector('button[accessKey="'+event.key.toLowerCase()+'"]');
|
|
if(btn) btn.click();
|
|
}
|
|
|
|
}
|
|
|
|
app.registerClass('SamplerView',SamplerView);
|