Mouse hitTest (collision test) in AS 2

April 6, 2008 by maohao

As a spatially challenged person (easily lost in a street/inside an office building/mall, etc.), I am always confused by the maths that is required when converting a spatial point from one coordinate space into another (localToGlobal, globalTolocal, etc. in Flash).

But hitTest for mouse cursor (collision test to see if mouse cursor collide with movieclip/subclass instances) is much more straightforward ;) You always test the mouse coordinates at the _root; this also holds true when you load the swf as an external file using MovieClip.loadMovie or MovieClipLoader.loadClip.

var bigMC:MovieClip;
var cir:MovieClip = bigMC.cir;
var rec:MovieClip = bigMC.rec;


var lsnr:Object = new Object();
lsnr.onMouseMove = function(evt:Object)
{
var tof:Boolean = cir.hitTest(_root._xmouse, _root._ymouse, true);
if(tof)trace(tof);
}
Mouse.addListener(lsnr);

In actionScript 3, the cumbersome way of using onMouseMove is gone because of the added event types such as MOUSE_OVER and MOUSE_OUT.

Set Reply-To in pine

March 24, 2008 by maohao

1.  Main menu->S (Set-up)

2.  C (Config)

3.  Shift-W (Search for “customized-hdrs”)

4. C (to set values. Each field should be separated by comma [,] like this “From: me@somewhere.com, Reply-To:me@here.com”

5. Return to  accept. E to exit.

Stop event propagation

March 5, 2008 by maohao

I was coding a small control. When it’s clicked, it unfolds itself and starts to respond to user input; when the user clicks anywhere after this, it folds back and stops responding to user input.

Basically there are two sources for the click event: the object itself and the Stage. Based on which state the object is in, it behaves differently. Here is what the mouse click handler looks like:

if(_state==FOLDED)
{
unfold();
stepper["registerSource"](stage);
removeEventListener(MouseEvent.CLICK, handleClick);
stage.addEventListener(MouseEvent.CLICK, handleClick);
}else if(_state==UNFOLDED)
{
fold();
stepper["unregisterSource"](stage);
stage.removeEventListener(MouseEvent.CLICK, handleClick); addEventListener(MouseEvent.CLICK, handleClick);
_state = (_state == FOLDED)? UNFOLDED: FOLDED;

The control didn’t seem to change its state with just this code. The reason is that once one source is removed from the event listeners list, another one is added to the list. Since the click event continues to bubble through, and the two sources are executing the same code (as shown above), so the switch between states seems to ultimately cancel each other.

Solution:

To make it work, just add one line on top of the code, like this:

evt.stopImmediatePropagation();

This eventually makes the state transfer smooth.

Full-screen mode in Flash 8

February 19, 2008 by maohao

How to create true fullscreen movies with Flash

Exploring full-screen mode in Flash Player 9

Quick facts:

  1. Only supported with Flash Player 9.0.28  or above;
  2. Can be implemented in Flash 8 IDE by modifying the Stage class;
  3. Can only be initiated with  user inputs such as mouse click or keypres;
  4. An overlay dialog box will appear when the movie enters full-screen mode, instructing the user how to exit and return to normal mode.

TortoiseSVN (UI client) cheat sheet

January 6, 2008 by maohao
  • Starting a new project
  1. Create a new repository at server side. E.g., myserver.com/codesnippets;
  2. At the client side set up an empty folder with all the necessary structures inside it. E.g., codesnippets/trunk. Right click the folder->TortoiseSVN->Import to get the empty folders up to the destination repository;
  3. Once the structure is ready at the repository, select the folder of contents you need to import to the repository and import the content to the destination repository;
  4. Now with the repository set up at the SVN server, we would need to keep a working copy at the client side to keep version control in synchronization. We do this by “checking out” from the repository. To do this, create a clean folder (or select a folder that has no previous SVN checkout history) and right click->SVN Checkout and specify myserver.com/codesnippets as the URL of the repository. This downloads the contents inside the repository to the folder.
  • Sending Your Changes To The Repository
  1. Use TortoiseSVN → Update or TortoiseSVN → Check for Modifications to see if there are any conflicts first;
  2. If there are no conflicts and your working copy is up to date, select any file and/or folders you want to commit, then TortoiseSVN → Commit…;
  3. If you need to rename, delete or move a file, use the SVN dialog menu to make the changes as to keep SVN aware of them. (TortoiseSVN is capable of detecting drag-drop to the files within a working copy of a repository.) Then repeat step 1, 2 to commit your changes to the repository.
  • Updating Your Working Copy With Changes From Others/The Repository
  1. The process of getting changes from the server to your local copy is known as updating. To update, select the files and/or directories you want, right click and select TortoiseSVN → Update in the explorer context menu.

E4X in ActionScript 3 and Flex 3

January 1, 2008 by maohao

The following top AS3 classes, in conjunction with HTTPService and mx.rpc.events.ResultEvent classes are used in Flex (2+) to handle XML:

XML/XMLList/Namespace/QName

XMLList Class can be considered a collection of XML objects. It is a native ActionScript class that is advised to handle XML such as data binding. XMLNode has become the legacy class in AS 2.

So the first step of handling XML data is to deserialize an XML document or object into XMLList objects.

<mx:HTTPService id="dataFetcher" url="http://mysite/myData.xml" resultFormat="e4x" result="onData(event)" />

Remember you will almost always need to initialize the call by adding the following code to the “creationComplete” event handler of the mx:Application node:

<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” creationComplete=”dataFetcher.send()”/>

To deserialize the an XML object (sample shown as follows), use ResultEvent Class, like so:

<delSum Test="1" timestamp="2007-12-10T21:07:48Z">
<del pId=”Dem” dNeed=”2029″ dTot=”4056″ dChosen=”991″ dToBeChosen=”3237″>
<Cand cId=”1746″ cName=”Clinton” dTot=”290″ d1=”+290″ d7=”+290″ d30=”+150″/>
<Cand cId=”1918″ cName=”Obama” dTot=”194″ d1=”+194″ d7=”+194″ d30=”+55″/>
</del>
<del pId=”GOP” dNeed=”1113″ dTot=”2225″ dChosen=”251″ dToBeChosen=”2153″>
<Cand cId=”893″ cName=”Romney” dTot=”109″ d1=”+109″ d7=”+109″ d30=”+1″/>
<Cand cId=”302″ cName=”Paul” dTot=”47″ d1=”+47″ d7=”+47″ d30=”0″/>
</del>
</delSum>

private function onData(event:ResultEvent):void
{
demData = event.result.del.(@pId==”Dem”).Cand.(@cName!=”Uncommitted”);
gopData = event.result.del.(@pId==”GOP”).Cand.(@cName!=”Uncommitted”);
}

Note that event.result represents the top node, which is <delSum> node in the XML document.

XML filtering:

To locate a set of XML objects that represents similar characteristics, use the parenthesis () to include sets of boolean statements, following a dot after the node you want to carry out the filtering against, like so:

var product1:XMLList = catalog.product.(@id==1);//Returning the product node or nodes if there are multiple products whose id is equal to 1

or

var productName:String = catalog.product.(price<50).name;//Returns the name node

or

var manufName:String = catalog.product.(price<50).@manufacturer;//Returns the manufacturer attribute under the name node

To get list of candidate names:

var _tst:XMLList = event.result.del.(@pId=="GOP").Cand.(@cName!="Uncommitted").@cName
trace((_tst[0] is XML)+”; “+_tst[0].nodeKind() )//Returns “true; attribute”
trace(gopData[0].@cName+”; “+(gopData[0].nodeKind())//Returns “Romney; element”

Types of node include: text, comment, processing-instruction, attribute, or element.

google map css trap 101

November 6, 2007 by maohao

#1. An div rule will sometimes screw up the overlay popup. Suppose you have #container>#mapDiv, the following will add a weird white bar underneath the popup window (speech bubble when openInfoWindowHTML/openInfoWindow are called):

#container div{
margin-top:10px;
padding-bottom:10px;
}

#2. For some mysterious reasons, sometimes the GInfoWindow object gets some extra document div(s) nested when you call openInfoWindowHTML/openInfoWindow and that results in extra white padding space between the real content and teh GInfoWindow object. The workaround is to specify the “maxWidth” property in the GInfoWindowOption object which is the second parameter for an openInfoWindow(HTML) call:

GEvent.addListener(marker, "click", function() {
marker.openInfoWindow(venue.getHTML(), {maxWidth:300});
});

Timeline, MovieClip and AS 3 101

October 8, 2007 by maohao

1. A MovieClip subclass instance starts playing as soon as it’s been instantiated:


var myMC:MyMC = new MyMC();

AddChild(myMC); or removeChild(myMC) doesn’t affect the playhead in myMC, meaning if there is no framescript, myMC will continue playing regardless of whether it’s been added to the playlist or not.

2. To use the versatile/artistic/rétrospectif/timeline-script style, one thing to keep in mind is if any children MovieClip symbols are physically placed inside the timeline of your MovieClip subclass, you can either have Flash make those variable declarations automatically (and thus you should not declaring them as variables in your timeline script), or associate your movieClip symbol with an external class file definition and remove those variable declaration in the class. (in such a case, you will still have Flash declare those children instances variables for you but you will have to make them public in your class.)

Link: Flash CS3: Automatic Timeline Declarations

3. To use an external class definition for a MovieClip symbol and associate timeline script with it, use addFrameScript(frameObj1, frameHandler1, frameObj2, frameHandler2, *rest);. Note that frameObject is zero based: meaning if you want to use frame number, frame one would need a value of 0.

4. To determine if a displayObject is on the playlist or not, check to see if either of the following revolves to true or false:

displayObject.stage

displayObjectParentsOrAncestor.contains(displayObject)

5. Since the timeline script is synchronized by “Event.ENTER_FRAME“, it might be it’s delayed because of other script took longer to execute. As an animator, I found myself, especially in my earlier days of using Flash, put a stop() on some frame (say that frame is labeled “paused”) of a MC symbol and in my client code, I need to gotoAndPlay("paused") to resume from that specific point. It would sometimes get confusing since gotoAndPlay("paused") won’t always resume the playhead, instead it seems to freeze at that certain frame; that is because the frame script stop() is executed AFTER gotoAndPlay("paused") is executed . A quick-n-dirty workaround is to simply do the following:

gotoAndStop("paused");
gotoAndPlay(currentFrame+1);

or

gotoAndPlay(pausedFrameNumber+1);

6. Render Event

7. Flash 9: Timeline navigation and code execution

useHandCursor, buttonMode and mouseChildren

October 7, 2007 by maohao

To display the hand cursor for a displayObject with a dynamic textfield inside it (Suppose the textfield is on top of a shape):

mySprite.buttonMode = true;
//By default useHandCursor is true;
//mySprite.useHandCursor = true;
mySprite.mouseChildren = false;

Assign additional class to a div using Prototype 1.5/6

October 5, 2007 by maohao

Senario:

You need to do something like this (only one div gets assigned class “hilit” at a time):

<div class = “thumbDivOther hilit” id=”thumb_intro” onclick=”showItem(’intro’, this);”>

Code:

currHilitDiv.removeClassName(’hilit’);
//This doesn’t work in IE6
//div.addClassName(’hilit’);
Element.addClassName(div, ‘hilit’);
currHilitDiv = div;