Greg Wilson's Ramblings

Every day I see new applications that take advantage of all of the cool features that AIR provides such as SQLite database, encrypted DB, idle detection, network detection, local file support, socket support, native integration, etc.   It is no surprise that AIR is starting to be a logical choice for many enterprise applications, especially applications that need extra security, offline capabilities and strict control over the UI.

As enterprise IT administrators start getting requests for AIR applications to be deployed in their environments, they immediately start asking questions about how they can control the deployment, auto-updates, etc.

Many people are not aware that Adobe has an AIR Administrator’s Guide.  In this guide you’ll learn how to do the following:

• Perform silent installs of the AIR runtime and AIR applications using Microsoft SMS, IBM Tivoli and other deployment tools
• Prevent installation of additional AIR applications
• Prevent installation of untrusted AIR applications
• Disable automatic updates of the AIR runtime

You can download the guide in PDF format from http://help.adobe.com/en_US/air/admin/air_admin_guide.pdf or read it online here.

On Thursday, I’m presenting a session at CFUnited titled, “Building Multi-Player games on the Flash Platform with ColdFusion, Flex and Data Services“.   As you can see, I’m trying to do something a bit more fun than my usual topics!   Yes, I’m talking about ColdFusion powering a multiplayer game!  Over the past 18 months, I’ve been involved in a fun weekend project called ChessJam with a couple of friends.  ChessJam is a multiplayer chess game that is seeing some incredible traffic over the past few months.  The entire app is powered on the back-end by ColdFusion.  The front-end is built in Flex and deployed on Adobe AIR.  This will be the first public sharing of any internals.  Even if you are not interested in building games, there are some techniques that I will share in this session that you will find useful in any collaboration application.

Topics:

• Find out why we chose the technology stack:  Ubuntu Linux, MySQL, ColdFusion, LiveCycle Data Services, Flex, AIR
• Learn how to use publish/subscribe messaging techniques to enable multi-player communications
• Hear about the challenges we faced as we dealt with users in remote areas of the globe with poor networking conditions and how we addressed it (we have users from more than 200 countries)
• Learn how to take advantage of ColdFusion remoting in Adobe Flex — soooo easy and soooo fast!
• Explore various collaboration techniques employed throughout ChessJam from in-game chat to synchronized views

I’m really looking forward to presenting this session.  This project has been a lot of fun and I am excited to share.  To prepare for this session, go grab the app and play! — http://chessjam.com

CFUnited Session: 7/29 Thursday 4:00PM – 5:00PM Faulkner

On Friday, I’m presenting a session at CFUnited titled, “Adding real-time data visualization to your application or website“.   In this session, I’m going to demonstrate how to take data from your web site or application and turn it into a real-time data feed that can be used to feed a dashboard that will impress your boss!  ;-)

Topics:

• Explore multiple techniques to tap into your app/site’s activity data (swf, “magic png”, server-side, etc.)
• Learn how to convert an IP Address to latitude, longitude, city and country
• Use ColdFusion’s sendGatewayMessage() to broadcast the data
• Learn how to configure publish/subscribe messaging using BlazeDS (included with CF9) and LiveCycle Data Services (I’ll explain the differences)
• Learn how to build amazing data visualizations using Adobe Flex
• Take a deep dive into two visualization examples:
  • Use Google Map Flash 3D APIs (amazing features)
  • Use IBM ILOG Elixir’s heat map component and gauges

I’ll be sharing the full source-code for the whole thing.

CFUnited Session: 7/30 Friday 3:15PM – 4:15PM Ballroom A

I hope to see you there!

Over the past few weeks, Christophe Coenraets has been working some late nights experimenting with the various beta builds of AIR for Android.   As a result, he has created some cool applications and shared them (with source) on his blog.   If you have a few minutes, you should check them out!

Here’s a list – check them out – the each include a video:

• Video Chat for Android in 30 Lines of Code — 30 lines of code and you can do multi-user video chat!   Takes advantage of Adobe LiveCycle Collaboration Services
• Android Trader Desktop with Flex and AIR – real-time data updates with live charting, etc.
• Employee Directory Sample Application Using Flex and AIR for Android – every company has an employee directory – a great use case and a great example of using SQLite with AIR on Android
• “VoiceNotes for Android”: Sample App using Flex, AIR, and the Microphone API – Cool demo of the new microphone API in AIR for Android

