gSkinner - Home

Beware the AIR Badger!!

Posted on September 23, 2008 by Grant Skinner

It’s the true sign of a mature platform ecosystem, using the platform to build tools to build tools to deploy tools that are built on the platform. Huh?

A while back, I worked with Adobe to build a better AIR install badge. Having done so, I thought it would be a neat idea to build an AIR application that made it easier to configure and deploy badge installers. Adobe agreed, and the Badger application was created.

Badger allows you to load a template install badge, configure all of its options, preview it live (via the HTML control in AIR), and then export it for deployment. Badger also takes the pain out of configuring badges by tracking down your application ID, publisher ID, version, and other information. You can even configure a badge to install Badger, click Install Now in the preview, and install Badger from Badger – though this is likely to cause a tear in the space/time continuum.

Badger (and its icon) was designed in Flash CS3, built in Flex 3, and deployed on the AIR platform. I find it quite strange that Adobe chose not to include an install badge for Badger, but maybe they have a strong sense of irony. Or maybe it was just too much work. :)

UPDATE: I’ve been informed that the lack of a badge installer is due to a limitation of the article page template.

You can check out the beta of Badger here.

Originally, we had hoped to name the application “AIR Badger” (which was discarded for legal or branding reasons), which led to the image below that I threw together for the fun of it. That image ultimately led to the icon you can see on the app today.


Click for the full size image.

Follow @gskinner on Twitter for more news and views on interactive media.
48 Comments

I love this app !

Posted by: Rémi on Sep 23, 2008 12:03pm URL: http://www.remitoffoli.com/

SWEET! a flying badger never gets old

Posted by: Kenny bunch on Sep 23, 2008 12:13pm

We don't need no stinking badgers!

Posted by: Randy Troppmann on Sep 23, 2008 1:59pm URL: http://www.randytroppmann.com

I actually created a similar tool back when Flex 3/AIR 1 was in beta:

http://blog.flexmonkeypatches.com/2008/02/06/adobe-air-badge-install-creation-application-monkeybadge/

http://code.google.com/p/flex-monkey-patches-monkeybadge/

I never did follow through and update it once AIR was release.

I think your app is way more full featured than mine was. And your flying badger is more cool than my "foot squishing banana" logo.

-Kyle

Posted by: Kyle on Sep 23, 2008 2:48pm URL: http://flexmonkeypatches.com

I just like the fact theres a flying badger. That. Is. Sweet!

Posted by: Ryan on Sep 23, 2008 3:46pm URL: http://www.bigbeam.co.uk

Very nice!

I too actually created something like this (called it the 'Badge Builder') not too long ago. My UI was not near as sleek.

Pulling the application ID, publisher ID, and version from the AIR file is too cool. Using the HTML control to preview live is a nice touch. Nicely done.

Posted by: jason on Sep 24, 2008 9:28am URL: http://www.knomedia.com/blog

Very cool idea. :)

Posted by: Harry Northover on Sep 25, 2008 9:12am URL: http://www.harrynorthover.com

Hello, Grant!

Do you have any ideas to support other languages except English?

Because I can not indicate local path to the files, if the name of folders not in the English…

Posted by: injun #576871 on Sep 29, 2008 6:36am URL: http://injun.ru

Hi Grant, nice work. It would be great to allow users to configure invoke parameters for their AIR application as well - i.e. the ability to pass a reference to an OPML file for Adobe Media Player for instance...

Thoughts?

Posted by: Andrew Spaulding on Sep 29, 2008 7:04pm URL: http://www.flexdaddy.info

amazing guy! =)

Nice work and well done!

Posted by: Alexander on Oct 1, 2008 11:24am URL: http://ugameasia.com

That's too funny, thanks for the tool, and entertainment!

Posted by: lee on Oct 4, 2008 4:10am URL: http://leefernandes.com

Awesome work!

Only problem is that it worked once but since then I always get #2032 Errors :(

Posted by: Jassa on Oct 8, 2008 12:59am URL: http://bangersandflash.net

Jassa,

I've never seen those errors. Can you please post the full error message (ie. stack trace) so that we can determine where the error is being thrown from?

Posted by: Grant Skinner on Oct 8, 2008 9:00am URL: http://gskinner.com/blog/

