dat.gui how to hide menu with code

Question

I made a menu using dat.gui for my applcation with Three.js. It works fine, I have also discovered that pressing h key I can hide the menu created with dat.gui. My question is how can I make the menu appear/disappear directly from the code?

 var gui = new dat.GUI();
 gui.add(text, 'message');
 gui.add(text, 'speed', -5, 5);

 gui.???

I tried to use the property of the DOMElement hide and it works but I would like a unique way to handle this function. There is a function to call? I have noticed that JavaScript events related to the keystrokes are related to the scope via a bind in the library. But what is the correct way to do this?

Answer 1

You can toggle the 'closed' class on the first ul tag within the gui domElement.

Here's how to do it if you are using JQuery:

var gui = new dat.GUI();
$(gui.domElement).find(">ul").toggleClass("closed");