You can join the AIR on Android beta by going to http://labs.adobe.com/technologies/air2/android/

Even if you don’t yet have an Android devices capable of running AIR, you can use the emulator and still have fun!  I blogged about this recently.

You’ve probably heard a lot of noise in the press, blogs, twitter, etc. about HTML 5.  You’ve probably also heard how its new video and animation capabilities combined with other cool HTML 5 features is going to be the death of Flash, right?  As a technical evangelist for Adobe, I obviously know a lot about the capabilities of Flash, but I also have invested a lot of time getting up to speed on HTML 5 so I could fully understand the debate and separate fact from noise.  I’ve been in this field long enough to see several religious technology debates come and go, so I tend to be very pragmatic when it comes to technology shifts.  I’ve also learned over the years to stay very educated on key topics, deal only with facts I can confirm myself, and rely on neither marketing BS nor sensationalism in the press.

I’ve been involved in web development since the early betas of Netscape.  I’ve used Java Servlets, JSPs, ASPs, Perl/CGI, PHP, ColdFusion and other means of dynamically generating web content and have always worked to push browser capabilities to the limit.   From day one I was excited about what web browsers could do, but like many web developers, I was almost instantly frustrated by the limitations and the painfully slow progress of web standards.  It has taken 15 years to reach the capabilities reflected in the HTML 5 spec.  These features should have been in HTML 2 or at least HTML 3!   Many other standards have innovated dramatically faster, so for me personally, HTML 5 is at least 10 years overdue!

The Flash/HTML overlap – Would you replace your <IMG/> tags with Flash?

Flash was added to our toolbox to extend the capabilities of web developers beyond what HTML provided.   It basically has helped developers fill the gap that exists between the desires of our application design and the capabilities of existing web technologies.   The intent of Flash has never been to compete with HTML.  The intent is to help developers realize the goals of our applications.  If HTML and related technologies provided everything we needed, Flash would not exist.

As complementary technologies evolve, there are inevitably overlapping capabilities.  Adobe has never promoted the use of Flash to do things that HTML can do without Flash.  Have you ever heard anyone promoting the use of Flash to display images?  You could replace all of your <IMG> tags with Flash but why would you use a plugin where no plugin is really needed?!   Although Flash would do a great job at displaying your images and even provide some unique features, it’s very unlikely that you need these features so you would be nuts to use Flash!  If Adobe told me to promote this idea, I would move to the Lightroom team!

This is a trivial example of where there is overlap, but because web developers fully understand the requirements and capabilities of displaying images, it’s obvious which technology to use!   The currently debated overlapping features are a bit more complex resulting in confusion for many.

HTML 5 increases the overlap

I remember the first time I saw DHTML used to make cascading menus (2002 I think?), I was impressed!  I could build UI controls that respond to mouse rollover events, dynamically display dropdown menus and all sorts of cool things.  Amazing!  Although this could already be done with Flash, it was nice to see HTML technologies evolve to this level.  (I’ll skip the history lesson about the huge pains we went through to make sure this new coolness worked on multiple browsers.  It was a mess until JQuery and other AJAX frameworks evolved!).

If you look at what HTML 5 is bringing us, you’ll see that the overlap between Flash and HTML 5 is indeed increasing.   HTML 5 introduces animations, drawing capabilities, video, audio,  and many other things that we usually rely on Flash to deliver, so yes, the overlap is obviously larger in many ways.  However, there is a high probability that the overlap is probably not as big as you may think.  Let’s start with the obligatory video debate.

The center of attention in the current debate – Video!

Now I’m going to say something that might surprise you.   If your video needs are met by HTML 5 and your target audience has an HTML 5 capable browser, you SHOULD use the new video tag instead of Flash!   Like I said before, why use a plugin for something that a plugin is not needed for!?  It’s no different than my <IMG/> analogy above.

However, before you draw any conclusions about video… be sure that you completely understand the implications:

1: Does your target audience have an HTML 5 compatible browser capable of viewing your video?

