After creating my custom function to fetch data from an API in order to change the user's pace, I defined the changePace function with a parameter named "pace". This parameter will be determined based on the user's selection of one of four paces: Steady, Strenuous, Grueling, or Resting.
However, when attempting to execute the changePace function with the correct parameter, I encountered the following error:
trail.js:8 Uncaught ReferenceError: steady is not defined
at HTMLBodyElement.document.body.onkeyup
JS FILE :
document.body.onkeyup = function(e){
if(e.keyCode == 13){
document.getElementById("paces").style.color = "white";
paceDiv = true;
console.log("Works");
}
if(e.keyCode == 49 && paceDiv == true) {
changePace(steady);
document.getElementById("paces").style.color = "black";
}
if(e.keyCode == 50 && paceDiv == true){
changePace(strenuous);
document.getElementById("paces").style.color = "black";
}
if(e.keyCode == 51 && paceDiv == true){
changePace(grueling);
document.getElementById("paces").style.color = "black";
}
if(e.keyCode == 52 && paceDiv == true){
changePace(resting);
document.getElementById("paces").style.color = "black";
}
if(e.keyCode == 32) {
changeDay();
document.getElementById("paces").style.color = "black";
}
}
function changePace(pace) {
fetch('/api/changePace',
{method: "post",
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: '{"pace": "' + pace + '"}'
})
.then(function(response) {
if (response.status !== 200) {
console.log('Error: ' + response.status + "..." + response.value);
return;
}
response.json().then(function(data) {
changeDay();
});
});
}