Smoky Cogs

Ah, the sheer programming bliss. I have been eagerly awaiting getting my hands on Adobe Air 2.0.

It has included a host of features that will make my life so much easier. It boasts a faster Webkit engine, making Javascript-based libraries run much faster. Improved network functionality, and the file promise API are other delectable additions.

Included in both Flash Player 10.1 and Adobe Air 2.0 is support for touch-screen monitors and support for the inbuilt mic so sound recording is now possible too.

Still have to wait for the mobile version of Flash Player 10.1 though…hopefully for not too much longer.

I saw this morning on Inside RIA that Adobe Air 2.0 will be released in the first quarter of 2010. The beta should be out before the end of the year.

This is very exciting news for me and my colleagues at work, since the application we are developing is based on Adobe Air.

It has a substantial amount of new features, and will be based on Flash player 10 using Flex 4.

Amongst the new features is support for IPv6 networking, UDP support, a DNS resolver to find out DNS information.

The biggest new feature for us though is the file promises API, which will enable you to drag and drop remote files seemlessly and easily, using URL streaming. Currently, Adobe Air only supports drag and drop on real local files.

The application will also have better performance, both in memory and CPU resources, which will make the applications run much better.

If you want to find out more about the new features offered in Adobe Air 2.0, click here.

If there is one thing that can drive me insane is the way in which Javascript handles errors.

The way Javascript does this is dependant, to a degree, on the browser implementation, but the worst offender for me occurs in Adobe Air ( and quite likely some other browsers too).

Let’s first introduce the scenario. Imagine a large framework built up with several Javascript ‘classes’, with multiple functions in each class.

Now, creating an instance of the class, and using the object, one of the functions generates an error when you call the function. Let’s assume the reason for the error was intermittent, caused by an improperly set parameter. What I mean is, that the function in question should not consistently fail, but only failed in that one instance.

The problem comes in that Javascript then decides that, since the function failed, then there is a problem with it, and consequently refuses to execute that function again after it has failed.

In a real world example, I had a function that starts a file download. It would work fine, until it crashed trying to download a file that does not exist, and after that, every call to that function would fail until I restarted the application. It is a problem that can cause some severe debugging headaches unless you are aware of this behaviour.

The solution to this problem is to use try-catch blocks around code that is likely to fail in this way, so that the code fails gracefully, which should be how you are coding anyway.

In a previous post, I talked about how Adobe Air was swallowing up the Javascript keydown event for the ctrl+v key combination. Now I have figured out a way to bypass the key events altogether and tap directly into the copy, cut and past events.

These events get triggered whenever a copy, cut or paste occurs, and is consistently triggered within Adobe Air (and any other browser for that matter).

Now, the element on the page I wanted to attach the event to has an element within it that gets dynamically generated, and no amount of tweaking would get the dynamic content to trigger these events within Adobe Air. In Firefox, it did all work as expected.

So my solution for this slight problem, is add the copy/cut/paste event listeners to the window (which would always trigger – dynamic or not) and then add listeners for the focus and blur events on the element I want the editing events trigger for.

There is one more hack needed though. Adobe Air, for some unexplained reason was firing the copy/cut/paste events twice each time I triggered it, so I put in a flag which checkes if the same event is refiring and ignore it.

So the code below, will give selective copy/cut/paste functionality in Adobe Air with no hassles.

var eventHandled = false;
var elementSelected = false;

pasteHandler = function(e) {
	if (eventHandled == false) {
		if (elementSelected == true) {
			alert('Paste');
		}
	}
	eventHandled = !eventHandled;
}

copyHandler = function(e) {
	if (eventHandled == false) {
		if (elementSelected == true) {
			alert('Copy');
		}
	}
	eventHandled = !eventHandled;
}

cutHandler = function(e) {
	if (eventHandled == false) {
		if (elementSelected == true) {
			alert('Cut');
		}
	}
	eventHandled = !eventHandled;
}

elementFocusHandler = function(e) {
	elementSelected = true;
}

elementBlurHandler = function(e) {
	elementSelected = false;
}


document.getElementById('myelement').addEventListener('focus', elementFocusHandler, true);
document.getElementById('myelement').addEventListener('blur', elementBlurHandler, true);
window.addEventListener('paste', pasteHandler, false);
window.addEventListener('copy', copyHandler, false);
window.addEventListener('cut', cutHandler, false);

I love the For Dummies series of books, and this one is no exception. It contains enough details about Air to get you going and using it quickly and easily. In the tradition of the For Dummies books, it addresses Air in a very easy to understand way.

It points out a lot of gotchas and pitfalls to watch out for when using Air too, which is most useful when first encountering the system or porting code across from a web environment.

This book will also help the novice, given the straightforwardness of the writing, although a seasoned veteran may need something more to keep him happy.

Adobe Air can be very finicky when it comes to ajax, as it has quite a lot of security rules to protect your computer from rogue scripts, and that is where this book comes in handy.

Most of the book covers general topics in Adobe Air, giving Air a full treatment, but where this book stands out is detailing how to get ajax working withing the Air environment, bypassing the security restrictions. For example, there is a chapter dealing with a client/server bridge.

Another great feature of this book is that it focuses on using Javascript to build Air applications rather than Flex, which is great for all us Javascript developers.

This book makes a good reference.

Web browsers are notorious in how they handle key presses. Every browser handles them differently. I am not going to go into the details here about the differences between the browsers, as it is covered in lots of other places on the web. There is a particularly good comparison here by The Pothoven Post which shows how the browsers differ in their interpretation of key presses. Rather I am going to deal with how it is handled in Adobe Air, and Webkit which air is built on.

The three events linked to capturing keys are the keydown, keyup and keypress events. And it is not all that difficult to listen to events using Javascript. The only code you need to listen to the keydown even is this:

keyDownEvent = function(e) {
   alert(e.keyCode);
}

document.getElementById('obj_name').addEventListener('keyup', keyUpEvent, false);

In Webkit, this event gets fired when you press a key, and e.keyCode contains the code for the key that was pressed.

What I was trying to do was to capture the ctrl-x, ctrl-c, ctrl-v shortcut keys.

When you press these key combinations, the keydown event should get fired. Rather more specifically, a keydown event will get fired for the ctrl key as well as for the c, x or v key, so you will get, with the code above, a popup giving a keycode of 17 when you press the ctrl key, and then, while holding down ctrl, if you press c, it will pop up with a key code of 67, which is the same code as if you had only been pressing c by itself.

So, what might my problem be, you may ask?

Well, everything works well, except for the fact that when you press ctrl-v, no event gets triggered, thus making it impossible to check for that key combination. You can detect ctrl-x and ctrl-c but not ctrl-v. I even tried many other keys, and all others I have tried have worked, and so it is solely the ctrl-v key combo which refuses to work.

Safari 4 is also built on top of Webkit, and thus should give similar results to Adobe Air, so I ran my code in there to test it. The code all worked fine in Safari 4, and the ctrl-v key combo was being correctly trapped.

This seems to indicate to me that there is a slight problem in Adobe Air itself as to why it won’t see this key, and I have yet to find a way in which to overcome this problem.