NemoHQ

January 10th, 2009

URL: http://www.nemohq.com
AGENCY: Nemo
ROLE: Technical Architect, Wordpress Integration
TECHNOLOGIES: Flash, Ruby on Rails

Using jQuery to Build a Better Flash Fly-Down Nav

January 9th, 2009

It seems simple, but one of the most troublesome tasks is to get a Flash fly-down (or drop-down) menu to reliably collapse when it sits over non-Flash content. Some browsers (IE) have trouble recognizing the change of control from the Flash Player application instance to the browser. For that reason Flash won’t always read when the mouse has moved outside the bounds of the Flash Player… worse still – it just receives no notification at all, which means that if you’re relying on Flash to read when the mouse has moved outside the bounds of the navigation – you’re out of luck.


Over the years I’ve come up with many tricks to help deal with this – some more effective than others. Today I found the best solution to date. It’s not 100% effective, but it’s much better than any of the other options that I used.


I decided to try using the jQuery hover method to detect when the mouse leaves the Flash’s containing DIV element in the DOM.


The AJAX code looked something like this:


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$('document').ready(function()
{
    $('#flashNavReplace').hover(
        function()
        {
	    //rollover functionality here
        },
        function()
        {
            getFlashMovie("flashNavReplace").jsCloseNavigation();
        });
});
 
function getFlashMovie(movieName) 
{
    var isIE = navigator.appName.indexOf("Microsoft") != -1;
    return (isIE) ? window[movieName] : document[movieName];
}

and then the Flash side uses some code like this:


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
import flash.external.ExternalInterface;
 
/**************************************************************************
* 
* CONSTRUCTOR
* 
**************************************************************************/
public function TopNavigation()
{
    //setup the JS callback
    ExternalInterface.addCallback("jsCloseNavigation", jsClose);
}
 
function jsClose():void
{
    Logger.log("CALLED FROM JS");
    //close the nav
}


This works for me pretty much all of the time… I can break it if I really try, but it works great for normal usage.

SPEAK VISUAL IS GETTING A LOT OF ATTENTION

January 7th, 2009

Congratulations to the entire NVIDIA team here @ odopod on the success of the Speak Visual site on being featured in F:E:D, StyleBoost, and being chosen as the FWA Site of the Day.




Electrolux Virtual Kitchen

September 23rd, 2008


URL: http://www.electroluxappliances.com/node58.aspx
AGENCY: Struck Creative / DDB-NY
LAUNCH: January 2008
ROLE: Lead Developer


I relied heavily upon Arthur Debert’s Bulk Loader to create this video and audio heavy media site. Media files load in the background and you view other content, to create as seemless an experience as possible.

GM USED CAR AMBUSH

September 22nd, 2008


URL: http://www.usedcarambush.com/
AGENCY: STRUCK Creative
LAUNCH: July 2008
ROLE: Lead Developer / Technical Architect


This was the last project that I worked on at STRUCK before I left for NEMO. The site is built entirely in ActionScript3 and I personally built the Papervision 3D powered van interior, and the media queue and streaming system.

Meet in Utah

September 22nd, 2008

URL: http://www.meetinutah.com
AGENCY: STRUCK Creative
LAUNCH: December 2007
ROLE: Lead Developer
TECHNOLOGIES: Flash


Flash landing page for the Utah Office of Tourism to direct visitors to the correct visitor’s bureau for their destination.

HP + VOODOODNA

September 22nd, 2008


URL: http://www.hp.com/voodoodna/
AGENCY: NEMO
LAUNCH: June 2008
ROLE: Lead Developer / Technical Architect

Nike 6.0

September 21st, 2008


URL: http://www.nike6.com
AGENCY: Nemo
LAUNCH: July 2008
ROLE: Senior Developer
TECHNOLOGIES: Flash, jQuery, & Wordpress


There’s a lot of AJAX that binds the two halves of this site together – one side represents that brand message, and it built in Flash. The other side represents “The Insider” showcasing the latest news and information about the athletes. The two sides interact and use tagged content as a way to display relevant content based on what is currently shown on the opposite side.

This site was featured on http://www.commarts.com/.

The Wi-Life

September 21st, 2008


URL: http://thewilife.urbandaddy.com/
AGENCY: Left Fields Labs
LAUNCH: August 2008
ROLE: Lead Developer
TECHNOLOGIES: Flash


Flash based site for UrbanDaddy and Sony to help travelers locate Wi-Fi hot-spots in San Francisco and New York. ActionScript 3 that integrates with the flash-based Yahoo Maps API.

GRANT SKINNER ON AS3 RESOURCE MANAGEMENT

September 21st, 2008

This is an oldie but a goodie – Grant Skinner gives the straight dope on Garbage Collection and resource management in ActionSctipt 3. Topics that are all too often overlooked.

While on the subject you might also want to check out his articlce Understanding the DELETE Keyword.