Setting scaleX to -1 on a display object

Of course, you can easily place the video object back to where it was by compensating for the flip and adding the video object’s width to it’s current x value. While this solution works for most applications, there is one annoying thing about this method. If you ever want to move the video object around the stage or play with it’s scaleX value, there’s going to be a lot of compensating going on and it can get messy quick depending on the complexity of your application.

So to make it easier, here’s a class that extends the Video object and adds a “flipped” property. I don’t think I need to explain what the property does, but the class overrides the x and scaleX properties of Video so that it takes care of all the positioning when flipping the display object. Check out the demo [webcam required]:

Even when flipped, the x property always references the left side of the video object and the scaleX remains the same. Here’s the source: MirrorDemo.zip

The quick and dirty solution is to put some callback functions on a frame (or two or three) on the MovieClip’s timeline. This works well for simple cases, but gets messy quickly. And the problem gets worse when you create subclasses and have to maintain all those timeline actions manually. Ugh.

In ActionScript 3, all of the frame labels in a MovieClip are available through its currentLabels property, and the undocumented addFrameScript() method lets you add code to it’s timeline at run time. Put them together and you can read the frame labels to figure out where the code should go, then add it to the timeline at programatically. Presto! No more ActionScript in your FLA. Since I’m lazy, I wrote a Label utility class to do all the dirty work :-)

The code below shows an example of a player sprite with idle and attack animations. The timeline has two labelled keyframes, ‘idle’ and ‘attack’. The constructor function checks to make sure both labels exist, then starts the idle animation, which loops until attack() is called. When attack() is called, the attack animation plays once, then idle() is called and the idle animation starts looping again.

package {
 
    import com.zincroe.display.Label;
    import flash.display.MovieClip;
 
    public class Player() {
 
        public function Player() {
            if(!Label.find(this, 'attack')) {
                throw new Error('Label missing: attack');
            }
            if(!Label.find(this, 'idle')) {
                throw new Error('Label missing: idle');
            }
            idle();
        }
 
        function attack():void {
            Label.play(this, 'attack', attackComplete);
        }
 
        function attackComplete():void {
            idle();
        }
 
        function idle():void {
            Label.play(this, 'idle', idleComplete);
        }
 
        function idleComplete():void {
            Label.repeat(this, 'idle', idle);
        }
 
    }
 
}

Download the Label utility class.

We also knew that we wanted to create both the book assembly and viewing tool in Flash as opposed to Director. The tool is written in AS1 and uses Screentime Media’s MProjector software to create a standalone tool for creating the bundles of assets and text that are loaded into the viewer which works equally well locally or online.

What we see now as a version 1.0 tool has been used successfully by the Toronto Public Library in a public touch-screen kiosk format at the Metro Reference Library and had it’s widest release just recently as the core of a jointly produced project called Ontario Time Machine.

At this year’s SXSWi and the Museums and the Web conferences, the “VirtualBook” or “Page Turner” (it needs a real name) was greeted with interest by quite a few people from libraries and museums and it got us thinking about the possibility of a version 2.0 which would build upon the functionality and strengths of the existing version.

We know some of our basic goals in working towards a new version:

• Author in AS3 (bitmap handling and more structured code just a couple of the reasons)
• Streamline the book assembly process and application (cross-platform desktop application and/or hosted process)
• Make the viewing interface relatively “skinnable”
• Expand the display/export options (Flash viewer, HTML view, text only, PDF, etc.)
• Open the process and the product up to benefit from outside knowledge, criticism, and development

The first step in this is this post. We know there are a number of projects with similar goals out there in varying stages of production and we certainly have our personal opinions of where those tools succeed and fail but we would love some direct public feedback on what we have done with version 1.0 and on an on-going basis as we work towards a new version.

As an aside, here are a few companies and organizations with related goals or technology: Open Library, Google Book Search, Zoomify, and Issuu, Any others?

P.S. Please excuse the extremely punny title of this post. I shall endeavour to keep humour reigned-in during all future internet ramblings. Some may say it has been suitable reigned in that they noticed no humour present herein. To them, point taken.