// Changes the border color of a given id
function changeBorder (id, color) { 
    document.getElementById(id).style.borderColor = color; 
}

// Changes the color of a given id
function changeColor (id, color) {
    document.getElementById(id).style.color = color;
}

// Changes the background color of a given id
function changeBGColor (id, color) {
    document.getElementById(id).style.backgroundColor = color;
}

// Swaps borders and images for the subnav list
function subnav (id, state) {
    if(state=='on') {
        imColor = '#b5e00b';
        navColor = '#b5e00b';
        document.images['arrow'+id].src = 'Resources/sub_arrow_on.gif';
    } else if (state=='off') {
        imColor = '#444444';
        navColor = '#ededed';
        document.images['arrow'+id].src = 'Resources/sub_arrow_off.gif';
    }
    changeBorder('thumb'+id, imColor);
    changeColor('subnav'+id, navColor);
}


function swapAltImg (image, imgwidth, id, total) {
    document.images['detailimage'].src = image;
    document.images['detailimage'].width = imgwidth;
    changeBorder('alt'+id, "#b5e00b");
    for (i=1; i<=total; i++) {
        if (i!=id) {
            changeBorder('alt'+i, "#444444");
        }
    }
}

function altThumb (id, state) {
    if(state=='on') { imColor = '#b5e00b';} 
    else if (state=='off') { imColor = '#1a1a1a';}
    changeBGColor('alt'+id, imColor);
}


// Deprecated
function subnavOld (id, imColor, navColor) {
    changeBorder('thumb'+id, imColor);
    changeColor('subnav'+id, navColor);    
}