Dat.gui how to hide the menu with the code

Question

I made a menu using dat.gui for my application using Three.js. It works fine, I also found that by pressing the h key I can hide the menu created using 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 using the DOMElement hiding property and it works, but I would like to use a unique way to handle this function. Is there a call function? I noticed that JavaScript events related to keystrokes are bound to an area using library bindings. But what is the right way to do this?

Answer 1

I had the same problem and solved it:

 var gui = new dat.GUI(); dat.GUI.toggleHide(); 

Answer 2

Ok found a solution by adding the following function to the dat.GUI prototype:

  dat.GUI.prototype.removeFolder = function(name) { var folder = this.__folders[name]; if (!folder) { return; } folder.close(); this.__ul.removeChild(folder.domElement.parentNode); delete this.__folders[name]; this.onResize(); } 

Answer 3

What you and I were looking for

 var gui = new dat.GUI(); // to toggle it closed gui.closed = true; // to toggle it open again gui.closed = false; 

I got this from the source on line 2104, where the internal functions open and close do exactly that.

Gui responds to changes in value on the fly (you can reassign gui.closed from the console to see it in action).

Answer 4

You can try

 var gui = new dat.GUI(); //... your logic here gui.__proto__.constructor.toggleHide() 

Answer 5

Starting from the latest version:

gui.close ();

Answer 6

You can switch the "closed" class to the first ul tag in the gui domElement element.

Here's how to do it if you use jQuery:

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

Answer 7

I would recommend:

 $(gui.domElement).attr("hidden", true); 

since it also prevents clicking. With toggleHide() you can still click on it. Just closing leaves you open again.

Worked for me, since I don't want the user to open it again;)