If not, I can assure you that they almost certainly have Flash, therefore, it’s an obvious choice for playback of video on non-HTML5-ready browsers.  Read my prior article, “HTML 5 and Flash – A Reality Check“.  Are you surprised to see that more people use IE6 than Safari?  I was!  Of course there are new devices that support the HTML 5 video tag and some of these new devices do not have Flash support for various reasons (no, I’m not going there), so it basically creates more work for us developers to support 100% of the audience.  Now we find ourselves writing code that handles video playback differently based on the user agent.  It’s reminiscent of the early 2000s and I believe that it’s going to get worse before it gets better because the number of devices, browsers, screen resolutions, OSes, etc. is dramatically larger than ever before.

2: Do your video requirements go beyond simply pointing to a video file with the new video tag?

You would be surprised at how many customers have much more complex requirements.   Here are a few comments made yesterday by John Harding, Software engineer at YouTube on the YouTube blog that illustrates my point:

“It’s important to understand what a site like YouTube needs from the browser in order to provide a good experience for viewers as well as content creators. We need to do more than just point the browser at a video file like the image tag does – there’s a lot more to it than just retrieving and displaying a video. The <video> tag certainly addresses the basic requirements and is making good progress on meeting others, but the <video> tag does not currently meet all the needs of a site like YouTube”

The article goes on to explain multiple technical reasons why Flash will continue to be the video player for YouTube.   You can read the full article at http://apiblog.youtube.com/2010/06/flash-and-html5-tag.html.  Hulu recently made a similar blog post -http://blog.hulu.com/2010/05/13/pardon-our-dust/ that mentions a few other interesting points.   Although HTML 5 provides video playback, many customers find a gap between their requirements and what HTML 5 offers….so once again, Flash fills the gap!

Did you know that there was such a vast difference between the capabilities of HTML 5′s proposed video tag and Flash?  Have you really looked at the complete feature set of Flash video?

Assuming the HTML 5 video format war finally gets resolved (it has a long ways to go), we will indeed see more videos delivered by the browser without the use of Flash, and that is the way it is supposed to be.  However, when you need advanced video capabilities, you will find that Flash once again complements HTML very nicely.

Video is just one aspect of Flash and only one aspect of HTML 5.  I used it as an example of how disconnected people are from the reality of the debate.

As HTML technologies expand, so do the capabilities of Flash

The ever increasing overlap between Flash and HTML 5 is just one part of what’s happening right now.  The other part that is seldom mentioned is the continually increasing capabilities of Flash.   As HTML 5 is slowly realized, Flash continues to innovate at a very fast pace so that it can continue to fill the gap between what HTML technologies offer and what developers want to build.  You should see what’s coming in future versions!  Flash will continue to complement HTML and help developers realize capabilities not possible otherwise.  Can Adobe continue to innovate to fill the gap?  Can Flash evolve fast enough to continue complementing HTML?  You bet.  I’ve seen it!  Eventually, we will be debating HTML 6 vs Flash Player X and we’ll see whole new set of hot topics. Fun times!

Get educated!

Spoken in my stern teacher voice — It is impossible for you to evaluate the future of HTML 5 and Flash unless you are fully educated on both technologies.  I keep meeting developers who have a decent understanding of HTML5 but think Flash is nothing more than simple video and animated ads.  I also meet developers who have a decent understanding of Flash but think HTML 5 is only about adding video, audio and canvas tags to today’s HTML.  In both cases, the person is VERY misinformed and is lacking the required education to make any future-looking statement about either technology.  However, both uneducated groups tend to be very loud!  It reminds me of a political election where people vote based on what they have learned from political ads!  STOP IT!

Whether you are debating technology or politics, it’s an absolute requirement to be equally knowledgeable on all topics involved.

Where to learn more

Hopefully you are now inspired to learn more.  Below are the resources I found while learning about HTML 5.  I’ve also listed some resources about Flash and related technologies.  Go read everything below and let’s have an intelligent and fun discussion about the future.

HTML 5:

