// WTN*mootools sample:: Image change script.(use mootools1.2)
// Copyright (c) 2008 Tenderfeel. http://tenderfeel.xsrv.jp
// MIT Style License.

window.addEvent('domready', function() {
	
	var viewarea =$('myImg'); // Main image area
	var thumb = $("thumbs").getElements("img"); // thumbnails
/*	var comment =$$('p.comment'); */
// comments element
	var mag = 5.1; //imgsize magnification
	var regrep = "_thumb"; // 	Replace name of thumbnail images
	
	//create Arrays
	var myhref = new Array();
	var mySize = new Array();
	var myalt = new Array();
	var newImg= new Array();
	
	
	
	thumb.each(function(item,i){
		myhref[i] = item.src.replace(regrep,"");
		myalt[i] = item.getProperty('alt');
		mySize[i] =item.getSize();
		newImg[i] = new Element('img',{src:myhref[i],width:(255),height:(203),alt:myalt[i]});
		
		item.addEvent('click', function(){
			viewarea.empty();
			newImg[i].set('opacity','0');
			newImg[i].inject(viewarea);
			newImg[i].fade('in');
/*			
			comment.each(function(el){
				el.setStyle('display','none');
			});
		
	*/		
	thumb.each(function(el){
				el.setStyle('border','solid 2px #fff');
			});	
			this.setStyle('border','solid 2px #000');
		/*	comment[i].setStyle('display','block');*/
		});
	});

});