Estoy tratando de crear un experimento en el generador de experimentos Gorilla que use ganchos js Gorilla específicos.
Hay 3 tipos de pantallas a las que se puede redirigir a un participante: una pantalla "correcta y rápida" (si responde en menos de 2 segundos), una pantalla "correcta pero lenta" (si responde en más de dos segundos) y una pantalla "incorrecta" pantalla (si dan una respuesta incorrecta).
Aquí está el código que tengo. El primer ciclo while funciona, pero falla tan pronto como intenta redirigir a los participantes a algo que no sea la pantalla "correcta y rápida".
No soy un experto con javascript en absoluto, por lo que esta podría ser la forma en que lo he escrito, pero parece que no puedo resolverlo.
//If the RT is FAST (less than 2 seconds AND correct, move to a correct fast screen) var reactionTime = gorilla.readStopwatch(); while (reactionTime <= 2000) { if (response == "g") { //If the RT is slow but still correct, move to a correct slow screen. return { new_screenName: 'Correct_fast'}; } while (reactionTime > 2000) { if (response == "g") { //If the response is incorrect, move to an incorrect screen. return { new_screenName: 'Correct_slow'}; } else if (response == "h") { return { new_screenName: 'Incorrect'}; } } }No sé nada sobre Gorilla, pero aquí hay un temporizador de vainilla js.
let start, slow = false; function step(timestamp) { start ??= timestamp; const elapsed = timestamp - start; if (elapsed > 2000) slow = true; // slow = true after 2 seconds if (elapsed < 2000) { // Recursion loop ends after 2 seconds window.requestAnimationFrame(step); } } window.requestAnimationFrame(step); // requestAnimationFrame passes step() one argument, a DOMHighResTimeStamp similar to the one returned by performance.now()Tratar con el tiempo entre eventos asíncronos puede requerir habilidades/experiencia avanzada de JS y es una buena manera de obligarse a aprender mucho rápidamente. Así es como yo resolvería este problema.
async function TestExperiment(){ var answer, wasSlow, newScreenName; [answer, wasSlow] = await Promise.all([getAnswer(), checkIfSlow()]) if (answer == 'wrong') newScreenName = 'incorrect' else if (!wasSlow) newScreenName = 'correct_fast' else if (wasSlow) newScreenName = 'correct_slow' console.log('New Page =>', newScreenName) function checkIfSlow(){ return new Promise( resolve => { let start, slow = false; function step(timestamp) { start ??= timestamp; const elapsed = timestamp - start; if (answer) resolve(slow) // resolve early if answer set before 2 seconds if (elapsed > 2000) { // resolve after 2 seconds slow = true; resolve(slow) } if (elapsed < 2000) { window.requestAnimationFrame(step); } } window.requestAnimationFrame(step); }) } function getAnswer() { return new Promise( resolve => { let correctBtn = document.getElementById('correct') let wrongBtn = document.getElementById('wrong') correctBtn.onclick = () => { answer = 'correct' resolve(answer) } wrongBtn.onclick = () => { answer = 'wrong' resolve(answer) } }); } } TestExperiment() <button id="correct">correct</button> <button id="wrong">wrong</button>Creo que su problema podría ser que su segundo ciclo while está anidado en su primer ciclo while, por lo que ahora su código verifica si el tiempo de reacción es mayor que 2000 solo cuando el tiempo de reacción es menor que 2000. Puede hacer 2 bucles o simplemente verificar cuando la respuesta es dado
if(response == 'g' && reactionTime <= 2000){ return { new_screenName: 'Correct_fast'}; else if(response == 'g'){ return { new_screenName: 'Correct_slow'}; }else{ return {new_screenName: 'Incorrect'}; }