﻿// display.js
//
// all display functions for the dft website

/* on load jargon */
var divid = 'featurettecontent';
var imageid = 'featurettebgimg';
var transitionTimer;

var bgarr = new Array();
bgarr[0] = new Image(720,258);
bgarr[0].src = 'images/featurette0.jpg';
bgarr[1] = new Image(720,258);
bgarr[1].src = 'images/featurette1.jpg';
bgarr[2] = new Image(720,258);
bgarr[2].src = 'images/featurette2.jpg';
var featuretteState = 0;

function featuretteOnLoad()
{
    addFeaturetteClickEvents();
    setTransitionTimer();
}
/* end on load jargon */


/* featurette functions */
function setTransitionTimer()
{
    transitionTimer = setInterval('swapFeaturetteImages(true)', 10000);
}

function resetTimerOnClick()
{
    clearInterval(transitionTimer);
    setTransitionTimer();
}

function changeOpac(opacity, id) 
{
    var object = document.getElementById(id);
    YAHOO.util.Dom.setStyle(object, 'opacity', opacity/100);
}

/* param fb - 1 = forward or 0 = backward, state is optional */
function swapFeaturetteImages(fb, state) 
{    
    resetTimerOnClick();
    
    var speed = Math.round(300 / 100);
    var timer = 0;

    // remove events to prevent glitch in animation
    YAHOO.util.Event.removeListener('fwdarrow', "click");
    YAHOO.util.Event.removeListener('bkwdarrow', "click");
    YAHOO.util.Event.removeListener('f0', "click");
    YAHOO.util.Event.removeListener('f1', "click");
    YAHOO.util.Event.removeListener('f2', "click");
     
    //set the current image as background
    document.getElementById(divid).style.backgroundImage = "url(" + document.getElementById(imageid).src + ")";
    
    //make image transparent
    changeOpac(0, imageid);
    var hideelms = YAHOO.util.Dom.getElementsByClassName('f'+featuretteState.toString(), '*', document.getElementById(divid));
    for (var i = 0; i < hideelms.length; i++)
    {
        hideelms[i].style.display = 'none';
    }    
    // change bullet color
    var oldBullet = document.getElementById(divid).getElementsByTagName('a')[featuretteState+1];   // add one due to elements offset
    oldBullet.style.color = '#FFFFFF';
    
    //make new image
    (!isNaN(state))
        ? featuretteState = state
        : (fb == true) ? featuretteState++ : featuretteState--;  
    if (featuretteState >= bgarr.length)
    {
        featuretteState = 0;
    }
    if (featuretteState < 0)
    {
        featuretteState = bgarr.length-1;
    }
    document.getElementById(imageid).src = bgarr[featuretteState].src;
    var showelms = YAHOO.util.Dom.getElementsByClassName('f'+featuretteState.toString(), '*', document.getElementById(divid));
    for (var i = 0; i < showelms.length; i++)
    {
        if(showelms[i].tagName != 'A')
            showelms[i].style.display = 'block';
        else
            showelms[i].style.display = 'inline';            
    }
    // change bullet color
    var newBullet = document.getElementById(divid).getElementsByTagName('a')[featuretteState+1];   
    newBullet.style.color = '#000066';
    
    //fade in image
    for(var i = 0; i <= 100; i++) 
    {
        setTimeout("changeOpac(" + i + ",'" + imageid + "')",(timer * speed));
        timer++;
    }
    
    // add events back to buttons after animation has completed
    setTimeout('addFeaturetteClickEvents()',(timer * speed));
}

function addFeaturetteClickEvents()
{
    YAHOO.util.Event.addListener('fwdarrow', "click", function(e) {swapFeaturetteImages(true); featuretteOnClick();});
    YAHOO.util.Event.addListener('bkwdarrow', "click", function(e) {swapFeaturetteImages(false); featuretteOnClick();});
    YAHOO.util.Event.addListener('f0', "click", function(e) {swapFeaturetteImages(true, 0); featuretteOnClick();});
    YAHOO.util.Event.addListener('f1', "click", function(e) {swapFeaturetteImages(true, 1); featuretteOnClick();});
    YAHOO.util.Event.addListener('f2', "click", function(e) {swapFeaturetteImages(true, 2); featuretteOnClick();});
}

function featuretteOnClick()
{
    resetTimerOnClick();
}
/* end featurette functions */


/* general form functions */
function changeInputBg(elm, isFocus)
{
    if (isFocus)
    {
        YAHOO.util.Dom.setStyle(elm, 'background', '#FFFF99');
    }
    else
    {
        YAHOO.util.Dom.setStyle(elm, 'background', '#FFFFFF');        
    }
}