Hi Grant,

The error is occurring during the install process - http://www.bangersandflash.net/lab/spellr/

If you have a sec just follow the link above and hit the install button. If not, I'll post back here when I work out what it is.

Cheers.

Posted by: Jassa on Oct 14, 2008 12:10am URL: http://www.bangersandflash.net

Jassa - The appurl parameter must be an absolute path (ie. beginning with http:// ). You will notice in Badger that this parameter is highlighted in red if it is not an absolute url. Badger also generates a warning when you export (in problems and notes).

Posted by: Grant Skinner on Oct 14, 2008 8:27am URL: http://gskinner.com/blog/

Ahh, thanks Grant - I *really* should have picked that up earlier. My bad.

Posted by: jassa on Oct 14, 2008 11:01pm URL: http://www.bangersandflash.net

I cannot insert special chars :s

I'm portuguese, and I need those chars: áàéèóòçãõ

Is the preview badge inside a html component? or is a SWFloader? I need it! I'll need to insert a badger into a flex site, and I don't know how :s

best regards,

rui

Posted by: Rui Cruz on Oct 16, 2008 3:47am

Yes! This is awesome. I was just struggling with getting the Install Badge manually setup for the past couple hours, and I knew you made it so I figured I'd go whine somewhere on your website, and lo and behold, the Badger saves the day! Most of my problems came from my oversight of the publisher id, which the Badger recovered for me.

I still have 2 small issues:

1. When upgrading or installing when the AIR runtime is already installed, users are prompted with an AIR Open/Save dialog instead of going straight to the install/replace page. Is that right? If AIR is not installed, it prompts to install AIR then goes straight to the Install screen, no somewhat-confusing Open/Save dialog.

2. After installation/upgrade/launch, the message on the badge still says "Please wait..." -- I really don't give a flip about it, but the client does. Fact of life, right?

Thanks for your work, and work on the work.

Posted by: Aaron on Oct 16, 2008 10:36pm

This is great! Are there other badge templates available somewhere?

I'm gonna use this a lot. Thanks!

Posted by: chad royer on Oct 22, 2008 2:46pm

No other templates yet, but we tried to build it so that it was simple and powerful to create badge templates for Badger. If anyone creates one, please link it back from here!

Posted by: Grant Skinner on Oct 22, 2008 3:21pm URL: http://gskinner.com/blog/

I have absolutely no idea what the tool does but you should definitely find a way to use that image and the tagline "Bigger... Stronger... Badger!" commercially. (Although I would recommend changing "Bigger" to "Faster"...)

Posted by: Tyler Durden on Nov 18, 2008 6:00am URL: http://www.tylerdurden.com

The tool is nice, but is there a trick to link to an AIR file via a relative path?

The big question is > how can we distribute AIR apps on CDs without having the user to first install the AIR runtime then install the AIR app?

If we could use a badge that relatively links to the AIR app that'd do it!

Any clue would be really helpful!

Posted by: Quentin on Nov 25, 2008 3:48am URL: http://toki-woki.net

Is it possible to use a language other than English in the String parameters? I tried copying and pasting some japanese text and it wasn't allowed.

ie, in order to change "Install Now" to a localized label.

Posted by: David on Dec 4, 2008 7:14pm

Does anyone know how to create the new badge template? Badger just loads them, it can't create one.

Posted by: paroot on Jan 30, 2009 5:54am

Great work.

Thanks.

I look forward to an updated beta.

Posted by: Harley on Feb 3, 2009 6:26am

Nice work.

Will there be any facilities for introducing parameters to be passed on install or browser invoke?

If I just edit the created file to include parameters as with the original version will it work?

Thanks

Posted by: Dave on Apr 2, 2009 10:55am

An excellent app. Unfortunately I get the Error #2032 message as well in both Firefox and IE. I've triple-checked the absolute URL and the other parameters. Could something else be causing this error?

Possibly this is related: I had a working example of the badge and updater API working from the web. I haven't touched it in a couple of months. Today when I tried it, it tosses the same Error #2032.

Did something change on the Adobe-side of things?

Thanks.

Posted by: Spencer Grey on Apr 28, 2009 1:39pm

Turned out that the server needed to know about the AIR MIME-type.

I created a .htaccess file and added the following line:

AddType application/vnd.adobe.air-application-installer-package+zip .air

Hope that helps anybody with the same problem!

Posted by: Spencer Grey on Apr 28, 2009 2:50pm

A while ago, Aaron posted the following:

'I still have 2 small issues:

1. When upgrading or installing when the AIR runtime is already installed, users are prompted with an AIR Open/Save dialog instead of going straight to the install/replace page. Is that right? If AIR is not installed, it prompts to install AIR then goes straight to the Install screen, no somewhat-confusing Open/Save dialog.

2. After installation/upgrade/launch, the message on the badge still says "Please wait..." -- I really don't give a flip about it, but the client does. Fact of life, right?'

And I did not see a reply. How can I either remove the 'Please wait...' message entirely, or help the badge detect if 1) the install was cancelled ( or failed ) 2) the install was successful, and then revert back the the 'fresh' state.

