How to simulate onblur event for a Panel in Extjs

Here is a simple trick in Extjs I borrowed from Ext.layout.BorderLayout that simulates listening for the onblur event of an Ext.Panel. This trick is necessary because unfortunately Ext.Panel does not natively support registering for the onblur event (or at least I don't know how). We typically use this trick when we show a Panel and want to remove it when the user clicks off, or to state it differently, when the Panel looses focus. This is very similar to how menus work.

Step 1: Register for mousedown event

this.panel.show();
Ext.getDoc().on("mousedown", this.handleDocMouseDown, this);

First, we show the panel. Here it is assumed this was created previously. Second, we use Ext.getDoc() to return the current HTML document object, and then we register for the mousedown event. The second parameter, this.handleDocMouseDown, is our function we want called when this event is fired. Notice that we register for the mousedown event as opposed to the click event. This is intentional because listening for the click event will actually call this.handleDocMouseDown before your ready because a click involves both mousedown and mouseup.

Step 2: Handle the event

handleDocMouseDown : function(e) {
if (!e.within(this.panel.getEl())) {
   this.panel.destroy();
   Ext.getDoc().un("mousedown", this.handleDocMouseDown, this);
}
}

In our second step we first check to make sure the user didn't click anywhere in the Panel that was just displayed. If it wasn't then we destroy the panel and unregister the mousedown event.

Groovy's MarkupBuilder and Namespaces

Yesterday Kit Plummer posted an XML example using Ruby to demonstrate how to include attributes and namespaces. So I went on a quest to duplicate his output using Groovy to compare the difference and evangelize.

Here is the desired output:

<person:person text='test'>
   <name>Jim</name>
   <phone>555-1234</phone>
</person:person>

Using the Groovy Console, and Groovy's ninja-like MarkupBuilder, you can execute the following script to get attributes and namespace prefixes:

import groovy.xml.MarkupBuilder

def writer = new StringWriter()
def xml = new MarkupBuilder(writer)

xml.'person:person'(text: 'test') {
   name('Jim')
   phone('555-1234')
}

println writer.toString()

If you prefer to define a default namespace instead do this:

xml.person(xmlns: 'http://people.org', text: 'test') {
   name('Jim')
   phone('555-1234')
} 

Finally, here is an example that uses them all:

xml.'person:person'('xmlns:person': 'http://people.org', xmlns: 'http://people.org', text: 'test') {
   name('Jim')
   phone('555-1234')
} 

This will output:

<person:person xmlns:person='http://people.org' xmlns='http://people.org' text='test'>
   <name>Jim</name>
   <phone>555-1234</phone>
<person:person>

I think it's more readable than the Ruby example and definitely much better than the equivalent Java code.

By the way, I attempted to use this online syntax highlighter and did not like it. Does anyone know of a good online syntax highlighter?

Volunteering as Hudson OpenSolaris IPS maintainer

Starting with an open request by Hudson project lead Kohsuke Kawaguchi, I volunteered to be an OpenSolaris IPS package maintainer for Hudson. Not sure I am qualified but I am a huge Hudson advocate and am looking forward to the challenge.

My main goals are to:

• Learn more about how open source communities work
• Go in the opposite direction of my comfort zone and learn something new

Stay tuned on this Hudson wiki page I have created to document this effort.