var currHomeTileIndex = '1';

function initHome(){
	$$('.hometile').each(function(elem) {
        var index = elem.getProperty('index');
        elem.addEvent('mouseenter', function() {
			homeTileEnter(index);
        });
        elem.addEvent('mouseleave', function() {
            homeTileLeave(index);
        });
		elem.addEvent('click', function() {
            homeTileClick(index);
        });
    });
}

function homeTileEnter(index){
	if(index != currHomeTileIndex){
		($('HomeTile'+index)).addClass('hometile_over');
	}
}

function homeTileLeave(index){
	if(index != currHomeTileIndex){
		($('HomeTile'+index)).removeClass('hometile_over');
	}
}

function homeTileClick(index){
	if(index != currHomeTileIndex){
		currHomeTileIndex = index;
		// clear all on states
		($('HomeTile1')).removeClass('hometile_on');
		($('HomeTile2')).removeClass('hometile_on');
		($('HomeTile3')).removeClass('hometile_on');
		($('HomeTile4')).removeClass('hometile_on');
		($('HomeTileContent1')).setStyle('display','none');
		($('HomeTileContent2')).setStyle('display','none');
		($('HomeTileContent3')).setStyle('display','none');
		($('HomeTileContent4')).setStyle('display','none');
		($('HomeTile'+index)).removeClass('hometile_over');
		// set the click states
		($('HomeTile'+index)).addClass('hometile_on');
		($('HomeTileContent'+index)).setStyle('display','block');
	}
}