/**********************************
 *  GRACE Home Page Roll Over Lib
 *  
 *  Uses Scriptaculous to effect rollover
 *  on main page.
 *  
 *  By Kevin Mann
 **********************************/

// Vars for elements in page
var pane       = [];    // List of panes
var images     = [];    // List of images

// Var and consts for roll-over effects
var cur_pane   = 0;     // Current pane on top
var roll_delay = 15000; // Delay between pane refreshes
var rollTo     = 0;     // Temp var used for current roll target
var lockImages = false; // When true, clicking images has no effect
var rollID     = 0;     // ID for timeout
var h_color    = [256, 256, 256]; // RGB color code for highlight
var noh_color  = [146, 48, 17]; // RGB color code for no highlight
var current    = [
                  [0,0,0],
                  [0,0,0],
                  [0,0,0],
                  [0,0,0]
                 ];     // Current color of the border for all for panes

function rollover_load_handler(){
	// Load up panes and reverse order to get layer order
	pane   = $$('div.news-item');
	pane.reverse();
	
	// Load images
	images = $$('div.pick img');
	
	// Set z-index on panes so they don't flash
	for(var i = 0; i < 4; i++){
		pane[i].setStyle({zIndex: (4-i)});
	}
	
	// Bind observers to links
	var links = $$('div.pick a');
	for(var i = 0; i < links.length; i++){
		links[i].observe('click', catchImageClick);
	}
	
	// Highlight first frame
	createNewTween(cur_pane, 1, 0);
	createNewTween(cur_pane, 1, 1);
	createNewTween(cur_pane, 1, 2);
	
	rollID = setTimeout(rollInOrder, roll_delay); // Start fade process
}

// Roll images in order
function rollInOrder(){
	rollOver((cur_pane+1)%4);
	rollID = setTimeout(rollInOrder, roll_delay + 1000); // Add 1 second for rollover
}

// Catch clicks
function catchImageClick(event){
	var img;
	
	event.stop(); // Stop event propagation so the link doesn't navigate
	
	if(lockImages == true) return; // Don't allow roll if locked
	img = $(event.findElement('div.pick')).down('img'); // Find image for firing event
	
	// Match image to index location in array
	for(var i = 0; i < 4; i++){
		if(img == images[i]){
			if(i == cur_pane) return; // Don't roll if we're already there
			clearTimeout(rollID);
			rollOver(i);
			rollID = setTimeout(rollInOrder, roll_delay*2+1000);
			return;
		}
	}
}

// Used to roll over to next pane
function rollOver(rollToImage){
	lockImages = true; // Lock out image rollover until rollover is complete
	rollTo = rollToImage;
	
	sortTwoForFade(cur_pane, rollToImage);
	
	pane[cur_pane].fade({ duration: 1.0, from: 1, to: 0, afterFinish: rollFinish });
	
	// Init fade from highlight to standard for currently selected
	createNewTween(cur_pane, -1, 0);
	createNewTween(cur_pane, -1, 1);
	createNewTween(cur_pane, -1, 2);
	
	// Now highlight the newly selected
	createNewTween(rollToImage, 1, 0);
	createNewTween(rollToImage, 1, 1);
	createNewTween(rollToImage, 1, 2);
}

// Function used to fade borders on images
function rollSelects(pane, index, value){
	current[pane][index] = value.round();
	//console.info("Pane: " + pane + ", Index: " + index + ", Value: " + current[pane]);
	images[pane].setStyle({border: '2px solid rgb(' + current[pane][0] + ',' + current[pane][1] + ',' + current[pane][2] + ')'});
}

// Completes roll process
function rollFinish(){
	cur_pane = rollTo;
	lockImages = false; // Release lock
}

function sortTwoForFade(top, target){
	for (var i = top; i < top+4; i++){
		if(i%4 == top) pane[i%4].setStyle({zIndex: 2, display: 'block'});
		else if(i%4 == target) pane[i%4].setStyle({zIndex: 1, display: 'block'});
		else pane[i%4].setStyle({zIndex: 0, display: 'none'});
	}
}

function createNewTween(pane, dir, index){
	if(dir == 1){ // Highlight
		new Effect.Tween(null, noh_color[index], h_color[index], { duration: 1.0 }, function(val){ rollSelects(pane, index, val); });
	}else{ // UNhighlight
		new Effect.Tween(null, h_color[index], noh_color[index], { duration: 1.0 }, function(val){ rollSelects(pane, index, val); });
	}
	
}

// Start up roll-over code
document.observe("dom:loaded", rollover_load_handler);