var Gallery = Class.create({

	/*
		Prepares all images of rel="tag" to be sent to
		the element passed as "frame" when they're clicked.
	*/

	initialize: function(frame, tag) {
	
		this.frame = $(frame);
		
		var anchors = $$('a');
		for(var i = 0; i < anchors.length; i++)
			if(anchors[i].rel.indexOf("display") != -1)
				this.primeImage(anchors[i]);
		
	},

	/*
		Simply updates the gallery image (the larger picture)
		with that of the thumbnail selected and its information.
	*/

	sendToFrame: function(photo, info) {
		this.frame.update(photo);
		this.frame.insert(info);
	},

	/*
		Sets up the passed element such that its "href"
		will be sent to the gallery frame when clicked
	*/
	primeImage: function(a) {
		var i = a.href.preloadImage(); // the image itself
		var f = a.next().innerHTML; // the photo's info
		a.observe('click', function() {
			this.sendToFrame(i, f);
		}.bindAsEventListener(this));
		a.onclick = function() { return false; }
	}

});

Event.observe(window, 'load', function() {
	new Gallery('raptor_gallery', 'display');
});

