1. 1GR2-00 GR2 Advanced Computer Graphics AGR Lecture 11 VRML Animation and Interaction

2. 2GR2-00 VRML - The Story So Far n We have seen how to build hyperlinked, static, non- interactive 3D worlds #VRML V2.0 utf8 Shape { geometry Cylinder { radius2 height4 } appearance Appearance { material Material { diffuseColor 1 0 0 specularColor1 1 1 } }

3. 3GR2-00 Richer Worlds n VRML97 allows the creation of much more interesting worlds by introducing: – interaction and animation – multimedia – scripting active n Worlds become active – can change over time – can change in response to a users actions

4. 4GR2-00 Making Worlds Come Alive n To understand how this works we shall create a really simple example n We shall build a signboard that rotates... eventssensors n... for this we need to understand events and sensors

5. 5GR2-00 Sensors and Events sensor n A sensor is a type of node that generates data within the world - as the browser navigates it – eg TimeSensor – eg TouchSensor event n Data generated within a node is called an event routed n Events are routed from one node to another to program behaviour in the world

6. 6GR2-00 Routing of Events n Each node has a specified list of events associated with it – eg TimeSensor has time events n Divided into eventOuts and eventIns – a node can receive eventIns – a node can send eventOuts n Routes assign eventOut of one node to eventIn of another node Node A Node B route eventOutseventIns

7. 7GR2-00 Example of Routing DEF OBJECT Shape {.. } DEF LIGHT PointLight {.. } DEF TIMER TimeSensor {.. } DEF SWITCH TouchSensor {.. } # start the clock when someone presses dimmer switch ROUTE SWITCH.touchTime TO TIMER.set_startTime # as the clock ticks, change the intensity of light in the room ROUTE TIMER.fraction_changed TO LIGHT.set_intensity

8. 8GR2-00 Time Sensor n A Time Sensor generates events as the clock ticks n Fields include: – start time (secs) [0 is default = midnight, 1/1/1970] – cycle time (secs) [1 is default] – loop (TRUE/FALSE) n EventOuts include: – current time – fraction_changed (fraction of current cycle) n EventIn includes – set_startTime

9. 9GR2-00 Animation animation engine n Animation is achieved by routing time events to an animation engine keyframe values n This engine is programmed with keyframe values – on receiving a time event, it calculates an in-between value – this gets routed to another node, typically a transform node

10. 10GR2-00 Interpolator Nodes n These form the animation engines Orientation Interpolator n Example is Orientation Interpolator OrientationInterpolator { key[0, 0.5,1] keyValue[0 1 0 0, 0 1 0 3.14, 0 1 0 6.28] } – EventIn set_fraction(eg 0.25) – EventOut value_changed(eg 0 1 0 1.57) Note: Orientation specified as angle about axis - here y-axis

11. 11GR2-00 Animation animation engine... n Animation then achieved by routing time events from a time sensor to the animation engine... n... which then drives say a transform node: TIME SENSOR time elapsed ROTATION INTERPOL- ATOR rotation TRANSFORM animation engine sensor event modify geometry

12. 12GR2-00 Rotating Sign DEF TURN_SIGN Transform { rotation0 1 0 0 children [ DEF SIGN Shape {...}]} DEF TIMER TimeSensor { loopTRUE }#continuous DEF ROTOR OrientationInterpolator { key[0,0.51.0] keyValue[0 1 0 0, 0 1 0 3.140 1 0 6.28] #rotate twopi in a cycle } ROUTE TIMER.fraction_changed TO ROTOR.set_fraction ROUTE ROTOR.value_changed TO TURN_SIGN.set_rotation

13. 13GR2-00 User Activated Sensors n Another set of sensor nodes generate events in response to user actions TouchSensor n A TouchSensor node creates an event when you click on any sibling geometry nodes – siblings are brothers / sisters (ie at same level in hierarchy) – an eventOut called touchTime is created

14. 14GR2-00 Touch Sensor Example DEF TURN_SIGN Transform { rotation0 1 0 0 children [ DEF SIGN Shape {...} DEF HIT TouchSensor{ }]} DEF TIMER TimeSensor { loopFALSE }#once only DEF ROTOR OrientationInterpolator { key[0,0.5,1.0] keyValue[0 1 0 0, 0 1 0 3.140 1 0 6.28] #rotate twopi in a cycle } ROUTE HIT.touchTime TO TIMER.set_startTime ROUTE TIMER.fraction_changed TO ROTOR.set_fraction ROUTE ROTOR.value_changed TO TURN_SIGN.set_rotation

