mirror of
https://github.com/dhewm/iddevnet.git
synced 2024-11-21 12:01:18 +00:00
5a7e5cbe45
it's more or less usable now! all images (except for the ones of moinmoin itself) are still missing. possibly articles are missing as well, haven't checked yet (and the lost downloads are missing, of course)
433 lines
41 KiB
HTML
433 lines
41 KiB
HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||
<html>
|
||
<head>
|
||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
||
<meta name="robots" content="index,nofollow">
|
||
|
||
<title>Scripting Actions and Animations - Quake 4 SDK Documentation</title>
|
||
<script type="text/javascript" src="wiki/common/js/common.js"></script>
|
||
|
||
<script type="text/javascript">
|
||
<!--// common functions
|
||
|
||
// We keep here the state of the search box
|
||
searchIsDisabled = false;
|
||
|
||
function searchChange(e) {
|
||
// Update search buttons status according to search box content.
|
||
// Ignore empty or whitespace search term.
|
||
var value = e.value.replace(/\s+/, '');
|
||
if (value == '' || searchIsDisabled) {
|
||
searchSetDisabled(true);
|
||
} else {
|
||
searchSetDisabled(false);
|
||
}
|
||
}
|
||
|
||
function searchSetDisabled(flag) {
|
||
// Enable or disable search
|
||
document.getElementById('fullsearch').disabled = flag;
|
||
document.getElementById('titlesearch').disabled = flag;
|
||
}
|
||
|
||
function searchFocus(e) {
|
||
// Update search input content on focus
|
||
if (e.value == 'Search') {
|
||
e.value = '';
|
||
e.className = '';
|
||
searchIsDisabled = false;
|
||
}
|
||
}
|
||
|
||
function searchBlur(e) {
|
||
// Update search input content on blur
|
||
if (e.value == '') {
|
||
e.value = 'Search';
|
||
e.className = 'disabled';
|
||
searchIsDisabled = true;
|
||
}
|
||
}
|
||
|
||
function actionsMenuInit(title) {
|
||
// Initialize action menu
|
||
for (i = 0; i < document.forms.length; i++) {
|
||
var form = document.forms[i];
|
||
if (form.className == 'actionsmenu') {
|
||
// Check if this form needs update
|
||
var div = form.getElementsByTagName('div')[0];
|
||
var label = div.getElementsByTagName('label')[0];
|
||
if (label) {
|
||
// This is the first time: remove label and do buton.
|
||
div.removeChild(label);
|
||
var dobutton = div.getElementsByTagName('input')[0];
|
||
div.removeChild(dobutton);
|
||
// and add menu title
|
||
var select = div.getElementsByTagName('select')[0];
|
||
var item = document.createElement('option');
|
||
item.appendChild(document.createTextNode(title));
|
||
item.value = 'show';
|
||
select.insertBefore(item, select.options[0]);
|
||
select.selectedIndex = 0;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
//-->
|
||
</script>
|
||
|
||
|
||
<link rel="stylesheet" type="text/css" charset="utf-8" media="all" href="wiki/modern/css/common.css">
|
||
<link rel="stylesheet" type="text/css" charset="utf-8" media="screen" href="wiki/modern/css/screen.css">
|
||
<link rel="stylesheet" type="text/css" charset="utf-8" media="print" href="wiki/modern/css/print.css">
|
||
<link rel="stylesheet" type="text/css" charset="utf-8" media="projection" href="wiki/modern/css/projection.css">
|
||
|
||
<!-- css only for MSIE browsers -->
|
||
<!--[if IE]>
|
||
<link rel="stylesheet" type="text/css" charset="utf-8" media="all" href="wiki/modern/css/msie.css">
|
||
<![endif]-->
|
||
|
||
|
||
|
||
<link rel="Start" href="./Quake4SDK.html">
|
||
<link rel="Alternate" title="Wiki Markup" href="./Scripting_Actions_and_Animations?action=raw">
|
||
<link rel="Alternate" media="print" title="Print View" href="./Scripting_Actions_and_Animations?action=print">
|
||
<link rel="Search" href="./FindPage.html">
|
||
<link rel="Index" href="./TitleIndex.html">
|
||
<link rel="Glossary" href="./WordIndex.html">
|
||
<link rel="Help" href="./HelpOnFormatting.html">
|
||
</head>
|
||
|
||
<body lang="en" dir="ltr">
|
||
|
||
<div id="header">
|
||
<div id="logo"><a href="./Quake4SDK.html"><img src="wiki/common/moinmoin.png" alt="MoinMoin Logo"></a></div>
|
||
|
||
<form id="searchform" method="get" action="">
|
||
<div>
|
||
<input type="hidden" name="action" value="fullsearch">
|
||
<input type="hidden" name="context" value="180">
|
||
<label for="searchinput">Search:</label>
|
||
<input id="searchinput" type="text" name="value" value="" size="20"
|
||
onfocus="searchFocus(this)" onblur="searchBlur(this)"
|
||
onkeyup="searchChange(this)" onchange="searchChange(this)" alt="Search">
|
||
<input id="titlesearch" name="titlesearch" type="submit"
|
||
value="Titles" alt="Search Titles">
|
||
<input id="fullsearch" name="fullsearch" type="submit"
|
||
value="Text" alt="Search Full Text">
|
||
</div>
|
||
</form>
|
||
<script type="text/javascript">
|
||
<!--// Initialize search form
|
||
var f = document.getElementById('searchform');
|
||
f.getElementsByTagName('label')[0].style.display = 'none';
|
||
var e = document.getElementById('searchinput');
|
||
searchChange(e);
|
||
searchBlur(e);
|
||
//-->
|
||
</script>
|
||
|
||
<ul id="username"><li><a href="./Scripting_Actions_and_Animations?action=login" id="login">Login</a></li></ul>
|
||
<div id="locationline">
|
||
|
||
|
||
<ul id="pagelocation">
|
||
<li><a class="backlink" title="Click to do a full-text search for this title" href="./Scripting_Actions_and_Animations?action=fullsearch&value=linkto%3A%22Scripting+Actions+and+Animations%22&context=180">Scripting Actions and Animations</a></li>
|
||
</ul>
|
||
|
||
</div>
|
||
|
||
|
||
<ul id="navibar">
|
||
<li class="wikilink"><a href="./GettingStarted.html">GettingStarted</a></li><li class="wikilink"><a href="./ScriptFile.html">ScriptFile</a></li><li class="wikilink"><a href="./MakeAMod.html">MakeAMod</a></li><li class="wikilink"><a href="./LevelEditor.html">LevelEditor</a></li><li class="wikilink"><a href="./FXEditor.html">FXEditor</a></li><li class="wikilink"><a href="./GUIEditor.html">GUIEditor</a></li><li class="wikilink"><a href="./Sounds.html">Sounds</a></li><li class="wikilink"><a href="./Animations.html">Animations</a></li><li class="wikilink"><a href="./ArtReference.html">ArtReference</a></li><li class="wikilink"><a href="./DownloadableContent.html">DownloadableContent</a></li><li class="wikilink"><a href="./RecentChanges.html">RecentChanges</a></li><li class="wikilink"><a href="./FindPage.html">FindPage</a></li><li class="wikilink"><a href="./HelpContents.html">HelpContents</a></li><li class="current"><a href="./Scripting_Actions_and_Animations.html">Scripting A... Animations</a></li>
|
||
</ul>
|
||
|
||
<div id="pageline"><hr style="display:none;"></div>
|
||
|
||
<ul class="editbar"><li><span class="disabled">Immutable Page</span></li><li><a href="./Scripting_Actions_and_Animations?action=info">Info</a></li><li><a href="./Scripting_Actions_and_Animations?action=AttachFile">Attachments</a></li><li>
|
||
<form class="actionsmenu" method="get" action="">
|
||
<div>
|
||
<label>More Actions:</label>
|
||
<select name="action"
|
||
onchange="if ((this.selectedIndex != 0) &&
|
||
(this.options[this.selectedIndex].disabled == false)) {
|
||
this.form.submit();
|
||
}
|
||
this.selectedIndex = 0;">
|
||
<option value="raw">Raw Text</option>
|
||
<option value="print">Print View</option>
|
||
<option value="RenderAsDocbook">Render as Docbook</option>
|
||
<option value="refresh">Delete Cache</option>
|
||
<option value="show" disabled class="disabled">------------</option>
|
||
<option value="SpellCheck">Check Spelling</option>
|
||
<option value="LikePages">Like Pages</option>
|
||
<option value="LocalSiteMap">Local Site Map</option>
|
||
<option value="show" disabled class="disabled">------------</option>
|
||
<option value="RenamePage" disabled class="disabled">Rename Page</option>
|
||
<option value="DeletePage" disabled class="disabled">Delete Page</option>
|
||
<option value="show" disabled class="disabled">------------</option>
|
||
<option value="MyPages">My Pages</option>
|
||
<option value="SubscribeUser">Subscribe User</option>
|
||
<option value="show" disabled class="disabled">------------</option>
|
||
<option value="Despam">Remove Spam</option>
|
||
<option value="PackagePages">Package Pages</option>
|
||
</select>
|
||
<input type="submit" value="Do">
|
||
</div>
|
||
<script type="text/javascript">
|
||
<!--// Init menu
|
||
actionsMenuInit('More Actions:');
|
||
//-->
|
||
</script>
|
||
</form>
|
||
</li></ul>
|
||
|
||
</div>
|
||
|
||
<div id="page" lang="en" dir="ltr">
|
||
<div dir="ltr" id="content" lang="en"><span class="anchor" id="top"></span>
|
||
<span class="anchor" id="line-1"></span><p class="line867">
|
||
<h2 id="head-54e8f90e1aa0844460ab6208d6542db050cca49a">Scripting Actions and Animations</h2>
|
||
<span class="anchor" id="line-2"></span><p class="line867"><hr /><p class="line874"> <span class="anchor" id="line-3"></span>There are two basic things that occur in GUIs: <span class="anchor" id="line-4"></span><span class="anchor" id="line-5"></span><p class="line874">1. The user clicks an element that causes an action <span class="anchor" id="line-6"></span><span class="anchor" id="line-7"></span><p class="line874">2. The action sends commands, performs a separate script, or starts an animation <span class="anchor" id="line-8"></span><span class="anchor" id="line-9"></span><p class="line862">In order to make this happen, <a href="./Def_Types.html">windowDefs</a> have to contain scripts. To add scripting to a <a href="./Def_Types.html">windowDef</a> in the GUI editor, select the <a href="./Def_Types.html">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). <span class="anchor" id="line-10"></span><span class="anchor" id="line-11"></span><p class="line874">The syntax for scripting elements looks like the following example: <span class="anchor" id="line-12"></span><span class="anchor" id="line-13"></span><p class="line867"><span class="anchor" id="line-14"></span><pre> OnScriptElementName
|
||
<span class="anchor" id="line-15"></span> {
|
||
<span class="anchor" id="line-16"></span> command “windowname::parameter” “value” ;
|
||
<span class="anchor" id="line-17"></span> }
|
||
<span class="anchor" id="line-18"></span></pre><span class="anchor" id="line-19"></span><span class="anchor" id="line-20"></span><span class="anchor" id="line-21"></span><p class="line867">
|
||
<h2 id="head-dcc908e1b060c59d34b4d7b8f95d1ac51626e6f6">Common Script Commands</h2>
|
||
<span class="anchor" id="line-22"></span><p class="line867"><hr /><p class="line874"> <span class="anchor" id="line-23"></span>
|
||
<h4 id="head-4f5eab5e09f80856d56ba9a3d1e889f6f9d11252">Set and Transition</h4>
|
||
<span class="anchor" id="line-24"></span><span class="anchor" id="line-25"></span><p class="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 <a href="./Def_Types.html">windowDef</a> flag. Scripts can change the flags of the <a href="./Def_Types.html">windowDef</a> that contains the script or other windowDefs as well. If the script is changing the flags of its own <a href="./Def_Types.html">windowDef</a>, the “windowname::flag” syntax can be dropped and only the flag is needed (see examples below). <span class="anchor" id="line-26"></span><span class="anchor" id="line-27"></span><p class="line874">The following are some examples with the “set” command syntax. <span class="anchor" id="line-28"></span><span class="anchor" id="line-29"></span><ul><li style="list-style-type:none"><p class="line891"><strong>set “visible” “0” ;</strong> <span class="anchor" id="line-30"></span><span class="anchor" id="line-31"></span></li></ul><p class="line862">This turns off the visibility of the <a href="./Def_Types.html">windowDef</a> that contains the script. <span class="anchor" id="line-32"></span><span class="anchor" id="line-33"></span><ul><li style="list-style-type:none"><p class="line891"><strong>set “foo::visible” “1” ;</strong> <span class="anchor" id="line-34"></span><span class="anchor" id="line-35"></span></li></ul><p class="line862">This enables the visibility of the <a href="./Def_Types.html">windowDef</a> named “foo”. <span class="anchor" id="line-36"></span><span class="anchor" id="line-37"></span><ul><li style="list-style-type:none"><p class="line891"><strong>set “cmd” “close” ;</strong> <span class="anchor" id="line-38"></span><span class="anchor" id="line-39"></span></li></ul><p class="line874">This sends a command to close the GUI. <span class="anchor" id="line-40"></span><span class="anchor" id="line-41"></span><p class="line867"><hr /><p class="line874"> <span class="anchor" id="line-42"></span><span class="anchor" id="line-43"></span><p class="line874">Commands can be sent as if the user typed them into the console: <span class="anchor" id="line-44"></span><span class="anchor" id="line-45"></span><ul><li style="list-style-type:none"><p class="line891"><strong>consolecmd “si_map mp/q4dm1” ;</strong> <span class="anchor" id="line-46"></span><span class="anchor" id="line-47"></span></li></ul><p class="line874">This specific command sets the server map to be mp/q4dm1 <span class="anchor" id="line-48"></span><span class="anchor" id="line-49"></span><p class="line867"><hr /><p class="line874"> <span class="anchor" id="line-50"></span><span class="anchor" id="line-51"></span><p class="line867"><strong>Transition</strong> is used to change one flag value to another over time. This is often used for mouseover color changes and <a href="./Def_Types.html">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. <span class="anchor" id="line-52"></span><span class="anchor" id="line-53"></span><ul><li style="list-style-type:none"><p class="line891"><strong>transition “matcolor” “1,1,1,1” “1,1,0,1” “100” ;</strong> <span class="anchor" id="line-54"></span><span class="anchor" id="line-55"></span></li></ul><p class="line862">This transitions the color of the image in a <a href="./Def_Types.html">windowDef</a> from white to yellow over 100 milliseconds. The following performs the same function but only transitions the <a href="./Def_Types.html">windowDef's</a> alpha color: <span class="anchor" id="line-56"></span><span class="anchor" id="line-57"></span><ul><li style="list-style-type:none"><p class="line891"><strong>transition “matcolor_w” “1” “0” “100” ;</strong> <span class="anchor" id="line-58"></span><span class="anchor" id="line-59"></span></li></ul><p class="line862">The following transitions the size of a <a href="./Def_Types.html">windowDef</a> from 640 x 480 to 300 x 300 over 500 milliseconds. <span class="anchor" id="line-60"></span><span class="anchor" id="line-61"></span><ul><li style="list-style-type:none"><p class="line891"><strong>transition “rect” “0,0,640,480” “0,0,300,300” “500” ;</strong> <span class="anchor" id="line-62"></span><span class="anchor" id="line-63"></span></li></ul><p class="line867">
|
||
<h4 id="head-78a7dbd2f86f77b9fdef9847be3e19ab157fc617">setFocus</h4>
|
||
<span class="anchor" id="line-64"></span><span class="anchor" id="line-65"></span><p class="line862">setFocus is used mostly in console menus. This command is used to set the mouse focus of a specific <a href="./Def_Types.html">windowDef</a>. The syntax is as follows: <span class="anchor" id="line-66"></span><span class="anchor" id="line-67"></span><ul><li style="list-style-type:none"><p class="line891"><strong>setFocus “windowname” ;</strong> <span class="anchor" id="line-68"></span><span class="anchor" id="line-69"></span></li></ul><p class="line867">
|
||
<h4 id="head-6c068c50681559aa9c75a143fdaa832e59142b1d">Stoptransitions</h4>
|
||
<span class="anchor" id="line-70"></span><span class="anchor" id="line-71"></span><p class="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: <span class="anchor" id="line-72"></span><span class="anchor" id="line-73"></span><p class="line867"><span class="anchor" id="line-74"></span><pre> windowDef button1
|
||
<span class="anchor" id="line-75"></span> {
|
||
<span class="anchor" id="line-76"></span> rect 0,0,100,100
|
||
<span class="anchor" id="line-77"></span> visible 1
|
||
<span class="anchor" id="line-78"></span>
|
||
<span class="anchor" id="line-79"></span> onMouseEnter
|
||
<span class="anchor" id="line-80"></span> {
|
||
<span class="anchor" id="line-81"></span> // highlights the button
|
||
<span class="anchor" id="line-82"></span> transition "matcolor_w" "0.5" "1" "150" ;
|
||
<span class="anchor" id="line-83"></span> }
|
||
<span class="anchor" id="line-84"></span>
|
||
<span class="anchor" id="line-85"></span> onMouseExit
|
||
<span class="anchor" id="line-86"></span> {
|
||
<span class="anchor" id="line-87"></span> // unhighlights the button
|
||
<span class="anchor" id="line-88"></span> transition "matcolor_w" "1" "0.5" "150" ;
|
||
<span class="anchor" id="line-89"></span> }
|
||
<span class="anchor" id="line-90"></span>
|
||
<span class="anchor" id="line-91"></span> onAction
|
||
<span class="anchor" id="line-92"></span> {
|
||
<span class="anchor" id="line-93"></span> // halts all animations and transitions when the player selects the button
|
||
<span class="anchor" id="line-94"></span> stoptransitions "button1" ;
|
||
<span class="anchor" id="line-95"></span> }
|
||
<span class="anchor" id="line-96"></span> }
|
||
<span class="anchor" id="line-97"></span></pre><span class="anchor" id="line-98"></span><span class="anchor" id="line-99"></span><p class="line867">
|
||
<h4 id="head-9b7d249c322eb86b2d268f0e5a3eba114f8f74c8">Noninteractive</h4>
|
||
<span class="anchor" id="line-100"></span><span class="anchor" id="line-101"></span><p class="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: <span class="anchor" id="line-102"></span><span class="anchor" id="line-103"></span><ul><li style="list-style-type:none"><p class="line891"><strong>Noninteractive "1" ;</strong> <span class="anchor" id="line-104"></span><span class="anchor" id="line-105"></span><span class="anchor" id="line-106"></span></li></ul><p class="line867">
|
||
<h2 id="head-00ee40a13993eebb62c69bce3c9c8d23d8035d49">Scripting Functions</h2>
|
||
<span class="anchor" id="line-107"></span><p class="line867"><hr /><p class="line874"> <span class="anchor" id="line-108"></span>
|
||
<h4 id="head-22fbd8f4599b4c64d94405cea7e4b585f1e85890">onMouseEnter</h4>
|
||
<span class="anchor" id="line-109"></span><ul><li style="list-style-type:none"><p class="line862">Specifies actions to happen when the player mouses over the <a href="./Def_Types.html">windowDef</a>. <span class="anchor" id="line-110"></span><span class="anchor" id="line-111"></span></li></ul><p class="line867">
|
||
<h4 id="head-c53af4fd76f6930d599911f9479c2b4726fecb81">onMouseExit</h4>
|
||
<span class="anchor" id="line-112"></span><ul><li style="list-style-type:none"><p class="line862">Specifies actions to happen when the player mouses out of the <a href="./Def_Types.html">windowDef</a>. <span class="anchor" id="line-113"></span><span class="anchor" id="line-114"></span></li></ul><p class="line867">
|
||
<h4 id="head-e5e9aa5d41b44cd230d8267fdb75e5f73cc178f4">onAction</h4>
|
||
<span class="anchor" id="line-115"></span><ul><li style="list-style-type:none"><p class="line862">Specifies actions to happen when the player clicks on the <a href="./Def_Types.html">windowDef</a>. <span class="anchor" id="line-116"></span><span class="anchor" id="line-117"></span></li></ul><p class="line867">
|
||
<h4 id="head-74ca8410f601379bacb172460c2919de84953d74">onESC</h4>
|
||
<span class="anchor" id="line-118"></span><ul><li style="list-style-type:none"><p class="line862">Usually defined in the Desktop (for console menus, this is also defined in other <a href="./Def_Types.html">windowDefs</a>). Defines the actions to be performed when the player hits the ESC key. (For Xenon menus where this is used in <a href="./Def_Types.html">windowDefs</a>, it defines the actions to happen when the player hits the B button.) <span class="anchor" id="line-119"></span><span class="anchor" id="line-120"></span></li></ul><p class="line867">
|
||
<h4 id="head-6bbe702789bd56dd62a4a889eb17c87d19274ad6">onNamedEvent</h4>
|
||
<span class="anchor" id="line-121"></span><ul><li style="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. <span class="anchor" id="line-122"></span><span class="anchor" id="line-123"></span></li></ul><p class="line867">
|
||
<h4 id="head-9ceb2f7d7443e8ae4a292d4f5ae65416d505d692">OnJoyUp, onJoyDown, onJoyRight, onJoyLeft</h4>
|
||
<span class="anchor" id="line-124"></span><ul><li style="list-style-type:none">Used for Xbox 360 GUIs. Defines the actions to happen when the player uses the D-pad. <span class="anchor" id="line-125"></span><span class="anchor" id="line-126"></span></li></ul><p class="line867">
|
||
<h4 id="head-cc562dd459c97c9a1515f53bd5bffbd7b7c025c6">onJoyButton1, onJoyButton2, onJoyRShoulder, onJoyLShoulder</h4>
|
||
<span class="anchor" id="line-127"></span><ul><li style="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. <span class="anchor" id="line-128"></span><span class="anchor" id="line-129"></span></li></ul><p class="line867">
|
||
<h4 id="head-6e606316978e1df8c466092a8b433aa25009b3a0">onJoyBack</h4>
|
||
<span class="anchor" id="line-130"></span><ul><li style="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. <span class="anchor" id="line-131"></span><span class="anchor" id="line-132"></span><span class="anchor" id="line-133"></span></li></ul><p class="line867">
|
||
<h2 id="head-0b1da921cb3e29e599fa9d3ebc10d7698149cd83">Scripting Function Syntax</h2>
|
||
<span class="anchor" id="line-134"></span><p class="line867"><hr /><p class="line874"> <span class="anchor" id="line-135"></span>The following example shows what a scripting window might look like for a <a href="./Def_Types.html">windowDef</a> that will perform actions when the player mouses over it, away from it, and presses it, causing two commands to perform: <span class="anchor" id="line-136"></span><span class="anchor" id="line-137"></span><p class="line867"><span class="anchor" id="line-138"></span><pre> windowDef button1
|
||
<span class="anchor" id="line-139"></span> {
|
||
<span class="anchor" id="line-140"></span> rect 0,0,200,100
|
||
<span class="anchor" id="line-141"></span> visible 1
|
||
<span class="anchor" id="line-142"></span> backcolor 1,1,0,1
|
||
<span class="anchor" id="line-143"></span> text "button 1"
|
||
<span class="anchor" id="line-144"></span> textscale 0.26
|
||
<span class="anchor" id="line-145"></span> font "fonts/lowpixel"
|
||
<span class="anchor" id="line-146"></span>
|
||
<span class="anchor" id="line-147"></span> onMouseEnter
|
||
<span class="anchor" id="line-148"></span> {
|
||
<span class="anchor" id="line-149"></span> transition “button1::backcolor” “1,1,0,1” “1,1,1,1” “100” ;
|
||
<span class="anchor" id="line-150"></span> }
|
||
<span class="anchor" id="line-151"></span>
|
||
<span class="anchor" id="line-152"></span> onMouseExit
|
||
<span class="anchor" id="line-153"></span> {
|
||
<span class="anchor" id="line-154"></span> transition “button1::backcolor” “1,1,1,1” “1,1,0,1” “100” ;
|
||
<span class="anchor" id="line-155"></span> }
|
||
<span class="anchor" id="line-156"></span>
|
||
<span class="anchor" id="line-157"></span> onAction
|
||
<span class="anchor" id="line-158"></span> {
|
||
<span class="anchor" id="line-159"></span> set “cmd” "play guisound_beep2; runscript map_hangar1::fire " ;
|
||
<span class="anchor" id="line-160"></span> }
|
||
<span class="anchor" id="line-161"></span> }
|
||
<span class="anchor" id="line-162"></span></pre><span class="anchor" id="line-163"></span><span class="anchor" id="line-164"></span><span class="anchor" id="line-165"></span><p class="line867"><span class="anchor" id="animations"></span> <span class="anchor" id="line-166"></span>
|
||
<h2 id="head-8c8838f6bc213f42daef3bec7b7b758d3c611c55">onTime and Animations</h2>
|
||
<span class="anchor" id="line-167"></span><p class="line867"><hr /><p class="line874"> <span class="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 <a href="./Def_Types.html">windowDef</a>: <span class="anchor" id="line-169"></span><span class="anchor" id="line-170"></span><p class="line867"><span class="anchor" id="line-171"></span><pre> windowDef foo
|
||
<span class="anchor" id="line-172"></span> {
|
||
<span class="anchor" id="line-173"></span> rect 0,0,1,1
|
||
<span class="anchor" id="line-174"></span> visible 0
|
||
<span class="anchor" id="line-175"></span> notime 0
|
||
<span class="anchor" id="line-176"></span>
|
||
<span class="anchor" id="line-177"></span> onTime 0
|
||
<span class="anchor" id="line-178"></span> {
|
||
<span class="anchor" id="line-179"></span> // statements here to execute
|
||
<span class="anchor" id="line-180"></span> }
|
||
<span class="anchor" id="line-181"></span> }
|
||
<span class="anchor" id="line-182"></span></pre><span class="anchor" id="line-183"></span><span class="anchor" id="line-184"></span><p class="line862">Note: <a href="./Def_Types.html">windowDefs</a> do not have to be visible for their onTime scripts to run. It's common to house animations in small <a href="./Def_Types.html">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). <span class="anchor" id="line-185"></span><span class="anchor" id="line-186"></span><p class="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. <span class="anchor" id="line-187"></span><span class="anchor" id="line-188"></span><p class="line867"><strong>Example 1</strong> <span class="anchor" id="line-189"></span><span class="anchor" id="line-190"></span><pre> onTime 0
|
||
<span class="anchor" id="line-191"></span> {
|
||
<span class="anchor" id="line-192"></span> transition “foo::backcolor_w” “1” “0” “100” ;
|
||
<span class="anchor" id="line-193"></span> }
|
||
<span class="anchor" id="line-194"></span>
|
||
<span class="anchor" id="line-195"></span> onTime 100
|
||
<span class="anchor" id="line-196"></span> {
|
||
<span class="anchor" id="line-197"></span> transition “foo::backcolor_w” “0” “1” “100” ;
|
||
<span class="anchor" id="line-198"></span> }
|
||
<span class="anchor" id="line-199"></span>
|
||
<span class="anchor" id="line-200"></span> onTime 200
|
||
<span class="anchor" id="line-201"></span> {
|
||
<span class="anchor" id="line-202"></span> transition “foo::backcolor_w” “1” “0” “100” ;
|
||
<span class="anchor" id="line-203"></span> }
|
||
<span class="anchor" id="line-204"></span>
|
||
<span class="anchor" id="line-205"></span> onTime 300
|
||
<span class="anchor" id="line-206"></span> {
|
||
<span class="anchor" id="line-207"></span> transition “foo::backcolor_w” “0” “1” “100” ;
|
||
<span class="anchor" id="line-208"></span> }
|
||
<span class="anchor" id="line-209"></span></pre><span class="anchor" id="line-210"></span><span class="anchor" id="line-211"></span><p class="line867"><strong>Example 2</strong> <span class="anchor" id="line-212"></span><span class="anchor" id="line-213"></span><pre> OnTime 0
|
||
<span class="anchor" id="line-214"></span> {
|
||
<span class="anchor" id="line-215"></span> transition “foo::backcolor_w” “1” “0” “100” ;
|
||
<span class="anchor" id="line-216"></span> }
|
||
<span class="anchor" id="line-217"></span>
|
||
<span class="anchor" id="line-218"></span> onTime +100
|
||
<span class="anchor" id="line-219"></span> {
|
||
<span class="anchor" id="line-220"></span> transition “foo::backcolor_w” “0” “1” “100” ;
|
||
<span class="anchor" id="line-221"></span> }
|
||
<span class="anchor" id="line-222"></span>
|
||
<span class="anchor" id="line-223"></span> onTime +100
|
||
<span class="anchor" id="line-224"></span> {
|
||
<span class="anchor" id="line-225"></span> transition “foo::backcolor_w” “1” “0” “100” ;
|
||
<span class="anchor" id="line-226"></span> }
|
||
<span class="anchor" id="line-227"></span>
|
||
<span class="anchor" id="line-228"></span> onTime +100
|
||
<span class="anchor" id="line-229"></span> {
|
||
<span class="anchor" id="line-230"></span> transition “foo::backcolor_w” “0” “1” “100” ;
|
||
<span class="anchor" id="line-231"></span> }
|
||
<span class="anchor" id="line-232"></span></pre><span class="anchor" id="line-233"></span><span class="anchor" id="line-234"></span><p class="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. <span class="anchor" id="line-235"></span><span class="anchor" id="line-236"></span><p class="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 <a href="./Def_Types.html">windowDef</a>, the <strong>resettime</strong> command will start an animation from the beginning. <span class="anchor" id="line-237"></span><span class="anchor" id="line-238"></span><p class="line862">The following is an example of the “white full alpha to white with zero alpha” animation looped with the <strong>resettime</strong> command: <span class="anchor" id="line-239"></span><span class="anchor" id="line-240"></span><p class="line867"><span class="anchor" id="line-241"></span><pre> onTime 0
|
||
<span class="anchor" id="line-242"></span> {
|
||
<span class="anchor" id="line-243"></span> transition “windowname::backcolor” “1,1,1,1” “1,1,10” “100” ;
|
||
<span class="anchor" id="line-244"></span> }
|
||
<span class="anchor" id="line-245"></span>
|
||
<span class="anchor" id="line-246"></span> onTime 100
|
||
<span class="anchor" id="line-247"></span> {
|
||
<span class="anchor" id="line-248"></span> transition “windowname::backcolor” “1,1,1,0” “1,1,1,1” “100” ;
|
||
<span class="anchor" id="line-249"></span> }
|
||
<span class="anchor" id="line-250"></span>
|
||
<span class="anchor" id="line-251"></span> onTime 200
|
||
<span class="anchor" id="line-252"></span> {
|
||
<span class="anchor" id="line-253"></span> resettime “0” ;
|
||
<span class="anchor" id="line-254"></span> }
|
||
<span class="anchor" id="line-255"></span></pre><span class="anchor" id="line-256"></span><span class="anchor" id="line-257"></span><p class="line862">The following example would reset the time of an animation in a <a href="./Def_Types.html">windowDef</a> named "foo" from another <a href="./Def_Types.html">windowDef's</a> <em>onAction</em> script: <span class="anchor" id="line-258"></span><span class="anchor" id="line-259"></span><p class="line867"><span class="anchor" id="onaction"></span> <span class="anchor" id="line-260"></span><span class="anchor" id="line-261"></span><pre> onAction
|
||
<span class="anchor" id="line-262"></span> {
|
||
<span class="anchor" id="line-263"></span> resettime “foo” “0” ;
|
||
<span class="anchor" id="line-264"></span> }
|
||
<span class="anchor" id="line-265"></span></pre><span class="anchor" id="line-266"></span><span class="anchor" id="line-267"></span><p class="line862">Looping animations can also be stopped with the notime flag. If you want an animation to stop when the player clicks on a <a href="./Def_Types.html">windowDef</a> somewhere in the GUI, the syntax would be as follows: <span class="anchor" id="line-268"></span><span class="anchor" id="line-269"></span><p class="line867"><span class="anchor" id="line-270"></span><pre> onAction
|
||
<span class="anchor" id="line-271"></span> {
|
||
<span class="anchor" id="line-272"></span> set “windowname::notime” “1” ;
|
||
<span class="anchor" id="line-273"></span> }
|
||
<span class="anchor" id="line-274"></span></pre><span class="anchor" id="line-275"></span><span class="anchor" id="line-276"></span><p class="line867"><strong>notime</strong> can also be set as a <a href="./Def_Types.html">windowDef's</a> flag to keep the animation from running until the <strong>resettime</strong> command has been issued: <span class="anchor" id="line-277"></span><span class="anchor" id="line-278"></span><p class="line867"><span class="anchor" id="line-279"></span><pre> windowDef animation_alpha
|
||
<span class="anchor" id="line-280"></span> {
|
||
<span class="anchor" id="line-281"></span> rect 0,0,1,1
|
||
<span class="anchor" id="line-282"></span> visible 0
|
||
<span class="anchor" id="line-283"></span> notime 1
|
||
<span class="anchor" id="line-284"></span>
|
||
<span class="anchor" id="line-285"></span> onTime 0
|
||
<span class="anchor" id="line-286"></span> {
|
||
<span class="anchor" id="line-287"></span> transition "foo::matcolor_w" "1" "0" "100" ;
|
||
<span class="anchor" id="line-288"></span> }
|
||
<span class="anchor" id="line-289"></span> }
|
||
<span class="anchor" id="line-290"></span></pre><span class="anchor" id="line-291"></span><span class="anchor" id="line-292"></span><span class="anchor" id="line-293"></span><p class="line867">
|
||
<h2 id="head-4ed99d3933e57b9e3beb6e9eae742ad1053d3b89">If Statements</h2>
|
||
<span class="anchor" id="line-294"></span><p class="line867"><hr /><p class="line874"> <span class="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: <span class="anchor" id="line-296"></span><span class="anchor" id="line-297"></span><p class="line867"><span class="anchor" id="line-298"></span><pre> if ("desktop::float1" == 0) {
|
||
<span class="anchor" id="line-299"></span> set "foo::backcolor" "1,0,0,1" ;
|
||
<span class="anchor" id="line-300"></span> } else if("desktop::float1" == 1) {
|
||
<span class="anchor" id="line-301"></span> set "foo::backcolor" "1,1,1,1" ;
|
||
<span class="anchor" id="line-302"></span> } else {
|
||
<span class="anchor" id="line-303"></span> set "foo::backcolor" "1,1,0,1" ;
|
||
<span class="anchor" id="line-304"></span> }
|
||
<span class="anchor" id="line-305"></span></pre><span class="anchor" id="line-306"></span><span class="anchor" id="line-307"></span><p class="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. <span class="anchor" id="line-308"></span><span class="anchor" id="line-309"></span><p class="line867"><span class="anchor" id="line-310"></span><pre> if ("desktop::float1" >= 5) {
|
||
<span class="anchor" id="line-311"></span> set "foo::backcolor" "1,0,0,1" ;
|
||
<span class="anchor" id="line-312"></span> } else if("desktop::float1" <= 2) {
|
||
<span class="anchor" id="line-313"></span> set "foo::backcolor" "1,1,1,1" ;
|
||
<span class="anchor" id="line-314"></span> } else if("desktop::float1" != 8) {
|
||
<span class="anchor" id="line-315"></span> set "foo::backcolor" "1,0,1,1" ;
|
||
<span class="anchor" id="line-316"></span> } else {
|
||
<span class="anchor" id="line-317"></span> set "foo::backcolor" "1,1,0,1" ;
|
||
<span class="anchor" id="line-318"></span> }
|
||
<span class="anchor" id="line-319"></span></pre><span class="anchor" id="line-320"></span><span class="anchor" id="line-321"></span><span class="anchor" id="line-322"></span><p class="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> <span class="anchor" id="line-323"></span><span class="anchor" id="line-324"></span><p class="line867"><span class="anchor" id="line-325"></span><pre> if ("desktop::float1" == 0 && "desktop::float2" == 0) {
|
||
<span class="anchor" id="line-326"></span> set "foo::backcolor" "1,0,0,1" ;
|
||
<span class="anchor" id="line-327"></span> } else if ("desktop::float1" == 2 || "desktop::float2" == 2 || "desktop::float3" == 2) {
|
||
<span class="anchor" id="line-328"></span> set "foo::backcolor" "1,1,1,1" ;
|
||
<span class="anchor" id="line-329"></span> } else {
|
||
<span class="anchor" id="line-330"></span> set "foo::backcolor" "1,1,0,1" ;
|
||
<span class="anchor" id="line-331"></span> }
|
||
<span class="anchor" id="line-332"></span></pre><p class="line874"> <span class="anchor" id="line-333"></span><span class="anchor" id="bottom"></span></div><p id="pageinfo" class="info" lang="en" dir="ltr">Scripting Actions and Animations (last edited 2005-11-04 23:18:50 by <span title="MattVainio @ 67.129.250.254[67.129.250.254]"><a class="nonexistent" href="./MattVainio.html" title="MattVainio @ 67.129.250.254[67.129.250.254]">MattVainio</a></span>)</p>
|
||
|
||
<div id="pagebottom"></div>
|
||
</div>
|
||
|
||
|
||
<div id="footer">
|
||
<ul class="editbar"><li><span class="disabled">Immutable Page</span></li><li><a href="./Scripting_Actions_and_Animations?action=info">Info</a></li><li><a href="./Scripting_Actions_and_Animations?action=AttachFile">Attachments</a></li><li>
|
||
<form class="actionsmenu" method="get" action="">
|
||
<div>
|
||
<label>More Actions:</label>
|
||
<select name="action"
|
||
onchange="if ((this.selectedIndex != 0) &&
|
||
(this.options[this.selectedIndex].disabled == false)) {
|
||
this.form.submit();
|
||
}
|
||
this.selectedIndex = 0;">
|
||
<option value="raw">Raw Text</option>
|
||
<option value="print">Print View</option>
|
||
<option value="RenderAsDocbook">Render as Docbook</option>
|
||
<option value="refresh">Delete Cache</option>
|
||
<option value="show" disabled class="disabled">------------</option>
|
||
<option value="SpellCheck">Check Spelling</option>
|
||
<option value="LikePages">Like Pages</option>
|
||
<option value="LocalSiteMap">Local Site Map</option>
|
||
<option value="show" disabled class="disabled">------------</option>
|
||
<option value="RenamePage" disabled class="disabled">Rename Page</option>
|
||
<option value="DeletePage" disabled class="disabled">Delete Page</option>
|
||
<option value="show" disabled class="disabled">------------</option>
|
||
<option value="MyPages">My Pages</option>
|
||
<option value="SubscribeUser">Subscribe User</option>
|
||
<option value="show" disabled class="disabled">------------</option>
|
||
<option value="Despam">Remove Spam</option>
|
||
<option value="PackagePages">Package Pages</option>
|
||
</select>
|
||
<input type="submit" value="Do">
|
||
</div>
|
||
<script type="text/javascript">
|
||
<!--// Init menu
|
||
actionsMenuInit('More Actions:');
|
||
//-->
|
||
</script>
|
||
</form>
|
||
</li></ul>
|
||
|
||
<ul id="credits">
|
||
<li><a href="http://moinmoin.wikiwikiweb.de/">MoinMoin Powered</a></li><li><a href="http://www.python.org/">Python Powered</a></li><li><a href="http://validator.w3.org/check?uri=referer">Valid HTML 4.01</a></li>
|
||
</ul>
|
||
|
||
|
||
</div>
|
||
</body>
|
||
</html>
|
||
|