function fireEvent(element,event)
{
    if(document.createEvent)
    {
        // dispatch for firefox + others
        var evt = document.createEvent('HTMLEvents');
        evt.initEvent(event, true, true ); // event type,bubbling,cancelable
        return !element.dispatchEvent(evt);
    }
    else
    {
        // dispatch for IE
        var evt = document.createEventObject();
        return element.fireEvent('on'+event,evt)
    }
}
    
window.productListItems = new Hash();

function setProductListItemEvents(clientid)
{
    var productListItem = productListItems.get(clientid);
    var variant1List = $(productListItem.variant1ListClientId);
    var variant2List = $(productListItem.variant2ListClientId);
    
    if(variant1List != null)
    {
        if(variant2List != null)
        {
            variant1List.observe("change", ChangeVariation1.bind(productListItem));
            variant2List.observe("change", ChangePricing.bind(productListItem));
            fireEvent(variant1List, "change");
        }
        else
        {
            variant1List.observe("change", ChangePricing.bind(productListItem));
            fireEvent(variant1List, "change");
        }
    }
}

function ChangeVariation1(event) 
{
    var dropdown = Event.element(event);
                    
    var isOpera = (typeof(window.opera) != 'undefined') ? true : false;
    var isIE = (isOpera == false && (navigator.userAgent.indexOf('Internet Explorer') >= 0 || navigator.userAgent.indexOf('MSIE 7.0') >= 0)) ? true : false;

    var dropdown2 = $(this.variant2ListClientId);
    var data = this.variationData[dropdown.selectedIndex];

    dropdown2.options.length = 0;
    for(var i=0;i<data.length;i++)
        dropdown2.options[i] = new Option(data[i][1],data[i][0]);

    fireEvent(dropdown2, "change")
    if(dropdown2.style.display == 'none')
    {
        var radio = $(this.radio2ClientId);
        for(var i=radio.childNodes.length; i>0;i--)
            radio.removeChild(radio.childNodes[i-1]);

        for(var i=0; i<dropdown2.options.length; i++)
        {
            var container = document.createElement('div');
            radio.appendChild(container); 
            var button = new Element('input', 
                {
                    name: this.clientId + '_variant2',
                    type: 'radio',
                    value: i,
                    id: this.clientId + '_variant2_' + i
                }
            );
            
            container.appendChild(button);

            if(this.selector2Type == 2)
                button.setAttribute('style','display:none;');

            button.observe("click", function(event) {
                    var dropdown2 = $(this.variant2ListClientId);
                    Variation2_RadioClick(Event.element(event).value, dropdown2, this);
                }.bind(this));
                                
            if(i==0)
            {
                button.checked = true;
                Variation2_RadioClick(i, dropdown2, this);
            }

            var label = new Element("label");
            container.appendChild(label);
            if(this.selector2Type == 2)
            {   
                var image = new Element("img",
                    {
                        src: data[i][2],
                        id: this.clientId + '_variant2_image_' + i,
                        'class': '' + ((i==0) ? 'ImageThumbBorderOn' : 'ImageThumbBorder'),
                        title: data[i][1]
                    });
                    
                label.appendChild(image);
                image.observe("click", function(event) {
                        var dropdown2 = $(this.variant2ListClientId);
                        
                        var radio = Event.element(event).parentNode.parentNode.select('[type="radio"]')[0];
                        
                        Variation2_RadioClick(radio.value, dropdown2, this);
                    }.bind(this));
            }                
            else
                label.innerHTML = data[i][1];
        }
    } 
    else 
    {
        fireEvent(dropdown2, "change")
    }   
}

