60 lines
1.7 KiB
JavaScript
60 lines
1.7 KiB
JavaScript
const audio = document.querySelector('#stream')
|
|
const playPauseButton = document.querySelector('[name="play-pause"]')
|
|
const playPauseButtonIcon = playPauseButton.querySelector('i.icon')
|
|
const volumeControl = document.querySelector('[name="volume"]')
|
|
const currentlyPlaying = document.querySelector('.currently-playing-title')
|
|
const volumeButton = document.querySelector('[name="mute"]')
|
|
const volumeButtonIcon = volumeButton.querySelector('i.icon')
|
|
|
|
let isPlaying = false
|
|
let fetchInterval = null
|
|
let currentVolume = 0.2
|
|
|
|
audio.volume = currentVolume
|
|
const adjustVolumeIcon = volume => {
|
|
volumeButtonIcon.classList.remove('icon-silenci')
|
|
volumeButtonIcon.classList.remove('icon-so')
|
|
|
|
if (volume === 0) {
|
|
volumeButtonIcon.classList.add('icon-silenci')
|
|
} else {
|
|
volumeButtonIcon.classList.add('icon-so')
|
|
}
|
|
}
|
|
volumeControl.addEventListener('input', () => {
|
|
const volume = parseFloat(volumeControl.value)
|
|
|
|
audio.volume = currentVolume = volume
|
|
currentVolume = volume
|
|
|
|
adjustVolumeIcon(volume)
|
|
})
|
|
|
|
volumeButton.addEventListener('click', () => {
|
|
if (audio.volume > 0) {
|
|
adjustVolumeIcon(0)
|
|
audio.volume = 0
|
|
volumeControl.value = 0
|
|
} else {
|
|
adjustVolumeIcon(currentVolume)
|
|
audio.volume = currentVolume
|
|
volumeControl.value = currentVolume
|
|
}
|
|
})
|
|
|
|
playPauseButton.addEventListener('click', () => {
|
|
if (isPlaying) {
|
|
audio.pause()
|
|
|
|
playPauseButtonIcon.classList.remove('icon-pausa')
|
|
playPauseButtonIcon.classList.add('icon-play')
|
|
|
|
} else {
|
|
audio.play()
|
|
|
|
playPauseButtonIcon.classList.remove('icon-play')
|
|
playPauseButtonIcon.classList.add('icon-pausa')
|
|
}
|
|
isPlaying = !isPlaying
|
|
})
|