/****************************************************************
Swap the pictures by grabbing and changing the hrefs of the links
*****************************************************************/
function swap(pic){
        if (document.getElementById) {
//		document.getElementById('eimg').src=pic.href.replace(/large/, "small");
		document.getElementById('eimg').src="./images/products/small/" + pic.title;
                document.getElementById('eimg').removeAttribute('width');
                document.getElementById('eimg').removeAttribute('height');
		document.getElementById('eimg').title=pic.href;
                var imgs = document.getElementById('extraimgs').childNodes;
                var i; for(i=0;i<imgs.length;i++){
			if(imgs[i].className){
				imgs[i].className='';
			}
		}
		viewlarge();
                pic.className='extraactive';
                return false;
        }else {
                return true;
        }
}

/**************************************************************************
Set the 'view large' text on hover, grab and change the src to make a href
***************************************************************************/
function viewlarge(){
	main = document.getElementById('eimg');	
	if(main){
		ref = main.title;
		document.getElementById('imgawrap').href=ref;
	}
}

/*****************************************************************
Make some rules for events based upon css selectors. Lovely stuff.
*****************************************************************/
var isrule = {
	'div#extraimgs a' : function(el){
		el.onclick = function(){return swap(this);}
	}

};

/*****************************************************************
Register the rules. We love keeping the JS out of the XHTML
*****************************************************************/
Behaviour.register(isrule);
