function ProductDetail_ascx_Load() {

    //accessoires, vervangend, documenten, videos, info
    switch (intInitialDetailTab) {
        case 1:
            refreshProductDetailTab('accessoires');
            break;

        case 2:
            refreshProductDetailTab('vervangend');
            break;

        case 3:
            refreshProductDetailTab('documenten');
            break;

        case 4:
            refreshProductDetailTab('videos');
            break;

        case 5:
            refreshProductDetailTab('info');
            break;

        default:
            break;
    }

    $get('divRelatedThumbnail').innerHTML='';
    ShopWebService.GetRelatedThumbnails(sid, CWDecode(strArtikelcode), GetRelatedThumbnails_callback, generic_callbackerror);
}

function GetRelatedThumbnails_callback(result) {
    strRelatedThumbImg = result;
    intRelatedThumbOffset = 0;
    
    intTotalRelatedThumbs = CARTwise.arraySize(strRelatedThumbImg);
    
    displayRelatedThumbImg();
}

function displayRelatedThumbImg() {
    var strTemplate='<div style="float:left;width:40px;height:40px;border:1px solid #e0e0e0;margin-right:1px;cursor:pointer;"\
                    onmouseover="return swapThumbnail(this,event,\'{id2}\',\'{bigimgpath}\');"><img id="{id}" src="{imgpath}" title="{title}" style="max-width:100%;max-height:100%;" /></div>';
    var strLeftButton = '<div style="float:left;width:14px;height:40px;cursor:pointer;" onclick="return moveThumbLeft();"><img src="images/main/thumb_left.png" style="margin-top:8px;" /></div>';
    var strRightButton = '<div style="float:left;width:14px;height:40px;cursor:pointer;" onclick="return moveThumbRight();"><img src="images/main/thumb_right.png" style="margin-top:8px;" /></div>';
    var strNoneButton = '<div style="float:left;width:14px;height:40px;"><img src="images/main/thumb_none.png" style="margin-top:8px;" /></div>';
    var strHTML='';
    var strTemp='';

    if (intTotalRelatedThumbs<=1) {
        strHTML='';
    } else {
        if (intRelatedThumbOffset==0) {
            strHTML += strNoneButton;
        } else {
            strHTML += strLeftButton;
        }

        for (i=0;i<4;i++) {
            if (i>=intTotalRelatedThumbs) {
                strTemp = "&nbsp;"
            } else {
            strTemp = strTemplate;
            strTemp = strTemp.replace("{id}","imgthumb_" + strRelatedThumbImg[i+intRelatedThumbOffset].ArtikelImage_PK);
            strTemp = strTemp.replace("{id2}","imgthumb_" + strRelatedThumbImg[i+intRelatedThumbOffset].ArtikelImage_PK);
            strTemp = strTemp.replace("{imgpath}", _thumbnailStub + strRelatedThumbImg[i + intRelatedThumbOffset].NormalizedArtikelcode + '/' + strRelatedThumbImg[i + intRelatedThumbOffset].Filename);
            strTemp = strTemp.replace("{bigimgpath}", _detailStub + strRelatedThumbImg[i + intRelatedThumbOffset].NormalizedArtikelcode + '/' + strRelatedThumbImg[i + intRelatedThumbOffset].Filename);
            strTemp = strTemp.replace("{title}",strRelatedThumbImg[i+intRelatedThumbOffset].Title);
            strHTML += strTemp;
            }
        }

        if (intRelatedThumbOffset+4 >= intTotalRelatedThumbs) {
            strHTML += strNoneButton;
        } else {
            strHTML += strRightButton;
        }
    }
    
    $get('divRelatedThumbnail').innerHTML=strHTML;
}

function moveThumbLeft() {
    intRelatedThumbOffset-=1;
    displayRelatedThumbImg();
}

function moveThumbRight() {
    intRelatedThumbOffset+=1;
    displayRelatedThumbImg();
}

function swapThumbnail(obj,evt,id,bigimgpath) {
    $get('cardimg_' + strArtikelcode).src=bigimgpath;
}

function selectVariant(cbo,evt) {
    ShopWebService.GetCurrentLanguageCode(function(res){window.location.href='/' + res + '/a?action=detail&artcode=' + cbo.options[cbo.selectedIndex].value + '';});
}

function refreshProductDetailTab(tabname) {
    switch (tabname) {
        case 'accessoires':
            ShopWebService.GetProductDetailTab_Accessoires(sid, CWDecode(strArtikelcode), refreshProductDetailTab_callback, generic_callbackerror, tabname);
            break;
        case 'vervangend':
            ShopWebService.GetProductDetailTab_Vervangend(sid, CWDecode(strArtikelcode), refreshProductDetailTab_callback, generic_callbackerror, tabname);
            break;
        case 'documenten':
            ShopWebService.GetProductDetailTab_Documenten(sid, CWDecode(strArtikelcode), refreshProductDetailTab_callback, generic_callbackerror, tabname);
            break;
        case 'videos':
            ShopWebService.GetProductDetailTab_Videos(sid, CWDecode(strArtikelcode), refreshProductDetailTab_callback, generic_callbackerror, tabname);
            break;
        case 'info':
            ShopWebService.GetProductDetailTab_Info(sid, CWDecode(strArtikelcode), refreshProductDetailTab_callback, generic_callbackerror, tabname);
            break;
    }
}

