I am wondering if we can run a javascript function for each task. I thought prodigymount event could be used for this use case. But, it seems to fire only once.
To provide more context, I am trying to show highlighted transcript synched with audio stream. I was motivated by the WaveSurfer code. In short, it iterates over elements with wavesurfer-marker css class within the given page to identify transcript segments as well as start and end times. I loaded the js code using the javascript setting in blocks config.
However, this will only work for the first task if we use prodigymount. For subsequent tasks, prodigymount won’t fire and the new page with different transcript segments won’t be processed.
I am curious if you have any suggestions on how to address this issue.
Yes, prodigymount will only fire on the first mount and is designed for executing code once after the app has loaded.
It sounds like based on what you describe, you could use prodigyupdate, which is executed every time there's an updat to the task? If you only want to run it once whenever a new task loads, you could store the task's _task_hash value in a variable and then check if it has changed.
Thank you @ines for the suggestion! It was very helpful.
For anyone looking to run a JS function per task, you can do something similar to the following code segment:
let current_task_hash = null;
document.addEventListener('prodigyupdate', () => {
// is this a new task?
if (current_task_hash != window.prodigy.content._task_hash) {
// yes, this a new task — make sure to update the state
current_task_hash = window.prodigy.content._task_hash;
run_js_function_once_per_task();
}
});