var scrolly = {
	_images: new Array(),
	
	_mainImg: 0,
	
	_caroImg: 0,
	
	create: function()
	{
		// get main image element
		this._mainImg = $$('#imagebox img')[0];
		
		// carousel div
		this._caroImg = $$('#imagebox ul')[0];
		
		// don't continue if elements not found
		if((! this._mainImg)||(! this._caroImg))
		{
			alert("Main image or carousel div element not found!");
			return false;
		}
		
		// get image urls from list
		this._caroImg.cleanWhitespace().descendants().each(function(a)
							{
								var fullimage = new Image();
								fullimage.src = a.innerHTML.strip();
								
								var thumbimg = new Image();
								thumbimg.src = a.innerHTML.strip().replace(".jpg", "-thumb.jpg");
								
								var image = {full: fullimage, thumb: thumbimg};
								
								this._images.push(image);
								
								// clear list item
								a.remove();
								
								return true;
							}.bind(this));
		
		// image array should be full now
		if(this._images.length == 0)
		{
			alert("No images found, therefore unable to construct carousel");
			return false;
		}
		
		// now repopulate list, this time with image elements
		for(var i = 0, l = this._images.length; i < l; i++)
		{
			var li = new Element("li");
			
			li.observe('mouseover', function(ev)
					{
						if(ev.element().match('img'))
						{
							var img = ev.element();
						}
						else
						{
							var img = ev.element().select('img');
							
							if(img.length != 1)
								return false;
							
							img = img[0];
						}
						
						this._mainImg.src = img.src.replace("-thumb.jpg", ".jpg");
						
						
					}.bindAsEventListener(this));
			
			this._images[i].thumb.width = 100;
			
			// insert img into li
			Element.insert(li, this._images[i].thumb);
			
			// insert li into carousel list
			Element.insert(this._caroImg, li);
			
		}
		
		
		// set main image
		this._mainImg.src = this._images[0].full.src;
		
	}
	
	
}