I am trying to make a progress bar as follows. I am only able to write very simple code and my test example is here:
<html><head><title>Progress Bar</title></head><body>
<div><button id="run">Run</button></div>
<progress value="0" max="100" id="progress" style="width:100px;"></progress>
<script src='fengari_web.js' type="text/javascript" async></script>
<script type="application/lua" async>
local js = require "js"
local window = js.global
local document = window.document
progbar=document:getElementById("progress")
submit=document:getElementById("run")
submit:addEventListener("click", function() jim() end)
function jim()
for i=1,10^7 do
if i%10^6==0 then
prog=math.floor(i/10^7*100)
progbar.value=tostring(prog) --only updates at the end
print(prog) --prints out in real time
end
end
end
</script></body></html>
The problem is that the progress bar only updates when the calculation has finished while the printed output to the console appears in real time. I have tried using promises and timeouts, etc, but I can't sort it out, sorry. Any help much appreciated.
I am trying to make a progress bar as follows. I am only able to write very simple code and my test example is here:
The problem is that the progress bar only updates when the calculation has finished while the printed output to the console appears in real time. I have tried using promises and timeouts, etc, but I can't sort it out, sorry. Any help much appreciated.