var ImageSwitcher = Class.create();

ImageSwitcher.prototype = {
	initialize: function(container) {
		this.container = $(container);
		this.container.addClassName('imgsw_toplevel');

		this.images = Selector.findChildElements(container, ['IMG']);
		
		this.buttonlist = $(document.createElement('DIV'));
		this.buttonlist.addClassName('imgsw_list_numbers');
		this.buttons = new Array();

		this.viewport = $(document.createElement('DIV'));
		this.viewport.addClassName('imgsw_viewport');
		
		this.container.appendChild(this.buttonlist);
		this.container.appendChild(this.viewport);
		
		for (var i = 0; i < this.images.length; ++i) {
			var button = $(document.createElement('A')).update(i);
			button.href = "#";
			this.buttons.push(button);
			button.observe('click', this.buttonClicked.bind(this, button));
			this.buttonlist.appendChild(button);
			
			var img = this.container.removeChild(this.images[i]);
			img.hide();
			this.viewport.appendChild(img);
		}
			
		this.buttonClicked(this.buttons[0]);
	},
	
	buttonClicked: function(btn) {
		for (var i = 0; i < this.images.length; ++i) {
			if (this.buttons[i] == btn) {
				this.images[i].show();
				this.buttons[i].addClassName('active');
			} else {
				this.images[i].hide();
				this.buttons[i].removeClassName('active');
			}
		}
		
		return false;
	}
};