// make up the arrays for menu and square, with implicit correspndence by array index
var square = ['topleft','topcent','topright','midleft','midcent','midright','botleft','botcent','botright'];
var menu = [  'shop',   'press',  'artists', 'contact','start',  'news',    'media',  'photos', 'releases'];

// on DOMREADY, invoke active elements on site
window.addEvent('domready', function() {    
	// Assign the proper events to each part of the square: animate the part and blend the text
	// also, add correct titles to each of the squares
	
	// for all menu entries (4: 'start' is not in the menu):
    // give the menu entries and the corresponding square there actions
	Array.each([0,1,2,3, 5,6,7,8],
	    function(index){
	        // assign actions to menu entries
	        $('menu_' + menu[index]).addEvents({
	            'mouseover': function() { hover(index); },
	            'mouseout': blendReset
	        });
	        // assign actions to corresponding square
	        $(square[index]).addEvents({
	            'mouseover': function() { hover(index); },
            	'mouseout': blendReset,
            	'click': function() { redirect(index); }
	        }).setProperty('title',menu[index]);
	    }
	);
	// [4: 'start'] is not in the menu, but needs a redirect to home page, + title attribute
	$(square[4]).addEvent('click',function(){ document.location.href='http://www.quadratisch-rekords.de'; }).setProperty('title',menu[4]);
});

// reset everything to default: no animation, no title is visible
function blendReset() {
    $$('.blend').setProperty('class','blend off');
    $$('.move').removeClass('move');
    $$('.hover').removeClass('hover');
}

// on hover: animate the assigned square part and show the title
function hover(index) {
    $('blend_'+menu[index]).setProperty('class','blend on');
    $('menu_'+menu[index]).addClass('hover');
    $(square[index]).setProperty('class','move');
}

// make the parts of the square clickable
function redirect(index){
	document.location.href=$('menu_' + menu[index]).getProperty('href');
}