• Google’s http://html5rocks.com – fantastic resource with tons of live demos – my favorite resource for showing off HTML 5
• Microsoft’s IE 9 test drive home page – includes some very impressive HTML 5 demos – http://ie.microsoft.com/testdrive/ – it’s great to see Microsoft innovating around HTML 5.
• Apple’s Safari technology demos – some impressive demos of HTML 5, but a bit too “Apple owned” feeling – http://developer.apple.com/safaridemos/ – the original demos only ran in Safari but now also run in Chrome.
• CanvasDemos – an entire site devoted to the new canvas tag in HTML 5 – some very impressive stuff – http://www.canvasdemos.com/
• HTML 5 Test site – gives your browser a HTML-readiness score and list the capabilities.  Each listed capability is a hyperlink to the HTML 5 spec – http://html5test.com/
• HTML 5 Readiness site – shows current status of most modern browsers (anything not listed has no HTML 5 support) – http://html5readiness.com/
• HTML 5 Demos – a decent set of HTML 5 demos – http://html5demos.com/
• HTML 5 Video tag browser support matrix – a very up to date article on which browsers support which video formats/codecs, etc. – http://en.wikipedia.org/wiki/HTML5_video
• Adobe Dreamweaver HTML5 Pack – an amazing set of HTML 5 capabilities you can use today – http://labs.adobe.com/technologies/html5pack/

Adobe Flash Platform:

• Adobe Flash Platform Home Page – http://www.adobe.com/flashplatform/
• Flex.org – great starting point for learning about Flex, a developer’s toolkit for creating Flex content.  If you have never looked at Flex, you are missing a big piece of the Flash Platform, especially when it comes to complex application development.  Be sure to check out the showcase (“What’s possible”).  You’ll see that Flex is used to build very complex mission critical apps in the enterprise.  These apps run on the Flash platform.
• Tour de Flex – a gallery of nearly 500 code samples illustrating everything from simple UI controls to complex data visualizations and real-time data handling – http://flex.org/tour
• Top Flash Misconceptions by Mike Chambers – addresses some very recent false claims about Flash – http://www.mikechambers.com/blog/tag/flash_myths/
• What’s new in the latest release of Flash Player 10.1 – a very substantial release – http://labs.adobe.com/technologies/flashplayer10/features.html
• Adobe AIR home page – a runtime that enables desktop applications built with either Flash, Flex or HTML/JavaScript – http://www.adobe.com/products/air/ – supports Windows, MacOS, Linux, Android (beta) and more on the way.  If you have never looked at AIR, you need to check this out.
• Flash Media Server home page – http://www.adobe.com/products/flashmediaserver/

Go learn!

We have FINALLY launched Tour de ColdFusion! We are still filling in a few gaps and testing, so we consider it a beta, but it’s ready for you to dive in.

Tour de ColdFusion is a desktop application built on Adobe AIR that provides quick access to hundreds of ColdFusion code samples.   Live running samples combined with the source code that you see running is the fastest way to learn!

Over the next few days, we will be adding additional samples.  Tour de ColdFusion will automatically reflect the latest sample database each time you run it so you know that you are seeing the latest, greatest stuff.

Help us make Tour de ColdFusion better by helping us add new samples.   If you have any code samples, techniques, frameworks, etc., that you think would make Tour de ColdFusion an even better learning tool, please contact us at submit@tourdecoldfusion.com.

Please report any issues to bug@tourdecoldfusion.com.

Go to the Tour de ColdFusion Beta home page to download and install.

We just posted Tour de Flex 2.0.  If you already have a previous version of Tour de Flex, it should auto-update to 2.0.   This latest version has several bug fixes and now requires AIR 2.0 to support many new AIR 2.0 samples.   Go grab it and check out the new samples in the AIR Applications folder!  There is some great stuff!

THANK YOU to Holly Schinsky (twitter) for building the majority of these new samples in addition to fixing many of the bugs in the Tour de Flex application.

There are now 490 samples in Tour de Flex!

If you don’t already have Tour de Flex, go to http://flex.org/tour.  Tour de Flex is a desktop application for exploring Flex capabilities and resources, including the core Flex components, Adobe AIR, data integration, and a variety of third-party components, effects, skins, and more.

Earlier this week, I was updating an AIR app originally built on AIR 1.1 to AIR 2.0.   I changed my namespace to 2.0 (so I could take advantage of some new AIR 2.0 specific APIs), built my .airi file, signed it and tried to install it.  I expected it to prompt me to upgrade my existing version but instead, I got the following error:

“Sorry, an error has occurred. The application could not be installed because an application with that name already exists at the selected installation location. Try installing to a different location.”

This also breaks auto-update.  You’ll get the following error:

“This application cannot be installed because this installer has been mis-configured.  Please contact the application author for assistance.“

After doing a bit of research, I discovered that a change was made starting with AIR 1.5.3 with how publisher IDs are generated.  When you switch from a namespace prior to 1.5.3 to 1.5.3 or later, the assigned publisher ID will be different unless you override.

The solution is simple and documented here.

Here’s the quick version of what you need to do:

1. Determine your application’s current publisher ID. In an installed application, this is found in the META-INF/AIR/publisherid file.
2. Add a <publisherID></publisherID> element in your descriptor, and copy your publisher ID into it.
3. Update your application’s namespace to 1.5.3, 2.0 or whatever

Now when I try to install, it recognizes it as a newer version and gives me the dialog and upgrade experience I expected.

If you are reading this, you are probably a fairly technical person that understands the complexities of HTML, JavaScript, CSS, Flash, and other web technologies.  Like me, you probably have more than one web browser installed on your systems and enjoy the very latest technology every day.  I bet you have already viewed the latest HTML 5 demos including the ones that only work with Safari 5, right?  A few days ago, I had an epiphany.  When it comes to web development, we are sometimes a bit narrow-minded when we think about our users.  Instead of thinking of our friends and colleagues in the industry, we need to think about the “real world” and the “typical user”.  The real-world is your mom, daughter, doctor, dentist, accountant, and coworkers in HR.  The majority of these people don’t think about what the various technologies are called  and which browser supports what.  They don’t care about the various debates and religious wars being waged over Flash, Silverlight, HTML 5, and other technologies.  They just want a barrier-free world of news, entertainment, and other content.  And they just need it to work!

To find out what browsers people are using, I decided to go find some data.  I quickly discovered some interesting stats at http://w3schools.com/browsers/browsers_stats.asp .  There are twice as many people using IE6 than Safari??!!  Wow.  After studying the data, I was reminded that w3schools doesn’t really provide good data for my purposes because your mom, daughter, doctor, dentist, accountant, and coworkers in HR never visit w3schools.com.  It’s a site for technical people looking to learn more about web development!  The data is still interesting but keep reading…

I recently discovered a goldmine of information maintained by our new friends from Omniture called SiteCatalyst NetAverages, an online service that provides insight into current Internet usage trends. The data is based on anonymous aggregate unique visits across the majority of Omniture customers.  These sites are the big leagues and they are visited daily by your mom, daughter, doctor, dentist, accountant and co-workers in HR.

I won’t waste your time analyzing the results.  Take a look for yourself.  The charts below are from last month (May 2010).

After looking at this data, I realize that we are dealing with two different challenges.  The first challenge is getting all vendors to agree on the numerous aspects of the standard and implement them consistently across all supported platforms (I have to admit that I’m skeptical.  History does not build any confidence).  The second challenge is the rate of adoption.   Although Flash Player 10 was quickly adopted (over 90% in only a few months), new browser technology moves much slower.  I do think that HTML 5 will be adopted faster than previous browser advancements because the new features are compelling, but the reality is that it will take some serious time.  Keep in mind that IE 6 was introduced in 2001 and it still appears in the chart!  It’s depressing!

If you would like to take a look at the data from NetAverages, go sign up!    It’s part of CSLive and is complementary for 12 months when you register your Creative Suite 5 product or sign up online before April 11, 2011.  You can signup now at http://adobe.com/go/cslive.  There are other charts showing OS’s (Win XP is nearly 50% still!…geez), screen resolution, JavaScript versions, etc.   It’s fascinating to explore.

If you would like to see data from another source, check out NetMarketShare – the results are even more surprising (they show IE 6 at 17.6%!).  Check out their OS version chart – Windows XP still at 62%??!!  Now that I think about it, my accountant does still use Windows XP.  Thankfully my mom has a loving son that upgrades her often.  :)

