﻿// JScript File


var current_image = 0;
// Setup gallery panel
function gallery_setup() {


	// Setup Panel
	YAHOO.namespace("example.container");
	YAHOO.example.container.panel1 = new YAHOO.widget.Panel( "gallery_panel", {
		modal:true,
		width:"630px",
		fixedcenter:true,
		visible:false,
		constraintoviewport:true,
		close:true,
		zIndex: 1000 } );
	YAHOO.example.container.panel1.render(document.body);
	YAHOO.util.Event.addListener( 'image_gal_button1', "click", YAHOO.example.container.panel1.show, YAHOO.example.container.panel1, true);
	YAHOO.util.Event.addListener( 'image_gal_button1', "click", toggleGallery);

	YAHOO.util.Event.addListener( 'image_gal_button2', "click", YAHOO.example.container.panel1.show, YAHOO.example.container.panel1, true);
	YAHOO.util.Event.addListener( 'image_gal_button2', "click", toggleGallery);
}
// Init panel onLoad
YAHOO.util.Event.addListener(window, "load", gallery_setup);


function changeHtml(targetId, sourceElementId)
{
    document.getElementById(targetId).innerHTML = document.getElementById(sourceElementId).innerHTML;
}

function setHtml(targetId, htmlString)
{
    document.getElementById(targetId).innerHTML = htmlString;
}


function changeHtmlFromString(targetId, HTML)
{
    document.getElementById(targetId).innerHTML = HTML;
}

function setDisplay(elementId)
{
    document.getElementById(elementId).style.display = '';
}

function setDisplayNone(elementId)
{
    document.getElementById(elementId).style.display = 'none';
}

function toggleGallery()
{
    setDisplay('gallery_panel');
    cmbSlideShowSpeed = document.getElementById(cmbSlideShowSpeed.id);
    cmbSlideShowSpeed.selectedIndex = 1;
    changeHtml(pnlActiveProductInfo.id, initialProductContainer.id);
    btnStopSlideShow = document.getElementById(btnStopSlideShow.id);
    btnStartSlideShow = document.getElementById(btnStartSlideShow.id);
    btnStopSlideShow.className = "gallery_button pause";
    btnStartSlideShow.className = "gallery_button play_pressed";
    slideShowTimeout = setTimeout("startSlideShow()", getSelectedSlideShowSpeed());
    YAHOO.example.container.panel1.doCenterOnDOMEvent(); // To force firefox to center the panel vertically on show
}

var continueSlideShow = false;
var slideShowIndex = 1;
var productArray;
var slideShowTimeout;
var stripTimeout;
function startSlideShow()
{
    btnStopSlideShow = document.getElementById(btnStopSlideShow.id);
    btnStartSlideShow = document.getElementById(btnStartSlideShow.id);
    
    continueSlideShow = true;
    btnStopSlideShow.className = "gallery_button pause";
    btnStartSlideShow.className = "gallery_button play_pressed";
    productArray = getCurrentProductInfoArray();
    setTimeout("slideShow()", 1);
}

function slideShow(index)
{
    if(continueSlideShow)
    {
        
        if(productArray[slideShowIndex] != null)
        {
            displayProduct(slideShowIndex);
            slideShowIndex++;
            if(slideShowIndex < 5)
            {
                slideShowTimeout = setTimeout("slideShow()", getSelectedSlideShowSpeed());
            }
            else 
            {
                stripTimeout = setTimeout("nextStrip()", 1000);
                slideShowIndex = 0;
                slideShowTimeout = setTimeout("startSlideShow()", getSelectedSlideShowSpeed()/2);
            }   
        }else
        {
            stopSlideShow();
        }
    }
}

function displayProduct(productIndex)
{
    
    changeHtmlWithFading(pnlActiveProductInfo.id, getCurrentProductInfoArray()[productIndex]);
    setProductDataIndexLabel(getProductDataIndex(getCurrentProductInfoArray()[productIndex].id));
    setBorder(getCurrentStripImageArray()[productIndex]);
    
}

function stopSlideShow()
{
    clearTimeout(stripTimeout);
    clearTimeout(slideShowTimeout);
    btnStopSlideShow.className = "gallery_button pause_pressed";
    btnStartSlideShow.className = "gallery_button play";
    continueSlideShow = false;
}