function refreshProductDetailTab_callback(result, tabname) {
    if($get(divProductDetail_Content_ClientID) != null)
        $get(divProductDetail_Content_ClientID).innerHTML = result;

    if ($get('divViewTabButtonAccessoires')) {
        $get('divViewTabButtonAccessoires').style.backgroundImage = "url('skins/" + _shopid + "/ViewTabs/ViewTab" + (tabname == 'accessoires' ? '_Selected' : '') + ".png')";
        $get('divViewTabButtonAccessoires').className = (tabname == 'accessoires' ? 'divViewTabs' : 'divViewTabs_dim');
    }

    if ($get('divViewTabButtonVervangend')) {
        $get('divViewTabButtonVervangend').style.backgroundImage = "url('skins/" + _shopid + "/ViewTabs/ViewTab" + (tabname == 'vervangend' ? '_Selected' : '') + ".png')";
        $get('divViewTabButtonVervangend').className = (tabname == 'vervangend' ? 'divViewTabs' : 'divViewTabs_dim');
    }

    if ($get('divViewTabButtonDocumenten')) {
        $get('divViewTabButtonDocumenten').style.backgroundImage = "url('skins/" + _shopid + "/ViewTabs/ViewTab" + (tabname == 'documenten' ? '_Selected' : '') + ".png')";
        $get('divViewTabButtonDocumenten').className = (tabname == 'documenten' ? 'divViewTabs' : 'divViewTabs_dim');
    }

    if ($get('divViewTabButtonVideos')) {
        $get('divViewTabButtonVideos').style.backgroundImage = "url('skins/" + _shopid + "/ViewTabs/ViewTab" + (tabname == 'videos' ? '_Selected' : '') + ".png')";
        $get('divViewTabButtonVideos').className = (tabname == 'videos' ? 'divViewTabs' : 'divViewTabs_dim');
    }

    if ($get('divViewTabButtonInfo')) {
        $get('divViewTabButtonInfo').style.backgroundImage = "url('skins/" + _shopid + "/ViewTabs/ViewTab" + (tabname == 'info' ? '_Selected' : '') + ".png')";
        $get('divViewTabButtonInfo').className = (tabname == 'info' ? 'divViewTabs' : 'divViewTabs_dim');
    }
}

var handlePopupTimer;
var currentSpeccode;

function popupSpec(obj, evt, speccode) {
    return false;
}

function unpopupSpec() {
    $get('divSpecPopup').style.display='none';
    return false;
}

function clickSpec(obj, evt, speccode) {
    var xb_x=0;
    var xb_y=0;
    
    //if (speccode==currentSpeccode) return;

    $get('divSpecPopup').style.display='none';
    
    currentSpeccode=speccode;
    
    if (evt.layerX) {
        //FF
        xb_x=evt.layerX;
        xb_y=evt.layerY;
    } else {
        if (/MSIE/.test(navigator.userAgent)) {
            //IE
            xb_x=evt.x;
            xb_y=evt.y;
        } else {
            //Chrome/Safari
            xb_x=evt.offsetX;
            xb_y=evt.offsetY;
        }
    }
    
    $get('divSpecPopup').style.marginTop =  (-200 + xb_y) + 'px';
    $get('divSpecPopup').style.marginLeft =  (xb_x - 180) + 'px';
    
    ShopWebService.Spec_Get(sid, speccode, Spec_GetDescription_callback, generic_callbackerror, speccode);
    //handlePopupTimer = window.setTimeout("popupSpecShow()", 10);
    return false;
}

function Spec_GetDescription_callback(result, speccode) {
    var h;
    h = "<div style=\"margin:10px;\">";
    h += "<div style=\"position:absolute;color:#a0a0a0;cursor:pointer;\" onclick=\"return printSpec('" + speccode + "');\">print</div>";
    h += "<div style=\"position:absolute;color:#a0a0a0;cursor:pointer;left:380px;\" onclick=\"return unpopupSpec();\">x</div>";
    h += "<div style>&nbsp;</div>";
    h += "<hr />";
    h += "<b>" + result.Name + "</b>";
    h += "<br /><br />";
    h += result.Description;
    h += "</div>";
    
    $get('divSpecPopup').innerHTML=h;
    $get('divSpecPopup').style.display='block';
}

function printSpec(speccode) {
    unpopupSpec();
    window.open('PrintSpec.aspx?speccode=' + speccode,'specprintwindow','width=600,height=400');
}