Using FlexEvent.IDLE to Determine Inactivity

A FlexEvent.IDLE event will dispatch every 100 milliseconds when there has been no keyboard or mouse activity for 1 second.  So, if you want to have some other method fire off after the user is inactive for 5 minutes (for example), you would set it up as detailed below.

Be sure to import the following classes.  IDLE needs to be bound to a SystemManager instance and we will need to reference the mx_internal namespace later on:

1
2
3
import mx.managers.SystemManager;
import mx.events.FlexEvent;
import mx.core.mx_internal;

You’ll need to tell Flex that you want to use mx_internal as a namespace to access those properties within the SystemManager class. SytemManager has an “idleCounter” property which is super useful to access- but it is scoped to mx_internal and is not normally accessible. Trying to access it without these steps will throw an error:

1
use namespace mx_internal;

SystemManager is automatically instantiated as a part of every Flex app, so we do not need to do this manually. We will, however, need to add an event listener for FlexEvent.IDLE:

1
this.systemManager.addEventListener(FlexEvent.IDLE, userIdle);

Construct the callback method. Five minutes is equal to 300000 milliseconds… divided by 100 ticks and the number we need to check against is 3000. Of course, you’ll probably want something a little shorter in duration for testing:

1
2
3
4
5
private function userIdle(e:FlexEvent):void {
	if(e.currentTarget.mx_internal::idleCounter == 3000){
		//do something!
	}
}

Note that we prefix the idleClounter property with the mx_internal namespace.

That’s it! Now we have a sweet little activity monitor in our app. When activity is detected, idleCounter will automatically reset as well.

VidLoop Updates and a Word of Caution

icon_128I took some time today to update the VidLoop AIR application. The current version is 1.2.2.  New features include a randomize function and the integration of the AIR Update Framework.  I’ve also fixed a few small bugs.

A note of importance here… I really should have integrated the update framework before my initial public build.  I just didn’t initially expect a ton of users.  Now I cannot push the update to anyone who currently has the app installed- they’ll have to update manually.  It’s probably best to include the updater on any project- no matter how small… just in case. Lessons learned!

Nifty AIR App: VidLoop

icon_128Last week, I was approached by someone asking if we could build a small application that would run a series of videos in a continual loop. I told him it would be pretty simple to do this and that it would only be an afternoon’s work in AIR. So, that evening, I was able to point him to the URL hosting the AIR app. It performed exactly as he requested- user points to a local directory and then all the videos within are run in a loop until the user intervenes. Very simple.

My client had no problem installing the app or running it but asked if it might be possible to inject still images between videos as well. This got me thinking of other useful features and I ended up spending a good deal of time over the Thanksgiving break enhancing and tweaking until I had what you can see below.

VidLoop

The VidLoop application allows a user to specify a directory of media files in order to present them within a semi-infinite loop.

File types that are supported are as follows…

VIDEO: flv, f4v, mp4, m4v

IMAGE: jpg, jpeg, gif, png

The user is able to adjust certain settings based on the controls presented. This includes the amount of time images are to persist on the screen, whether or not to scale these images up to fill the screen, the local directory to pull media from, and whether or not to parse subdirectories. All settings are saved upon each occurrence of a successful run.

Hit ESCAPE to stop a presentation. CLICKING will step through each item and can be used to skip ahead regardless of video length or image duration settings.

I can see a lot of applications for this tool and have begun thinking of some future enhancements; Screensaver Mode, Media Sort Functionality, Randomize Option…

Before AIR, it would be have been a lot of trouble for me to put something like this together.  Now, it’s a piece of cake – and this work is very addicting as well!

Grab it, if you wish…

HTML Links in Flex

I’ve never found the need to have HTML links in Flex behave (and look) like their true HTML counterparts, but a student recently asked how she could get HTML links defined in a Text control to behave like regular HTML links.  After digging around, I found a lot of references to this problem but the solution turned up at Flex Freaks:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
 
import mx.core.mx_internal;
 
public function textHandler(e:Event):void
{
    var styleSheet:StyleSheet = new StyleSheet();
    styleSheet.setStyle("a:link", { textDecoration: "underline", color: "#30F" });
    e.currentTarget.mx_internal::styleSheet = styleSheet;
}
 
]]>
</mx:Script> 
 
 
<mx:Text initialize="this.textHandler(event)">
    <mx:htmlText>
    <![CDATA[
        You may <a href="">click</a> here.
    ]]>
    </mx:htmlText>
</mx:Text>
 
</mx:Application>

Apparently, this should not be used with any degree of reliability so far as future-proofing is concerned since the mx.core.mx_internal class may flux between versions of the Flex SDK.

Listed in the rumored Flex 4 improvements are support for CSS descendant selectors, ID selectors, and space-delimited style names. Something like this should really be handled via CSS so here’s hoping that this will soon be a much simpler process.

Not sure if I’ll ever need this in the future, but in the case that I do- I know it’s here for easy access.

DU Visual Media Center Weblog

I’m taking a moment to highlight the Visual Media Center at the University of Denver and the relatively new weblog maintained by its Director, Leslie Trumble.

The VMC works very closely with those of us on the DU VAGA development team and most of the feedback we receive about the application originates with users from this area.  This week, Leslie writes about two pretty large additions to the application environment; the inclusion of PicLens on digital object search results,  and a standalone application that I’ve been heavily involved in this summer called the DU VAGA Projection System.

What may be of interest to most of my readers is that the DU VAGA Projection System [VPS] is written using Flex and ActionScript 3 for deployment via Adobe AIR.  Though it is not the first application from the university built for the AIR runtime (see the Fridlyand Kiosk software), it is certainly the most complex.

The software takes advantage of a few AIR-specific capabilities including the ability to integrate with the operating system in terms of hardware discovery (and the flexibility to adapt to various configurations), the power to read and write files to a local hard drive, and extensive use of windowing technology.  This application also makes heavy use of Coldfusion 8 and Flash Media Server 3.

I may be writing more on this software and other efforts at the university in the near future.  In fact, many of my recent posts were born directly from work on this specific project.

Visit Unmasked.