[How] Flash: Seek() & PlayHeadTime() Accuracy

Using seek() and PlayHeadTime() with FLVPlayback component of video files in Flash can be quite inaccurate. We had the same problem when we were building a prototype for our project, which involved switching and syncing of videos using specific timing. PlayHeadTime gave a decimal value, but whenever we would do a seek() using the PlayHeadTime value on a video, the timing would be off by 0.5-1 second.

Apparently, the accuracy of the seek() function is dependent on the keyFrameInterval of the video and the FPS meaning Precision = keyFrameInterval / FPS.

So for example, if you have a keyFrameInterval = 30 (1st frame will be a keyframe, 30th frame will be a keyframe, 60th frame ... etc.) and FPS is set on 15, you'll only be able to seek in 2-seconds intervals of time (precision = 30 / 15).

To make the seeking more accurate, set the key frame distance when exporting your video with Adobe Premiere. This option can be found in the "video" tab, "Advanced Settings", check "Set Key Frame Distance" and set the key frame distance lower. Export it and now your seek() accuracy would be more precise!


Away3D - Outlining Hotspot on 3D Plane Image

[swfobj src="http://elwinlee.com/flash/outline/TestImageOutline.swf" width="546" height="400"]

I'm learning Away3D at the moment instead of PaperVision3D for a project at the HITLab. PaperVision is kind of outdated and the latest version was causing trouble for creating interactive panoramas.
In the example above;
- Rotate the view by clicking the background and drag the mouse.
- The bidoof is the hotspot and will change color when pressed.
- Outline moves along the z-axi when tilted to show the 2 separate layers (background & hotspot).

The idea behind this is to create an actual outline of the hotspot on the panorama picture instead having an image (e.g. arrow) overlapping the background image to indicate a hotspot.
To achieve this, I placed 2 planes; background and hotspot, on top of each other. The hotspot image is a cutout of the background image with a transparent background. The images are then mapped onto the planes and placed on top of each other accordingly. Flash ignores the transparency in the hotspot image, so placing the image on a plane wouldn't effect the image.

Next apply a "GlowFilter" to the hotspot image, set the strength to a high value and set Knockout = true, to create an outline. The hotspot object might disappear when moving the camera around. To fix this, move the object slightly in front of the background, e.g. value of "0.5", which won't be visible to the viewer anyway. And set the "pushback" and "pushfront" accordingly (this saved my day!). Compile the file and tada! :D

background = new Plane( {material: BackgroundImage, width: 800, height: 600 } );
background.rotationX = -90;
background.rotationZ = 180;
background.ownCanvas = true;
background.pushback = true;
view.scene.addChild(background);

var objectGlow:GlowFilter = new GlowFilter(0xff1616, 1, 8, 8, 20, 1, false, true);
object = new Plane( { material: ObjectImage, width: 250, height: 250 } );
object.x = -158;
object.y = -65;
object.z = 0.5;
object.rotationX = -90;
object.rotationZ = 180;
object.ownCanvas = true;
object.filters = [objectGlow];
object.useHandCursor = true;
object.pushfront = true;
view.scene.addChild(object);

Flash AS3 TextField buttonMode

It got so frustrated when the mouse cursor didn't change into a hand-icon when I do a MOUSE_OVER event over the MovieClip containing that TextField with "buttonMode = true;"

Apparently, the TextField class in AS3 doesn't contain the buttonMode property. The cursor does change into a hand whenever I scroll over the MovieClip, but turns back to the default cursor if I'm moving over the TextField :@

Luckily Google saved me some headaches!
To get round this simply use the "mouseChildren = false" property on your Sprite/Movieclip button.

mc.buttonMode = true;
mc.mouseChildren = false;

Source: http://www.adenforshaw.co.uk/?p=168