15. 15GR2-00 Proximity Sensor n This acts as a detector as the viewer enters a region n It generates events on entry and exit n You can use this for example to turn on a light as someone enters a room

16. 16GR2-00 Proximity Sensor Example DEF SIGN Shape {...} DEF TIMER TimeSensor { loopFALSE }#once only DEF SPY ProximitySensor { size 16 16 16 } DEF LIGHT PointLight { intensity0 location0 0 5} NavigationInfo { headlightFALSE } # turn off the browser hlight # start clock when browser nears the sign ROUTE SPY.enterTime TO TIMER.set_startTime # increase the intensity from zero to one in the time cycle ROUTE TIMER.fraction_changed TO LIGHT.set_intensity

17. 17GR2-00 Other Sensors n Drag sensors – PlaneSensor – CylinderSensor – SphereSensor these constrain the allowable motion

18. 18GR2-00 Collision Detection n VRML allows you to detect when the viewer collides with an object – Collision { children [...] } n When collision occurs, a collideTime event is generated n Note collision between objects NOT detected

19. 19GR2-00 Sound n Sound node – location and direction fields specify where the sound emanates from – source field specifies an AudioClip node... which points at a.wav file given as a url * locationfull intensity sound fades

20. 20GR2-00 Collision + Sound Example DEF COLLIDE Collision { children [DEF SIGN Shape {.. }] DEF TUNE Sound { sourceDEF CLASSIC AudioClip { url "http://.....wav"} } ROUTE COLLIDE.collideTime TO CLASSIC.set_startTime

21. 21GR2-00 Movies n Textures can be movies rather than static images n Use the MovieTexture node...

22. 22GR2-00 User Control of VRML Worlds n There are two mechanisms for allowing user control of VRML worlds - scripts and external authoring n Both involve the execution of Java software in association with the VRML world – Java – Java of course is a programming language allowing portable code to be delivered to the browser for execution – scripts: Java or JavaScript inside VRML – external authoring: Java and JavaScript outside VRML

23. 23GR2-00 Scripting n Script node – allows a world creator to program their own animation engine – url field points to Java or JavaScript code – events can be routed to and from script nodes – example: viewpoint animation TIME SENSOR SCRIPT NODE VIEWPOINT time elapsedposition java code

24. 24GR2-00 Example of Scripting n In the following example, the heights on an elevation grid are animated using a script node n ElevationGrid node draws surface through heights defined on a grid Colours can be assigned to each vertex and smoothly interpolated

25. 25GR2-00 Example of Scripting - Dynamic Change of Surface Shape{ geometryDEF GRID ElevationGrid{ height[... ] } appearance... } DEF TIMER TimeSensor { loopTRUE } DEF ENGINE Script { eventInSFFloattime_fraction eventOutMFFloat new_height url:javascript <JavaScript code goes here, to create new set of heights at grid points, based on time> } ROUTE TIMER.fraction_changed TO ENGINE.time_fraction ROUTE ENGINE.new_colour TO GRID.set_height

26. 26GR2-00 Linking Software to VRML Worlds n Script node allows Java code to be included within a VRML world n External Authoring Interface (EAI) allows a Java applet to link to a VRML world script node VRML node Java applet VRML node VRML world

27. 27GR2-00 External Authoring Interface n Allows communication between a Java applet and a VRML world.. n Here is a virtual shopping mall.. Clicking on a TouchSensor over an object sends event to Java applet which keeps record of purchases

28. 28GR2-00 Browsing n Has been a range of browsers to select from n Commonly: – free – beta n Not all browsers support all functionality... n Rapidly changing environment n Leading product is CosmoPlayer – developed by SGI – spun-off to Cosmo – sold to Platinum – yesterday (sic) agreed to be Open Source n Other players: – Sony (CommunityPlace)

29. 29GR2-00 Authoring n Variety of approaches: – use a text editor – use an interactive modeller »Cosmo Worlds (SGI - Cosmo- Platinum-??) »Caligari truespace3 – use a higher level language to author, then interpret – generate dynamically from software – generate automatically from scanner

30. 30GR2-00 Futures n Development being controlled by VRML Consortium (http://www.vrml.org) n Plans underway to develop X3D - or VRML2000 n Interesting areas for research – 3D user interfaces – large worlds – multi-user worlds – integration of VRML and MPEG – 4D navigation n Eye on web site: http://www.scs.leeds.ac.uk/vrmljava3d