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 = prototypeJs(productListItem.variant1ListClientId);
    var variant2List = prototypeJs(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 = prototypeJs(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 = prototypeJs(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 = prototypeJs(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 = prototypeJs(this.variant2ListClientId);
                    var currentImage = Event.element(event);
                    if (prototypeJs(currentImage).hasClassName('ImageThumbBorder'));
                    prototypeJs(currentImage).removeClassName('ImageThumbBorder');
                    var variantWrapper = prototypeJs(currentImage).up('.VariantRadioButtons');
                    if (variantWrapper != null) {
                        var selectedImages = prototypeJs(variantWrapper).select('.ImageThumbBorderOn');
                        for (var i = 0; i < selectedImages.length; i++) {
                            prototypeJs(selectedImages[i]).removeClassName('ImageThumbBorderOn');
                            prototypeJs(selectedImages[i]).addClassName('ImageThumbBorder');
                        }
                    }
                    prototypeJs(currentImage).addClassName('ImageThumbBorderOn');

                    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 = prototypeJs(this.priceClientId);
    var saleprice = prototypeJs(this.salepriceClientId);
    var memberprice = prototypeJs(this.memberpriceClientId);
    var membersaleprice = prototypeJs(this.membersalepriceClientId);
    var pricebreaks = prototypeJs(this.pricebreaksClientId);


    var pdata = this.productData[dropdown.value];
    if (this.imageLinkClientId != "") {
        if (typeof (changeDisplayImageObject) == 'undefined')
            ChangeDisplayImage(this.imageLinkClientId, pdata[6]);
        else
            changeDisplayImageObject.ChangeBaseImage(this.imageLinkClientId, pdata[6]);
    }

    var thumbnailLink = prototypeJs(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 = prototypeJs(pdata[8]);
    if (bestPrice) bestPrice.removeClassName("NotBestPrice");

    var stockLevel = prototypeJs(this.stockLevelClientId);
    if (stockLevel) {
        var showStockLevel = Boolean.parse(pdata[9].toLowerCase());
        if (showStockLevel) {
            prototypeJs(stockLevel).show();
        }
        else {
            prototypeJs(stockLevel).hide();
        }
    }
}

function Variation1_RadioClick(value, productListItem, index) {
    var variant1List = prototypeJs(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 = prototypeJs(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 = prototypeJs(productListItem.variant1ListClientId).options.length;
    var imageRadio;

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

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

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

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

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



function SetShoppingCartVariant2RadioButton(i, productListItem) {
    if (productListItem.selector2Type == 2) {
        var variant2List = prototypeJs(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 = prototypeJs(imageVariant2RadioId);
        if (variant2Image != null)
            variant2Image.className = 'ImageThumbBorderOn';


    }

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


function ChangeDisplayImage(imageWrapperClientId, imgSrc) {
    var imageLink = prototypeJs(imageWrapperClientId);
    if (imageLink) {
        var images = imageLink.getElementsByTagName('img');
        if (images.length > 0)
            images[0].src = imgSrc;

        var links = imageLink.getElementsByTagName('a');
        if (links.length > 0) {
            var linkImageHref = links[0].href;
            var strArray = imgSrc.toQueryParams();
            var imageId = strArray['ImageId'];
            var realImageHref = '';
            if (imageId != 'undefined' && imageId != null && imageId > 0) {
                realImageHref = linkImageHref.substring(0, linkImageHref.indexOf('?')) + '?ImageId=' + imageId;
                links[0].href = realImageHref;
            }
        }
    }
}

function ShowReviewForm(reviewFormTabClientId, showList) {
    var reviewForms = prototypeJs(reviewFormTabClientId).select('.ReviewForm');
    if (reviewForms.length > 0) {
        if (showList)
            prototypeJs(reviewForms[0]).hide();
        else
            prototypeJs(reviewForms[0]).show();
    }

    var reviewList = prototypeJs(reviewFormTabClientId).select('.ReviewLists');
    if (reviewList.length > 0) {
        if (showList)
            prototypeJs(reviewList[0]).show();
        else
            prototypeJs(reviewList[0]).hide();
    }
}

function ShowReviewTabAndForm(reviewTabHeadTitleId, reviewFormTabClientId, showList) {
    var reviewTabHeadTitle = prototypeJs(reviewTabHeadTitleId);
    var tabTarget = prototypeJs('TabTarget');
    if (tabTarget != null && reviewTabHeadTitle != null) {
        var LiTags = tabTarget.select('li');
        for (var i = 0; i < LiTags.length; i++) {
            var aTags = LiTags[i].select('a');
            if (aTags.length > 0) {
                var spanTags = aTags[0].select('span');
                if (spanTags.length > 0) {
                    if (spanTags[0].textContent == reviewTabHeadTitle.textContent) {
                        if (tabs != null)
                            tabs.selectTab(i);
                    }
                }
            }
        }
    }
    ShowReviewForm(reviewFormTabClientId, showList);
}

function OpenRateThisModalBox(rateThisDivClientId, frameUrl) {
    var rateFrame = prototypeJs(rateThisDivClientId);
    if (rateFrame != null && rateFrame != 'undefined') {
        rateFrame.src = frameUrl;
        Modalbox.show(prototypeJs(rateThisDivClientId), { title: 'Rate This Product', width: 400, height: 150 });
    }
}

function UpdateRateThis(rating, voteCount) {
    var averageWrapper = prototypeJs(document.body).select('.AverageRating');
    if (averageWrapper.length > 0) {
        var rateControls = averageWrapper[0].select('.RateControl');
        if (rateControls.length > 0) {
            var rate = prototypeJs(rateControls[0]).select('div');
            if (rate.length > 0) {
                var clientId = rate[0].identify();
                var telerikRateControl = $find(clientId);
                telerikRateControl.set_value(rating);
                var prototypeRateControl = prototypeJs(clientId);
                var liControls = prototypeRateControl.select('.rrtSelected');
                for (var i = 0; i < liControls.length; i++) {
                    var aLinks = prototypeJs(liControls[i]).select('a');
                    if (aLinks.length > 0) {
                        aLinks[0].setAttribute('title', rating.toFixed(1));
                    }
                }
            }
        }

        var rateResults = averageWrapper[0].select('.RateResult');
        if (rateResults.length > 0) {
            var result = prototypeJs(rateResults[0]).select('span');
            if (result.length > 0) {
                prototypeJs(result[0]).innerHTML = 'Based on ' + voteCount + ' Votes';
            }
        }
    }
}