Jump to content
justsomeguy

Capturing tab keystrokes in IE

Recommended Posts

This is a bit complicated.A company I work for makes online training. Most of our courses are developed with Flash. We have a courseware shell that runs the entire course. The shell contains code like setting up the lesson and page structure, interface and navigation buttons, displaying the menu, going back and forth through the pages, keeping track of scoring, communicating with a server, etc, all of the basic groundwork stuff that every course needs. Each individual page for each lesson is a separate SWF file that the shell loads into a content area to display. The pages might have their own specific code, such as playing a certain MP3 or controlling a game that appears on that page.This problem concerns the same page running in two different shells. By that, I mean the exact same SWF file, not a republished version of the same FLA file. The two shells are just different versions, there are only minor modifications between them. I'll just refer to them as the old shell and the new shell. The page in question is a simulation exercise where the user needs to enter values into various text fields and press tab to move to the next field. The text fields don't exist all at once, there is one text field per frame and the tab key is being captured to move to the next frame and focus the new field. This is the code we use to capture the keypress and send it to our handler function. This code is on an otherwise empty movie clip on the stage:

onClipEvent (keyUp) {  var keycombo = 0;  if(Key.isDown(Key.CONTROL)){ keycombo += 1; }  if(Key.isDown(Key.SHIFT)){ keycombo += 2; }  _parent.keyPressed(Key.getCode(), keycombo);}

Not surprisingly, everything works fine in Firefox and Opera. Then along comes IE. In IE6 and IE7 with the old shell everything works fine. In IE6 and IE7 with the new shell pressing the tab key highlights the URL in the address bar. The first tab press highlights the URL, the second press unhighlights it (and possibly refocuses the Flash movie), and the third keypress is received by the code. This holds for the entire page. There are 6 or 7 text boxes on the page, and it takes 3 presses of the tab key in IE to move between them. Every time the first press highlights the URL, second unhighlights, and third is received by the code.I'm having a hard time finding discussions online why this happens. I saw one post where a guy said he changed the background from transparent to solid and that fixed it, I don't know what that has to do with anything. The obvious answer is that there is either some code in the old shell that is causing this to work, or there is code in the new shell that is causing it not to work. The differences between the old shell and the new shell don't have anything to do with anything that would affect this, so I can't find any indication why this is happening in one shell and not another. Both shells were published for Flash 6 and Actionscript 2. The changes from the old shell to the new shell are small changes like this:

old:if(!beenhere){ progress = ""; _root.complete = true; }new:	if(!beenhere)	{ 		progress = ""; 		_root.complete = true; 				//fix for print certificate button being enabled with failing score		if (_root.requirePassingScore && _root.passingScore > _root.score) 			_root.complete = false;	}

I'm clueless as to what could be the reason why this would be the case. There is a test page on the Adobe site that demos tab focus here:http://www.adobe.com/devnet/flash/quicksta...essible_ui_as3/If you scroll down you'll see a series of red boxes. If you click on a box and hit tab you'll see the focus move to the next box in the movie. If you try that page with Opera, you'll notice that you can hold down tab and when it gets to the last box it will start back with the first box. With IE, when it gets to the last box then focus will leave the Flash movie and it will focus the next link on the page, then the next, then some other Flash movie lower down where focus stays. So clearly tab behavior is different in IE and [other]. What I don't understand is why our page is behaving two different ways in two different shells where the differences between the shells have nothing to do with interface or keypress behavior. If anyone has run into any issues with Flash and IE focusing, please speak up, I'll listen to anything that anyone has done, it might help or at least make me think of something else. I have not tried downgrading the new shell to use the older code, I don't feel comfortable downgrading the shell version to fix a problem that I don't know what the cause is, it makes me feel like there's a bug that I don't know about.If anyone has any suggestions or questions please let me know. Thanks.

Share this post


Link to post
Share on other sites

Im definately not sure of the solution however with the last example on that page the one with the fields the tab behaviour seems to be the same on all browsers.cant you look into both sources to see what's the difference?

Share this post


Link to post
Share on other sites

Yeah, the form seems to work the same way, it's just that IE is the only browser that removes focus from the first movie when you get to the last tabbable (?) item. It would be nice if they were consistent that way.I did find a solution to this issue. IE still behaves in its own little world, but replacing this line:onClipEvent (keyUp) {with this:onClipEvent (keyDown) {worked, because then Flash immediately launched the action as soon as the key was pressed instead of waiting for it to be released, by which time IE had already grabbed control away from Flash so that Flash never captured the keyUp event.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...