﻿var previewLayerTimeout;
var previewSlideTimeout;
var previewFadeTimeout;
var hideMenuTimeout;

function ShowItemPreview(rowNumber, itemGroup, divHeight, imageType, ths, imageClientID)
{
	var itemImage = document.getElementById(imageClientID);
	//var ev = ths.event;
	//var img = ths.currentTarget.id; //document.getElementById(ev.currentTarget.id);
    item = itemGroup.items[itemGroup.currentItem];
    defaultItem = itemGroup.currentItem; //we store this in a local variable, otherwise it would be passed by reference
    if (item.GetImage("NAV", imageType))
    {
        HideItemPreview(rowNumber, itemGroup, divHeight, imageType, ths, imageClientID);
        document.getElementById("imgPreview_" + rowNumber).src=item.GetImage("NAV", imageType).path;
        document.getElementById("divPreviewRollout").style.display="none";
        document.getElementById("imgPreview_" + rowNumber).style.display="none";
        document.getElementById("divPreviewColor_" + rowNumber).innerHTML=item.color;
        document.getElementById("imgDummyPreview_" + rowNumber).style.display="none";
        document.getElementById("divPreviewTitle_" + rowNumber).innerHTML=itemGroup.name;
        document.getElementById("divItemPreview_" + rowNumber).style.display="none";
		
		//alert(findY(document.getElementById("divItemPreviewRel_" + rowNumber)));
		/*
        winHeight = document.documentElement.clientHeight;
        scrollAmount = (document.documentElement.scrollTop==0 ? (document.body.scrollTop>0 ? document.body.scrollTop : 0) : document.documentElement.scrollTop);
        if (findY(document.getElementById("divItemPreviewRel_" + rowNumber))+divHeight>winHeight+scrollAmount)
            document.getElementById("divItemPreview_" + rowNumber).style.top=(winHeight+scrollAmount-divHeight - 28) + "px";
        if (findY(document.getElementById("divItemPreviewRel_" + rowNumber))<scrollAmount)
            document.getElementById("divItemPreview_" + rowNumber).style.top=(scrollAmount-20)    
        */
        //alert(ths.offsetTop);
        
        document.getElementById("divItemPreview_" + rowNumber).style.top= getAbsoluteTop(ths.id)*0 - 19*0 + "px";
        document.getElementById("divItemPreview_" + rowNumber).style.left= getAbsoluteLeft(ths.id)*0 + 1*0 + "px";
        
        itemGroup.PreloadImages();
        if(itemGroup.items.length > 1)
        {
			SlideShow(rowNumber, itemGroup, defaultItem, imageType, itemImage);
		}
    }
}
document.getElementsByClassName = function(clsName){
    var retVal = new Array();
    var elements = document.getElementsByTagName("*");
    for(var i = 0;i < elements.length;i++){
        if(elements[i].className.indexOf(" ") >= 0){
            var classes = elements[i].className.split(" ");
            for(var j = 0;j < classes.length;j++){
                if(classes[j] == clsName)
                    retVal.push(elements[i]);
            }
        }
        else if(elements[i].className == clsName)
            retVal.push(elements[i]);
    }
    return retVal;
}
function HideItemPreview(rowNumber, itemGroup, divHeight, imageType, ths, imageClientID)
{
    if (previewLayerTimeout)
        clearTimeout(previewLayerTimeout);
    if (previewSlideTimeout)
        clearTimeout(previewSlideTimeout);
    if (previewFadeTimeout)
        clearTimeout(previewFadeTimeout);
    if (hideMenuTimeout)
        clearTimeout(hideMenuTimeout);

    document.getElementById("divPreviewRollout").style.display="none";
    document.getElementById("divPreviewRollout").innerHTML = "";
    elements = document.getElementsByTagName("div");
    for(i=0; i<elements.length; i++)
    {
        if (elements[i].id.indexOf("divItemPreview_")>=0)
        {
                elements[i].style.display="none";
                //elements[i].style.top="";
        } 
    }
    
    elements = document.getElementsByTagName("img");
    for(i=0; i<elements.length; i++)
    {
        if (elements[i].id.indexOf("imgDummyPreview_")>=0 || elements[i].id.indexOf("imgPreview_")>=0)
        {
                elements[i].style.display="none";
                elements[i].src = "//assets.kompo.com/SteveMadden/layout/blank.gif";
                //elements[i].style.width = "0px";
                //elements[i].style.width = "0px";
        } 
    }
    var itemImage = document.getElementById(imageClientID);
    itemImage.src = itemGroup.items[itemGroup.currentItem].GetImage("NAV", imageType).path;
//	elements = document.getElementsByClassName("previewDOMquerySel");
//	for(i=0; i<elements.length; i++)
//    {
//		elements[i].innerHTML = "";
//    }
}


function SlideShow(rowNumber, itemGroup, defaultItem, imageType, itemImage)
{
    i=defaultItem+1;
    intAlpha=0;
    
    function DoSlide()
    {
        if(itemGroup.items[i])
        {
            intAlpha=0;
            
            itemImage.src = itemGroup.items[i].GetImage("NAV", imageType).path;
            document.getElementById("imgDummyPreview_" + rowNumber).src=itemGroup.items[i].GetImage("NAV", imageType).path;
            document.getElementById("divPreviewColor_" + rowNumber).innerHTML=itemGroup.items[i].color;

            previewFadeTimeout = setTimeout(DoFade, 0);
            i++;
            previewSlideTimeout = setTimeout(DoSlide, 1000);
        }
        else
        {
            i=0;
            DoSlide();
        }
    }
    
    function DoFade()
    {
        // reveal image 1
        
//        document.getElementById("imgDummyPreview_" + rowNumber).style.filter="alpha(opacity=100)";
//        document.getElementById("imgDummyPreview_" + rowNumber).style.MozOpacity=intAlpha/20;
//        document.getElementById("imgDummyPreview_" + rowNumber).style.opacity=intAlpha/20;
          document.getElementById("imgDummyPreview_" + rowNumber).style.display="";

//        // hide image 2
//        document.getElementById("imgPreview_" + rowNumber).style.filter="alpha(opacity=" +(20-intAlpha)*5 + ")";
//        document.getElementById("imgPreview_" + rowNumber).style.MozOpacity=(20-intAlpha)/20;
//        document.getElementById("imgPreview_" + rowNumber).style.opacity=(20-intAlpha)/20;
//        document.getElementById("imgPreview_" + rowNumber).style.display="";


//        intAlpha++;
//        if (intAlpha<=20 && navigator.appName.indexOf("Internet Explorer")<0)
//        {
//            previewFadeTimeout = setTimeout(DoFade, 20);
//        }
//        else
//        {
//            // done, switch images
            document.getElementById("imgPreview_" + rowNumber).src=document.getElementById("imgDummyPreview_" + rowNumber).src;            
            document.getElementById("imgDummyPreview_" + rowNumber).style.display="none";
//        }

    }
    
    
    previewSlideTimeout = setTimeout(DoSlide,1000);
}

function imageFadeOut(img) 
{
  if ( document.all) 
  {
    img.opacity = 100;
    setOpacity(img.name, -10, 100);
  }
}

function imageFadeIn(img) 
{
  if ( document.all) 
  {
    img.opacity = 0;
    setOpacity(img.name, 10, 100);
  }
}

function setOpacity (imgName, step, delay) 
{
  var img = document.images[imgName];
  img.opacity += step;
  if (document.all) img.style.filter = 'alpha(opacity = ' + img.opacity + ')'; 
  if (step > 0 && img.opacity < 100 || step < 0 && img.opacity > 0)
    setTimeout('setOpacity("' + img.name + '",' + step + ', ' + delay + ')', delay);
} 














function doMenuHiding()
{
    //hideMenuTimeout = setTimeout(HideItemPreview, 0);
}

function clearMenuHiding()
{
    clearTimeout(hideMenuTimeout);
}

function RegisterScrollHandler()
{
	if (window.attachEvent) {
      window.attachEvent("onscroll", scrollPreviewLayer);
    }

    if (document.addEventListener) {
        document.addEventListener("scroll",   scrollPreviewLayer, false);
    }

}

function scrollPreviewLayer()
{
    scrollAmount = (document.documentElement.scrollTop==0 ? (document.body.scrollTop>0 ? document.body.scrollTop : 0) : document.documentElement.scrollTop);
    document.getElementById("divPreviewRollout").style.top = (270 + scrollAmount) + "px";
}