If you’ve been following my blog for long, you know that I LOVE Adobe AIR.  My largest AIR project is ChessJam (FB), an online Chess application built with Flex that has users from over 155 countries playing over 2500 games of Chess every day.

You can read about all of the incredible new features of AIR 2.0 here but the bottom line is that you want this upgrade.  The memory and CPU usage is improved so much, we were able to change the machine requirements for ChessJam!  We have users that use low-end Netbooks that could not play ChessJam with AIR 1.5 but with AIR 2.0, it now works great.  The improvements are not trivial!

I have over 45 AIR applications installed on several systems and 100% of them run perfectly under AIR 2.0 so compatibility is great.  You do NOT have to recompile your apps to take advantage of the improved memory and CPU.  Once your users upgrade to AIR 2, they benefit instantly.  The AIR runtime checks once a week for updates so your users will get prompted soon.

In addition to the performance improvements, AIR 2 now has support for calling native code and support for creating a native installer so the opportunities for AIR just exploded.

Tons of new capabilities and uses less memory and CPU?  A no brainer!  ;)

We just added samples from Flexicious to the “Other Components” section of Tour de Flex. If your application requires a datagrid, this is a must-see.

From the Flexicious website:
The Flexicious Flex DataGrid/Advanced DataGrid controls are extensions of the mx.controls.DataGrid and mx.controls.AdvancedDataGrid, with UI to provide filter, paging, sorting, Select All Checkbox, and footer operations. It provides support for SERVER and CLIENT based data manipulation. With client data manipulation, all operations (filter,page,sort) are performed by the grid internally, without a SINGLE line of code. For server manipulation, the grid fires an event with all the necessary information to fetch data from the server. It also supports Flex DataGrid Print, Excel Export and a host of other features!

The Flexicious Flex DataGrid/Advanced DataGrid controls were designed with Line of Business applications in mind, so most features you would expect for enterprise application development are built into it. Compatible with any flex framework (Mate/PureMvc/Cairngorm) as well as any backend techonology! Integration examples with popular backends, including Java/Spring/Hibernate as well as .NET/Entity Framework/IIS/SQL Server are included!

The Flexicious samples are under the “Other Components” section. Check it out!

There are a lot of things that make building apps for mobile devices extremely fun and addictive.  I’ve especially had fun with the onboard GPS in my Google Nexus One using ActionScript (flash.sensors.Geolocation class).  It’s actually very simple.  Here’s a trivial example:

if(Geolocation.isSupported)
{
	geo = new Geolocation();
	geo.addEventListener(GeolocationEvent.UPDATE,geoUpdate);
	geo.setRequestedUpdateInterval(10000); // update my location every 10 seconds
}
...
...
private function geoUpdate(g:GeolocationEvent):void
{
	// everything you need about the location is in the passed event
	// g.latitude, g.longitude, g.speed, etc.
}

I’m currently playing around with a mobile app that polls my location every few minutes and uses a RemoteObject to send it to a ColdFusion CFC on my server. The server saves the location data in a local database and publishes the location on a data services message queue. I then use a simple Flex app utilizing the Google 3D Maps API to visualize both my recent location history and update in real-time with any new location transmissions:
       

I’m going to add some code soon to log the location data to a on-device SQLite database when there is no network connectivity (probably using the fault event handler of the RemoteObject) and re-attempt on the next poll.

Once I’m done with the app, I’ll post the full client and server source code.

Resources:

• Adobe AIR on Android – http://labs.adobe.com/technologies/air2/android/
• flash.sensors.Geolocation docs – http://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/flash/sensors/Geolocation.html
• Google Maps API for Flash developers (includes links to the 3D maps) – http://code.google.com/apis/maps/documentation/flash/intro.html
• Tour de Flex – includes samples with source for Google Maps API and other mapping providers – http://flex.org/tour
• Wanna play but dont’ have an Android device yet? Use the emulator! – http://gregsramblings.com/2010/05/24/get-started-with-air-on-android-before-you-get-an-android-device/ – there is a way to feed it geo data for testing – see the emulator docs for details.

Recently, Adobe announced the public beta of AIR on Android.  This excitement combined with all of the energy from the recent Google IO conference has a lot of developers wanting to dig right in!  If you don’t have access to an Android device today, don’t let that stop you from having some fun.  The Android SDK includes an emulator!  Yes, you can install the SDK, run the emulator, install the AIR runtime from the AIR for Android pre-release site and then install your apk files and test your application.

