I'm making a game with Sugarcube and I making a slider for a volume music and effects. but i can't make that the change and input events are listened in a cordova aplication in my ifone.
i tested it in my pc with Microsoft Edge, in my mac with Safari, and in my android like apk compiled with Cordova.
i compiled it for ios with change and input event for my inputs range don't work.
here is the code:
<label for="musica">Activar música</label><input type="checkbox" id="musica">
<label for="vmusica" id="smusica">Volumen de la música</label><input type="range" min="0" max="100" step="10" id="vmusica">
<label for="efectos">Activar efectos de sonido</label><input type="checkbox" id="efectos">
<label for="vefectos" id="sefectos">Volumen de los efectos de sonido</label><input type="range" min="0" max="100" step="10" id="vefectos">
<script>
document.querySelector("#vmusica").value=parseInt(SugarCube.State.variables.vmusica*100);
document.querySelector("#musica").checked=SugarCube.State.variables.sonidito;
document.querySelector("#vmusica").style.display =document.querySelector("#musica").checked ? "inline-block" : "none";
document.querySelector("#smusica").style.display =document.querySelector("#musica").checked ? "inline-block" : "none";
document.querySelector("#vefectos").value=parseInt(SugarCube.State.variables.vefectos*100);
document.querySelector("#efectos").checked=SugarCube.State.variables.efectitos;
document.querySelector("#vefectos").style.display =document.querySelector("#efectos").checked ? "inline-block" : "none";
document.querySelector("#sefectos").style.display =document.querySelector("#efectos").checked ? "inline-block" : "none";
document.querySelector("#efectos").addEventListener("change", function(){
SugarCube.State.variables.efectitos=this.checked ? true : false;
SugarCube.State.display("efectos",SugarCube.Story.get("efectos"));
});
document.querySelector("#musica").addEventListener("change", function(){
SugarCube.State.variables.sonidito=this.checked ? true : false;
if (this.checked) {
SugarCube.State.display("sonido",SugarCube.Story.get("efectos"));
}
else{
SugarCube.SimpleAudio.select(":playing").pause();
}
SugarCube.State.display("efectos",SugarCube.Story.get("efectos"));
});
document.querySelector("#vmusica").addEventListener("change", () => {
SugarCube.State.variables.vmusica=parseFloat(document.querySelector("#vmusica").value/100);
SugarCube.SimpleAudio.select(":playing").volume(SugarCube.State.variables.vmusica);
});
document.querySelector("#vefectos").addEventListener("change", () => {
SugarCube.State.variables.vefectos=parseFloat(document.querySelector("#vefectos").value/100);
});
</script>
i want that when i change the slider for example 10% the music or effects the sounds low o up the volume in real time. in my pc and in my android works perfectly but in ios no. thanks, Any help or suggestions would be greatly appreciated. Thank you!