Keyboard Shortcuts for Dovetail Mobile Agent

October 7, 2008

In a past post, I discussed how to use GreaseMonkey to modify a web application, particularly, Dovetail Mobile Agent.

In my last post, I linked to a GreaseMonkey script that added keyboard shortcuts to Basecamp.

Now let’s combine the two together.

Access Keys for Mobile Clients

Keep in mind that Dovetail Mobile Agent already has Access Keys (shortcuts) that are geared for mobile devices. The access keys are numbers. This works well on a mobile device, but it doesn’t make as much sense for non-mobile devices.

Notice in the image below that each link has a numeric access key.

In a previous post, I showed you how to use Stylish to restyle the app.  One of the styling changes I made was to hide the numeric access keys:

.access-key-label{
   display:none;
}

This hid the mobile-centric numeric access keys.

Keyboard Shortcuts for Dovetail Mobile Agent

Lets add shortcut keys that make sense for non-mobile browsers.

 

Notice that one letter is underlined in each link. This is the shortcut for this action.

For example, if I simply type the letter "e", this is the same as clicking the "Send Email" link. "h" will take you Home. "d" will do a Dispatch. etc.

 

Code

I simply grabbed the code from Quickcamp, and modified it. Specifically, I just had to modify the chunk of code that sets up the links object.

Here’s the code that changed:

var navigation=ebi("navigation");
var content=ebi("content");
var footer=ebi("footer-navigation");

var link=new Array();
links={
  72:{
    pObj:lookForLink(navigation,"Home","H")||lookForLink(footer,"Home","H"),
    },
  83:{
    pObj:lookForLink(navigation,"Search","S")||lookForLink(content,"Search","S")||lookForLink(footer,"Search","S"),
    },
  77:{
    pObj:lookForLink(navigation,"My Cases","M")||lookForLink(content,"My Cases","M"),
    },
  82:{
    pObj:lookForLink(navigation,"Recent Activity","R")||lookForLink(content,"Your Workgroup’s Recent Activity","R"),
    },
  65:{
    pObj:lookForLink(content,"Assign","A"),
    },
  68:{
    pObj:lookForLink(content,"Dispatch","D"),
    },
  69:{
    pObj:lookForLink(content,"Send Email","E"),
    },
  67:{
    pObj:lookForLink(content,"Call Contact","C"),
    },
  78:{
    pObj:lookForLink(content,"Change Status","n"),
    },
  76:{
    pObj:lookForLink(content,"Close Case","l"),
    },                       
  89:{
    pObj:lookForLink(content,"Yank","Y"),
    },
  79:{
    pObj:lookForLink(footer,"Sign Out","O"),
    }
};