Wednesday, March 27, 2013

Adobe Edge Animate


Stage properties: Title, Composition ID (useful to refer to it using code from outside javascript). eg.: AdobeEdge.getComposition("EDGE-9496421")

Elements and Library panel. 
Elements: HTML elements in the symbol. mainly using jQuery $(...). eg.: sym.getSymbol("rect1").$("RoundRect")
Library: shows the symbols. DO NOT confuse the symbol ID with instance ID below. similar concept with Flash. but strangely the API uses getSymbol() instead of getInstance()

Instance properties: ID. useful for referring to instances in javascript. eg.: sym.getSymbol("rect1")...

Timeline: can add Label like Frame label in flash. for use in javascript: eg.: sym.play("over")

sample code: 

var count = 0; // my own variable
(function($, Edge, compId){
var Composition = Edge.Composition, Symbol = Edge.Symbol; // aliases for commonly used Edge classes

   //Edge symbol: 'stage'
   (function(symbolName) {
   
      Symbol.bindElementAction(compId, symbolName, "${_rect1}", "mouseenter", function(sym, e) {
         // insert code to be run when the mouse enters an element
         sym.getSymbol("rect1").play();
      });
      //Edge binding end

      Symbol.bindElementAction(compId, symbolName, "${_rect1}", "mouseleave", function(sym, e) {
         // insert code to be run when the mouse leaves an element
         sym.getSymbol("rect1").playReverse();
      });
      //Edge binding end

      Symbol.bindElementAction(compId, symbolName, "${_rect1}", "click", function(sym, e) {
         // insert code for mouse click here
         //console.log(sym);
         e.preventDefault();

         // using jquery text() function
         sym.getSymbol("text1").$("Text").text("button clicked: " + (count++));

      });
      //Edge binding end

   })("stage");
   //Edge symbol end:'stage'


})(jQuery, AdobeEdge, "EDGE-9496421");

// my own code
var id = setTimeout(myfn, 1000);
function myfn(){
//console.log("time out");
// run some code in Edge
var comp = AdobeEdge.getComposition("EDGE-9496421");
//console.log("EDGE composition: " + comp);
console.log("stage: " + comp.getStage());

var mytext = comp.getStage().getSymbol("text1").$("Text");

 // using jquery offset() function
var x = mytext.offset().left + 1;
//console.log(x);
mytext.offset({left: x});

id = setTimeout(myfn, 1000);
}

Thursday, March 14, 2013

Unity: instantiating GameObjects at runtime

Use Prefabs!
Assets > Create > Prefab
Drag the model, material, etc into the new prefab

in the JS script, declare a variable. eg.: var bullet:GameObject;
Assuming that this JS script is added to a GameObject, you can drag a prefab from Project View to the variable in the Inspector view.

instantiate using code: eg.:
var bulletClone = Instantiate(bullet, Vector3(Input.mousePosition.x, Input.mousePosition.y, 1.0), Quaternion.identity);


Wednesday, March 13, 2013

Unity: XML parsing


import System.Xml;
import System.IO;

var filename = "Assets/sample.xml";
function Start () {
print("processing xml");
var reader:XmlTextReader = new XmlTextReader(filename);
print (reader);

while (reader.Read()) {
       switch (reader.NodeType) {
         case XmlNodeType.Element:
           print("element: " + reader.Name); // print the name
           print("attribute: " + reader.GetAttribute("name"));
           break;
         case XmlNodeType.Text: // for text node
          print(reader.Value); // read the content of the text
          break;
       }
    }
}


Note: to parse float or int from String, use float.Parse(string), or int.Parse(...) etc

Monday, March 11, 2013

Unity - audio and video

Put WAV or MP3 in Assets folder.
Create an empty Game Object.
Drag the Audio file to the Game Object
If "Play on Awake", music will play automatically.
If not, using code:
use GameObject.Find . eg.: var obj:GameObject = GameObject.Find("music");
and then
obj.audio.Play(); // audio is built-in, if audio component exists. else null

Video: It is a PRO / Advanced feature. only for Unity Pro license.



Wednesday, March 06, 2013

Unity Engine: mouse and key input

Sample JS:
function Update () {
this.gameObject.transform.position.x = Input.mousePosition.x;
this.gameObject.transform.position.y = Input.mousePosition.y;
// only capture once. will not be true until key is released
if(Input.GetKeyDown(KeyCode.R)){
print("rotate");
this.gameObject.transform.Rotate(0, 0, 6);
}
// will not be true until button is released
if(Input.GetMouseButtonDown(0)){
        print("left mouse button down");
this.gameObject.transform.Rotate(0, 0, -6);
}
// auto fire mode. will return true as long as key is down
    if(Input.GetKey(KeyCode.R) && Input.GetKey(KeyCode.LeftShift)){

this.gameObject.transform.Rotate(0, 0, 10*Time.deltaTime);
}
}


Used a new coordinate system. origin of plane at bottom left. to match with mouse screen coordinate
switched the camera to its original orientation. no rotation. orthographic. x, y, z = (w/2, h/2, 0)

Sample of OBJ file:
# This file uses centimeters as units for non-parametric coordinates.

v 0.000000 1.000000 0.000000
v -1.000000 1.000000 0.000000
v 0.000000 0.000000 -0.000000
v -1.000000 0.000000 -0.000000
vt 0.000000 0.000000
vt 1.000000 0.000000
vt 0.000000 1.000000
vt 1.000000 1.000000
vn 0.000000 0.000000 -1.000000
vn 0.000000 0.000000 -1.000000
vn 0.000000 0.000000 -1.000000
vn 0.000000 0.000000 -1.000000
f 3/1/4 4/2/3 2/4/2 1/3/1


Tuesday, March 05, 2013

Unity Engine: Text

Tried using GUI Text and 3D Text. GameObject > Create Other > ...
preferred 3D Text. easier placement using (x, y, z). easier to preview in Scene view.
GUI Text uses the [0,1] for location. (0,0) for bottom left, (1,1) for top right?

To change font, copy the desired TTF font in the Assets view. select the text GameObject and change the Font in Inspector.



to access the text from the GameObject:
  1. use GameObject.Find()
  2. use GetComponent()
  3. use .text property

Unity engine: Scripting

Asset > Create > Javascript

A JS file will be created in Assets view. It is like a class. It can be dragged to be added into a GameObject in Hierarchy. but the variable will be available in the Inspector view. its value can be changed there. it will NOT be taken from the default value in the script file. The variable / property name will automatically starts with Uppercase letter.


print() is use to print to console.

to access other GameObject in scene, use GameObject.Find("game object tag")
to access component in GameObject, use GetComponent("component name")

Example:

#pragma strict
// a script file is like a class
// a member variable
var i = 1;
var speed = 0.1;
// start calls once
function Start () {
// testing while loop
while(i < 10){
// it's like trace in Flash and echo/print in PHP
// prints to console.
print("hello ");
i++;
}
// instantiate a object / component by adding to the GameObject
// gameObject is built-in as this script is added to a GameObject
// declare class type of variable using ":"
var obj:MyClass = gameObject.AddComponent("MyClass");
// call a method
obj.myMethod();
}

// updates every frame
function Update () {
// rotate around z-axis by speed x time(s) taken to complete last frame
transform.Rotate(0, 0, speed * Time.deltaTime);
// transform is built-in for GameObject
transform.position.y+=0.1;

// testing if statement
if(transform.position.y > 300){
transform.position.y = 0;
}

}

NOTE: there is no %= operator. so has to do something like: number = number % 10;

creating a class: create a JS file. put the class code in. sample below:

class MyCustomClass{
var myVar = 10;
var myName = "TBY";

function MyMethod(){
myVar++;
return myVar;
}

static function MyStaticMethod(num){
return num*num;
}
}


to create an instance, sample:

print(MyCustomClass.MyStaticMethod(10));
var obj:MyCustomClass = new MyCustomClass();
print(obj.MyMethod());

Monday, March 04, 2013

Unity Game engine: Transparent Texture

Works with PNG (8 or 24) with transparency enabled in Photoshop. File > Save for Web > PNG-8 or PNG-24 > Transparency checked

Material Shader changed to Transparent/Diffuse. Hierarchy view > object > default > Inspector > defaultmat > Shader > Transparent/Diffuse

Took some time troubleshooting a silly error. Accidentally change the material's Main Color to RGBA (255, 255, 255, 0) . Alpha zero! and so when material shader set to transparent, nothing is seen as the Main Color alpha is ZERO.


Sunday, March 03, 2013

Unity engine: creating a 2d game project

Camera > Projection > Orthographic

Change resolution: Edit > Project Settings > Player > Resolution

Orthographic size is half of the vertical size of the viewing volume. (defined in Unity Reference: http://docs.unity3d.com/Documentation/ScriptReference/Camera-orthographicSize.html)
so if the resolution is set as 640x480. then for a 1:1 mapping the size is 480 (height in pixels) / 2 = 240.

Camera Preview may show more in the window compared to set resolution. but when build and run. actual app displays fine.

rotated camera x-axis: 180 deg
change ambient lighting to #FFFFFF or RGB (255, 255, 255). Edit > Render Setting > #FFFFFF

using following OBJ plane format to create a simple 2D plane in the XY plane:
# vertices x, y, z
v 0.000000 1.000000 0.000000
v -1.000000 1.000000 0.000000
v 0.000000 0.000000 -0.000000
v -1.000000 0.000000 -0.000000
# texture coordinates in u,v. (0,0) is bottom left corner
vt 0.000000 0.000000
vt 1.000000 0.000000
vt 0.000000 1.000000
vt 1.000000 1.000000
# normal: x, y, z
vn 0.000000 0.000000 1.000000
vn 0.000000 0.000000 1.000000
vn 0.000000 0.000000 1.000000
vn 0.000000 0.000000 1.000000
# faces  1st point: vertex/vtexture/vnormal, 2nd point, 3rd point, etc.
f 1/1/1 2/2/2 4/4/3 3/3/4

texture working properly.