/* This lives here because it's served in several places - VDP, DDA, inView, etc. */
var popwin = null;
//function openPopWin(winURL,winWidth,winHeight) {
//    var winOptions = 'menubar=no,toolbar=no,location=no,directories=no,status=no,scrollbars=yes,resizable=yes,width=' + winWidth + ',height=' + winHeight;
//    popwin = window.open(winURL, 'pgp', winOptions);
//}

var myImages = new Array(); // Populated with preloaded images. Reference this array source to avoid "blank" images. Just swapping out based on source string was producing blank or half loaded images for some odd reason in IE (interaction with fade filter?).

var transformFilterType = 'Fade'; // IE activeX image transitions
/* Transitions available...
 * Blinds Checkerboard Fade GradientWipe Inset Iris Pixelate RadialWipe
 * RandomBars RandomDissolve Slide Spiral Stretch Strips Wheel ZigZag
*/

var currentSelectionIndex = 0; // Current index of visible medium image
var dealerPixelsToMove = 8; // How many pixels to move each iteration
var dealerSpeed = 0; // How fast to execute each iteration in milliseconds
var dealerPixelsPerClick = 400; // How far to move layer on each click - width of image block of 9.
var dealerLefttime,dealerRighttime; // Timeout containers
var leftEdgeOfThumbLayer = 0; // The value of the left edge of the thumbnail layer (current or sliding toward)
var currentTopLeftThumb = 0; // Current visible top left thumbnail - ex: 0,8,17, etc.
var pages = 1; // How many pages of 9 thumbnails available - get's set in JSP based on image array list length.

/* Basic image swap - with activeX filter for image transitions in IE for nice touch */
function swapImg(img) {
    if (currentSelectionIndex != img) {
        var ele = document.getElementById('thumb' + currentSelectionIndex);
        ele.style.borderColor = '#ccc';
    }
    currentSelectionIndex = img;
    if (document.images['img1'].filters) {
       document.images['img1'].filters['DXImageTransform.Microsoft.' + transformFilterType].apply();
    }
    document.images['img1'].src = myImages[img].src;
    if (document.images['img1'].filters) {
        document.images['img1'].filters['DXImageTransform.Microsoft.' + transformFilterType].play();
    }
    var ele = document.getElementById('thumb' + img);
    ele.style.borderColor = '#f60';
}
/* Handle hover states of images */
function hoverState(img,active) {
    if (currentSelectionIndex != img) {
        if (img == 'img1') {
            var ele = document.getElementById(img);
        } else {
            var ele = document.getElementById('thumb' + img);
        }
        if (active) {
            ele.style.borderColor = '#f60';
        } else {
            ele.style.borderColor = '#ccc';
        }
    }
}
/* Slide thumbnails to right - called by leftButton() */
function dealerMoveRight() {
    if (dealerLefttime) clearTimeout(dealerLefttime);
    var ele = document.getElementById('thumbRow');
    if (parseInt(ele.style.left) < leftEdgeOfThumbLayer) {
        if (parseInt(ele.style.left) + dealerPixelsToMove > leftEdgeOfThumbLayer) {
            ele.style.left = leftEdgeOfThumbLayer + 'px';
            if (dealerRighttime) clearTimeout(dealerRighttime);
        } else {
            ele.style.left = (parseInt(ele.style.left)+dealerPixelsToMove) + 'px';
            dealerRighttime = setTimeout("dealerMoveRight()",dealerSpeed);
        }
    } else if (dealerRighttime) {
        clearTimeout(dealerRighttime);
    }
}
/* Slide thumbnails to left - called by rightButton() */
function dealerMoveLeft() {
    if (dealerRighttime) clearTimeout(dealerRighttime);
    var ele = document.getElementById('thumbRow');
    if (parseInt(ele.style.left) > leftEdgeOfThumbLayer) {
        if (parseInt(ele.style.left) - dealerPixelsToMove < leftEdgeOfThumbLayer) {
            ele.style.left = leftEdgeOfThumbLayer + 'px';
            if (dealerLefttime) clearTimeout(dealerLefttime);
        } else {
            ele.style.left = (parseInt(ele.style.left)-dealerPixelsToMove) + 'px';
            dealerLefttime = setTimeout("dealerMoveLeft()",dealerSpeed);
        }
    } else if (dealerLefttime) {
        clearTimeout(dealerLefttime);
    }
}
/* Handle click of Left button */
function leftButton(){    
    var ele = document.getElementById('thumbRow');
    if (currentTopLeftThumb - 9 >= 0) {
        currentTopLeftThumb -= 9;
        leftEdgeOfThumbLayer += dealerPixelsPerClick;
        dealerMoveRight();
        document.getElementById('dealerPagingStatus').innerHTML = '<strong>' + (currentTopLeftThumb + 1) + '-' + (((currentTopLeftThumb + 9) < mediumImageList.length) ? currentTopLeftThumb + 9 : mediumImageList.length) + ' of ' + mediumImageList.length + '<\/strong>';

    }
    setArrows();
}
/* Handle click of Right button */
function rightButton(){
    var ele = document.getElementById('thumbRow');
    if (currentTopLeftThumb + 9 < (pages * 9)) {
        currentTopLeftThumb += 9;
        leftEdgeOfThumbLayer -= dealerPixelsPerClick;
        dealerMoveLeft();
        document.getElementById('dealerPagingStatus').innerHTML = '<strong>' + (currentTopLeftThumb + 1) + '-' + (((currentTopLeftThumb + 9) < mediumImageList.length) ? currentTopLeftThumb + 9 : mediumImageList.length) + ' of ' + mediumImageList.length + '<\/strong>';
    }
    setArrows();
}
/* Manage Arrow states - on or off */
function setArrows() {
    var leftArrow = document.getElementById('dealerLeftArrow');
    var rightArrow = document.getElementById('dealerRightArrow');

    if (currentTopLeftThumb+1 <= (pages * 9) - 9) {
        document.images['dealerRightArrowImg'].src = '/img/dealer/btn_next_on_26x17.gif';
        rightArrow.className = 'onArrow';
    } else {
        document.images['dealerRightArrowImg'].src = '/img/dealer/btn_next_off_26x17.gif';
        rightArrow.className = 'offArrow';
    }
    if (currentTopLeftThumb > 0) {
        document.images['dealerLeftArrowImg'].src = '/img/dealer/btn_prev_on_26x17.gif';
        leftArrow.className = 'onArrow';                
    } else {
        document.images['dealerLeftArrowImg'].src = '/img/dealer/btn_prev_off_26x17.gif';
        leftArrow.className = 'offArrow';
    }
}
/* Preload medium images */
function preloadImages() {
    // mouseover arrow images
    var arrow = new Image();
    arrow.src = '/img/dealer/btn_prev_on_26x17.gif';
    var arrow2 = new Image();
    arrow2.src = '/img/dealer/btn_next_off_26x17.gif';

    for (var i=0; i < mediumImageList.length; i++) {
        myImages[i] = new Image();
        myImages[i].src = mediumImageList[i];
    }
}