Inside Technique : Extending the Browser : Adding Context

When you are using the browser, you may have noticed there are quite a few different context menus displayed based on the selection or where the mouse is when clicked. For example, if you registered the extension yourself, the context menu for annotate is always available. If you registered it through our site, you will only see it when text is selected. In this section, we explain how to control when your menu option is displayed with the contexts registry key.

The availability of the extension is defined by a DWORD registry entry "Contexts". Adding this is as simple as expanding the key representing your menu option and selecting new DWORD from the edit menu. Give the name of this value Contexts. The value itself is a number representing the contexts when the option should be available. The following contexts are defined in Internet Explorer:

Context	Value
Default	1
Image	2
Control	4
Table	8
Text Selection	10
Anchor	20
Unknown	40

For the annotate extension, set the value of the context DWORD to 10. This will cause the menu option to only be displayed when text is selected. Multiple contexts can be specified by ORing the above values together. To simplify calculating these values, at the end of this article is a tool that builds registry files with all the possible settings.

Scripting the context menu

Your extension also has access to what context menu was used to call your extension. This allows you to customize your extension based on where the user is when they choose the extension. The type of context menu is exposed through the event object's type property. The type property returns a string that corresponds to the context menu:

MenuExtDefault	MenuExtImage	MenuExtControl
MenuExtTable	MenuExtTextSelect	MenuExtAnchor
MenuExtUnknown

For example, in our Remember Me tool, we have a switch statement for handling the different types of context menus:

var w = external.menuArguments
// Get the event object of the parent window
var ev = external.menuArguments.event

switch (ev.type) {
  case "MenuExtAnchor":
    // Context menu for an anchor    
    break;
  case "MenuExtImage":
    // Context menu for an image
  default:
    // All other context menus
}

You have now learned the basics for creating your own extension. In the next section, we explain how to add a user-interface to your extensions.

© 1997-2000 InsideDHTML.com, LLC. All rights reserved.