//-- updated for jQuery 1.4

	var WorkBrowser = function (parent, $container) {
    
		var init = function () {
        	$container.empty().append(
            	$('<div />', { css: { textAlign: 'center', clear: 'both', margin: '100px auto' } })
                	.append( $('<img />', { src: 'img/loader.gif' }) )
            );
            
        	$.getJSON(
            	'/services/portfolio',
                function ( json ) {
                	config.touts = json;
                    render.init();
                }
            );
		};
        
        var render = {
        	init: function () {
            	$container.empty().append( render.browser() );
            },
            browser: function () {
            	var ret = $('<div />', { id: 'work_browser' });
                for ( var cv = 0; cv < config.touts.length; cv++)
                	ret.append( render.tout( config.touts[cv] ) );
                return ret;
            },
            tout: function (tout) {
            	return $('<div />', { 'class': 'tout inactive', mouseover: events.over, mouseout: events.out })
                	.append(
                    	$('<a />', { href: '#/portfolio/detail/' + tout })
                        	.append( $('<img />', { 'src': 'img/portfolio/touts/' + tout + '.jpg' }) )
                    );
            }
		};
		
		var config = {};
		
		var events = {
        	over: function () {
            	$(this).removeClass('inactive');
                $('.inactive').stop().animate({opacity:.75},{duration:250,easing:'none'});

            },
            out: function () {
            	$(this).addClass('inactive');
                $('.inactive').stop().animate({opacity:1},{duration:250,easing:'none'});
            }
		};
		
		init();
        
        return true;
	};