I am hoping someone is able to help with a problem I am having. The below code manages the audio player on a website I am developing. The idea is that the user can click a mute button to toggle sound on the website and if the user clicks on a specific link to leave the site, the sound should be muted if not already.
So the first part of the script below sets a global variable for the audio player (audio html5 tag) (audioPlayer) and the second part sets a global variable for the mute button the user can click.
<script type="text/javascript">
var muteAudio = document.getElementById('audioPlayer'),
ctrl = document.getElementById('audioControl');
Then if someone clicks the mute button, I update the inner html of the mute button to either say mute or play, depending on what status the button is on
ctrl.onclick = function () {
// Update the Button
var pause = ctrl.innerHTML === 'Mute';
ctrl.innerHTML = pause ? 'Play' : 'Mute';
And then I update the html 5 audio embed method
// Update the Audio
var method = pause ? 'pause' : 'play';
muteAudio[method]();
// Prevent Default Action
return false;
};
The second part of the script sets a 3rd global variable for a external link (SHOP) that takes users to the e-commerce store. If the sound is on, it should get muted when the user leaves. If the sound is not on, this if statement should not execute
ctrl3 = document.getElementById('muter');
if (ctrl.innerHTML.indexOf('Mute') != -1) {
console.log('not-muted');
ctrl3.onclick = function () {
$("#audioControl").click();
return false;
};
}
else {console.log('did nothing');}
</script>
Problem is that the if statement does not appear to work. If the audio is muted, it should not execute the click function on the mute button to mute the sound when a user exits to the online store. What is happening is that the if statement always seems to be true because regardless of whether the mute button is in play state (i.e. the mute button says mute/inner html), it will toggle the sound to off if the music is playing and toggle the sound to on if the music is off (seemingly ignoring the if statements check of the inner html text.
You can see it live here http://goo.gl/DJMJBx
Thanks for your help!
Aucun commentaire:
Enregistrer un commentaire