Category: AIR

How to build an Adobe AIR Badge

NOTE: This article was written with AIR 1.5 in mind. I can’t say if the following information will work as intended on AIR 2. If you already know how to build you own Adobe AIR badge, you won’t find much new information here. This post is more to inform users that you can in fact create your own AIR badge if you didn’t already know. When I first started working with AIR, I learned about the badge but as far as I was concerned, the badge was a black box who’s functionality was designed to remain mysterious.  The badge I used was the one Grant Skinner created and you can get more information from Adobe on how to use it. For a long time this badge worked well but finally the time has come where I need to make it behave a bit differently so I decided to do a bit of research.

After doing a few Google searches, I found a link to Adobe’s site with all the technical information on how to create your own AIR badge! I was completely surprised that I never even thought about the possibility that I could write my own badge… not sure what I was thinking. Nothing is more fun that reinventing the wheel right? After looking at the specifications, I realized it wasn’t too bad and started to plan out a logical flow on how my badge was supposed to work.

Requirements

My current badge has the following issue: a user installs my app through the badge, every time after that point that the user comes back to the badge, they have to ‘install’ the app again even thought it was already installed. Instead, I want the badge to sense if the application is installed and if so, launch it (I haven’t spend much time looking into Grants Badger app but I think it’ll let you do this as well if used correctly… I think). The logic for the new badge should be:

  1. Check if AIR is installed (If not, install)
  2. Check if my app is installed (If not install)
  3. Launch my app

Setup

I’ll be using Flash CS3 since that’s what I have available to me for this tutorial and I am making the assumption you already know how to use Flash, understand ActionScript 3, and have an AIR app to test. Open Flash and create a new AS3 file and save it in some folder. Now attach a class called ‘Badge’ to your file that extends MovieClip. Your class should look like the following:

package
{
	import flash.display.MovieClip;

	public class Badge extends MovieClip
	{
		public function Badge():void
		{
			trace('hi');
		}
	}
}

I added a trace in the constructor so I can make sure my class is working. When you test your badge you should see ‘hi’ in your output window. Now we are ready to continue. Continue reading “How to build an Adobe AIR Badge”

Uploader Phase 2 complete!

Here is a screen shot of the Uploader 0.1.0
Uploader 0.2.0

So today after work I decided it was about time to start working on phase two of my Uploader tool. Phase two consists of allowing me to drag and drop an image URL into the app so the app can then download the image to a folder in my server, create a thumbnail of this image, and update the WordPress database with information about the new image. The new image would then show up the next time a person visits my blog. If you notice, there is now a “Pics of Interest” section on the sidebar to the right of the page (similar to what people are doing with the flickr plugin). Every time I drag an image URL into the Uploader, the new image thumbnail will show in that area and if you click on the thumbnail you’ll see the full size image.

It was actually much easier than I originally thought to make this work. Technically, the Uploader already has the drag/drop functionality and already takes in a URL. The only extra AS3 code was a check to see if the URL was an image and if so call the PHP page with a code (I’m passing –@IMAGE@– to know it’s an image – it was just the first thing that came to my head) so then PHP knows this URL should be treated as an image not just a URL. If you remember, phase 1 for the Uploader allows a person to drag/drop a URL into the app so it creates a new link under the “Links of Interest”. Continue reading “Uploader Phase 2 complete!”

AIR widow/app drag, minimize, and close

In working on my Uploader tool, I had to do a bit of research on how to drag, minimize, and close an AIR app. Below is the summarized code in case anyone else is wondering how to do this.

import flash.display.Sprite;
import flash.display.MovieClip;
import flash.text.TextField;
import flash.desktop.NativeApplication;
import flash.events.MouseEvent;

public class Main extends Sprite
{
	public function Main():void
	{
		// button events
		mc_exit.addEventListener(MouseEvent.CLICK, exitApp);
		mc_minimize.addEventListener(MouseEvent.CLICK, minimizeApp);
		mc_drag.addEventListener(MouseEvent.MOUSE_DOWN, dragApp);
	}

	private function exitApp(event:MouseEvent):void
	{
		NativeApplication.nativeApplication.activeWindow.close();
	}

	private function minimizeApp(event:MouseEvent):void
	{
		NativeApplication.nativeApplication.activeWindow.minimize();
	}

	private function dragApp(event:MouseEvent):void
	{
		NativeApplication.nativeApplication.activeWindow.startMove();
	}
}

Three buttons on the root of the flash file each with a listener that handles an action when the mouse is clicked on it. The drag button has to use ‘MOUSE_DOWN’ instead of ‘CLICK’ to work. NativeApplication is the AIR app and it looks to see which window is currently active to send the commands for.

Uploader Phase 1

Here is a screen shot of the Uploader 0.1.0
Uploader 0.1.0

If you missed the previous post explaining what Uploader is go check it out.

So after having some fun with code I think I’m close to being done with phase 1.  I currently have a working beta (0.1.0) that I’m going to share with you all and explain what I’ve done in case anyone else wants to do something similar.  For the most part this was pretty straight forward.  There were a few hiccups here and there that I’ll try to address in this post. The link to the code will be at the end.

  Continue reading “Uploader Phase 1”

Uploader: Automating WordPress Links and File Uploads

So now that I’m starting to get my WordPress and new hosting server settled in I’m trying to think of what I can create to help me automate some tasks. One of the things I know I’ll be doing quite often is adding new links to the ‘Links of Interest’ on the front page.  I’ll also be uploading files/images to use on posts or to share with others but I’m too lazy to be ftping files constantly. So… time for a new tool!

The Uploader (yeah I know, I’m very creative) is going to do all the above for me. This will be a app I can keep running on my desktop somewhere and when I need to upload a file or link I can just drag it over and drop it in. The tool will then figure out what kind of item was dropped in and what to do with it.

Phase 1 will handle the links. The way the tool should work for links is the following.  I visit a page that I find interesting and want to add to the ‘Links of Interest’.  Instead of logging into WordPress to create it, I highlight the link from the address bar of the browser, drag it over to the app, and drop it. Now the app needs to figure out the <title> of that page to use as the name since we need a name and url to create a link. Once it has that, the tool will send the information to a PHP page which will do an insert to the links table in the WordPress DB.  

Phase 2 will deal with images and files. I may break phase 2 into two since I may do some stuff differently with images versus other files.  I’m thinking I may want to upload images, create a thumbnail, and insert to a DB to display in the front page the same way some people do with their flickr images. Other files I would just upload and store somewhere else.  I’ll give this more thought when I get to it.

I’m going to be writing the tool in Flash CS3/AIR with PHP in the backend using the current WordPress MySQL DB.  Stay tuned for updates!

EDIT:

Uploader Phase 1 completed 
Uploader Phase 2 completed