I want to implement a progress bar in my application using ambiorix + htmx
This is the logic of the app:
The user clicks a button, this issues a POST request which goes to the end1
endpoint inside here an async process is initialized to update the variable value
and a new div tag is shown to the user indicating that the process has initialized.
This div tag should issue a GET request to the getvals
endpoint every 2 seconds and return the updated value of the variable value
This is what I tried but the problem is that the value doesn’t update it stays at zero, I guess this occurs because of my lack of understanding of async processes so any explanation is appreciated, thanks in advance.
library(future)
library(ambiorix)
library(ipc)
library(htmltools)
plan(multisession)
app <- Ambiorix$new()
value <- 0
q <- queue()
app$get("/", (req,res){
tags$button(
`hx-post` = "/end1",
"Begin progress"
) |>
as.character() |>
HTML() -> var_1
res$render("temp.html", list(html_1 = var_1))
})
app$post("/end1", (req,res){
futuro_1 <- future({
for(i in 1:5){
Sys.sleep(3)
q$producer$fireEval({
# print(index)
value <- index
value
}, list(index=i))
}
})
futuro_1
q$consumer$start()
div(
`hx-get` = "/getvals",
`hx-trigger` = "every 2s",
"Creating Archive"
) |>
as.character() |>
HTML() -> var_2
res$send(var_2)
})
app$get("/getvals", (req,res){
# value
res$send(as.character(value))
})
app$start()
Here is the HTML code for the temp.html
template:
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://unpkg.com/[email protected]" integrity="sha384-0895/pl2MU10Hqc6jd4RvrthNlDiE9U1tWmX7WRESftEDRosgxNsQG/Ze9YMRzHq" crossorigin="anonymous"></script>
</head>
<body>
[% html_1 %]
</body>
</html>