
var Scaler = Class.create();
Scaler.prototype = {

	initialize: function (handle, track, container) {

		// Get our list of thumbnails
		this.container = $(container);
		this.thumbnails = this.container.getElementsByTagName('img');

		for (i=0; i < this.thumbnails.length; i++) 
			this.thumbnails[i].original = this.thumbnails[i].src;
		
		// Set our default options
		this.options = {
			sliderFloor:	1,
			sliderCeiling:	2.6,
			reloadat:		40,
			original:		100,
			maxwidth:		614
		};
		
		this.options.loaded = this.options.original;

		// Create the slider control
		this.slider = new Control.Slider(handle, track, { 
			axis:			'horizontal', 
			sliderValue: 	0
		});
			
		this.slider.options.onSlide = function(value) {
			this.scale(value);
		}.bind(this);

		this.slider.options.onChange = function(value) {
			this.scale(value);
		}.bind(this);
	},
	
	scale: function(value) {
		var semaphore = false;
		var size = parseInt((this.options.sliderFloor + (value * (this.options.sliderCeiling - this.options.sliderFloor))) * 100);
				
		if ((size - this.options.original) % this.options.reloadat == 0)
			var tile = size;
		else
			var tile = ((parseInt((size - this.options.original) / this.options.reloadat) + 1) * this.options.reloadat) + this.options.original;
	  
		for (i=0; i < this.thumbnails.length; i++) {
			var thumbnail = this.thumbnails[i];
			thumbnail.style.width = size + "px";
			thumbnail.style.height = size + "px";

			if (tile != this.options.loaded) {
				thumbnail.src = thumbnail.original.replace(new RegExp('=' + this.options.original, 'g'), '=' + tile);
				semaphore = true;
			}
		}
		
		if (semaphore)
			this.options.loaded = tile;		
	}
};

Event.onDOMReady(function () {
	if ($('images')) {
		var scaler = new Scaler('handle', 'track', 'images');
	}
});

