sanette/bogue

Countdown Timer GUI Not Responding

IdaraNabuk opened this issue · 7 comments

IdaraNabuk commented

I'm an Outreachy intern working on the project "Improve the GUI experience for OCaml users". I'm trying to create a simple countdown GUI that decrements the set value per second when one clicks on the start button, can pause it, resume, and reset the whole countdown timer.

The countdown is working as intended in the console but the GUI is not responding except the mouse is hovered on any of the buttons. I'd like to know how to resolve this so I can proceed with my projects as my internship is for a very limited period.

Here's a link to the file: https://github.com/IdaraNabuk/Bogue-examples/blob/main/bogue_timer/bin/main.ml

Attached is a screenshot of the GUI behavior and the console response.
Timer error

sanette commented

Hi Idara

nice to have you working on Bogue!

In your update function, you have to explicitly ask for graphics update: just use W.update:

let updateDisplayVal c n =
  W.set_text c (string_of_int n);
  W.update c

Then it should work!

Some tips if you want to make your code more idiomatic:

  • better not to use Thread yourself. You can use W.connect instead of the convenience ~action parameter of W.button. (W.connect starts a Thread under the hood)

  • You could use the Timeout module, and then you don't need a separate function working in parallel at all

  • Be careful that in your current implementation, if the user clicks "Starts" many times, it will launch as many threads, and hence the countdown will be too fast. You could check that the tread is already running, or simply use the ~priority:W.Forget option of W.connect, which is precisely designed for this. See

http://sanette.github.io/bogue/Bogue.Widget.html#TYPEaction_priority

Best wishes

IdaraNabuk commented

Thanks so much for the prompt response. I'll implement the necessary changes.

sanette commented

For an example on how to use W.connect, you can have a look at example#14:

https://github.com/sanette/bogue/blob/7f20e1fa2ab852c5031385e3af57ee346cd055f9/examples/examples.ml#L327C1-L327C48

and if you want nice +/- buttons, you may use fontawsome icons:

let inc_button = W.button ~border_radius:100
                     ~label:(Label.icon "plus-circle")
                     ~action: (fun _ ->
                       incr counter;
                       updateDisplayVal count !counter) "" in
  • 👍1
IdaraNabuk commented
IdaraNabuk commented

@sanette Thank you for the help with the Bogue countdown timer. It is working well now.

I would appreciate your suggestions on what can be best listed as functionalities for the Bogue library. This is to assist me in
better organizing the page "is_ocaml_gui_yet" in ocaml.org. Here's the draft PR for that. I'll close that PR soon to open another in a new branch.

sanette commented

Maybe here is not the best place for such suggestions. Do you want to open an issue in you PR?

IdaraNabuk commented

We figured something out with my mentors and the idea we got from Sabine for the page. Thanks