# \[GenieFramework\] Persist some actions after refreshing on web browser

**URL:** https://discourse.julialang.org/t/genieframework-persist-some-actions-after-refreshing-on-web-browser/126852
**Category:** Web Stack
**Tags:** genie, stipple
**Created:** [March 12, 2025, 9:42am UTC](https://discourse.julialang.org/t/genieframework-persist-some-actions-after-refreshing-on-web-browser/126852 "2025-03-12T09:42:23Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![leejm516](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/leejm516/32/8219_2.png) [@leejm516](https://discourse.julialang.org/u/leejm516)
#### Post date: [March 12, 2025, 9:42am UTC](https://discourse.julialang.org/t/genieframework-persist-some-actions-after-refreshing-on-web-browser/126852/1 "2025-03-12T09:42:23Z")

</div>

Hi, all!

I am making a web-based monitoring app using Genie and Stipple.jl.

If an action or a function is triggered by @onchange, it does not persist after refreshing on web browser.

Here’s an MWE.

```julia
module App
using GenieFramework
@genietools

# global variable for status save
gen_on = false

@app begin
    @in mybutton = gen_on
    @out ranval = 0.

    @onchange mybutton begin
        if mybutton
            global gen_on = true
            @info "Generation starts!"
            @async begin
                while gen_on
                    ranval = rand()
                    sleep(1)
                end
            end
        else
            global gen_on = false
            @info "Generation stops!"            
        end
    end    
end

function ui()
    [
        cell([
            btn("Generate random number!", @click("mybutton = !mybutton"))
        ])
        cell([
            bignumber("Random value!", :ranval)
        ])
    ]
end

@page("/", ui)
end

```

In this code, clicking the button will trigger a while loop generating a random number per sec.  
Once I click refresh button on the browser, the value will be no longer changed even though the while loop is still running. I have to click the button twice to see the generation again. It makes sense `@onchange` macro only senses the change of the value, and definitely no change has been made on `mybutton` after refresh…

Then, how can I change the code so that the random number generation will be displayed after refresh? As you can see above, my trial to use a global variable was not successful ☹

Thanks for any comments!

---

<div class="post-metadata">

### Author: ![hhaensel](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/hhaensel/32/1207_2.png) [@hhaensel](https://discourse.julialang.org/u/hhaensel)
#### Post date: [March 15, 2025, 8:21am UTC](https://discourse.julialang.org/t/genieframework-persist-some-actions-after-refreshing-on-web-browser/126852/2 "2025-03-15T08:21:45Z")

</div>

This would be my solution for a global counter:

```julia
using Stipple, Stipple.ReactiveTools
using StippleUI

gen_on::Bool = false
const ranval = Observable(0.0)

function startcounter(model = nothing)
    if gen_on
        msg = "Generation is already running!"
        @info msg
        model !== nothing && notify(model, type = "warning", msg)
    else
        @async begin
            global ranval, gen_on
            gen_on = true
            msg = "Generation starts!"
            @info msg
            model !== nothing && notify(model, type = "positive", msg)
            while gen_on
                ranval[] = rand()
                sleep(1)
            end
        end
    end
end

function stopcounter(model = nothing)
    global gen_on
    if gen_on
        gen_on = false
        msg = "Generation stops!"
        @info msg
        model !== nothing && notify(model, type = "negative", msg)
    else
        msg = "Generation is not running!"
        @info msg
        model !== nothing && notify(model, "warning", msg)
    end
end

@app begin
    @in mybutton = false
    @out ranval = 0.0

    @onchange isready begin
        synchronize!( __model__.ranval, @ __MODULE__ ().ranval, bidirectional=false)
    end

    @onchange mybutton begin
        gen_on ? stopcounter( __model__ ) : startcounter( __model__ )
    end    
end

function ui()
    htmldiv(card(class = "q-ma-lg", style = "max-width: 300px", [
        cardsection(row(class = "justify-center", btn(col = "auto", "Generate random number!", @click("mybutton = !mybutton"))))
        cardsection(bignumber(class = "column items-center", "Random value!", :ranval))
    ]))
end

@page("/", ui, post = x->(global model = x; nothing))

```

---

<div class="post-metadata">

### Author: ![hhaensel](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/hhaensel/32/1207_2.png) [@hhaensel](https://discourse.julialang.org/u/hhaensel)
#### Post date: [March 15, 2025, 8:22am UTC](https://discourse.julialang.org/t/genieframework-persist-some-actions-after-refreshing-on-web-browser/126852/3 "2025-03-15T08:22:32Z")

</div>

![image](https://global.discourse-cdn.com/julialang/original/3X/4/3/43f21b940ef13f5f5f368c8ad4f6cd6b356e7b01.png)

---

<div class="post-metadata">

### Author: ![leejm516](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/leejm516/32/8219_2.png) [@leejm516](https://discourse.julialang.org/u/leejm516)
#### Post date: [March 17, 2025, 5:59am UTC](https://discourse.julialang.org/t/genieframework-persist-some-actions-after-refreshing-on-web-browser/126852/4 "2025-03-17T05:59:32Z")

</div>

Thank you so much for sharing a nice code!

It will be a useful primer for my self study.