WARNING:  The emulator is SLOW.  Not just frustratingly slow… it’s painfully slow… so don’t judge the performance of AIR or Android based on the emulator.  When you’re ready to see good performance, go get a real Android device.

Getting started:

• Download and install the Android SDK from http://developer.android.com/sdk/index.html
• Sign up for the Adobe AIR for Android prerelease program at http://labs.adobe.com/technologies/air2/android
• Learn how to get the emulator running at http://developer.android.com/guide/developing/tools/emulator.html
• Read the docs from the AIR for Android prerelease site (once you are granted access – very fast)
• Go write some Flex or Flash apps and feel the rush of building apps for mobile!

RUN ON MY DEVICE:  If you live in the Tampa bay area and you build a cool AIR app for Android and want to see it on a real device, contact me and I’ll meet you and we’ll try it out on my Google Nexus One.  If it’s cool, I’ll buy lunch.  If not, you buy.

Christophe Coenraets recently blogged Employee Directory app built with Flex on AIR for Android:

I’ve been a Verizon FiOS user since the early beta program.  A few years ago, I upgraded to 20Mbps/20Mbps service and found that my various LinkSys routers couldn’t keep up with the throughput.  I then tried the Linksys WRT610N but it still showed the same problem – every few minutes, my network traffic would simply pause for about 1 to 3 seconds!  It was most evident on VOIP calls.   I finally called Verizon and had them send me their supported router, the Actiontec MI424-RW.   Problem solved!

However, two months ago, I upgraded my service to 35/35 (it was now less expensive than 20/20!) and suddenly, the pauses were back.

I started researching the high-end consumer routers and found that the Netgear WNDR3700 had a 680Mhz processor and claimed to support gaming, video streaming, etc., so I decided to give it a shot.   It was a bit pricey ($149 at Best Buy) but when you pay for 35/35 service, you gotta do what you gotta do.

I’ve been running it for 3 days now and am very satisfied.  I’ve seen no network pauses and the various speed test sites all show a faster throughput than with the Linksys and Actiontec routers.

There are some other features that I’ve yet to try including USB Drive support, media server, QOS and more.  It even includes a wireless repeater feature which I’ve not seen in anything other than Apple’s Airport Express or more advanced software stacks like DD-WRT.

The router is dual band (802.11g/802.11n).  Using 802.11n with my Macbook Pro, I get the full 35Mbps throughput wirelessly.

If you have found other routers that handle 35/35 or faster, please comment.  I had a hard time finding anything online about consumer-grade routers for very fast throughput, so hopefully this post will be a decent resource.

We just posted some new IBM ILOG Elixir 3.0 samples in Tour de Flex under the Data Visualization category.

Here are some highlights:

Several months ago, we launched Tour de LiveCycle, a desktop app for navigating 1000+ pages of LiveCycle content. This week, we have taken that same content and made it also available through your web browser.

Go to Tour de LiveCycle ES2 Web version at http://www.adobe.com/devnet/livecycle/tourdelivecycle/web

One nice feature is that you can bookmark specific content.  For example, to learn about LiveCycle Workbench, go to http://www.adobe.com/devnet/livecycle/tourdelivecycle/web/#illustIndex=0;sampleId=3610;docIndex=-1

If you are curious about LiveCycle, this is a great starting point.  Check it out!

A few months ago, I blogged about a little side project I’m involved in called ChessJam, an online live chess application built with Flex that runs as a desktop application on Adobe AIR.  A few weeks ago, we had some users complain that ChessJam was basically unusable on Netbooks.  Further investigation confirmed that we had selected an application size that was too tall for the typical Netbook 1024×600 resolution.  Oops!

Our WindowedApplication tag was setup as follows:

<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" width="1019" height="680" applicationComplete="init()" ...>

Our first instinct was to rework the UI to eliminate some vertical space.  We also considered making a dramatic change to the artwork to make all backgrounds tileable. Unfortunately, both of these options are very time consuming and since we have “real day jobs”, time is scarce.