Thank you,

Alex K

Posted by: Alex K on May 6, 2009 12:04pm URL: http://www.alexkoyich.com

Love the badger app! Is there a way to disable the save capability and just run the install when the user clicks to download?

Thanks!

Posted by: Jaafer on May 14, 2009 2:34pm URL: http://sensidea.com

Can someone tell us what's the exact image size to add to the badge as mine shows everytime a distorted image...

Thanks in advance

Sjaakie

Posted by: sjaakie777 on Jul 29, 2009 7:11am

While creating my install badge with Badger, it recognizes that my app is already installed on my machine and therefore in the preview window allows me to launch the application.

But I deploy the badge and open it up in a browser, it does not recognize that I have the app already installed and forces another install. As a test, I noticed the Tour De Flex install badge doesn't recognize I have Tour De Flex already installed either. This is on both Mac and Windows.

I have the correct application ID and publisher ID, but what's going on here?

Posted by: Rob on Aug 27, 2009 2:05pm

... correction to my above post. Works on Windows (I am using XP ) but not on Mac (using OS X 10.5.8)

Posted by: Rob on Aug 27, 2009 2:07pm

Nice work! is it possible to send parameter to my app on launch?

I have tried using this app but I still can't passing any variable on launch.Can anyone help me?

Posted by: Toni on Dec 1, 2009 11:57pm

Grant, we absolutely LOVE your Badger tool. Thanks so much for making it available. We've blogged a little bit about it as one of our partners is about to go live with it. See our blog entry at http://www.whisperraw.com/2009/12/badger-is-brilliant.html

Posted by: Jane Taylor on Dec 14, 2009 8:18am URL: http://www.WhisperRoar.com

Nice work. But I have difficulty entering non-English characters. Even I manually modify the exported html code to use non-English characters, they still display as blank in the actual badge.

Can anyone help?

Thanks.

Posted by: James on Dec 16, 2009 12:10pm

I have spent countless hours looking for a better badger and finally came across this today. I am about one error code away from success. I used the Badger, got no errors then posted the files to the website.

I added the mime type information to an htaccess file and made sure that I have the full url to the .air file.

I would really appreciate some help to get this working properly.

Thanks!

Posted by: Forrest on Jan 1, 2010 12:38pm URL: http://www.bendelcorp.com/tools/index.html

I have no problem using the badger. What error are you getting?

Posted by: Mehran Majidi on Jan 18, 2010 4:20pm URL: http://www.mindsharehdv.com

so = new SWFObject("lib/launcher/AIRInstallBadge.swf", "Badge", "250", "250", "9.0.115", "#FFFFFF");

// these parameters are required for badge install:

so.addVariable("airversion", "1.0"); // version of AIR runtime required

so.addVariable("appname", "deviceMgr"); // application name to display to the user

so.addVariable("appurl", "deviceMgr.air"); // absolute URL (beginning with http or https) of the application ".air" file

// these parameters are required to support launching apps from the badge (but optional for install):

so.addVariable("appid", "com.embla.deviceMgr"); // the qualified application ID (ex. com.gskinner.air.MyApplication)

so.addVariable("pubid", "4AE1627BCE978E86797B22AD2A3083D32A346975.1"); // publisher id

// this parameter is required in addition to the above to support upgrading from the badge:

so.addVariable("appversion", "0.1"); // AIR application version

