Scripting Buttons

Tutorial:Virtual Worlds Made Easy - Scripting Buttons
Time to complete: 10 minutes approximately
Summary: This tutorial will show you how to turn on a light with the use of a button.
Aim: Learn to insert primitives, use scripting and trigger events.
Required application: VastPark Creator

Required IMML Elements:
  • Box Primitive x 2
  • Light
  • Scripts x 3
  • Triggers x 3
  • Camera

In this tutorial I'm going to show you how to turn on a light with a button.

The best place to start is by adding in the elements to the scene. The first box will be the Button, place it at 0,0,0, give it an emissive value of #0A6500 and rename it to "Button". Its size isn't important, I gave mine a size of 0.8,0.4,0.01.
The next box I insert at 0,0,2 and its size and colour can be left default. This box is only being used to see the effect of the light when it is turned on and off.

Next insert your light and camera. I placed my light at 1.5,4,1 and gave it's diffuse colour a value of #FF0000.
The camera I placed at 0,0,-3.5 and under the scene properties made it the default Camera for the park.

Having setup the four main visual elements of the scene we need to start adding in some scripts to make our button do something.
The first two scripts that I'm going to make will change the emissive colour of the button when you hover over it.
To create a script go to the insert menu and click on Inline Script.

The first script I'm going to call "OnMouseEnter" and looks like this:

function main(obj, args)
obj.material.emissive = rgb('#00FF00')
end

The next script is almost identical except for the emissive value returns to the buttons original value.
Call the script "OnMouseLeave" and paste in the following script:

function main(obj, args)
obj.material.emissive = rgb('#0A6500')
end

With the Button selected in its properties there is a menu called triggers. You will need to add in two triggers with an MouseEnter and Mouse Leave event that points to the corresponding scripts we created earlier.

The final script we need to create is for turning on and off the light. This will happen when you click on the Button.
Insert another Inline script and call it "OnMouseClick". The script should look like this:

function main(obj, args)
scene:getelement('Light').enabled = not scene:getelement('Light').enabled
end

Add a final trigger to the Button, making its MouseClick event correspond to the OnMouseClick script.
That's it, now click Interactive Preview and use your mouse to hover over the Button and click it to see the light turn on.

You can download the IMML in the files at the bottom of the page.
Move onto the next tutorial where I'll show you can use this button to enable a video to play on a surface.

VWME7-Buttons1.jpg (17.8 KB) Adrian Shepherd, 2010-06-01 02:13 PM

VWME7-Buttons2.jpg (4.6 KB) Adrian Shepherd, 2010-06-01 02:13 PM

VWME-ScriptingButtons.imml (1.8 KB) Adrian Shepherd, 2010-06-01 02:47 PM

Also available in: HTML TXT