Sunday, June 26, 2005

Extending XULElement

In my XUL application, I often found myself setting things like:

document.getElementById('uname').style.display = 'none';


This seemed very tedius, so using the wonderful flexibility of JavaScript's prototyping, I added a few helpful functions to the XULElement, which all elements in XUL are derived from:

XULElement.prototype.hide = function() {
this.style.display = 'none';
}

XULElement.prototype.show = function() {
this.style.display = 'block';
}

XULElement.prototype.conceal = function() {
this.style.visibility = 'hidden';
}

XULElement.prototype.reveal = function() {
this.style.visibility = 'visible';
}


Now I can simply call

document.getElementById('uname').hide();


And since I use document.getElementById() a lot, I wrapped it with a simple macro-style function:

function ID( id ) {
return( document.getElementById( id ) );
}

ID('uname').hide();


This reduced my code a lot and removed a lot of redundancy.

Purpose & Introduction

I am currently employed as a full-time PHP developer. I will be using this blog to publish my thoughts, ideas, code snippets, and solutions to tough problems I run into. I currently use PHP 5.1-dev, PostgreSQL 8.0.3 with PDO (http://www.php.net/pdo) and Apache 2 running on FreeBSD. XUL is used for our administration panel and is based on a slim Javscript/PHP library.