// these parameters are optional:

// so.addVariable("image", "app_m1_splash.jpg"); // URL for an image (JPG, PNG, GIF) or SWF to display in the badge (205px wide, 170px high)

so.addVariable("image", "images/app_m1_splash.jpg"); // URL for an image (JPG, PNG, GIF) or SWF to display in the badge (205px wide, 170px high)

so.addVariable("appinstallarg", parm); // passed to the application when it is installed from the badge

so.addVariable("applauncharg", parm); // passed to the application when it is launched from the badge

Posted by: Mehran Majidi on Jan 18, 2010 4:33pm URL: http://www.mindsharehdv.com

How do you launch the application from the badge?

I've added so.addVariable(("applauncharg",...) to index.html, but it's still launched without any parameters.

Note 1: The only way to run the app I found was to click Install Now, then click Open, and then click Run Now from "Would you like to run the version already installed?".

Note 2: I retrieve the parameters in the event-handler for WindowedApplication.invoke, using event.arguments.

Posted by: Harry on Feb 24, 2010 3:11am

To answer my own question:

The event to handle is actually BrowserInvokeEvent.BROWSER_INVOKE.

A good place in which to add the event listener is WindowedApplication.initialize.

The argument string must contain only a-z,A-Z,0-9.

Normally appinstallarg equalls applauncharg, but both should be specified.

Posted by: Harry on Feb 24, 2010 5:37am

Hi,

Badger is working fine on the server, ...but only when the AIR runtime is already installed on the client system.

Otherwise, first thing Badger does is to alert the client to go to the Adobe website to install the AIR runtime (not nice), and does not go any further than posting over the alert every 5 seconds or so.

Did I miss something in the Badger config process?

Thanks for your help.

Jerome

Posted by: Jerome on Mar 7, 2010 11:42am URL: http://isource.fr

If you try to use Badger with AIR 2.0 it loses the ability to launch apps. It seems that this is because AIR 2.0 doesn't use publisherID any more. Even if you set publisherID to be an empty string in Badger's parameters it still can't find the app.

Its a lovely little app Grant, hope that you have a few moments to update it! Or post the code and maybe someone else can help?

Thanks

Adrian

Posted by: Adrian Raper on Apr 19, 2010 4:35am URL: http://www.clarityenglish.com/Recorder/Start.…

Hi Grant,

Very nice idea but we're having the same problem as Jerome two posts up. Launching is fine with AIR 1.5 installed but when we uninstall that we just get an alert with a text link to the adobe site.

Is the Flash Player supposed to install AIR directly or are we missing something? The solution now is to provide the user with a link when they don't have AIR installed but that is not what we wanted..

Thanks!

Posted by: Hansn on Apr 20, 2010 12:56am URL: http://www.studentlitteratur.se

Currently Adobe is not officially supporting Badger for AIR2 applications in the beta release.

The reasoning is that they do not want users to install Beta versions of AIR without realizing they are doing so. By forcing users to download the AIR Runtime through the Labs site they make sure the user is aware they're using Beta software.

From my testing, you can still detect versions, and launch AIR2 apps using badger, but the AIR Installation process and App Installation both do not work.

If you are having problems launching an AIR2 app, just make sure you have set the <allowBrowserInvocation>true</allowBrowserInvocation> tag in your -app.xml file.

Posted by: Shawn on Apr 21, 2010 1:06pm

Hi,

Any update about the last issue?

Do we have to specify the publisherID namually in the manifest in order to work with the badge?

Thanks!

Posted by: Yann on Aug 23, 2010 1:59am URL: http://htttp://lab.kapit.fr

To allow the "Launch" or "Upgrade" functionality using Badger with AIR 2.0, just make sure the pubid you are passing is a space (" "). That's how I got it to work properly.

Posted by: Alex K on Sep 24, 2010 9:37am URL: http://www.crazedcoders.com/pallette.png

A Better Custom Air Install Badge + Tracking downloads with Google Analytics
http://www.getwebreader.com/2011/02/a-better-custom-air-install-badge-google-analytics/

Posted by: Jo on Feb 15, 2011 4:39am URL: http://www.getWebReader.com

Leave a Reply

Your email is never published nor shared.




You may use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" highlight="">