function getModelFilterComboBoxes()
{
    var filterSelects = new Array();
    
    var selects = document.getElementsByTagName("select"); 
    var counter = 0;
    for (var i = 0; i < selects.length; i++) { 
        if(
            (selects[i].id.indexOf('ModelFilterCategory') >= 0)
            ||
            (selects[i].id.indexOf('ddlBaseColor') >= 0)
            ||
            (selects[i].id.indexOf('ddlBoutique') >= 0)
            ||
            (selects[i].id.indexOf('ddlBaseSize') >= 0)
            )
        {
            filterSelects[counter++] = selects[i];
        }
    }
    return filterSelects;
}

function prevStrip()
{
    pnlActStrip = document.getElementById(pnlActStrip.id);
    changeHtmlWithFadingById(pnlActStrip.id, pnlStrip1.id);  
    var v = setTimeout(btnPrevStripPostBackFunction, 700);
    slideShowIndex = 0;
}


function nextStrip()
{
    pnlActStrip = document.getElementById(pnlActStrip.id);
    changeHtmlWithFadingById(pnlActStrip.id, pnlStrip3.id);   
    var v = setTimeout(btnNextStripPostBackFunction, 700);
    slideShowIndex = 0;
}

function getClickedProductInfoPanel(id)
{
    for (var i = 0; i < pnlActStrip.childNodes.length; i++)
    {
        if (pnlActStrip.childNodes[i].id == id) 
        {
            return pnlActStrip.childNodes[i];
        }
    }
}
    
function getCurrentProductInfoArray()
{
    var productInfoArray = new Array(5);
    var j=0;
    for (var i = 0; i < pnlActStrip.childNodes.length; i++)
    {

        if(pnlActStrip.childNodes[i].id != null && pnlActStrip.childNodes[i].id.indexOf('productInfo') >= 0)
        {
            pnlActStrip.childNodes[i].style.display = 'none';
            productInfoArray[j]=pnlActStrip.childNodes[i];
            j++;
        }
    }
    
    return productInfoArray;
}    

function getCurrentStripImageArray()
{
    var stripImageArray = new Array(5);
    var j=0;
    for (var i = 0; i < pnlActStrip.childNodes.length; i++)
    {
        if(pnlActStrip.childNodes[i].id != null && pnlActStrip.childNodes[i].id.indexOf('stripImage') >= 0)
        {
            stripImageArray[j]=pnlActStrip.childNodes[i];
            j++;
        }
    }
    return stripImageArray;
}  

function setProductDataIndexLabel(dataIndex)
{
    lblDataIndex = document.getElementById(lblDataIndex.id);
    lblDataIndex.innerHTML = dataIndex + "/" + totalProductCount;
}

function getProductDataIndex(productElementId)
{
    var dataIndex;
    var divProductContainer = document.getElementById(productElementId);
    var  divProduct;
    for (var i = 0; i < divProductContainer.childNodes.length; i++)
    {
        if(divProductContainer.childNodes[i].id != null && divProductContainer.childNodes[i].id.indexOf('product') >= 0)
        {
            divProduct = divProductContainer.childNodes[i];
        }
    }
    
    
    for (var i = 0; i < divProduct.childNodes.length; i++)
    {
        if(divProduct.childNodes[i].id != null && divProduct.childNodes[i].id.indexOf('DataIndex') >= 0)
        {
            dataIndex = divProduct.childNodes[i].value;
        }
    }
    return dataIndex;
}


function getSelectedSlideShowSpeed()
{
    cmbSlideShowSpeed = document.getElementById(cmbSlideShowSpeed.id);
    return cmbSlideShowSpeed.value;
}

function setBorder(stripImage)
{
    stripImage = document.getElementById(stripImage.id);
    var imagesInDocument = document.getElementsByTagName('img');
    for(i = 0;i < imagesInDocument.length; i++)
    {
        if(imagesInDocument[i].id.indexOf('stripImage') >= 0 && imagesInDocument[i].id != stripImage)
        {
            imagesInDocument[i].className = 'stripImage';
        }
    }
   
    stripImage.className = 'stripImageBorder';
    
}