Multiple scenes captions visibility controlled by a single button

Hi,

I have a certain number of scenes. In each scene I have a group of captions illustrating the names of the objects displayed on the scene.

For the time being, as a temporary solution, I added a toggle button on each scene in order to control the visibility of the captions for one scene at a time.

However, as an ideal solution, I would like to simultaneously control the visibility of all the captions in all the scenes simply by clicking on a toggle button located on the first scene, for example. Is it possible?

Thank You in Advance

Yes, you can use Document Panel > Event Handlers > Scene Activate to run a script when each scene loads.

You’ll need to set a value when the button is clicked and use this in the script to show / hide the captions. If you group all the captions using the same group name on each scene - you can collectively hide / show rather than naming each object.

Thank you very much for your reply mackavi,

It took me some time to understand your hints. My level of knowledge about javascript is very low. This is the best I could get:

I made a test page with three scenes. In the second and third scene, I placed an object with its own caption made visible. In the first scene, I placed the toggle button with the following code:

function changeCaptionVisibility(doc, e) {
visibility = false;
}

In Document Panel > Event Handlers > Scene Activate, I used the following script:

function showHideEventHandler(doc, e) {

var caption = doc.getElement('caption');

if ( visibility == false ) {	
	caption.show(false);
} else if ( visibility == true ) {
	caption.show(true);
} else {
	caption.show(false);
}

}

The problem with the above code is that it works just once and only in one direction (show caption > hide caption). Clicking on the toggle button to show the caption once again does not produce any result. In order to show the captions once again, I have to reload the entire Web page with F5. Any hints about it?

toggle.saolapack (2.8 KB)

The attached project is one example of toggling and may help you.

The button on the first scene will toggle the captionsGroup object on any subsequent scene.

Hi mackavi,

thank you very much. I clearly understood my mistakes. Your solution also answered to another question I was going to ask: how to change the toggle button text.
Now, I also understand how to refer to document variables (i.e. doc.myToggle) in javascript.

Best Regards,
Tony

Glad it helped.

Just remember that ‘doc’ is a Saola Animate object so will have their properties and functions as well.

Best to always use variable / property naming that will not conflict such as myColour or myScore.

thank you mackavi. I really appreciate your help and advises.