RSS Feed
Download our iPhone app
Browse DevX
Sign up for e-mail newsletters from DevX


Implement a Browser Command Line with JavaScript : Page 3

AJAX techniques offer sophisticated GUIs on the web, but sometimes you need to execute commands at the command line. This article demonstrates how to build a custom command line you can add to your user interface—and even get a free run-time scripting engine.

Example Command Handlers
You can put anything you want inside a handler. It doesn't really have much to do with the implementation of the command line itself. However, considering what you can do with a few simple handlers is still instructional.

The Google search function goes like this:

function g()
  var search_string = arguments_to_array( arguments ).join( " " );
  bcl_jump_cgi( "http://www.google.com/search", { "q": search_string } );

The first line takes the arguments and concatenates them into a single string. This is the opposite of what the parser did, but you still need to parse first in order to separate the command words from the arguments. And not all handlers concatenate the words into a single string.

Note that you must convert the 'arguments' object into a regular JavaScript array, using arguments_to_array(). The 'arguments' object is defined within the scope of every function call, and it contains a list of all the arguments. However, it isn't actually an array object, so it doesn't have a join() method. As such, you convert 'arguments' to an array, which does have a join() method. The arguments_to_array() function is defined elsewhere in the code.

The second line of the Google search handler builds a Google search URL and directs the browser to visit it. This is done using a helper function called bcl_jump_cgi(), which will make a CGI call, given the URL and a set of parameters. In this case, the URL is "http://www.google.com/search", and a single parameter, "q", is the search string. The second argument to bcl_jump_cgi() is an array containing the CGI parameters.

The g i image search command is very similar to the Google search command:

function g_i()
  var search_string = arguments_to_array( arguments ).join( " " );
  bcl_jump_cgi( "http://www.google.com/images", { "q": search_string } );

In fact, the code is identical, except that the URL is different. The Wikipedia search is also similar:

function w()
  var search_string = arguments_to_array( arguments ).join( " " );
  bcl_jump_cgi( "http://en.wikipedia.org/wiki/Special:Search", { "search": search_string } );

This search has a different URL, and the search string parameter is named "search" instead of "q".

All of these search functions take a variable number of arguments, because a search can take an arbitrary list of words. The al() function, which simply does an alert, is different. It takes a single argument as follows:

function al( o )
  alert( o );

The argument is passed in as the parameter "o".

Making CGI Calls
The bcl_jump_cgi() function is so useful, it's worth taking a look at:

function bcl_jump_cgi( url, kvs )
  var url = url+"?";
  for (var k in kvs) {
    var v = kvs[k];
    url += k+"="+escape( v );
  location = url;

This code appends the CGI parameters to the end of the URL. Note that it uses the escape() function to escape each parameter value so that it can be safely used in a URL, following the HTTP standard.

The last line of the function assigns the URL to the pseudo-variable "location," which directs the browser to visit the URL.

Close Icon
Thanks for your registration, follow us on our social networks to keep up-to-date