| PROTOs for Dummies III | |
| |
|
Dateline: 4/13/98
Now that we have some PROTOs for eye balls, clearly we have to start
poking it! To review from the previous features, still available as Dummies
I, and Dummies II there several PROTOs that
we now have. PROTOs for single and multiple eyeballs.
I'm going to change gears a little bit and not continue to build up these silly PROTOs. While somewhat instructive they are let's face it stupid. Rather than reinvent the PROTO wheel let's look at how to take an existing intelligent PROTO and apply it to our eyeballs. One interesting technique in the development of your own PROTOs is to follow the style and structure of an existing node, but to add some functionality to it. This is exactly the method used by Braden McDaniel (also known as Prismatic Booger) with his HotShape PROTO (used with Braden's gracious permission).
HotShape is a PROTO which can be used in place of an existing Shape
node, but it switches between two different Appearance nodes depending
on whether the cursor is or is not on top of the geometry in the Shape.
The complete PROTO in gory detail follows. I have also added and changed
comments.
#VRML V2.0 utf8
# hotshapePr.wrl
# Like the Shape node, but it changes appearance when the
mouse is moved over it.
# author: Braden N. McDaniel
# e-mail: braden@shadow.net
Begin the Interface Section
PROTO HotShape [
eventIn SFNode set_notOverAppearance
eventIn SFNode set_overAppearance
# a geometry node; the geometry of the switch
exposedField SFNode geometry NULL
# an Appearance node; the normal appearance of the geometry
field SFNode notOverAppearance NULL
# an Appearance node; the appearance of the geometry when
the mouse is over it
field SFNode overAppearance NULL
eventOut SFNode notOverAppearance_changed
eventOut SFNode overAppearance_changed
] {
Group {
children [ DEF HOTSENSOR
TouchSensor {},
DEF SHAPE Shape {
appearance IS notOverAppearance
geometry IS geometry
}
]
} #end Group
Begin the Script
DEF HOTSCRIPT Script {
eventIn SFBool isOver
eventIn SFNode set_overAppearance IS set_overAppearance
eventIn SFNode set_notOverAppearance IS set_notOverAppearance
field SFNode notOverAppearance IS notOverAppearance
field SFNode overAppearance IS overAppearance
eventOut SFNode appearance_changed
eventOut SFNode overAppearance_changed IS overAppearance_changed
eventOut SFNode notOverAppearance_changed IS notOverAppearance_changed
url [ "javascript:
function initialize() { appearance_changed = notOverAppearance;
}
function isOver(over) {
if (over) {
appearance_changed = overAppearance;
} else {
appearance_changed = notOverAppearance;
}
} #end of isOver
function set_overAppearance(appearance) {
overAppearance = appearance;
overAppearance_changed = overAppearance;
}
function set_notOverAppearance(appearance) {
notOverAppearance = appearance;
notOverAppearance_changed = notOverAppearance;
}"
#Note the actual PROTO can/should contain scripts in multiple languages
i.e. vrmlscript and ECMAscript to support more browsers (I have removed
these for clarity of the article.)
]
} #end of Script
ROUTE HOTSENSOR.isOver TO HOTSCRIPT.isOver
ROUTE HOTSCRIPT.appearance_changed TO SHAPE.appearance
} #end of PROTO
Obviously the creation of the script is the trickiest part of the whole PROTO. The isOver state (TRUE or FALSE) from HOTSENSOR comes from the boolean isOver field defined as part of the TouchSensor. HOTSENSOR is DEF'd as a TouchSensor. The isOver event generated by the TouchSensor is ROUTEd to the isOver input (eventIn) of the script called HOTSCRIPT. The state of the isOver field is used by the script to set the appropriate appearance. The result of the appearance state change is sent via the second ROUTE from the script HOTSCRIPT to the actual Appearance node used by the SHAPE Shape node DEFd in the PROTO. Is that clear :-) ? It can all get quite confusing but a little time looking over the code should clarify the matter.
A regular Shape node is defined as:
Shape {
exposedField SFNode appearance NULL
exposedField SFNode geometry NULL
}
The use of HotShape is a straightforward replacement of a Shape node (with of course the additional Appearance node definitions)
The before and after VRML code fragments of HotShape in use are:
Transform {
translation 0 0 1
scale IS squashFactor
children [
Shape {
appearance Appearance {
material Material {
diffuseColor 1.0 1.0 1.0 #color of the whites
}
}
geometry Sphere { }
}
]
}
Replacing Shape with HotShape
Transform {
translation 0 0 1
scale IS squashFactor
children [
HotShape {
notOverAppearance Appearance {
material Material {
diffuseColor 1.0 1.0 1.0 #color of the whites
}
}
overAppearance Appearance {
material Material {
diffuseColor 1.0 0 0 #poke color
}
}
geometry Sphere { }
}
]
}
We can easily turn the original PROTO into an EXTERNPROTO and it's use doesn't muck up the file.
Select the image to see the pokeEyes.wrl in action, the PROTO is called
hotshapePr.wrl.
Even better go to Braden's VRML97 PROTO
collection located in the Prototype page on this site.
In our next installation of this series we will look at the addition of sounds.
Got any PROTO thoughts or actual thoughts, post it on the board.