function ChangePricing(event) 
{
    var dropdown = Event.element(event);
    var price = $(this.priceClientId);
    var saleprice = $(this.salepriceClientId);
    var memberprice = $(this.memberpriceClientId);
    var membersaleprice = $(this.membersalepriceClientId);
    var pricebreaks = $(this.pricebreaksClientId);

    var pdata = this.productData[dropdown.value];
    var imageLink = $(this.imageLinkClientId);
    if(imageLink)
    {
        var images = imageLink.getElementsByTagName('img');
        if(images.length > 0)
            images[0].src = pdata[6];
    }
    var thumbnailLink = $(this.thumbnailLinkClientId);
    if(thumbnailLink)
    {
        var images = thumbnailLink.getElementsByTagName('img');
        if(images.length > 0)
            images[0].src = pdata[7];
    }

    if(price) 
    {
        price.innerHTML = pdata[0];
        price.addClassName("NotBestPrice"); 
        if(price.innerHTML != '') price.show(); else price.hide();
    }
    if(saleprice) 
    {
        saleprice.innerHTML = pdata[1];
        saleprice.addClassName("NotBestPrice");
        if(saleprice.innerHTML != '') saleprice.show(); else saleprice.hide();
    }
    if(memberprice)
    {
        memberprice.innerHTML = pdata[2];
        memberprice.addClassName("NotBestPrice");
        if(memberprice.innerHTML != '') memberprice.show(); else memberprice.hide();
        if(membersaleprice.innerHTML != '') membersaleprice.show(); else membersaleprice.hide();
    }
    if(membersaleprice) 
    {
        membersaleprice.innerHTML = pdata[3];
        membersaleprice.addClassName("NotBestPrice");
    }
    
    if(pricebreaks) pricebreaks.innerHTML = pdata[4];
    
    var bestPrice = $(pdata[8]);
    if(bestPrice) bestPrice.removeClassName("NotBestPrice");
    
}

function Variation1_RadioClick(value, productListItem, index)
{
    var variant1List = $(productListItem.variant1ListClientId);
    var dropdown1 = document.getElementById('" + Variant1List.ClientID + @"');
    variant1List.selectedIndex = value;
    fireEvent(variant1List, "change");
    
    if(index != null)   
        ImageRadioButtonClick(index, productListItem);
}

function Variation2_RadioClick(option, dropdown2, productListItem, index )
{
    dropdown2.selectedIndex = option;
    fireEvent(dropdown2, "change");

    if(index != null)   
        ImageRadioButtonClick(index, productListItem, true);
}  

function ImageRadioButtonClick(i, productListItem, var2Click)
{
    var var2Visible = $(productListItem.variant2ListClientId) != null;
    
    if(var2Visible==true)
    {
        if(var2Click != null)
            ImageVariant2RadioButton(i, productListItem);
        else
        {
            ImageVariant1RadioButton(i, productListItem);
            ImageVariant2RadioButton(0, productListItem);
        }
    }    
    else
    {
        ImageVariant1RadioButton(i, productListItem);
        ImageVariant2RadioButton(i, productListItem);
    }
}

function ImageVariant1RadioButton(i, productListItem)
{
    var items = $(productListItem.variant1ListClientId).options.length;
    var imageRadio;

    for(var index=0;index<items;index++)
    {
        imageRadio = $(productListItem.variant1ImageListClientId + '_Image_' + index);
        imageRadio.className = 'ImageThumbBorder';
    }

    imageRadio = $(productListItem.variant1ImageListClientId + '_Image_' + i);
    imageRadio.className = 'ImageThumbBorderOn';

    var radioControl = $(productListItem.variant1ImageListClientId + '_' + i);

    if( radioControl != null)
        radioControl.click();
}

function ImageVariant2RadioButton(i, productListItem)
{
    var variant2List = $(productListItem.variant2ListClientId);
    if(variant2List != null)
    {
      for(var index=0;index<variant2List.options.length;index++)
      {
        var variant2Image = $(productListItem.clientId + '_variant2_image_' + index);
        if (variant2Image != null)
        {
            if(i != index)
                variant2Image.className = 'ImageThumbBorder';
            else
                variant2Image.className = 'ImageThumbBorderOn';
        }
      }
    }
    var variant2Input =  $(productListItem.clientId + '_variant2_' + i);
    if (variant2Input != null)
        variant2Input.click();
 }



function SetShoppingCartVariant2RadioButton(i, productListItem)
{
    if(productListItem.selector2Type == 2)
    {
        var variant2List = $(productListItem.variant2ListClientId);
        var imageVariant2RadioId,variant2Image;
        var index;
        for(index=0;index<variant2List.options.length;index++)
        {
            imageVariant2RadioId = productListItem.clientId + '_variant2_image_' + index;
            variant2Image = document.getElementById(imageVariant2RadioId);
            if (variant2Image != null)
                variant2Image.className = 'ImageThumbBorder';
        }
        
        imageVariant2RadioId = productListItem.clientId + '_variant2_image_' + i;
        variant2Image = $(imageVariant2RadioId);
        if (variant2Image != null)
            variant2Image.className = 'ImageThumbBorderOn';
            
            
    }

    var variant2InputId = productListItem.clientId + '_variant2_' + i;
    var variant2Input = $(variant2InputId);
    if (variant2Input != null)
        variant2Input.click();
}