<li><aclass="backlink"title="Click to do a full-text search for this title"href="/quake4/Scripting_Actions_and_Animations?action=fullsearch&value=linkto%3A%22Scripting+Actions+and+Animations%22&context=180">Scripting Actions and Animations</a></li>
<h2id="head-54e8f90e1aa0844460ab6208d6542db050cca49a">Scripting Actions and Animations</h2>
<spanclass="anchor"id="line-2"></span><pclass="line867"><hr/><pclass="line874"><spanclass="anchor"id="line-3"></span>There are two basic things that occur in GUIs: <spanclass="anchor"id="line-4"></span><spanclass="anchor"id="line-5"></span><pclass="line874">1. The user clicks an element that causes an action <spanclass="anchor"id="line-6"></span><spanclass="anchor"id="line-7"></span><pclass="line874">2. The action sends commands, performs a separate script, or starts an animation <spanclass="anchor"id="line-8"></span><spanclass="anchor"id="line-9"></span><pclass="line862">In order to make this happen, <ahref="/quake4/Def_Types">windowDefs</a> have to contain scripts. To add scripting to a <ahref="/quake4/Def_Types">windowDef</a> in the GUI editor, select the <ahref="/quake4/Def_Types">windowDefs</a> and hit <strong>ctrl + Enter</strong>. Scripts are then entered in the window that pops up. Multiple scripting functions can be entered in the window, so a scripting window could contain scripts, for example, for <strong>onMouseEnter</strong>, <strong>onMouseExit</strong>, and <strong>onAction</strong> (see below for more information on specific scripting functions). <spanclass="anchor"id="line-10"></span><spanclass="anchor"id="line-11"></span><pclass="line874">The syntax for scripting elements looks like the following example: <spanclass="anchor"id="line-12"></span><spanclass="anchor"id="line-13"></span><pclass="line867"><spanclass="anchor"id="line-14"></span><pre> OnScriptElementName
<h4id="head-4f5eab5e09f80856d56ba9a3d1e889f6f9d11252">Set and Transition</h4>
<spanclass="anchor"id="line-24"></span><spanclass="anchor"id="line-25"></span><pclass="line862">The two most common script commands are <strong>set</strong> and <strong>transition</strong>. Both are used to set or change values of a <ahref="/quake4/Def_Types">windowDef</a> flag. Scripts can change the flags of the <ahref="/quake4/Def_Types">windowDef</a> that contains the script or other windowDefs as well. If the script is changing the flags of its own <ahref="/quake4/Def_Types">windowDef</a>, the “windowname::flag” syntax can be dropped and only the flag is needed (see examples below). <spanclass="anchor"id="line-26"></span><spanclass="anchor"id="line-27"></span><pclass="line874">The following are some examples with the “set” command syntax. <spanclass="anchor"id="line-28"></span><spanclass="anchor"id="line-29"></span><ul><listyle="list-style-type:none"><pclass="line891"><strong>set “visible” “0” ;</strong><spanclass="anchor"id="line-30"></span><spanclass="anchor"id="line-31"></span></li></ul><pclass="line862">This turns off the visibility of the <ahref="/quake4/Def_Types">windowDef</a> that contains the script. <spanclass="anchor"id="line-32"></span><spanclass="anchor"id="line-33"></span><ul><listyle="list-style-type:none"><pclass="line891"><strong>set “foo::visible” “1” ;</strong><spanclass="anchor"id="line-34"></span><spanclass="anchor"id="line-35"></span></li></ul><pclass="line862">This enables the visibility of the <ahref="/quake4/Def_Types">windowDef</a> named “foo”. <spanclass="anchor"id="line-36"></span><spanclass="anchor"id="line-37"></span><ul><listyle="list-style-type:none"><pclass="line891"><strong>set “cmd” “close” ;</strong><spanclass="anchor"id="line-38"></span><spanclass="anchor"id="line-39"></span></li></ul><pclass="line874">This sends a command to close the GUI. <spanclass="anchor"id="line-40"></span><spanclass="anchor"id="line-41"></span><pclass="line867"><hr/><pclass="line874"><spanclass="anchor"id="line-42"></span><spanclass="anchor"id="line-43"></span><pclass="line874">Commands can be sent as if the user typed them into the console: <spanclass="anchor"id="line-44"></span><spanclass="anchor"id="line-45"></span><ul><listyle="list-style-type:none"><pclass="line891"><strong>consolecmd “si_map mp/q4dm1” ;</strong><spanclass="anchor"id="line-46"></span><spanclass="anchor"id="line-47"></span></li></ul><pclass="line874">This specific command sets the server map to be mp/q4dm1 <spanclass="anchor"id="line-48"></span><spanclass="anchor"id="line-49"></span><pclass="line867"><hr/><pclass="line874"><spanclass="anchor"id="line-50"></span><spanclass="anchor"id="line-51"></span><pclass="line867"><strong>Transition</strong> is used to change one flag value to another over time. This is often used for mouseover color changes and <ahref="/quake4/Def_Types">windowDef</a> size changes but can be used for other cases as well. The transition command requires two values to transition between and a time to perform the transition in milliseconds.The following are some examples with the “transition” command syntax. <spanclass="anchor"id="line-52"></span><spanclass="anchor"id="line-53"></span><ul><listyle="list-style-type:none"><pclass="line891"><strong>transition “matcolor” “1,1,1,1” “1,1,0,1” “100” ;</strong><spanclass="anchor"id="line-54"></span><spanclass="anchor"id="line-55"></span></li></ul><pclass="line862">This transitions the color of the image in a <ahref="/quake4/Def_Types">windowDef</a> from white to yellow over 100 milliseconds. The following performs the same function but only transitions the <ahref="/quake4/Def_Types">windowDef's</a> alpha color: <spanclass="anchor"id="line-56"></span><spanclass="anchor"id="line-57"></span><ul><listyle="list-style-type:none"><pclass="line891"><strong>transition “matcolor_w” “1” “0” “100” ;</strong><spanclass="anchor"id="line-58"></span><spanclass="anchor"id="line-59"></span></li></ul><pc
<spanclass="anchor"id="line-64"></span><spanclass="anchor"id="line-65"></span><pclass="line862">setFocus is used mostly in console menus. This command is used to set the mouse focus of a specific <ahref="/quake4/Def_Types">windowDef</a>. The syntax is as follows: <spanclass="anchor"id="line-66"></span><spanclass="anchor"id="line-67"></span><ul><listyle="list-style-type:none"><pclass="line891"><strong>setFocus “windowname” ;</strong><spanclass="anchor"id="line-68"></span><spanclass="anchor"id="line-69"></span></li></ul><pclass="line867">
<spanclass="anchor"id="line-70"></span><spanclass="anchor"id="line-71"></span><pclass="line862">The <strong>stoptransitions</strong> command is used to halt an animation or transition. This is similar to setting the <strong>notime</strong> flag, but the main difference is that setting <strong>notime</strong> will allow the animation to finish all of its onTime steps, whereas <strong>stoptransitions</strong> will break out of the onTime or the transition statements altogether. The following example illustrates its context: <spanclass="anchor"id="line-72"></span><spanclass="anchor"id="line-73"></span><pclass="line867"><spanclass="anchor"id="line-74"></span><pre> windowDef button1
<spanclass="anchor"id="line-75"></span> {
<spanclass="anchor"id="line-76"></span> rect 0,0,100,100
<spanclass="anchor"id="line-100"></span><spanclass="anchor"id="line-101"></span><pclass="line862">The <strong>noninteractive</strong> command is used to make the entire GUI noninteractive until the flag has been set to 0, making it interactive again: <spanclass="anchor"id="line-102"></span><spanclass="anchor"id="line-103"></span><ul><listyle="list-style-type:none"><pclass="line891"><strong>Noninteractive "1" ;</strong><spanclass="anchor"id="line-104"></span><spanclass="anchor"id="line-105"></span><spanclass="anchor"id="line-106"></span></li></ul><pclass="line867">
<spanclass="anchor"id="line-109"></span><ul><listyle="list-style-type:none"><pclass="line862">Specifies actions to happen when the player mouses over the <ahref="/quake4/Def_Types">windowDef</a>. <spanclass="anchor"id="line-110"></span><spanclass="anchor"id="line-111"></span></li></ul><pclass="line867">
<spanclass="anchor"id="line-112"></span><ul><listyle="list-style-type:none"><pclass="line862">Specifies actions to happen when the player mouses out of the <ahref="/quake4/Def_Types">windowDef</a>. <spanclass="anchor"id="line-113"></span><spanclass="anchor"id="line-114"></span></li></ul><pclass="line867">
<spanclass="anchor"id="line-115"></span><ul><listyle="list-style-type:none"><pclass="line862">Specifies actions to happen when the player clicks on the <ahref="/quake4/Def_Types">windowDef</a>. <spanclass="anchor"id="line-116"></span><spanclass="anchor"id="line-117"></span></li></ul><pclass="line867">
<spanclass="anchor"id="line-118"></span><ul><listyle="list-style-type:none"><pclass="line862">Usually defined in the Desktop (for console menus, this is also defined in other <ahref="/quake4/Def_Types">windowDefs</a>). Defines the actions to be performed when the player hits the ESC key. (For Xenon menus where this is used in <ahref="/quake4/Def_Types">windowDefs</a>, it defines the actions to happen when the player hits the B button.) <spanclass="anchor"id="line-119"></span><spanclass="anchor"id="line-120"></span></li></ul><pclass="line867">
<spanclass="anchor"id="line-121"></span><ul><listyle="list-style-type:none">Defines the actions to be performed when a named event is called. The named event can be defined in the Desktop or it can be a named event in the code that gets called by the GUI. <spanclass="anchor"id="line-122"></span><spanclass="anchor"id="line-123"></span></li></ul><pclass="line867">
<spanclass="anchor"id="line-124"></span><ul><listyle="list-style-type:none">Used for Xbox 360 GUIs. Defines the actions to happen when the player uses the D-pad. <spanclass="anchor"id="line-125"></span><spanclass="anchor"id="line-126"></span></li></ul><pclass="line867">
<spanclass="anchor"id="line-127"></span><ul><listyle="list-style-type:none">Used for Xbox 360 GUIs. Defines the actions to happen when the player presses the X button, the Y button, the right shoulder and left shoulder buttons respectively. <spanclass="anchor"id="line-128"></span><spanclass="anchor"id="line-129"></span></li></ul><pclass="line867">
<spanclass="anchor"id="line-130"></span><ul><listyle="list-style-type:none">Used for console GUIs. This is a more generic version of the onESC script and is executed when the player presses the B button on the controller. <spanclass="anchor"id="line-131"></span><spanclass="anchor"id="line-132"></span><spanclass="anchor"id="line-133"></span></li></ul><pclass="line867">
<h2id="head-0b1da921cb3e29e599fa9d3ebc10d7698149cd83">Scripting Function Syntax</h2>
<spanclass="anchor"id="line-134"></span><pclass="line867"><hr/><pclass="line874"><spanclass="anchor"id="line-135"></span>The following example shows what a scripting window might look like for a <ahref="/quake4/Def_Types">windowDef</a> that will perform actions when the player mouses over it, away from it, and presses it, causing two commands to perform: <spanclass="anchor"id="line-136"></span><spanclass="anchor"id="line-137"></span><pclass="line867"><spanclass="anchor"id="line-138"></span><pre> windowDef button1
<spanclass="anchor"id="line-139"></span> {
<spanclass="anchor"id="line-140"></span> rect 0,0,200,100
<h2id="head-8c8838f6bc213f42daef3bec7b7b758d3c611c55">onTime and Animations</h2>
<spanclass="anchor"id="line-167"></span><pclass="line867"><hr/><pclass="line874"><spanclass="anchor"id="line-168"></span>GUIs often use animations to transition between screens or to animate background elements, and in the Quake 4 GUI system <strong>onTime</strong> is used to define animations that will occur in specified time steps. <strong>onTime</strong> is used just like any other scripting element in a <ahref="/quake4/Def_Types">windowDef</a>: <spanclass="anchor"id="line-169"></span><spanclass="anchor"id="line-170"></span><pclass="line867"><spanclass="anchor"id="line-171"></span><pre> windowDef foo
<spanclass="anchor"id="line-172"></span> {
<spanclass="anchor"id="line-173"></span> rect 0,0,1,1
<spanclass="anchor"id="line-179"></span> // statements here to execute
<spanclass="anchor"id="line-180"></span> }
<spanclass="anchor"id="line-181"></span> }
<spanclass="anchor"id="line-182"></span></pre><spanclass="anchor"id="line-183"></span><spanclass="anchor"id="line-184"></span><pclass="line862">Note: <ahref="/quake4/Def_Types">windowDefs</a> do not have to be visible for their onTime scripts to run. It's common to house animations in small <ahref="/quake4/Def_Types">windowDefs</a> with rect properties set to 0,0,1,1, make them invisible, and then use the <strong>resettime</strong> command to make them run (see <strong>resettime</strong> below). <spanclass="anchor"id="line-185"></span><spanclass="anchor"id="line-186"></span><pclass="line874">The syntax can be written in one of two ways. The following two examples both do the same thing: they cause “foo”’s backcolor to change from white with full alpha to white with zero alpha, then back to full alpha, then back to zero alpha, and finally back to full alpha. <spanclass="anchor"id="line-187"></span><spanclass="anchor"id="line-188"></span><pclass="line867"><strong>Example 1</strong><spanclass="anchor"id="line-189"></span><spanclass="anchor"id="line-190"></span><pre> onTime 0
<spanclass="anchor"id="line-232"></span></pre><spanclass="anchor"id="line-233"></span><spanclass="anchor"id="line-234"></span><pclass="line862">In the first example, the times are hard-defined in the scripting. In the second example, each <strong>onTime</strong> performs its next action +X seconds after the previously defined action. Deciding which syntax to use depends on what you want to accomplish. The second type of syntax is usually easier to use for very large animations where you may need to tweak individual time steps and it would be inconvenient to adjust all of the times in your <strong>onTime</strong> script. <spanclass="anchor"id="line-235"></span><spanclass="anchor"id="line-236"></span><pclass="line867"><strong>Animations</strong> can be looped through the <strong>resettime</strong> command. The <strong>resettime</strong> command can be used at the end of an onTime script or it can be sent from another script just like the set command. When used outside of the animation loop itself, such as from another <ahref="/quake4/Def_Types">windowDef</a>, the <strong>resettime</strong> command will start an animation from the beginning. <spanclass="anchor"id="line-237"></span><spanclass="anchor"id="line-238"></span><pclass="line862">The following is an example of the “white full alpha to white with zero alpha” animation looped with the <strong>resettime</strong> command: <spanclass="anchor"id="line-239"></span><spanclass="anchor"id="line-240"></span><pclass="line867"><spanclass="anchor"id="line-241"></span><pre> onTime 0
<spanclass="anchor"id="line-255"></span></pre><spanclass="anchor"id="line-256"></span><spanclass="anchor"id="line-257"></span><pclass="line862">The following example would reset the time of an animation in a <ahref="/quake4/Def_Types">windowDef</a> named "foo" from another <ahref="/quake4/Def_Types">windowDef's</a><em>onAction</em> script: <spanclass="anchor"id="line-258"></span><spanclass="anchor"id="line-259"></span><pclass="line867"><spanclass="anchor"id="onaction"></span><spanclass="anchor"id="line-260"></span><spanclass="anchor"id="line-261"></span><pre> onAction
<spanclass="anchor"id="line-265"></span></pre><spanclass="anchor"id="line-266"></span><spanclass="anchor"id="line-267"></span><pclass="line862">Looping animations can also be stopped with the notime flag. If you want an animation to stop when the player clicks on a <ahref="/quake4/Def_Types">windowDef</a> somewhere in the GUI, the syntax would be as follows: <spanclass="anchor"id="line-268"></span><spanclass="anchor"id="line-269"></span><pclass="line867"><spanclass="anchor"id="line-270"></span><pre> onAction
<spanclass="anchor"id="line-271"></span> {
<spanclass="anchor"id="line-272"></span> set “windowname::notime” “1” ;
<spanclass="anchor"id="line-273"></span> }
<spanclass="anchor"id="line-274"></span></pre><spanclass="anchor"id="line-275"></span><spanclass="anchor"id="line-276"></span><pclass="line867"><strong>notime</strong> can also be set as a <ahref="/quake4/Def_Types">windowDef's</a> flag to keep the animation from running until the <strong>resettime</strong> command has been issued: <spanclass="anchor"id="line-277"></span><spanclass="anchor"id="line-278"></span><pclass="line867"><spanclass="anchor"id="line-279"></span><pre> windowDef animation_alpha
<spanclass="anchor"id="line-280"></span> {
<spanclass="anchor"id="line-281"></span> rect 0,0,1,1
<spanclass="anchor"id="line-294"></span><pclass="line867"><hr/><pclass="line874"><spanclass="anchor"id="line-295"></span><strong>If</strong> and <strong>else if</strong> statements can be used in the GUI system. Their syntax is basic. The following example uses an if statement to check a desktop float and then executes a command based on that value: <spanclass="anchor"id="line-296"></span><spanclass="anchor"id="line-297"></span><pclass="line867"><spanclass="anchor"id="line-298"></span><pre> if ("desktop::float1" == 0) {
<spanclass="anchor"id="line-299"></span> set "foo::backcolor" "1,0,0,1" ;
<spanclass="anchor"id="line-301"></span> set "foo::backcolor" "1,1,1,1" ;
<spanclass="anchor"id="line-302"></span> } else {
<spanclass="anchor"id="line-303"></span> set "foo::backcolor" "1,1,0,1" ;
<spanclass="anchor"id="line-304"></span> }
<spanclass="anchor"id="line-305"></span></pre><spanclass="anchor"id="line-306"></span><spanclass="anchor"id="line-307"></span><pclass="line862">If statements can be more advanced and check for ranges of values as well. You can check for values greater than, less than, or greater/less than <strong>Or</strong> == to values. You can also check for <strong>Not</strong> values as well. Greater than or equal to is represented by <strong>>=</strong> while Not equal to is represented by <strong>!=</strong> Here is an example of advanced value checking. <spanclass="anchor"id="line-308"></span><spanclass="anchor"id="line-309"></span><pclass="line867"><spanclass="anchor"id="line-310"></span><pre> if ("desktop::float1" >= 5) {
<spanclass="anchor"id="line-311"></span> set "foo::backcolor" "1,0,0,1" ;
<spanclass="anchor"id="line-315"></span> set "foo::backcolor" "1,0,1,1" ;
<spanclass="anchor"id="line-316"></span> } else {
<spanclass="anchor"id="line-317"></span> set "foo::backcolor" "1,1,0,1" ;
<spanclass="anchor"id="line-318"></span> }
<spanclass="anchor"id="line-319"></span></pre><spanclass="anchor"id="line-320"></span><spanclass="anchor"id="line-321"></span><spanclass="anchor"id="line-322"></span><pclass="line862">They can also be used to check <strong>And</strong> cases and <strong>Or</strong> cases. And cases are sets of checks seperated by <strong>&&</strong> while Or cases are seperated by <strong>||</strong><spanclass="anchor"id="line-323"></span><spanclass="anchor"id="line-324"></span><pclass="line867"><spanclass="anchor"id="line-325"></span><pre> if ("desktop::float1" == 0 && "desktop::float2" == 0) {
<spanclass="anchor"id="line-326"></span> set "foo::backcolor" "1,0,0,1" ;
<li><ahref="http://moinmoin.wikiwikiweb.de/">MoinMoin Powered</a></li><li><ahref="http://www.python.org/">Python Powered</a></li><li><ahref="http://validator.w3.org/check?uri=referer">Valid HTML 4.01</a></li>
