GET Request Parameter with JavaScript

I found an easy method to get url parameters with JavaScript. The beauty is that it uses a JavaScript closure to cache the values so that it can be called multiple times without unneeded processing:

var urlParameter = (function() {
    var parameters = undefined;
    return function (paramName) {
        if (parameters == undefined) {
            parameters = {};
            var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
            for (var i = 0; i < hashes.length; i++) {
                hash = hashes[i].split('=');
                parameters[hash[0]] = hash[1];
            }
        }
        return parameters[paramName];
    }
}());

Usage:

urlParameter(parameterName);

JSF CommandLink onclick event

Note: this is fixed in JSF 1.2 but for those of us not there yet …

The JSF CommandLink (h:commandLink) tag allows a link to act like an html form submit button. Much to my dismay I discovered that this tag doesn’t support the JavaScript onclick event. This is probably because JSF adds functionality for this event to simulate the form submit.

To solve this problem I wrote a JavaScript function that accepts an html element (CommandLink element) and a function I want to run onclick. After receiving these two arguments it will evaluate IF onclick functionality currently exists. If so, then it will ensure the function parameter passed in will be executed before the JSF provided onclick functionality. If not, then only the passed in function will be executed. Below is the JavaScript:

// random method I want to run onclick
someFunction = function() {
    alert('jsf ... yeah?');
}

// jsf commandLink onclick hack
jsfCommandLinkHack = function(link, onClickFunction) {
    // check the link exists
    if (link) {
        // get current (JSF) onclick functionality
        var clickFn = link.onclick;
	if (clickFn) { // add new functionality
		link.onclick = function() {
                     return (onClickFunction() == false) ? false : clickFn();
                }
        } else {
	    link.onclick = function() { return onClickFunction(); }
	}
    }
}

// handler
// element = form element
jsfCommandLinkHack(element, someFunction);

Version Control

With Version Control being a hot topic around my office I’ve been collecting links. Thought I’d put them out here so I don’t lose them.

• SVN Book
• Fossil
• Branching Patterns

Ajax Experience 2009 … Day 3

The third and final day of the conference had a couple of highlights for me.

SpritMe – Steve Sounders

Steve sounders gave a quick presentation on his SpriteMe tool, which was really cool. SpriteMe basically takes a look at an entire web page and figures out the best way to reorganize images that doesn’t sacrifice page layout, but decreases the number of http requests it takes to load a web page (thus decreasing page load time). Since I can’t do this presentation justice you’ll just have to check out the spriteme link: http://spriteme.org

Phone Gab – Brian Leroux

This presentation started by explaining the problems with mobile phone development (behind the times, several mobile platforms … iPhone, Palm Pre, Android, etc.) and how PhoneGap can help solve these problems. Presenter went into some detail presenting the highlights and relative low-lights of PhoneGap.

The highlights included that PhoneGap is open source, can handle mobile development on multiple platforms, and every app can be written in html, css and javascript while still taking advantage of each platforms strengths. The low-lights being lack of testing and documentation, which were mostly due to the developers not thinking the concept with work and thus didn’t bother. To check out their site for more information on PhoneGap: http://www.phonegap.com/

ARIA: Pushing Accessibility Even Further – Joe McCann

ADA is the least you can do. But really not that great for Ajax applications. WAI-ARIA spec is the top of the mountain. Most screen readers can handle this format.

Accessible Rich Internet Applications – addresses the accessibility of dynamic Web content for people with disabilities. This is a newer W3C standard for supporting web accessibility.

WAI-ARIA: http://www.w3.org/WAI/intro/aria.php

Slides: http://www.slideshare.net/ajaxexperience2009/joe-mc-cann-tae-aria-presentation

Progressive Enhancement

All the presenters that dealt with any JavaScript or front end enhancements consistently talked about Progressive Enhancement. It’s a pretty interesting topic that I haven’t been incorporating in my development up until this point. In fact, I didn’t even know much about it until this conference. So I pulled the following link, which I thought gave a good explanation. I’m totally on the Progressive Enhancement boat. I love the concept of producing HTML as dumb as possible then use CSS and JavaScript to add functionality based on browser functions rather then user-agent.

Ajax Experience 2009 … Day 2

On day 2 of the Ajax Experience it started out with a presentation on ECMAScript Harmony and the Future of JavaScript. This presentation went into a lot of detail on the new standards in JavaScript. However, it didn’t cover the newer features.

I also attended a presentation on Web Compatibility and Performance Testing given by Imad Mouline and Ryan Breen of Gomez Inc. This was a good presentation on evaluating browser speeds. Not surprised to see that Google Chrome and Apple Safari showed the fastest browser times and that IE and Firefox were the slowest. This session also covered topics such as time to first byte and domain sharding.

Just after lunch I hit the vendor session IE8 given by Chris Bowen. This was a quick session by nature (all the vendor tech sessions were only a half hour). Chirs did a good job of showing the new developer tools in IE8. Two things I was glad to see is that the developer tools are finally on par with those offered by Firebug and that IE8 can emulate IE7.

The highlight on the second day for my money was Object Oriented CSS given by Nicole Sullivan.  The presentation offered a shift away from how I normally think of CSS (styling by element) to focusing on styling by class. The benfit being smaller more managable CSS files and fewer defined styles.

• Avoid Styling by location.
• Define defaults.
• If two styles are so close (aka heading 3 and heading 4 should have more of a difference then 1 pixel) then throw one out and only use one.
• When adding classes to a style you may not know what one will take precedence.
• Slideshow

The final presentation of the day that I attended was on JavaScript patterns given by Stoyan Stefanov. This presentation quickly covered JavaScript patterns and anti-patterns. His website pretty much summed up his presentation. Also, here is the slideshow.