FANDOM


(Text changed to bold)
(Undo revision 4378 by 137.97.108.52 (talk) unhelpful)
Line 1: Line 1:
='''Javascript for After Effects'''=
+
=Javascript for After Effects=
   
'''These are standard and common functions used by After Effects. Although many can be used in an [[Expressions]] field, all of these are accessable by running a script manually.'''
+
These are standard and common functions used by After Effects. Although many can be used in an [[Expressions]] field, all of these are accessable by running a script manually.
   
=='''Types of scripts'''==
+
==Types of scripts==
'''There are two basic types of scripts which AE uses, uncompiled and compiled.'''
+
There are two basic types of scripts which AE uses, uncompiled and compiled.
   
==='''Uncompiled Javascript'''===
+
===Uncompiled Javascript===
'''An uncompiled Javascriptis the most common script you'll see. These are the scripts have filenames ending in .jsx and can be opened with any text editor and edited, and you can see the javascript code when opened. These scripts are meant to be flexible and available for anyone to edit.'''
+
An uncompiled Javascriptis the most common script you'll see. These are the scripts have filenames ending in .jsx and can be opened with any text editor and edited, and you can see the javascript code when opened. These scripts are meant to be flexible and available for anyone to edit.
   
==='''Compiled Javascript'''===
+
===Compiled Javascript===
'''Compiled scripts work exactly like an uncompiled script only the file is encoded for protection. These types of scripts are meant for commercial distribution and cannot be edited by anyone but the author.'''
+
Compiled scripts work exactly like an uncompiled script only the file is encoded for protection. These types of scripts are meant for commercial distribution and cannot be edited by anyone but the author.
   
=='''Variables'''==
+
==Variables==
 
'''What are they?'''
 
'''What are they?'''
   
'''You can think of a variable as a box that can store different types things based on the boxes shape.  For example, a number box (variable) can store numbers.  A string box can store a string of numbers and sletters surrounded by quotes "".  Normally we create a box before refering to it.   You wouldn't normally tell someone to give you a plooper unless you told that person what a plooper is.  ex. "A plooper is the number 5.  can you tell me what a plooper is?".  then answer would be, "The number 5"  Establishing the existance of your variable in this manner is called declaration.  You must declare your variable before using it.'''
+
You can think of a variable as a box that can store different types things based on the boxes shape.  For example, a number box (variable) can store numbers.  A string box can store a string of numbers and sletters surrounded by quotes "".  Normally we create a box before refering to it.   You wouldn't normally tell someone to give you a plooper unless you told that person what a plooper is.  ex. "A plooper is the number 5.  can you tell me what a plooper is?".  then answer would be, "The number 5"  Establishing the existance of your variable in this manner is called declaration.  You must declare your variable before using it.
  +
   
'''<br>
 
'''
 
   
 
'''Declaring variables'''
 
'''Declaring variables'''
   
'''Variables can be declared with a "var" in front of them. ex "var myNumber".  you can also assign a value to your variable at the same time.  "var myNumber = 5"  Until a variable is assign a value (5) it is considered "undefined."  Variable should be uniquely named.  If you accidently try to declare a variable that already exists, it will be treated as a an assignment and assign any new value in the declaration statement to the variable. If the duplicate declaration has no assignment, then nothing happens. If you try to assign a value to a non-existent variable, JavaScript will create the variable for you.'''
+
Variables can be declared with a "var" in front of them. ex "var myNumber".  you can also assign a value to your variable at the same time.  "var myNumber = 5"  Until a variable is assign a value (5) it is considered "undefined."  Variable should be uniquely named.  If you accidently try to declare a variable that already exists, it will be treated as a an assignment and assign any new value in the declaration statement to the variable. If the duplicate declaration has no assignment, then nothing happens. If you try to assign a value to a non-existent variable, JavaScript will create the variable for you.
  +
   
'''<br>
 
'''
 
   
 
'''Conventions'''
 
'''Conventions'''
*'''When naming your variable, you must use letters, $, and _   ex.  "myPlooper" or "my_Plooper" or "$myPlooper"'''
+
*When naming your variable, you must use letters, $, and _   ex.  "myPlooper" or "my_Plooper" or "$myPlooper"
*'''never use spaces'''
+
*never use spaces
*'''Javascript is case-sensitive, meaning.  "Plooper" is different from "plooper"'''
+
*Javascript is case-sensitive, meaning.  "Plooper" is different from "plooper"
*'''Try to use [http://en.wikipedia.org/wiki/CamelCase camelCase]'''
+
*Try to use [http://en.wikipedia.org/wiki/CamelCase camelCase]
  +
  +
  +
'''Lifespan'''
   
'''<br>
+
The life of a variable is based upon the region in which is was declared.  if it was declared inside a funtion, it doesn't exist outside the function.  if it exists inside a loop, is does not exist outside the loop.  Variables declared outside all loops and functions are considered global and exist while the script is being evaluated.
Lifespan'''
 
   
'''The life of a variable is based upon the region in which is was declared.  if it was declared inside a funtion, it doesn't exist outside the function.  if it exists inside a loop, is does not exist outside the loop.  Variables declared outside all loops and functions are considered global and exist while the script is being evaluated.'''
 
   
'''<br>
 
'''
 
   
'''Fore more information'''
+
Fore more information
*[http://webcheatsheet.com/javascript/variables.php '''http://webcheatsheet.com/javascript/variables.php''']
+
*http://webcheatsheet.com/javascript/variables.php
   
=='''Escape Characters'''==
+
==Escape Characters==
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 200px"
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 200px"
! scope="col" |'''Code'''
+
! scope="col"|Code
! scope="col" |'''Char'''
+
! scope="col"|Char
! scope="col" |'''Output'''
+
! scope="col"|Output
 
|-
 
|-
| style="text-align: center" |'''\''''
+
| style="text-align: center"|\'
| style="text-align: center" |'''<nowiki/>''''
+
| style="text-align: center"|'
| style="text-align: center" |'''single quote'''
+
| style="text-align: center"|single quote
 
|-
 
|-
| style="text-align: center" |'''\"'''
+
| style="text-align: center"|\"
| style="text-align: center" |'''"'''
+
| style="text-align: center"|"
| style="text-align: center" |'''double quote'''
+
| style="text-align: center"|double quote
 
|-
 
|-
| style="text-align: center" |'''\\'''
+
| style="text-align: center"|\\
| style="text-align: center" |'''\'''
+
| style="text-align: center"|\
| style="text-align: center" |'''backslash'''
+
| style="text-align: center"|backslash
 
|-
 
|-
| style="text-align: center" |'''\b'''
+
| style="text-align: center"|\b
 
| style="text-align: center"|
 
| style="text-align: center"|
| style="text-align: center" |'''backspace'''
+
| style="text-align: center"|backspace
 
|-
 
|-
| style="text-align: center" |'''\f'''
+
| style="text-align: center"|\f
 
| style="text-align: center"|
 
| style="text-align: center"|
| style="text-align: center" |'''form feed'''
+
| style="text-align: center"|form feed
 
|-
 
|-
| style="text-align: center" |'''\n'''
+
| style="text-align: center"|\n
 
| style="text-align: center"|
 
| style="text-align: center"|
| style="text-align: center" |'''new line'''
+
| style="text-align: center"|new line
 
|-
 
|-
| style="text-align: center" |'''\r'''
+
| style="text-align: center"|\r
 
| style="text-align: center"|
 
| style="text-align: center"|
| style="text-align: center" |'''carriage return'''
+
| style="text-align: center"|carriage return
 
|-
 
|-
| style="text-align: center" |'''\t'''
+
| style="text-align: center"|\t
 
| style="text-align: center"|
 
| style="text-align: center"|
| style="text-align: center" |'''tab'''
+
| style="text-align: center"|tab
 
|}
 
|}
   
=='''Operators'''==
+
==Operators==
'''<br />'''
+
<br />
==='''Comparison Operators'''===
+
===Comparison Operators===
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 650px; text-align:center"
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 650px; text-align:center"
 
|+'''Comparison Operators'''
 
|+'''Comparison Operators'''
 
|-
 
|-
! scope="col" | '''Operator'''
+
! scope="col"| Operator
! scope="col" | '''Description'''
+
! scope="col"| Description
! scope="col" | '''Example ( x=3 )'''
+
! scope="col"| Example ( x=3 )
! scope="col" | '''Result'''
+
! scope="col"| Result
 
|-
 
|-
| '''=='''
+
| ==
| '''Is equal to ( never use a single = )'''
+
| Is equal to ( never use a single = )
| '''x==5'''
+
| x==5
| '''false'''
+
| false
 
|-
 
|-
| '''==='''
+
| ===
| '''vcvcv absolutely equal to (this checks variable type too)*'''
+
| vcvcv absolutely equal to (this checks variable type too)*
 
|
 
|
'''x===3'''
+
x===3
   
'''<br>
+
x==="3"'''
+
x==="3"
 
|
 
|
'''true'''
+
true
  +
   
'''<br>
+
false
false'''
 
 
|-
 
|-
| '''!='''
+
| !=
| '''Is not equal to'''
+
| Is not equal to
| '''x!=4'''
+
| x!=4
| '''true'''
+
| true
 
|-
 
|-
| '''!=='''
+
| !==
| '''is NOT equal to (this checks variable type too)*'''
+
| is NOT equal to (this checks variable type too)*
 
|
 
|
'''x!==3'''
+
x!==3
   
'''<br>
+
x!=="3"'''
+
x!=="3"
 
|
 
|
'''false'''
+
false
   
'''<br>
+
true'''
+
true
  +
|-
  +
| >
  +
| Is greater than
  +
| x>5
  +
| false
 
|-
 
|-
| '''>'''
+
| <
| '''Is greater than'''
+
| Is less than
| '''x>5'''
+
| x<5
| '''false'''
+
| true
 
|-
 
|-
| '''<'''
+
| >=
| '''Is less than'''
+
| Is greater than or equal to
| '''x<5'''
+
| x>=5
'''| true
+
| false
<nowiki>|-
 
| >=</nowiki>'''
 
| '''Is greater than or equal to'''
 
| '''x>=5'''
 
| '''false'''
 
 
|-
 
|-
| '''<='''
+
| <=
| '''Is less than or equal to'''
+
| Is less than or equal to
| '''x<=5'''
+
| x<=5
| '''true'''
+
| true
 
|}
 
|}
   
'''<br />'''
+
<br />
   
'''<br /><br />'''
+
<br /><br />
   
==='''Logical Operators'''===
+
===Logical Operators===
   
 
{| border="1" cellpadding="5" cellspacing="1" style="width: 650px; text-align:center"
 
{| border="1" cellpadding="5" cellspacing="1" style="width: 650px; text-align:center"
 
|+'''Logical Operators'''
 
|+'''Logical Operators'''
! scope="col" | '''Operator'''
+
! scope="col"| Operator
! scope="col" | '''Description'''
+
! scope="col"| Description
! scope="col" | '''Example ( x=3 )'''
+
! scope="col"| Example ( x=3 )
! scope="col" | '''Result'''
+
! scope="col"| Result
 
|-
 
|-
 
| style="width: 50px" |
 
| style="width: 50px" |
'''&&'''
+
&&
| '''and'''
+
| and
| '''( x>1 )&&( x-1>1 )'''
+
| ( x>1 )&&( x-1>1 )
| '''true'''
+
| true
 
|-
 
|-
| '''<nowiki>||</nowiki>'''
+
| <nowiki>||</nowiki>
| '''or'''
+
| or
| '''( x==3 ) <nowiki>||</nowiki> ( x="three" )'''
+
| ( x==3 ) <nowiki>||</nowiki> ( x="three" )
| '''true'''
+
| true
 
|-
 
|-
| '''!'''
+
| !
| '''is not'''
+
| is not
| '''!(x==3)'''
+
| !(x==3)
| '''false'''
+
| false
 
|}
 
|}
   
'''<br /><br />'''
+
<br /><br />
   
==='''Arithmetic Operators'''===
+
===Arithmetic Operators===
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 650px; text-align:center"
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 650px; text-align:center"
 
|+'''Arithmetic Operators'''
 
|+'''Arithmetic Operators'''
! scope="col" | '''Operator'''
+
! scope="col"| Operator
! scope="col" | '''Description'''
+
! scope="col"| Description
! scope="col" | '''Example ( x=3 )'''
+
! scope="col"| Example ( x=3 )
! scope="col" | '''Result'''
+
! scope="col"| Result
 
|-
 
|-
| '''+'''
+
| +
| '''Add'''
+
| Add
| '''x = x+2'''
+
| x = x+2
| '''x = 5'''
+
| x = 5
 
|-
 
|-
| '''-'''
+
| -
| '''Subtract'''
+
| Subtract
| '''x = x-2'''
+
| x = x-2
| '''x = 1'''
+
| x = 1
 
|-
 
|-
| '''*'''
+
| *
| '''Multiply'''
+
| Multiply
| '''x = x*2'''
+
| x = x*2
| '''x = 6'''
+
| x = 6
 
|-
 
|-
| '''/'''
+
| /
| '''Divide'''
+
| Divide
| '''x = x / 2'''
+
| x = x / 2
| '''x = 1.5'''
+
| x = 1.5
 
|-
 
|-
| '''++'''
+
| ++
| '''Increment by'''
+
| Increment by
'''Increment (by 1) then return'''
+
Increment (by 1) then return
   
'''Return then increment (by 1)'''
+
Return then increment (by 1)
| '''x ++ 2'''
+
| x ++ 2
'''++ x'''
+
++ x
   
'''x ++'''
+
x ++
| '''x = 5'''
+
| x = 5
'''x = 4'''
+
x = 4
   
'''x = 3 (next time it will = 4)'''
+
x = 3 (next time it will = 4)
 
|-
 
|-
| '''--'''
+
| --
| '''Decrement by'''
+
| Decrement by
'''Decrement (by 1) then return'''
+
Decrement (by 1) then return
   
'''Return then decrement (by 1)'''
+
Return then decrement (by 1)
| '''x -- 2'''
+
| x -- 2
'''-- x'''
+
-- x
   
'''x --'''
+
x --
| '''x = 1'''
+
| x = 1
'''x = 2'''
+
x = 2
   
'''x = 3 (next time it will = 2)'''
+
x = 3 (next time it will = 2)
 
|-
 
|-
| '''%'''
+
| %
| '''Divide and get remainder (Modulus)'''
+
| Divide and get remainder (Modulus)
| '''x % 2'''
+
| x % 2
| '''x = 1'''
+
| x = 1
 
|}
 
|}
   
'''<br /><br />'''
+
<br /><br />
   
==='''Assignment Operators'''===
+
===Assignment Operators===
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 650px; text-align:center"
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 650px; text-align:center"
 
|+'''Assignment Operators'''
 
|+'''Assignment Operators'''
! scope="col" | '''Operator'''
+
! scope="col"| Operator
! scope="col" | '''Description'''
+
! scope="col"| Description
! scope="col" | '''Example ( x=3 )'''
+
! scope="col"| Example ( x=3 )
! scope="col" | '''Result'''
+
! scope="col"| Result
 
|-
 
|-
| '''='''
+
| =
| '''Assigns a value'''
+
| Assigns a value
| '''x = 5'''
+
| x = 5
| '''x = 5'''
+
| x = 5
 
|-
 
|-
| '''+='''
+
| +=
| '''adds a value'''
+
| adds a value
| '''x += 5'''
+
| x += 5
| '''x = 8'''
+
| x = 8
 
|-
 
|-
| '''-='''
+
| -=
| '''subtracts a value'''
+
| subtracts a value
| '''x -= 5'''
+
| x -= 5
| '''x = -2'''
+
| x = -2
 
|-
 
|-
| '''*='''
+
| *=
| '''multiplies a value'''
+
| multiplies a value
| '''x *= 5'''
+
| x *= 5
| '''x = 15'''
+
| x = 15
 
|-
 
|-
| '''/='''
+
| /=
| '''Divides by a value'''
+
| Divides by a value
| '''x /= 5'''
+
| x /= 5
| '''x = 0.6'''
+
| x = 0.6
 
|-
 
|-
| '''%='''
+
| %=
| '''Divides and gets remainder of a value (Modulus)'''
+
| Divides and gets remainder of a value (Modulus)
| '''x %= 5'''
+
| x %= 5
| '''x = 3'''
+
| x = 3
 
|}
 
|}
   
=='''Event Handler'''==
+
==Event Handler==
'''The following are NOT supported by AE at this time.'''
+
The following are NOT supported by AE at this time.
* [[onAbort|'''onAbort''']]
+
* [[onAbort]]
* [[onBlur|'''onBlur''']]
+
* [[onBlur]]
* [[onChange|'''onChange''']]
+
* [[onChange]]
* [[onClick|'''onClick''']]
+
* [[onClick]]
* [[onDblClick|'''onDblClick''']]
+
* [[onDblClick]]
* [[onDragDrop|'''onDragDrop''']]
+
* [[onDragDrop]]
* [[onError|'''onError''']]
+
* [[onError]]
* [[onFocus|'''onFocus''']]
+
* [[onFocus]]
* [[onKeyDown|'''onKeyDown''']]
+
* [[onKeyDown]]
* [[onKeyPress|'''onKeyPress''']]
+
* [[onKeyPress]]
* [[onKeyUp|'''onKeyUp''']]
+
* [[onKeyUp]]
* [[onload|'''onload''']]
+
* [[onload]]
* [[onMouseDown|'''onMouseDown''']]
+
* [[onMouseDown]]
* [[onMouseMove|'''onMouseMove''']]
+
* [[onMouseMove]]
* [[onMouseOut|'''onMouseOut''']]
+
* [[onMouseOut]]
* [[onMouseOver|'''onMouseOver''']]
+
* [[onMouseOver]]
* [[onMouseUp|'''onMouseUp''']]
+
* [[onMouseUp]]
* [[onMove|'''onMove''']]
+
* [[onMove]]
* [[onReset|'''onReset''']]
+
* [[onReset]]
* [[onResize|'''onResize''']]
+
* [[onResize]]
* [[onSelect|'''onSelect''']]
+
* [[onSelect]]
* [[onSubmit|'''onSubmit''']]
+
* [[onSubmit]]
* [[onUnload|'''onUnload''']]
+
* [[onUnload]]
   
=='''Methods'''==
+
==Methods==
   
==='''Dialogs'''===
+
===Dialogs===
   
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 950px; text-align: left"
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 950px; text-align: left"
! style="width:75px" |'''Name'''
+
! style="width:75px"|Name
! style="width:50px" |'''Secure'''
+
! style="width:50px"|Secure
! style="width:50px" |'''Expression'''
+
! style="width:50px"|Expression
! '''Description'''
+
! Description
 
|-
 
|-
| [[alert()|'''alert()''']]
+
| [[alert()]]
| '''yes'''
+
| yes
| '''no'''
+
| no
| '''Brings up an OK dialog, used to send the user a message.'''
+
| Brings up an OK dialog, used to send the user a message.
 
|-
 
|-
| [[confirm()|'''confirm()''']]
+
| [[confirm()]]
| '''yes'''
+
| yes
| '''no'''
+
| no
| '''Brings up an ok / cancel dialog and returned the value as a boolean.(good for if statements)'''
+
| Brings up an ok / cancel dialog and returned the value as a boolean.(good for if statements)
 
|-
 
|-
| [[Error()|'''Error()''']]
+
| [[Error()]]
| '''yes'''
+
| yes
| '''no'''
+
| no
| '''Brings up an error dialog.'''
+
| Brings up an error dialog.
 
|-
 
|-
| [[prompt()|'''prompt()''']]
+
| [[prompt()]]
| '''yes'''
+
| yes
| '''no'''
+
| no
| '''Brings up an ok / cancel dialog asking for user input. If no input is entered, the dialog returns false.'''
+
| Brings up an ok / cancel dialog asking for user input. If no input is entered, the dialog returns false.
 
|}
 
|}
   
==='''Math'''===
+
===Math===
   
   
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 950px; text-align: left"
 
{| border="1" cellpadding="1" cellspacing="1" style="width: 950px; text-align: left"
! style="width:75px" |'''Name'''
+
! style="width:75px"|Name
! style="width:50px" |'''Secure'''
+
! style="width:50px"|Secure
! style="width:50px" |'''Expression'''
+
! style="width:50px"|Expression
! '''Description'''
+
! Description
 
|-
 
|-
| [[isNaN()|'''isNaN()''']]
+
| [[isNaN()]]
| '''yes'''
+
| yes
| '''yes'''
+
| yes
| '''Checks if a value is Not a Number.'''
+
| Checks if a value is Not a Number.
 
|-
 
|-
| [[Math.sqrt()|'''Math.sqrt()''']]
+
| [[Math.sqrt()]]
| '''yes'''
+
| yes
| '''yes'''
+
| yes
| '''Finds the square root of a number.'''
+
| Finds the square root of a number.
 
|}
 
|}
   
==='''String Object'''===
+
===String Object===
'''new String(string)
+
new String(string)
<br />'''
+
<br />
  +
  +
* [[charAt()]] Returns an index of a specified character position
  +
* [[charCodeAt()]] Returns the UNICODE value of a specified character at position
  +
* [[concat()]] Joins two or more strings together into one
  +
* [[fromCharCode()]] Converts UNICODE values into characters
  +
* [[indexOf()]] Finds the '''first''' occurance of a string or character and returns its index value of its location. If the string is not found 0 is returned.
  +
* [[lastIndexOf()]] Finds the '''last''' occurance of a string or character and returns its index value of its location. If the string is not found 0 is returned.
  +
* [[match()]] Searches a string for a substring, then returns any matches
  +
* [[replace()]] Searches a string for a substring, then replaces any matches with a new string
  +
* [[search()]] Searches a string for a substring, then returns the position of any matches
  +
* [[slice()]] Extracts a part of a string and returns a new string
  +
* [[split()]] Creates a substring of a specified string
  +
* [[substr()]] Extracts the characters from a string, beginning at a specified start position, and through the specified number of character
  +
* [[substring()]] Extracts the characters from a string, between two specified indices
  +
* [[toLowerCase()]] Converts a string to lowercase letters
  +
* [[toUpperCase()]] Converts a string to uppercase letters
  +
* [[valueOf()]] Returns the primitive value of a String object
  +
  +
* [[toString()]] Converts a value into a string
  +
  +
  +
  +
  +
   
* [[charAt()|'''charAt()''']]''' Returns an index of a specified character position'''
 
* [[charCodeAt()|'''charCodeAt()''']]''' Returns the UNICODE value of a specified character at position'''
 
* [[concat()|'''concat()''']]''' Joins two or more strings together into one'''
 
* [[fromCharCode()|'''fromCharCode()''']]''' Converts UNICODE values into characters'''
 
* [[indexOf()|'''indexOf()''']]''' Finds the first occurance of a string or character and returns its index value of its location. If the string is not found 0 is returned.'''
 
* [[lastIndexOf()|'''lastIndexOf()''']]''' Finds the last occurance of a string or character and returns its index value of its location. If the string is not found 0 is returned.'''
 
* [[match()|'''match()''']]''' Searches a string for a substring, then returns any matches'''
 
* [[replace()|'''replace()''']]''' Searches a string for a substring, then replaces any matches with a new string'''
 
* [[search()|'''search()''']]''' Searches a string for a substring, then returns the position of any matches'''
 
* [[slice()|'''slice()''']]''' Extracts a part of a string and returns a new string'''
 
* [[split()|'''split()''']]''' Creates a substring of a specified string'''
 
* [[substr()|'''substr()''']]''' Extracts the characters from a string, beginning at a specified start position, and through the specified number of character'''
 
* [[substring()|'''substring()''']]''' Extracts the characters from a string, between two specified indices'''
 
* [[toLowerCase()|'''toLowerCase()''']]''' Converts a string to lowercase letters'''
 
* [[toUpperCase()|'''toUpperCase()''']]''' Converts a string to uppercase letters'''
 
* [[valueOf()|'''valueOf()''']]''' Returns the primitive value of a String object'''
 
   
* [[toString()|'''toString()''']]''' Converts a value into a string'''
 
   
'''<br>
+
'''String Object Properties'''
'''
+
* [[String.Constructor | .Constructor]] - a reference to the function which created the object
  +
* [[String.Length | .Length]] - returns the number of characters in a string
  +
* [[String.Prototype | .Prototype]] - Allows you to add methods and properties to the sring object
   
'''<br>
+
==Objects and Properties==
'''
+
An Object can be a File, project, folder, comp, layer, effect, etc. Each Object has a set of Properties; a file has a name, a layer has potition and rotation. Below are Objects and a few of their possible properties. In After Effects a specific object hierarchy is used. Meaning that objects contain sub-objects as well as properties.
  +
* [[application]] - [[app]]
  +
** [[settings]]
  +
** [[project]]
  +
***[[renderQueue]]
  +
****[[renderQueueitem]](s)
  +
*****[[outputModule]](s)
  +
***[[compItem]]
  +
****[[layer]](s)
  +
*****[[properties]]
  +
****[[proxySource]]
  +
*****[[solidSource]]
  +
******[[color]]
  +
*****[[placeholderSource]]
  +
*****[[fileSource]]
  +
******[[file]]
  +
***[[footageItem]]
  +
****[[mainSource]]
  +
*****[[solidSource]]
  +
******[[color]]
  +
*****[[placeholderSource]]
  +
*****[[fileSource]]
  +
******[[file]]
  +
****[[proxySource]]
  +
*****[[solidSource]]
  +
******[[color]]
  +
*****[[placeholderSource]]
  +
*****[[fileSource]]
  +
******[[file]]
  +
***[[folderItem]]
  +
****[[item]](s)
   
'''<br>
+
* [[system]]
String Object Properties'''
+
* [[file]]
* [[String.Constructor |''' .Constructor''']]''' - a reference to the function which created the object'''
+
* [[folder]]
* [[String.Length |''' .Length''']]''' - returns the number of characters in a string'''
+
* [[socket]]
* [[String.Prototype |''' .Prototype''']]''' - Allows you to add methods and properties to the sring object'''
 
   
=='''Objects and Properties'''==
 
'''An Object can be a File, project, folder, comp, layer, effect, etc. Each Object has a set of Properties; a file has a name, a layer has potition and rotation. Below are Objects and a few of their possible properties. In After Effects a specific object hierarchy is used. Meaning that objects contain sub-objects as well as properties.'''
 
* [[application|'''application''']]''' - [[app]]'''
 
** [[settings|'''settings''']]
 
** [[project|'''project''']]
 
***[[renderQueue|'''renderQueue''']]
 
****[[renderQueueitem|'''renderQueueitem''']]'''(s)'''
 
*****[[outputModule|'''outputModule''']]'''(s)'''
 
***[[compItem|'''compItem''']]
 
****[[layer|'''layer''']]'''(s)'''
 
*****[[properties|'''properties''']]
 
****[[proxySource|'''proxySource''']]
 
*****[[solidSource|'''solidSource''']]
 
******[[color|'''color''']]
 
*****[[placeholderSource|'''placeholderSource''']]
 
*****[[fileSource|'''fileSource''']]
 
******[[file|'''file''']]
 
***[[footageItem|'''footageItem''']]
 
****[[mainSource|'''mainSource''']]
 
*****[[solidSource|'''solidSource''']]
 
******[[color|'''color''']]
 
*****[[placeholderSource|'''placeholderSource''']]
 
*****[[fileSource|'''fileSource''']]
 
******[[file|'''file''']]
 
****[[proxySource|'''proxySource''']]
 
*****[[solidSource|'''solidSource''']]
 
******[[color|'''color''']]
 
*****[[placeholderSource|'''placeholderSource''']]
 
*****[[fileSource|'''fileSource''']]
 
******[[file|'''file''']]
 
***[[folderItem|'''folderItem''']]
 
****[[item|'''item''']]'''(s)'''
 
   
* [[system|'''system''']]
 
* [[file|'''file''']]
 
* [[folder|'''folder''']]
 
* [[socket|'''socket''']]
 
   
'''<br>
+
Classic Javascript Objects
'''
 
   
'''Classic Javascript Objects'''
+
* [[javascript Anchor |Anchor]]
  +
* [[javascript Applet |Applet]]
  +
* [[javascript Area |Area]]
  +
* [[javascript Array |Array]]
  +
* [[javascript Boolean |Boolean]]
  +
* [[javascript Button |Button]]
  +
* [[javascript Checkbox |Checkbox]]
  +
* [[javascript Date |Date]]
  +
* [[javascript Document |Document]]
  +
* [[javascript Event |Event]]
  +
* [[javascript FileUpload |FileUpload]]
  +
* [[javascript Form |Form]]
  +
* [[javascript Frame |Frame]]
  +
* [[javascript Function |Function]]
  +
* [[javascript Hidden |Hidden]]
  +
* [[javascript History |History]]
  +
* [[javascript Image |Image]]
  +
* [[javascript Layer |Layer]]
  +
* [[javascript Math |Math]]
  +
* [[javascript Object |Object]]
  +
* [[javascript Reset |Reset]]
  +
* [[javascript Screen |Screen]]
  +
* [[javascript String |String]]
  +
* [[javascript Submit |Submit]]
  +
* [[javascript Text |Text]]
  +
* [[javascript Textarea |Textarea]]
  +
* [[javascript Window |Window]]
  +
* [[javascript Link |Link]]
  +
* [[javascript Location |Location]]
  +
* [[javascript Navigator |Navigator]]
  +
* [[javascript Number |Number]]
  +
* [[javascript Option |Option]]
  +
* [[javascript Password |Password]]
  +
* [[javascript Radio |Radio]]
  +
* [[javascript RegExp |RegExp]]
  +
* [[javascript Select |Select]]
   
* [[javascript Anchor |'''Anchor''']]
 
* [[javascript Applet |'''Applet''']]
 
* [[javascript Area |'''Area''']]
 
* [[javascript Array |'''Array''']]
 
* [[javascript Boolean |'''Boolean''']]
 
* [[javascript Button |'''Button''']]
 
* [[javascript Checkbox |'''Checkbox''']]
 
* [[javascript Date |'''Date''']]
 
* [[javascript Document |'''Document''']]
 
* [[javascript Event |'''Event''']]
 
* [[javascript FileUpload |'''FileUpload''']]
 
* [[javascript Form |'''Form''']]
 
* [[javascript Frame |'''Frame''']]
 
* [[javascript Function |'''Function''']]
 
* [[javascript Hidden |'''Hidden''']]
 
* [[javascript History |'''History''']]
 
* [[javascript Image |'''Image''']]
 
* [[javascript Layer |'''Layer''']]
 
* [[javascript Math |'''Math''']]
 
* [[javascript Object |'''Object''']]
 
* [[javascript Reset |'''Reset''']]
 
* [[javascript Screen |'''Screen''']]
 
* [[javascript String |'''String''']]
 
* [[javascript Submit |'''Submit''']]
 
* [[javascript Text |'''Text''']]
 
* [[javascript Textarea |'''Textarea''']]
 
* [[javascript Window |'''Window''']]
 
* [[javascript Link |'''Link''']]
 
* [[javascript Location |'''Location''']]
 
* [[javascript Navigator |'''Navigator''']]
 
* [[javascript Number |'''Number''']]
 
* [[javascript Option |'''Option''']]
 
* [[javascript Password |'''Password''']]
 
* [[javascript Radio |'''Radio''']]
 
* [[javascript RegExp |'''RegExp''']]
 
* [[javascript Select |'''Select''']]
 
   
'''<br>
 
'''
 
   
==='''Special'''===
+
===Special===
* [[javascript + |'''+''']]''' Used between to strings to quickly concatinate them together - instead of using the [[concat()]] method. You can also add with "+=".'''
+
* [[javascript + |+]] Used between to strings to quickly concatinate them together - instead of using the [[concat()]] method. You can also add with "+=".
* [[javascript , |''',''']]
+
* [[javascript , |,]]
* [[javascript ?: |'''?:''']]
+
* [[javascript ?: |?:]]
* [[javascript delete |'''delete''']]
+
* [[javascript delete |delete]]
* [[javascript new |'''new''']]
+
* [[javascript new |new]]
* [[javascript this |'''this''']]''' is a context dependand object or property. It's connected to whatever is being passed to a function.'''
+
* [[javascript this |this]] is a context dependand object or property. It's connected to whatever is being passed to a function.
* [[javascript typeof |'''typeof''']]
+
* [[javascript typeof |typeof]]
* [[javascript void |'''void''']]
+
* [[javascript void |void]]
   
=='''Statements'''==
+
==Statements==
* [[try|'''try''']]''' is like an if statement for errors. Everything in a try block will be executed and but if errors occur, catch statements can pick up the error and parse it.'''
+
* [[try]] is like an if statement for errors. Everything in a try block will be executed and but if errors occur, catch statements can pick up the error and parse it.
* [[throw|'''throw''']]''' will send an error out for a catch statement.'''
+
* [[throw]] will send an error out for a catch statement.
* [[catch|'''catch''']]''' looks for try or thrown errors and reports them.'''
+
* [[catch]] looks for try or thrown errors and reports them.
'''<br>'''
+
<br>
* [[if|'''if''']]''' checks a true / false condition and executed if true.'''
+
* [[if]] checks a true / false condition and executed if true.
* [[else|'''else''']]
+
* [[else]]
'''<br>'''
+
<br>
* [[do|'''do''']]
+
* [[do]]
* [[while|'''while''']]
+
* [[while]]
'''<br>'''
+
<br>
* [[for|'''for''']]
+
* [[for]]
* [[for-in|'''for-in''']]
+
* [[for-in]]
'''<br />'''
+
<br />
* [[continue|'''continue''']]
+
* [[continue]]
* [[break|'''break''']]
+
* [[break]]
* [[switch|'''switch''']]''' looks up a value like an "if" statement would, but handles multiple results. This is like using a series of elseIf statements.'''
+
* [[switch]] looks up a value like an "if" statement would, but handles multiple results. This is like using a series of elseIf statements.
   
* [[export|'''export''']]
+
* [[export]]
   
* [[import|'''import''']]
+
* [[import]]
* [[label|'''label''']]
+
* [[label]]
* [[return|'''return''']]
+
* [[return]]
* [[var|'''var''']]
+
* [[var]]
* [[with|'''with''']]
+
* [[with]]
   
=='''Constants'''==
+
==Constants==
* [[Main Index|'''Main Index''']]
+
* [[Main Index]]
* [[Infinity|'''Infinity''']]
+
* [[Infinity]]
* [[NaN|'''NaN''']]
+
* [[NaN]]
* [[undefined|'''undefined''']]
+
* [[undefined]]
* [[null|'''null''']]
+
* [[null]]
   
=='''Commenting'''==
+
==Commenting==
* '''// - Single line [[comment]]'''
+
* <nowiki>//</nowiki> - Single line [[comment]]
   
* '''/* */ - Book ends for a multi-line [[comment]]'''
+
* /* */ - Book ends for a multi-line [[comment]]
   
=='''Resources'''==
+
==Resources==
[https://www.welookups.com '''https://www.welookups.com''']
+
https://www.welookups.com

Revision as of 16:21, May 1, 2020

Javascript for After Effects

These are standard and common functions used by After Effects. Although many can be used in an Expressions field, all of these are accessable by running a script manually.

Types of scripts

There are two basic types of scripts which AE uses, uncompiled and compiled.

Uncompiled Javascript

An uncompiled Javascriptis the most common script you'll see. These are the scripts have filenames ending in .jsx and can be opened with any text editor and edited, and you can see the javascript code when opened. These scripts are meant to be flexible and available for anyone to edit.

Compiled Javascript

Compiled scripts work exactly like an uncompiled script only the file is encoded for protection. These types of scripts are meant for commercial distribution and cannot be edited by anyone but the author.

Variables

What are they?

You can think of a variable as a box that can store different types things based on the boxes shape.  For example, a number box (variable) can store numbers.  A string box can store a string of numbers and sletters surrounded by quotes "".  Normally we create a box before refering to it.   You wouldn't normally tell someone to give you a plooper unless you told that person what a plooper is.  ex. "A plooper is the number 5.  can you tell me what a plooper is?".  then answer would be, "The number 5"  Establishing the existance of your variable in this manner is called declaration.  You must declare your variable before using it.


Declaring variables

Variables can be declared with a "var" in front of them. ex "var myNumber".  you can also assign a value to your variable at the same time.  "var myNumber = 5"  Until a variable is assign a value (5) it is considered "undefined."  Variable should be uniquely named.  If you accidently try to declare a variable that already exists, it will be treated as a an assignment and assign any new value in the declaration statement to the variable. If the duplicate declaration has no assignment, then nothing happens. If you try to assign a value to a non-existent variable, JavaScript will create the variable for you.


Conventions

  • When naming your variable, you must use letters, $, and _   ex.  "myPlooper" or "my_Plooper" or "$myPlooper"
  • never use spaces
  • Javascript is case-sensitive, meaning.  "Plooper" is different from "plooper"
  • Try to use camelCase


Lifespan

The life of a variable is based upon the region in which is was declared.  if it was declared inside a funtion, it doesn't exist outside the function.  if it exists inside a loop, is does not exist outside the loop.  Variables declared outside all loops and functions are considered global and exist while the script is being evaluated.


Fore more information

Escape Characters

Code Char Output
\' ' single quote
\" " double quote
\\ \ backslash
\b backspace
\f form feed
\n new line
\r carriage return
\t tab

Operators


Comparison Operators

Comparison Operators
Operator Description Example ( x=3 ) Result
== Is equal to ( never use a single = ) x==5 false
=== vcvcv absolutely equal to (this checks variable type too)*

x===3


x==="3"

true


false

 != Is not equal to x!=4 true
 !== is NOT equal to (this checks variable type too)*

x!==3


x!=="3"

false


true

> Is greater than x>5 false
< Is less than x<5 true
>= Is greater than or equal to x>=5 false
<= Is less than or equal to x<=5 true




Logical Operators

Logical Operators
Operator Description Example ( x=3 ) Result

&&

and ( x>1 )&&( x-1>1 ) true
|| or ( x==3 ) || ( x="three" ) true
 ! is not  !(x==3) false



Arithmetic Operators

Arithmetic Operators
Operator Description Example ( x=3 ) Result
+ Add x = x+2 x = 5
- Subtract x = x-2 x = 1
* Multiply x = x*2 x = 6
/ Divide x = x / 2 x = 1.5
++ Increment by

Increment (by 1) then return

Return then increment (by 1)

x ++ 2

++ x

x ++

x = 5

x = 4

x = 3 (next time it will = 4)

-- Decrement by

Decrement (by 1) then return

Return then decrement (by 1)

x -- 2

-- x

x --

x = 1

x = 2

x = 3 (next time it will = 2)

 % Divide and get remainder (Modulus) x % 2 x = 1



Assignment Operators

Assignment Operators
Operator Description Example ( x=3 ) Result
= Assigns a value x = 5 x = 5
+= adds a value x += 5 x = 8
-= subtracts a value x -= 5 x = -2
*= multiplies a value x *= 5 x = 15
/= Divides by a value x /= 5 x = 0.6
 %= Divides and gets remainder of a value (Modulus) x %= 5 x = 3

Event Handler

The following are NOT supported by AE at this time.

Methods

Dialogs

Name Secure Expression Description
alert() yes no Brings up an OK dialog, used to send the user a message.
confirm() yes no Brings up an ok / cancel dialog and returned the value as a boolean.(good for if statements)
Error() yes no Brings up an error dialog.
prompt() yes no Brings up an ok / cancel dialog asking for user input. If no input is entered, the dialog returns false.

Math

Name Secure Expression Description
isNaN() yes yes Checks if a value is Not a Number.
Math.sqrt() yes yes Finds the square root of a number.

String Object

new String(string)

  • charAt() Returns an index of a specified character position
  • charCodeAt() Returns the UNICODE value of a specified character at position
  • concat() Joins two or more strings together into one
  • fromCharCode() Converts UNICODE values into characters
  • indexOf() Finds the first occurance of a string or character and returns its index value of its location. If the string is not found 0 is returned.
  • lastIndexOf() Finds the last occurance of a string or character and returns its index value of its location. If the string is not found 0 is returned.
  • match() Searches a string for a substring, then returns any matches
  • replace() Searches a string for a substring, then replaces any matches with a new string
  • search() Searches a string for a substring, then returns the position of any matches
  • slice() Extracts a part of a string and returns a new string
  • split() Creates a substring of a specified string
  • substr() Extracts the characters from a string, beginning at a specified start position, and through the specified number of character
  • substring() Extracts the characters from a string, between two specified indices
  • toLowerCase() Converts a string to lowercase letters
  • toUpperCase() Converts a string to uppercase letters
  • valueOf() Returns the primitive value of a String object





String Object Properties

  • .Constructor - a reference to the function which created the object
  • .Length - returns the number of characters in a string
  • .Prototype - Allows you to add methods and properties to the sring object

Objects and Properties

An Object can be a File, project, folder, comp, layer, effect, etc. Each Object has a set of Properties; a file has a name, a layer has potition and rotation. Below are Objects and a few of their possible properties. In After Effects a specific object hierarchy is used. Meaning that objects contain sub-objects as well as properties.


Classic Javascript Objects


Special

  • + Used between to strings to quickly concatinate them together - instead of using the concat() method. You can also add with "+=".
  • ,
  • ?:
  • delete
  • new
  • this is a context dependand object or property. It's connected to whatever is being passed to a function.
  • typeof
  • void

Statements

  • try is like an if statement for errors. Everything in a try block will be executed and but if errors occur, catch statements can pick up the error and parse it.
  • throw will send an error out for a catch statement.
  • catch looks for try or thrown errors and reports them.


  • if checks a true / false condition and executed if true.
  • else




  • continue
  • break
  • switch looks up a value like an "if" statement would, but handles multiple results. This is like using a series of elseIf statements.

Constants

Commenting

  • /* */ - Book ends for a multi-line comment

Resources

https://www.welookups.com

Community content is available under CC-BY-SA unless otherwise noted.