if (!gwpstyle) { var gwpstyle = document.createElement('style'); gwpstyle.textContent = ' .gwp-div { clear: both; position:relative; } .sm-gwp-img-list { width: 100%; } .sm-gwp-img-grp-title { width: 100%; text-align:left; } .sm-gwp-img-grp-list { width: 100%; } .gwp-opt:hover { background-color:#efefef; } .gwp-opt-sel:hover { background-color:#efefef; } .gwp-opt-sel { background-color:#efefef; } .gwp-opt-name { text-align: left; width: 100%; } .gwp-opt-unavailable img { filter: grayscale(100%); } .gwp-opt-title { min-height: 1em; padding: 11px 0px; } .gwp-opt-prev { position:relative; width: 100%; } .gwp-opt-prev div { position:absolute; left:-505px; width:500px; display:none; z-index:1000; border:1px solid #bcbcbc; background-color:#FFFFFF; box-shadow:3px 3px 6px #AAAAAA; } .gwp-opt-prev-title { display: block; text-align: center; } .gwp-opt { padding: 2px; border-radius: 6px; cursor: pointer; display: flex; align-items: center; gap: 8px; background: #fff; } .gwp-opt img { width: 50px; height: 50px; object-fit: cover; border-radius: 2px; } .gwp-opt div { display:inline; } .option_select { position:relative; } .gwp-selected { position: relative; padding: 0 10px 0 2px; border-radius: 3px; cursor: pointer; display: flex; align-items: center; gap: 2px; width: 100%; height: 36px; color: #111; font-family: "Lato", sans-serif; font-size: 13.33px; border: 1px solid #d8d8d8; font-weight: 300; background: transparent url("/skins/user/rwd_shoper_34/images/ico_arrow_down_small.png") no-repeat 95% 50%; } .gwp-selected:hover { background: #fff url("/skins/user/rwd_shoper_15/images/user/select_arrow.png") no-repeat scroll right center !important; border: 1px solid #ae1a28; } .gwp-selected img { width: 55px; height: 33px; object-fit: cover; border-radius: 2px; } .gwp-selected div { display:inline; } .sm-gwp-img-list { position: absolute; top: 100%; left: 0; width: 100%; border: 1px solid #d8d8d8; border-radius: 3px; margin-top: 0px; background: #fff; display: none; max-height: 170px; overflow-y: auto; z-index: 10; display:none; font-size: 13.33px; } '; document.head.appendChild(gwpstyle); } gwpNo = {1304: "0", 1303: "0", 1305: "0", 1306: "0", 340: "0", 339: "0", 338: "0", 1314: "12", 1315: "12", 1316: "0", 1009: "11", 1010: "1", 1011: "11", 1317: "7", 755: "3", 898: "1", 899: "11", 897: "11", 756: "17", 757: "1", 644: "3", 645: "14", 900: "1", 902: "1", 542: "1", 543: "1", 1322: "4", 544: "2", 1324: "1", 1323: "3", 1325: "22", 1326: "3", 1327: "21", 1328: "3", 1330: "3", 1329: "22", 1331: "7", 1333: "3", 1334: "2", 1335: "2", 1355: "1", 1356: "1", 1357: "1", 728: "", 732: "", 1370: "1", 1371: "1", 1372: "1", 1373: "1", 1374: "1", 1375: "1", 1376: "1", 1377: "1", 1378: "1", 1379: "1", 1380: "1", 1410: "1", 1411: "1", 1412: "1", 1413: "1", 1414: "1", 1415: "1", 1429: "1", 1428: "1", 1430: "1", 1422: "1", 1423: "1", 1424: "1", 1425: "1", 1426: "1", 1427: "1", 1436: "1", 1437: "1", 1438: "1", 9410: "5", 9411: "1", 9412: "1", 9413: "1", 9414: "3", 9415: "1", };var opt_list = [234,71,405,184,98,138,415,7034]; var more_txt = [], less_txt = [], optTmp = [], optTmpVal = [], isStock = 0; var changeStock = 0; var sid = '180'; var gwpurl = 'https://gwp.brweb.pl/i/180/'; var imgLimit = '3'; var moreLabel = 'więcej + '; var lessLabel = 'ukryj -'; var showMLcnt = 0; var prevMopen = ''; var selectLangVal = ['','wybierz','choose','wählen','Vybrat','vali','izvēlēties','pasirinkti','választ','vyberte si','вибрати','-1']; function showPrev(e) { e = e.querySelector('img'); if (window.innerWidth < 700) return null; var id = e.id; var aId = id.split('__'); var aSO = aId[0].split('_'); var soptid = aSO[1]; var pid = soptid; var prev_div = document.getElementById('gwp_div_preview_'+pid); prev_div.style.display = 'block'; prev_div.innerHTML = ''; setTimeout(movePrev,10,pid); } function hidePrev(e) { e = e.querySelector('img'); if (window.innerWidth < 700) return null; var id = e.id; var aId = id.split('__'); var aSO = aId[0].split('_'); var soptid = aSO[1]; var pid = soptid; var prev_div = document.getElementById('gwp_div_preview_'+pid); prev_div.style.display = 'none'; prev_div.innerHTML = ''; prev_div.style.top = '0px'; } function movePrev(pid) { var prev_div = document.getElementById('gwp_div_preview_'+pid); if (prev_div) { var imgH = prev_div.getElementsByTagName('IMG')[0]; if (!imgH) { setTimeout(movePrev,10,pid); return false; } const recti = imgH.getBoundingClientRect(); if (recti.height == 0) { setTimeout(movePrev,10,pid); return false; } var hcorr = (recti.top + recti.height - window.innerHeight + 20) * -1; hcorr = (hcorr < 0 ? hcorr : 0); if (recti.top < 20) { hcorr = (recti.top + hcorr - 20) * -1; } if (recti.top > 20 && recti.height + 40 > window.innerHeight) { hcorr = (recti.top - 20) * -1; } prev_div.style.top = hcorr + 'px'; } } function showPrevMobile(e) { setTimeout(function() { var id = e.id; var aId = id.split('__'); var aSO = aId[0].split('_'); var soptid = aSO[1]; var prev_id = 'gwp_div_preview_'+soptid; var prev_div = document.getElementById(prev_id); if (prevMopen != '' && prevMopen != prev_div) document.getElementById(prevMopen).style.display = 'none'; prev_div.style.display = 'block'; prev_div.innerHTML = ''; prev_div.style.position = 'absolute'; prev_div.style.left = '0px'; prev_div.style.bottom = '20px'; prev_div.style.margin = '0px 10px'; prev_div.style.width = 'calc(100% - 20px)'; prevMopen = prev_id; }, 100); } function hidePrevMobile(e) { var id = e.id; var aId = id.split('__'); var aSO = aId[0].split('_'); var soptid = aSO[1]; var prev_id = 'gwp_div_preview_'+soptid; var prev_div = document.getElementById(prev_id); prev_div.style.display = 'none'; prev_div.innerHTML = ''; } function hideDiv() { document.getElementById(prevMopen).style.display = 'none'; } function oClick(e,type) { e = e.querySelector('img'); if (type == 'S') { selectClick(e); } else { radioClick(e); } setTimeout(showGWP,500); } function selectClick(e) { var id = e.id; var aId = id.split('__'); var optId = aId[0].replace('option_',''); if (document.getElementById(aId[0]).value != aId[1] || document.getElementById(aId[0]).length == 1) { if (window.innerWidth < 700) showPrevMobile(e); document.getElementById(aId[0]).value = aId[1]; if (document.getElementById('gwp_div_title_'+optId)) document.getElementById('gwp_div_title_'+optId).innerHTML = e.title; if (document.getElementById('gwp_div_selected_'+optId)) { document.getElementById('gwp_div_selected_'+optId).querySelector('img').src = e.src; document.getElementById('gwp_div_selected_'+optId).querySelector('img').style.display = 'block'; document.getElementById('gwp_div_selected_'+optId).querySelector('.gwp-opt-name').innerHTML = e.title; document.getElementById('gwp_div_list_'+optId).style.display = 'none'; } } else { if (window.innerWidth < 700) hidePrevMobile(e); document.getElementById(aId[0]).selectedIndex = '0'; if (document.getElementById('gwp_div_title_'+optId)) document.getElementById('gwp_div_title_'+optId).innerHTML = ''; if (document.getElementById('gwp_div_selected_'+optId)) { document.getElementById('gwp_div_selected_'+optId).querySelector('img').src = ''; document.getElementById('gwp_div_selected_'+optId).querySelector('img').style.display = 'none'; document.getElementById('gwp_div_selected_'+optId).querySelector('.gwp-opt-name').innerHTML = '
wybierz
'; document.getElementById('gwp_div_list_'+optId).style.display = 'none'; } } document.getElementById(aId[0]).dispatchEvent(new Event('change')); var c = document.getElementsByClassName('c_' + aId[0]); for( var i = 0; i < c.length; i++){ c[i].parentElement.className = c[i].parentElement.className.replace(' gwp-opt-sel',''); if ( c[i].id == id ) { c[i].parentElement.className = c[i].parentElement.className + ' gwp-opt-sel'; } } optTmpVal[aId[0].replace('option_','')] = document.getElementById(aId[0]).value; } function radioClick(e) { var id = e.id; if (window.innerWidth < 700) showPrevMobile(e); var aId = id.split('__'); var optId = aId[0].replace('option_',''); document.getElementById(aId[0]+'_'+aId[1]).click(); if (document.getElementById('gwp_div_title_'+optId)) { document.getElementById('gwp_div_title_'+optId).innerHTML = e.title; } var c = document.getElementsByClassName('c_' + aId[0]); for( var i = 0; i < c.length; i++){ c[i].parentElement.className = c[i].parentElement.className.replace(' gwp-opt-sel',''); if ( c[i].id == id ) c[i].parentElement.className = c[i].parentElement.className + ' gwp-opt-sel'; } if (document.getElementById('gwp_div_selected_'+optId)) { document.getElementById('gwp_div_selected_'+optId).querySelector('img').src = e.src; document.getElementById('gwp_div_selected_'+optId).querySelector('img').style.display = 'block'; document.getElementById('gwp_div_selected_'+optId).querySelector('.gwp-opt-name').innerHTML = e.title; document.getElementById('gwp_div_list_'+optId).style.display = 'none'; } } function showSelectList(optId) { document.querySelectorAll('.sm-gwp-img-list').forEach(menu => { menu.style.display = 'none'; }); document.getElementById('gwp_div_selected_'+optId).style.border = '1px solid #d8d8d8'; document.getElementById('gwp_div_list_'+optId).style.display = 'block'; } document.addEventListener('click', function(event) { if (prevMopen != '') document.getElementById(prevMopen).style.display = 'none'; const isInsideSelect = event.target.closest('.gwp-selected'); if (!isInsideSelect) { document.querySelectorAll('.sm-gwp-img-list').forEach(menu => { menu.style.display = 'none'; }); } }); function showGWP() { var isLoading = 0; var isDiff = 0; opt_list.forEach(function(opt_id) { var sr = document.getElementsByName('option_'+opt_id); if (sr.length == 0) { return; } var optValue = ''; if (sr[0].id == sr[0].name ) { var optType = 'S'; var s = sr[0]; var c = s.getElementsByTagName('option'); var optValue = s.value; } else { var optType = 'R'; var s = sr[0].parentElement.parentElement; var c = sr; for( var j = 0; j < c.length; j++){ if (c[j].checked == true) { optValue = c[j].value; } } } var svalues = Array.from(s.querySelectorAll('input[type="radio"], select option')).map(el => el.value).join('|'); isDiff = (!optTmp[opt_id] || optTmp[opt_id] != svalues || optTmpVal[opt_id] != optValue) ? 1 : 0; var eStock = (optType == 'S') ? s.parentElement.className : sr[0].parentElement.className; if (eStock.indexOf('option_truestock ') != -1 && eStock.indexOf('loading') != -1) { isLoading++; } if (isDiff == 1 || changeStock == 1) { if (optType == 'R') { s.style.visibility = 'hidden'; s.style.width = '0px'; s.style.height = '0px'; s.style.position = 'absolute'; s.style.bottom = '0px'; } else { s.style.display = 'none'; } var sPreview = '', sTitle = ''; var sOptions = ''; var imgNo = 0; var optCnt = (optType == 'S') ? c.length - 1 : c.length; if (optType == 'R') { for( var j = 0; j < c.length; j++){ if (c[j].parentElement.className == 'radio-wrap none') { optCnt--; } } var rlabels = s.getElementsByTagName('label'); var rDict = new Array(); for( var rli = 0; rli < rlabels.length; rli++){ if (rlabels[1].innerHTML != '' || !rlabels[rli]) rDict[rlabels[rli].getAttribute('for')] = rlabels[rli].innerHTML; } } more_txt[opt_id] = moreLabel + (showMLcnt == 1 ? (optCnt - imgLimit + 1) : ''); less_txt[opt_id] = lessLabel + (showMLcnt == 1 ? (optCnt - imgLimit + 1) : ''); var smTitle = ''; for( var j = 0; j< c.length; j++){ if (!selectLangVal.includes(c[j].value) && c[j].parentElement.className != 'radio-wrap none') { imgNo++; var smIsSelect = ((optType == 'S' && (s.options[s.selectedIndex].value == c[j].value || s.value == c[j].value)) || (optType == 'R' && c[j].checked == true)) ? 1 : 0; smItenSelect = smIsSelect == 1 ? ' gwp-opt-sel' : ''; smItenDisplay = (imgNo < imgLimit || (imgNo == imgLimit && imgNo == optCnt)) ? 'block' : 'none'; var lastOpt = (imgNo == imgLimit - 1) ? '!important' : ''; var lastOptClass = (imgNo == imgLimit - 1) ? ' toHidden ' : ''; var lastOptId = (imgNo == imgLimit - 1) ? ' id="gwp_loi_'+oId+'" ' : ''; smItenHidden = (imgNo > imgLimit || (imgNo == imgLimit && imgNo != optCnt)) ? ' gwpHidden'+opt_id+' ' : ''; oName = (optType == 'S') ? c[j].innerText.trim() : rDict[c[j].id].trim(); oId = (optType == 'S') ? s.id : c[j].name; if (smItenSelect == ' gwp-opt-sel') { smTitle = oName; } let optHtml = '
' + oName + '
'; sOptions += optHtml; } } sPreview = '
'; if (document.getElementById('gwp_div_list_'+opt_id)) { if (document.getElementById('gwp_div_title_'+opt_id)) { document.getElementById('gwp_div_title_'+opt_id).innerHTML = sTitle; } document.getElementById('gwp_div_list_'+opt_id).innerHTML = sOptions; } else { const div_title = document.createElement('div'); const div_prev = document.createElement('div'); div_prev.id = 'gwp_div_prev_'+opt_id; div_prev.className = 'gwp-opt-prev'; div_prev.innerHTML = sPreview; const div_selected = document.createElement('div'); div_selected.id = 'gwp_div_selected_'+opt_id; div_selected.className = 'gwp-opt gwp-selected'; div_selected.innerHTML = '
wybierz
'; div_selected.setAttribute('onclick', 'showSelectList(' + opt_id + ')'); const div_list = document.createElement('div'); div_list.id = 'gwp_div_list_'+opt_id; div_list.className = 'sm-gwp-img-list'; div_list.innerHTML = sOptions; s.parentElement.appendChild(div_title); s.parentElement.appendChild(div_prev); s.parentElement.appendChild(div_list); if (div_selected) { div_list.outerHTML = div_selected.outerHTML + div_list.outerHTML; } } optTmp[opt_id] = Array.from(s.querySelectorAll('input[type="radio"], select option')).map(el => el.value).join('|'); optTmpVal[opt_id] = optValue; } }); changeStock = 0; if (isLoading > 0 || isDiff == 1) { setTimeout(showGWP,1000); } } function checkOpt() { opt_list.forEach(function(opt_id) { if (document.getElementById('option_'+opt_id)) { var sc = document.getElementById('option_'+opt_id); if (sc.value == '' || sc.value == 'wybierz' || sc.value == 'choose' || sc.value == 'wählen') { document.getElementById('gwp_div_selected_'+opt_id).style.border = '1px solid red'; } } }); } var atb = document.getElementsByClassName('addtobasket')[0]; atb.onclick = function() { checkOpt() }; window.onload = function(){ showGWP(); }; showGWP(); setTimeout(showGWP,1000);