hexops / vecty

Vecty lets you build responsive and dynamic web frontends in Go using WebAssembly, competing with modern web frameworks like React & VueJS.
BSD 3-Clause "New" or "Revised" License
2.82k stars 144 forks source link

Recognize window kill and/or browser back button #210

Open pratapsu opened 6 years ago

pratapsu commented 6 years ago

I have written my web app entirely using vecty & gopherjs. It connects via websockets/rpc to a backend server. So far, the experience has been quite satisfying.

I have the need to reset a few data structures in the backend server when any of the following events happen:

I'd like to do this while staying pure and using vecty/gopherjs only, preferably. I noted there are APIs for "beforeunload" events, but it is not immediately obvious to me how I'd go about catching that event. If this is not possible with vecty alone, I'm also open to a jQuery based solution.

ow would I do this? Can you help?

Thanks,

Pratap

ghost commented 6 years ago

That's a really good question which I also hit and never bothered to find out about.. I actually hacked it with polling which is a terrible solution.

On Tue, 10 Jul 2018, 17:18 pratapsu, notifications@github.com wrote:

I have written my web app entirely using vecty & gopherjs. It connects via websockets/rpc to a backend server. So far, the experience has been quite satisfying.

I have the need to reset a few data structures in the backend server when any of the following events happen:

  • The current window is killed by the user explicitly
  • The user moves focus from the current window to older window on the stack via the "Back" button in the browser.
  • The user quits the browser

I'd like to do this while staying pure and using vecty/gopherjs only, preferably. I noted there are APIs for "beforeunload" events, but it is not immediately obvious to me how I'd go about catching that event. If this is not possible with vecty alone, I'm also open to a jQuery based solution.

ow would I do this? Can you help?

Thanks,

Pratap

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/gopherjs/vecty/issues/210, or mute the thread https://github.com/notifications/unsubscribe-auth/ATuCwqTc2JIG1Uj5BOXGbB_jcooKyL1Lks5uFMW4gaJpZM4VJnKx .

pratapsu commented 6 years ago

I arrived at a similar workaround too ... I poll my cached state every 5 seconds to update the true state stored on the server. As you also point out, this is clearly inefficient. Perhaps some one on this forum will shed some light.

NateWilliams2 commented 4 years ago

I'm facing the same situation now, does anyone have updated information on using beforeunload or some other event listener to do this? Thanks.

pdf commented 4 years ago

Totally untested, but something like:

import "github.com/gopherjs/vecty/event"

...
event.BeforeUnload(func(evt *vecty.Event) {
    evt.PreventDefault()
    // do your handling here
}
...

Seems like it should do what you want, though I've never used it, and I don't know what particular semantics browsers may apply to this event handler.

NateWilliams2 commented 4 years ago

Thanks for the idea, I still was unable to get my handling there to trigger. I came up with something that just uses syscall/js manually instead:

func BeforeUnload(close func()) {
    var unloadFunc js.Func
    unloadFunc = js.FuncOf(func(this js.Value, args []js.Value) interface{} {
        close()
        unloadFunc.Release() // release the function if the button will not be clicked again
        return nil
    })
    js.Global().Call("addEventListener", "beforeunload", unloadFunc)
}

There's probably just something about event.BeforeUnload I'm not getting right.. But for now this is working for me