trent/fcc-challenges
1
0
Fork 0
mirror of https://github.com/TrentSPalmer/fcc-challenges.git synced 2024-11-23 03:41:30 -08:00
Code Issues Projects Releases Wiki Activity

drum-machine make metronome continue on volume, sound, or bpm change

Browse Source
This commit is contained in:
Trent Palmer 2020-05-29 12:28:59 -07:00
parent 14e3f33729
commit 09f76acd55
3 changed files with 18 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
drum-machine/README.md
View File

@ -9,5 +9,3 @@
* [FreeCodeCamp Section](https://www.freecodecamp.org/learn/front-end-libraries/front-end-libraries-projects) * [FreeCodeCamp Section](https://www.freecodecamp.org/learn/front-end-libraries/front-end-libraries-projects)
### TODOS ### TODOS
* make sure metronome continues on volume, sound, or metronome BPM change

16
drum-machine/drumMachine.js
View File

@ -138,17 +138,31 @@ const playSample = (key) => {
const metronome = (key) => { const metronome = (key) => {
let keyDuration = parseInt(sessionStorage.getItem(key+'metronomeTempo')); let keyDuration = parseInt(sessionStorage.getItem(key+'metronomeTempo'));
const sound = document.getElementById(key); const sound = document.getElementById(key);
const soundFile = sound.src.slice(36);
const volumeOffSet = sessionStorage.getItem(key+'volume');
sound.volume = getVolume(key); sound.volume = getVolume(key);
sound.play(); sound.play();
let refreshMetronome = setInterval(function(){ let refreshMetronome = setInterval(function(){
keyDuration = parseInt(sessionStorage.getItem(key+'metronomeTempo')); const newKeyDuration = parseInt(sessionStorage.getItem(key+'metronomeTempo'));
sound.pause(); sound.pause();
sound.currentTime = 0; sound.currentTime = 0;
sound.volume = getVolume(key); sound.volume = getVolume(key);
sound.play(); sound.play();
if (volumeOffSet !== sessionStorage.getItem(key+'volume')) {
clearInterval(refreshMetronome);
metronome(key);
}
if (soundFile !== sessionStorage.getItem(key)) {
clearInterval(refreshMetronome);
metronome(key);
}
if (sessionStorage.getItem(key + 'metronomeIsPlaying') === 'false') { if (sessionStorage.getItem(key + 'metronomeIsPlaying') === 'false') {
clearInterval(refreshMetronome); clearInterval(refreshMetronome);
} }
if (newKeyDuration !== keyDuration) {
clearInterval(refreshMetronome);
metronome(key);
}
},keyDuration); },keyDuration);
}; };

6
drum-machine/makeSelection.js
View File

@ -15,6 +15,7 @@ const volumeMenuArray = ['+30','+20','+10','0','-10','-20','-30'];
const stopMetronomes = () => { const stopMetronomes = () => {
padsArray.forEach(pad => { padsArray.forEach(pad => {
sessionStorage.setItem(pad + 'metronomeIsPlaying', 'false'); sessionStorage.setItem(pad + 'metronomeIsPlaying', 'false');
makeMetronomeIcons(pad);
}); });
}; };
@ -43,14 +44,13 @@ const makeMetronomeSelection = (selection) => {
metronomeMenuDisplayed = false; metronomeMenuDisplayed = false;
$('#display-middle-left-b').html((drumPadGrid)); $('#display-middle-left-b').html((drumPadGrid));
$('#menuScrollTip').remove(); $('#menuScrollTip').remove();
makeAudioControl(padSelectingFor); makeMetronomeIcons(padSelectingFor);
} else if (selection.match(/\d{2,3}/)) { } else if (selection.match(/\d{2,3}/)) {
sessionStorage.setItem(padSelectingFor + 'metronomeTempo',Math.round(60000 / parseInt(selection.split(':')[1]))); sessionStorage.setItem(padSelectingFor + 'metronomeTempo',Math.round(60000 / parseInt(selection.split(':')[1])));
sessionStorage.setItem(padSelectingFor + 'isMetronome',true); sessionStorage.setItem(padSelectingFor + 'isMetronome',true);
metronomeMenuDisplayed = false; metronomeMenuDisplayed = false;
$('#display-middle-left-b').html((drumPadGrid)); $('#display-middle-left-b').html((drumPadGrid));
$('#menuScrollTip').remove(); $('#menuScrollTip').remove();
makeAudioControl(padSelectingFor);
makeMetronomeIcons(padSelectingFor); makeMetronomeIcons(padSelectingFor);
} else if (selection === '( cancel -- back )') { } else if (selection === '( cancel -- back )') {
if (padSelectingFor === '') { if (padSelectingFor === '') {
@ -230,7 +230,7 @@ const makeSelection = (selection) => {
menuDisplayed = false; menuDisplayed = false;
$('#display-middle-left-b').html((drumPadGrid)); $('#display-middle-left-b').html((drumPadGrid));
$('#menuScrollTip').remove(); $('#menuScrollTip').remove();
makeAudioControl(padSelectingFor); makeMetronomeIcons(padSelectingFor);
} else if (selection === '( cancel -- back )') { } else if (selection === '( cancel -- back )') {
if (fileStringArray.length === 0) { if (fileStringArray.length === 0) {
if (padSelectingFor === '') { if (padSelectingFor === '') {