To screen scrape the desired info from the page, I used greasemonkey located at http://greasemonkey.mozdev.org/. I always wanted to write a greasemonkey script and here was the perfect opportunity. greasemonkey is a Firefox extension that enables you to install a JavaScript document on the fly. The script is executed when the user navigates to a specific page. The script has access to the document object model and can mutate the document and communicate with a server-side component.

function getXml()
{
var xml = "<data>";
var unorderedList = document.getElementById("news");
var childNodes = unorderedList.childNodes;
for( var j = 0; j < childNodes.length; j++ )
{
    if( childNodes[j].nodeType == 1 )
    {
       xml += "<event>";
       xml += childNodes[j].textContent;
       xml += "</event>";
    }
}
xml += "</data>";
return xml;
}

The above is a script snippet locates the unordered list element (ul) and iterates through its children (li), extracting the text content to compose an XML document. This function is called when the user clicks on the AW Mashup icon in-jected by the script at load time. The XML document is HTTP posted to the server for geo-tagging. The latter is a Web service that scans a document and locates in that document places such as "Beirut" or even more powerful places such as "20 miles north of Haifa, Israel". Each identified placed is returned as part of the Web service response with a latitude and longitude value. The collection of the geo-tagged information is forwarded to a server-side viewer (in my case a JSP page) to produce a page with a spa-tial widget and a temporal widget. The geo-tagger information is then placed on each widget to express its dimension in a visual way. The spatial (map) widget is based on the ArcWeb Explorer (www1.arcwebservices.com/v2006/solutions/awx.jsp). This is a Flash 9 AJAX widget that enables the user to view vector and raster geographic features. It can be controlled using a JavaScript API and enables a developer to add "intelligent" markers with mouse-over effects and mouse-click callbacks. The temporal widget is based on the SIMILE Timeline project (http://simile.mit.edu/timeline/). This is another DHTML-based AJAX widget that enables the user to visualize time-based events. A user can pan the timeline by dragging the timeline horizontally and can repre-sent the event in different bands such as hours and days.

Now, greasemonkey script is executed whenever I navigate to the text-based blog URL. The script screen scrapes the relevant information (ul and li text content) and sends it to the server to be geo-tagged. The geo-tagged information is forwarded to a JSP page that renders the information using the ArcWeb Explorer and the Simile Time-line widgets (see Figure 3).

I hope you enjoyed reading this article. I have included URL references throughout that will give you more in-depth information. In addition, the source code for the items that I have developed are referenced in the resources section.

I would like to dedicate this article to all who died in the aforementioned war.

Resources: