//// JScript File
var myArray= new Array;
var CloseValue = 0;
var DelayDrawerExpand = 50;
var AnimationStep=10;
var ResponseDalay=100;

var Small=25;
var Large=195;
function ChangeImage(ImageContainer,Newfile){
    var CenteralImage = document.getElementById(ImageContainer);
    CenteralImage.src=Newfile;
}

var ExpandedIndex=0;
var AlreadyAnimating = 0;
var AllItems = 0;
var InitializedDrawer = 0;

function Expand(indx){
    ExpandedIndex=indx;    
    if (AlreadyAnimating==0&&InitializedDrawer==1){
        setTimeout("AnimationDrawer();",ResponseDalay);
        AlreadyAnimating=1;
    }
}
function Collapse(indx){
    if (AlreadyAnimating==0&&InitializedDrawer==1){
        setTimeout("AnimationDrawer();",ResponseDalay);
        AlreadyAnimating=1;
    }
}

function AnimationDrawer(){
    var indx=ExpandedIndex;    
    var Container=document.getElementById('Drawer');
    if (Container && InitializedDrawer==1){//Only when Drawer is loaded
        var counter=0;
        var change =0;
        var AllHeight=0;

        for(var i = 0; i < Container.childNodes.length; i++){
            if (Container.childNodes[i].className=='HoverItem'||Container.childNodes[i].className=='HoverItemLast'){
                var PanelToExpand=Container.childNodes[i];
                var PrevHeight;
                                
                if (PanelToExpand.clientHeight!=null)
                    PrevHeight= PanelToExpand.clientHeight;
                else
                    if (Container.childNodes[i].className!='HoverItemLast')
                        PrevHeight=Small;
                
                if (counter==indx){//expand animation
                    if (PrevHeight<Large-AnimationStep){
                        PrevHeight=PrevHeight+AnimationStep;
                        change=1;
                    }
                    else{
                       PrevHeight=Large;
                    }
                }
                else{//collapse animation
                    if (PrevHeight>Small+AnimationStep){
                        PrevHeight=PrevHeight-AnimationStep;
                        change=1;
                    }
                    else{
                        if (Container.childNodes[i].className=='HoverItemLast'){
                            
                        }else{
                            PrevHeight=Small;
                        }
                    }
                }
                if (counter<AllItems-1){
                    PanelToExpand.style.height=PrevHeight+'px';
                    AllHeight=AllHeight+PrevHeight;
                }
                else{
                    PanelToExpand.style.height=Large+'px';
                    AllHeight=AllHeight+Large;
                }
                
                counter++;
            }
        }
        
        if (change==1){
           setTimeout("AnimationDrawer();",DelayDrawerExpand);
        }
        else{
            AlreadyAnimating=0;
        }
    }
}

function InitExpand(){
    var indx=ExpandedIndex;
    var Container=document.getElementById('Drawer');
    if (Container){//Only when Drawer is loaded
        var counter=0;        
        for(var i = 0; i < Container.childNodes.length; i++){
            if (Container.childNodes[i].className=='HoverItem'||Container.childNodes[i].className=='HoverItemLast'){
                var PanelToExpand=Container.childNodes[i];
                
                if (counter==0)//expand animation
                    PanelToExpand.style.height=Large+'px';
                else//collapse animation
                    PanelToExpand.style.height=Small+'px';                
                counter++;
            }
        }
    }
    InitializedDrawer=1;
}



function OpenPage(URL){
    window.location = URL
}

function Init(){
    var Container=document.getElementById('Drawer');
    if (Container){//Only when Drawer is loaded
        var counter=0;
        for(var i = 0; i < Container.childNodes.length; i++){
            if (Container.childNodes[i].className=='HoverItem'){
                myArray[counter]=Container.childNodes[i].id;
                counter++;
            }
        }
        var ContainerHeight=(counter-1)*Small+Large;
        AllItems=counter;
        Container.style.height=ContainerHeight+'px';
    }
    //Expand(0);
    InitExpand();

}

function ShowPreview(PanelId){
    
    //
    setTimeout("ShowPreviewWithDelay('"+PanelId+"');",300);
}
function ShowPreviewWithDelay(PanelId){
    var Pn=document.getElementById(PanelId);
    Pn.style.height=22+'px';
}
function HidePreview(PanelId){
    setTimeout("HidePreviewWithDelay('"+PanelId+"');",300);
    
}
function HidePreviewWithDelay(PanelId){
    var Pn=document.getElementById(PanelId);
    Pn.style.height=0+'px';
}



//Product behavior

//Indexes the HTML elements of colors and Sizes by name (SizeIds['Red'])
var SizeIds=new Array();
var ColorIds=new Array();

//Indexes the HTML elements of colors and Sizes by number (SizeIndex[0])
var ColorIndex=new Array();
var SizeIndex=new Array();

//Table indexes the availability of products by color and size as Availability[color][size]
var Availability=new Array();

//Table to hold inventory id's for each valid conbination of color,size
var InventoryIds=new Array();
//Variable to pass inventory id to server via hidden field
var InventoryIdHF;

//Variables hold the selected values
var SelectedSize;
var SelectedColor;
var HoveredColor;
var HoveredSize;
//Pointers to index counter i,j to Availability[i][j] as Availability[ColorPointer[i]][SizePointer[j]]
var ColorPointer=new Array();
var SizePointer=new Array();

//Indeces to ColorNames
var ColorNames = new Array();
var SizeNames = new Array();

//For next image functionality by color
var ColorImages = new Array();
var SelectedImage=0;

var ImageListByColor = new Array();
var MainImage;
var SelColPanel;//Panel that shows message to select size and color
var FavoritesId;

function SelectColor(index,mytitle){
    var ColorItem;
    ColorItem=document.getElementById(ColorIndex[index]);
    if( SelectedColor || SelectedColor==0){
        PreviousSelection=document.getElementById(ColorIndex[SelectedColor]);
        PreviousSelection.className='Selector';
    }
    
    if (SelectedColor==index){
        //SelectedColor=null;     //Deselect color
        //ColorItem.className='Selector';
    }else{
        SelectedColor=index;    //Actual select
        HoverColor(index);
         ColorItem.className='SelectorSelected';
        if (SelectedSize || SelectedSize==0){
            if (!Availability[ColorPointer[SelectedColor]][SizePointer[SelectedSize]])
                SelectedSize=null;
        }        
    }
    ResetClasses();
    FillPrice();
    HoverColor(index);
    ToggleViewMoreImages();
    SelectedImage=-1;
    ChangeImage();
    document.title=mytitle;
    return false;
}

function ToggleViewMoreImages(){
    var NextImageContainer = document.getElementById("NextImageContainer");  
    if (SelectedColor!=null && SelectedColor>=0){
        var CurrentColumn=ColorImages[SelectedColor];    
        if (CurrentColumn==null || ColorImages[SelectedColor].length<=1){
            NextImageContainer.style.display='none';
        }
        else{
        NextImageContainer.style.display='block';
        }
    }
    else{
        NextImageContainer.style.display='none';
    }  
}

function ChangeImage(){
    if (SelectedColor!=null){
        var CenterImage = document.getElementById(MainImage);
        var CurrentColumn=ColorImages[SelectedColor];
        SelectedImage+=1;
        if (CurrentColumn.length>SelectedImage){
            CenterImage.src=CurrentColumn[SelectedImage];
        }
        else{
            CenterImage.src=CurrentColumn[0];
            SelectedImage=0;
        }
    }
}
function SelectSize(index){
    var SizeItem;
    SizeItem=document.getElementById(SizeIndex[index]);
    if( SelectedSize || SelectedSize==0){
        PreviousSelection=document.getElementById(SizeIndex[SelectedSize]);
        PreviousSelection.className='Selector';
    }
    
    if (SelectedSize==index){
        //SelectedSize=null;     //Deselect Size
        //SizeItem.className='Selector';
    }else{
        SelectedSize=index;    //Actual select
        HoverSize(index);
         SizeItem.className='SelectorSelected';
        if (SelectedColor || SelectedColor==0){
            if (!Availability[ColorPointer[SelectedColor]][SizePointer[SelectedSize]])
                SelectedColor=null;
        }
    }
    ResetClasses();
    FillPrice();
    HoverSize(index);
}

function FillPrice(){
    var SelectionContainer=document.getElementById("SelecedCombination");
    var FavoritesButton = document.getElementById(FavoritesId);
    var FavoritesHiddenField = document.getElementById(InventoryIdHF);
    
    var i;
    if((SelectedSize || SelectedSize==0)&&(SelectedColor || SelectedColor==0)){
        disableAnchor(FavoritesButton,false);
        toggleLayer(SelColPanel,true);
        if (FavoritesButton){
            for(var i = 0; i < FavoritesButton.childNodes.length; i++){
                if (FavoritesButton.childNodes[i].className=="InsideText"){
                    FavoritesButton.childNodes[i].style.color="#777777";
                }
            }
        }
        var PriceContainer = document.getElementById('BoldPrice');
        if (!(Availability[ColorPointer[SelectedColor]][SizePointer[SelectedSize]]==null) && PriceContainer!=null)
        PriceContainer.innerHTML=Availability[ColorPointer[SelectedColor]][SizePointer[SelectedSize]].toFixed(2) + '&euro;';
        
        if (FavoritesHiddenField)
        FavoritesHiddenField.value=InventoryIds[ColorPointer[SelectedColor]][SizePointer[SelectedSize]];
    }
    else{
        disableAnchor(FavoritesButton,true);
        toggleLayer(SelColPanel,false);
        for(var i = 0; i < FavoritesButton.childNodes.length; i++){
            if (FavoritesButton.childNodes[i].className=="InsideText"){
                FavoritesButton.childNodes[i].style.color="#BBBBBB";
            }
        }
        FavoritesHiddenField=0;
    }
    
    var SelectionText;    
    
    if (SelectedColor || SelectedColor==0)
        SelectionText= ColorNames[SelectedColor];
        else
    SelectionText=' ';
    if(SelectedSize || SelectedSize==0)
        if (SelectedColor || SelectedColor==0)
            SelectionText= SelectionText+' - '+ SizeNames[SelectedSize];
        else
            SelectionText= SizeNames[SelectedSize];
    if (SelectionContainer)
        SelectionContainer.innerHTML= SelectionText;
}

function toggleLayer( whichLayer,enableMode ){
    var elem, vis;
    elem = document.getElementById( whichLayer );
    if (elem){
        vis = elem.style;
        if(enableMode)
            vis.display='none';
        else
            vis.display='block';
    }
        //vis.display = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'block':'none';
        //vis.display = (vis.display==''||vis.display=='block')?'none':'block';
}

//Very clever and firefox friendly disable anchor where
//a backup is created in order not to lose property href
//while in firefox the disable property fails
function disableAnchor(obj, disable){
  if (obj){
      if(disable){
        var href = obj.getAttribute("href");
        if(href && href != "" && href != null){
           obj.setAttribute('href_bak', href);
        }
        obj.removeAttribute('href');
        obj.style.color="gray";
      }
      else{
        if (obj.attributes['href_bak']!=null){
            obj.setAttribute('href', obj.attributes['href_bak'].nodeValue);
            obj.style.color="blue";
        }
      }
   }
}

function HoverColor(index){
    HoveredColor=index;
    var i;
    var SizeItem;
    for(i=0;i<SizeIndex.length;i++){
        SizeItem=document.getElementById(SizeIndex[i]);
        if (!Availability[ColorPointer[index]][SizePointer[i]]){
            SizeItem.className='SelectorUnavailable';
        }
        else{
            if (i==SelectedSize)
                SizeItem.className='SelectorSelected';
            else
                SizeItem.className='Selector';
        }
    }
    //Show Correspondant image if found such
    var CenterImage = document.getElementById(MainImage);
    if (ImageListByColor.length>index)
        CenterImage.src=ImageListByColor[index];
}

function HoverSize(index){
    HoveredSize=index;
    var i;
    var ColorItem;
    for(i=0;i<ColorIndex.length;i++){
        ColorItem=document.getElementById(ColorIndex[i]);
        if (!Availability[ColorPointer[i]][SizePointer[index]]){
            ColorItem.className='SelectorUnavailable';
        }
        else{
            if (ColorItem){
                if (i==SelectedColor)
                    ColorItem.className='SelectorSelected';
                else
                    ColorItem.className='Selector';
            }
        }
    }
}
function DeHoverColor(){
    ResetClasses();
}
function DeHoverSize(){
    ResetClasses();
}

function ResetClasses(){
    var ColorItem;
    var SizeItem;
    
    //Color View
    for(i=0;i<ColorIndex.length;i++){
        ColorItem=document.getElementById(ColorIndex[i]);
        if (i==SelectedColor && ColorItem)
            ColorItem.className='SelectorSelected';
        else
            if( SelectedSize || SelectedSize==0)
                HoverSize(SelectedSize);
            else
                ColorItem.className='Selector';
    }
    
    //SizeView
    for(i=0;i<SizeIndex.length;i++){
        SizeItem=document.getElementById(SizeIndex[i]);
        if (SizeItem){
            if (i==SelectedSize)
                SizeItem.className='SelectorSelected';
            else
                if (SelectedColor || SelectedColor==0)
                    HoverColor(SelectedColor);
                else
                    SizeItem.className='Selector';
        }
    }
}
var SelectedShippingCostId;
var SelectedPayment;
var AdditionalPrice;
var ShippingCostContainer;
var FinalCostContainer;

 function SetUniqueRadioButton(current,ShippingCostId, ShippingPrice, TotalPrice, payOnline){
    for(var i = 0; i < document.forms[0].elements.length; i++){
      elm = document.forms[0].elements[i];
      if (elm.type == 'radio'){
        elm.checked = false;
      }
    }
    current.checked = true;
    
    if (SelectedShippingCostId==null)
        SelectedShippingCostId = document.getElementById('SelectedShippingCostId');
    SelectedShippingCostId.value = ShippingCostId;
    
    if (ShippingCostContainer==null)
        ShippingCostContainer = document.getElementById('ShippingCostContainer');
    
    ShippingCostContainer.innerHTML = ShippingPrice;
    
    if (FinalCostContainer==null)
        FinalCostContainer = document.getElementById('FinalCostContainer');
    
    FinalCostContainer.innerHTML = TotalPrice;
    
    var CreditCardInfo = document.getElementById('CreditCardInfo');

    if(payOnline==0){
        if (CreditCardInfo)
            CreditCardInfo.style.display='none';
    }else{
        if (CreditCardInfo)
            CreditCardInfo.style.display='';
    }
    
    /*
    
    
    
    var bPrice = document.getElementById(BearPrice);    
    if (SelectedSendMethod==null)
        SelectedSendMethod = document.getElementById('SelectedSendMethod');
    if (SelectedPayment==null)
        SelectedPayment = document.getElementById('SelectedPayment');
    if (ProductCostHF==null)
        ProductCostHF = document.getElementById('ProductCostHF');
    if (ShippingCostContainer==null)
    ShippingCostContainer = document.getElementById('ShippingCostContainer');
    
    SelectedSendMethod.value=SendMethod;
    SelectedPayment.value=PaymentType;
    
    var Metaforika=parseFloat(bPrice.value);
    var ProductPrice =parseFloat(ProductCostHF.value);
    
    ShippingCostContainer.innerHTML = Metaforika.toFixed(2) + ' &euro;';
    
    var FinalCostContainer = document.getElementById('FinalCostContainer');
    var allTogether = ProductPrice + Metaforika
    
    FinalCostContainer.innerHTML =  allTogether.toFixed(2) + ' &euro;';
    
    var SelectedSendValue = document.getElementById('SelectedSendValue');
    SelectedSendValue.value=Metaforika;
    
    var TotalEstimatedCost = document.getElementById('TotalEstimatedCost');
    TotalEstimatedCost.value=allTogether;
    
    var ProductPriceHf = document.getElementById('ProductPriceHf');
    ProductPriceHf.value=ProductPrice;
    
    var Credit0 = document.getElementById('Credit0');
    var Credit1 = document.getElementById('Credit1');
    var Credit2 = document.getElementById('Credit2');
    var Credit3 = document.getElementById('Credit3');
    if(!payOnline){
        if (Credit0)
            Credit0.style.display='none';
        if (Credit1)
            Credit1.style.display='none';
        if (Credit2)
            Credit2.style.display='none';
        if (Credit3)
            Credit3.style.display='none';

    }else{
        if (Credit0)
            Credit0.style.display='';
        if (Credit1)
            Credit1.style.display='';
        if (Credit2)            
            Credit2.style.display='';
        if (Credit3)
            Credit3.style.display='';
    }
    
    */
}