const generateToneButton = document.querySelector('#generate-tone > button:nth-of-type(1)')
const playButton = document.querySelector('#generate-tone > button:nth-of-type(2)')
const stopButton = document.querySelector('#generate-tone > button:nth-of-type(3)')
const toneDisplay = document.querySelector('#generate-tone dd')
const minInput = document.querySelector('#generate-tone input:nth-of-type(1)')
const maxInput = document.querySelector('#generate-tone input:nth-of-type(2)')

const synth = new Tone.Synth().toDestination()

let newTone
let lowest = 'a0'
let highest = 'c8'
const notes = [
	['c'],
	['c#','db'],
	['d'],
	['d#', 'eb'],
	['e'],
	['f'],
	['f#','gb'],
	['g'],
	['g#', 'ab'],
	['a'],
	['a#', 'bb'],
	['b']
]

minInput.setAttribute('placeholder', lowest)
maxInput.setAttribute('placeholder', highest)

generateToneButton.addEventListener('click', () => {
	Tone.start()
	if(!document.querySelector('[type="checkbox"]').checked) {
		
		const minFreq = teoria.note(lowest).fq()
		const maxFreq = teoria.note(highest).fq()
		newTone = (Math.random() * (maxFreq - minFreq)) + minFreq 

	} else {

		const lowOctave = parseInt(lowest.charAt(lowest.length - 1)) * 12
		const highOctave = parseInt(highest.charAt(highest.length - 1)) * 12
		const lowNote = notes.findIndex(enharmonics => enharmonics.includes(lowest.substring(0, lowest.length-1)))
		const highNote = notes.findIndex(enharmonics => enharmonics.includes(highest.substring(0, highest.length-1)))

		const lowPitch = lowOctave + lowNote
		const highPitch = highOctave + highNote
		const pitchSpread = highPitch - lowPitch
		const randomAddedPitches = Math.floor(Math.random() * (pitchSpread + 1) )
		const randomPitch = lowPitch + randomAddedPitches

		const randomPitchOctave = Math.floor(randomPitch / 12)
		const randomPitchNote = randomPitch % 12

		newTone = notes[randomPitchNote][0] + randomPitchOctave
		newTone = teoria.note(newTone).fq()

	}
	toneDisplay.innerHTML = newTone
})

playButton.addEventListener('click', ()=>{
	synth.triggerAttack(newTone)
})

stopButton.addEventListener('click', ()=>{
	synth.triggerRelease()
})

minInput.addEventListener('change', ()=>{
	lowest = minInput.value
})

maxInput.addEventListener('change', ()=>{
	highest = maxInput.value
})

startPitchDetection((heardPitch)=>{
	if(heardPitch !== -1 && newTone) {
		const centsDifference = 1200 * Math.log2(heardPitch / newTone)
		document.querySelector('#analyze-pitch input[type="range"]').value = centsDifference
	}
	if(heardPitch === -1){
		document.querySelector('#analyze-pitch input[type="range"]').value = 0
	}
});