Monday, May 9th, 2005

Ajax Summit: Kevin Lynch, Macromedia Presentation

Category: Ajax

<blockquote>

“I am Kevin Lynch and I work on the much beloved Flash player”

Before working on Flash itself, Kevin worked on Dreamweaver, so he has been there before.

He starts off showing us an old article that he wrote.

Then, he shows us a feed report which demonstrates having the HTML layer talking through to Flash, even with code:

function changeFeed(feedId, feedName)
{
    embolden('feed', feedId);
    var args = new Array(feedId, feedName);
    fp.execute('updateData', args);
    http = getHTTPObject();
    http.open('GET', 'postFormatterWrapperFeed.cfm?feedId='+feedId+'&feedName='+escape(feedName), true);
    http.onreadystatechange = handleChangeFeed;
    http.send(null);
}
                            
function handleChangeFeed()   
{
    if (http.readyState == httpReadyStates.COMPLETE && http.status == 200)
    {                           
        replaceHTML('postContainer', http.responseText);
    }                       
}

View Source is here for Flash…

You can now right-click ‘View Source’ in Flash (in the past it was all in the .swf), and that shows:

<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml" 
	xmlns:source="com.danieldura.viewsource.*" initialize="initTag()"
	backgroundColor="0xFFFFFF" marginTop="0" marginLeft="0" marginRight="0" marginBottom="0">		
	
	<source:ViewSourceMenu gotoURL="MXNACategoryFeedReport.mxml.html" />
	
	<mx:Script source="MXNACategoryFeedReport.as" />   

	<mx:Effect>
    		<mx:SeriesInterpolate duration="750" elementOffset="5" name="transition" />
	</mx:Effect>

	<mx:Panel id="panelTitle" title="Feed Report" width="475" height="250">
	
		<mx:Box width="100%" height="100%" marginTop="0" marginBottom="0">
			<mx:CartesianChart id="bChart" width="100%" height="100%" showDataTips="true" />
		</mx:Box>
		
		<mx:ControlBar id="cBar" width="100%" height="40" marginTop="0" marginBottom="0"
						 marginRight="2" verticalAlign="middle">
		    
		    <mx:Box width="50%" height="100%" verticalAlign="middle" marginTop="0" marginBottom="0">
		    		<mx:ProgressBar id="pBar" indeterminate="true" 
	   	    								label="Loading data from MXNA" />
		    </mx:Box>
		    
		    <mx:Box width="50%" height="100%" verticalAlign="middle" 
		    					horizontalAlign="right" marginTop="0" marginBottom="0">
		    		<mx:Label id="countField" />
		    </mx:Box>
			
		</mx:ControlBar>
		
	</mx:Panel>                                                                                                                                                                                                                            	
	
</mx:Application>	

and you can see the JS code in MXNACategoryFeedReport.as:

// Tell the chart to load some new data (usually called from HTML / JavaScript)
public function updateData(feedIdStr:String, feedName:String):Void
{
	var feedId:Number = Number(feedIdStr);
	setFeedName(feedName);
	loadData(feedId);
}

Kevin also talks about handling state in a page that is now dynamic, and shows us an example at Flash Linking which shows photos, and updates the URLs as you skip through pics.

Macromedia is putting together a Kit that will do all of this stuff for you, so we will have to look for that.

“Should Flickr have stuck with Flash”

Both Ajax and Flash have a place, and we are experimenting with the balance these days. In the Flickr case, maybe the photo arrangement is good for Flash, but the photo showing is better suited with Ajax.

Kevin also talks about how they have now got a nice way in which you can talk from the browser into Flash, which has been a BIG problem in the past (embedded plugins can only get variables from the browser on STARTUP, so they needed to hack around that via a proxy mini-Flash .swf.

Showing of Flash 7

Kevin shows us breezenow.com/kevinlynch, which really shows off some of the cool abilities.

Related Content:

Posted by Dion Almaer at 2:16 pm
2 Comments

++---
2.7 rating from 6 votes

2 Comments »

Comments feed

Some corrections:

You cannot, in general, right-click to view source in Flash. There is a bit of code written by Mike Chambers which adds a “view source” command to the right-click menu, which you can then link to a source file if you wish. This is all done manually by the author.

The code after that comment is not “flash source,” but is MXML, the language used by Macromedia Flex.

The code after that is not JS, but is ActionScript.

The URL given at the end of this article leads to a 404.

Comment by Josh Santangelo — May 9, 2005

Thanks for all of the comments Josh.

Ideally right-click would be in the engine itself, but having the author able to add it is better than nothing (and a lot of people would hate to have their source suddenly available).

The URL has been fixed.

Dion

Comment by Dion — May 10, 2005

Leave a comment

You must be logged in to post a comment.