window.addEvent('domready', function() {

	var imgs = $ES('img', 'menu')
	var divs = $ES('div', 'frame')
	
	imgs.forEach(function(el,index){
		
		var img = el;
		
 		    img.addEvent('mouseover', function() {
 		    if (img.hasClass('aktywna')){ } else {
      			var imgsrc = this.getProperty('src');
			    var imgsrcsubstr = imgsrc.lastIndexOf("/");
      			var newsrc = imgsrc.substring(0,imgsrcsubstr+1)+imgsrc.substring(imgsrcsubstr+1,imgsrcsubstr+3)+'a.png';
      			this.setProperty('src',newsrc);
      		}
    		})
    		img.addEvent('mouseout', function() {
 		    if (img.hasClass('aktywna')){ } else {
      			var imgsrc = this.getProperty('src');
      			var imgsrcsubstr = imgsrc.lastIndexOf("/");
      			var newsrc = imgsrc.substring(0,imgsrcsubstr+1)+imgsrc.substring(imgsrcsubstr+1,imgsrcsubstr+3)+'.png';
      			this.setProperty('src',newsrc);
      		}
    		})
		    img.addEvent('click', function() {
 		    if (img.hasClass('aktywna')){ } else {

				imgs.forEach(function(eel){
					eel.setProperty('src', eel.getProperty('src').replace('aaa',''));
				})

				divs.setStyle('display','none');
				divs[index].setStyle('display','block');

			    var imgsrc = this.getProperty('src');
			    var imgsrcsubstr = imgsrc.lastIndexOf("/");
      			var newsrc = imgsrc.substring(0,imgsrcsubstr+1)+imgsrc.substring(imgsrcsubstr+1,imgsrcsubstr+3)+'aaa.png';
      			this.setProperty('src',newsrc);
      			
      			imgs.removeClass('aktywna');
      			img.addClass('aktywna');
      			
      		}
    		})

	})
	
})