A few nights ago, I had a crazy idea….maybe I could simply scale everything.  As an experiment, I changed the WindowedApplication scaleX and scaleY to 80%:

<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" width="1019" height="680" scaleX="0.8" scaleY="0.8" applicationComplete="init()" ...>

Amazingly, everything looked fantastic and scaled nicely (with the exception of the HTML overlaid content which I discuss later in this post)!

I then decided to add a little code to determined how much to scale the app based on the user’s resolution. Here’s the code:

<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" width="1019" height="680" preinitialize="initScreenSize()" applicationComplete="init()" ...>
...
...
			private function initScreenSize():void{
				var thisScreen:Screen = Screen.mainScreen;
				var newScaleX:Number = thisScreen.visibleBounds.width / 1019 * 0.98;
				var newScaleY:Number = thisScreen.visibleBounds.height / 680 * 0.98;
				var newScale:Number = Math.min(newScaleX,newScaleY,1);
				this.scaleX = newScale;
				this.scaleY = newScale;
				this.height = this.height * newScale;
				this.width = this.width * newScale;
			}
...
...

Here’s a walkthrough of the code:

• Line 1: All of this needs to happen before anything is displayed, so I use the preinitialize event to trigger my initScreenSize() method.
• Line 5: Using the AIR screen API, I grab the main screen (Tour de Flex has some additional samples using the screen API)
• Line 6 and 7: Using the visible width and height of the screen, determine what the new width and height should be proportionally. I added the “0.98″ factor so that the app doesn’t fit too tightly. 98% gives it a nice tight margin.
• Line 8: Because I need to maintain the aspect ratio, I need the lowest scale factor required to make it fit on the screen. If the user has a very large screen, the scale factor will be greater than 1.0. I don’t want to scale the app larger than the original size so I added “1″ to the list of values to consider. This guarantees that I will never scale larger than the original size.
• Line 9 and 10: Set the scaleX and scaleY to my new computed scale factor
• Line 11 and 12: Set the new application height and width

To see the results, check out a full-resolution triple-screenshot by clicking the image below:

The largest image is the original 1019×680 app (scaleX/scaleY=1.0). The other two images are scaled for smaller resolutions. Notice that the graphics, fonts, etc. scaled nicely.

There is a catch to this if you are using any HTML in your application with the mx:HTML component:
All of the Flash content scales nicely, especially since we used embedded scalable fonts. However, our app also utilizes HTML overlays for some of the dynamic content. Notice the signs hanging on the doors in the screenshot above. Those signs are actually loaded into a transparent mx:HTML control (I blogged about this a few months ago here). The HTML content looked horrible because the HTML is rendered first, then it’s scaled, so I was seeing the results of image scaling of my text. At first I thought this might be the end of my brainstorm, but, later that night, I had a crazy idea… the kind of idea you only get after 2am:

This sounds nuts, but, I scaled the HTML control to the inverse of the application scaling which basically puts it back to full-scale. For example, if my app is scaled to 0.8 (80%), I scale the HTML control to 1/0.8 = 1.25. I then took advantage of a new CSS3 zoom property and set it to 80% in my CSS:

<style>
body {
   zoom: 80%;
}
</style>

Confused?   Basically, I let AIR scale the Flash content and I let CSS scale the HTML content. The results are not perfect, but it’s darn close.

IMPORTANT:  The CSS zoom property is part of CSS3 which requires AIR 2.0.  It will NOT work with AIR 1.5.x.  Our app has a version check of AIR before it does the scaling.  Since AIR 2.0 is going to be available very soon, it’s a short-term issue.

Our latest release is now “netbook friendly” without changing any artwork. I even tested it at 640×480 and it looks great!

Our next challenge is to make sure that everything is touch-friendly so it will run nicely on a tablet.  I don’t expect this to be much of a challenge.  The real challenge is getting my hands on a nice test tablet!

I’ve been using an Android phone for several weeks now and often get asked what apps I am using. I decided to create a simple list that I can point people to.

Apps I use on my Google Nexus One (running Android 2.1-update1) in no particular order: http://gregsramblings.com/gregsandroidapps/

Christian Cantrell shows off one code base running on five difference devices.   Simply fantastic. Full article here