1const fortuneWheel = function($self) { 2 3 let $block = $self.find('.decor-wrap-popup .fortune-wheel'); 4 if ($block.length) { 5 $block.each(function() { 6 let $this = $(this); 7 var parent = $this.closest('.lpc-block'); 8 var parentId = parent.attr('id'); 9 10 var padding = { 11 top: 0, 12 right: 0, 13 bottom: 0, 14 left: 0 15 }, 16 w = 460 - padding.left - padding.right, 17 h = 460 - padding.top - padding.bottom, 18 r = Math.min(w, h) / 2, 19 rotation = 0, 20 oldrotation = 0, 21 picked = 100000, 22 oldpick = [], 23 rotate = 0, 24 spinDuration = 5000, 25 color = d3.scale.category20(); //category20c() 26 var form = parent.find('form'); 27 var sendText = parent.find('.question__after-send').data('send-text'); 28 var checkPopupBlock = parent.attr('data-popup-block'); 29 var popupBlockBtn = parent.find('.lpc-popup-fortune__custom-btn'); 30 31 function hexToRgb(hex) { 32 // УдалÑем возможнÑй Ñимвол # 33 hex = hex.replace(/^#/, ''); 34 35 // ÐÑовеÑÑем налиÑие коÑÑекÑной Ð´Ð»Ð¸Ð½Ñ 36 if (hex.length !== 6) { 37 throw new Error('ÐепÑавилÑнÑй ÑоÑÐ¼Ð°Ñ ÑеÑÑнадÑаÑеÑиÑного ÑвеÑа. ÐжидаеÑÑÑ ÑоÑÐ¼Ð°Ñ "#RRGGBB".'); 38 } 39 40 // Разбиваем на ÑоÑÑавлÑÑÑие R, G и B 41 const r = parseInt(hex.slice(0, 2), 16); 42 const g = parseInt(hex.slice(2, 4), 16); 43 const b = parseInt(hex.slice(4, 6), 16); 44 45 return { 46 r, 47 g, 48 b 49 }; 50 } 51 52 function getContrastColor(rgbStr) { 53 let customBg = hexToRgb(rgbStr); 54 let textColor = Math.round((customBg.r * 299 + customBg.g * 587 + customBg.b * 114) / 1000); 55 return (textColor > 150) ? '#000' : '#000'; 56 } 57 58 var data = $this.data("labels"); 59 data = data.replace(/,$/, ''); 60 data = JSON.parse('[' + data + ']'); 61 62 var infiniteRotate = $this.data("infinite") 63 64 var svg = d3.select('#' + parentId + ' .fortune-wheel') 65 .append("svg") 66 .data([data]) 67 .attr("width", w + padding.left + padding.right) 68 .attr("height", h + padding.top + padding.bottom); 69 70 var container = svg.append("g") 71 .attr("class", "chartholder") 72 .attr("transform", "translate(" + (w / 2 + padding.left) + "," + (h / 2 + padding.top) + ")"); 73 74 container.append("circle") 75 .attr("cx", 0) 76 .attr("cy", 0) 77 .attr("r", 230) 78 .style({ 79 "fill": "var(--primary-color-base)" 80 }); 81 82 var vis = container 83 .append("g"); 84 85 if (infiniteRotate) { 86 vis.attr("class", "infinite-rotate"); 87 } 88 89 if (data.length % 2 === 0 && data.length / 2 % 2 !== 0) { 90 rotate = 360 / data.length / 2; 91 vis.style({ 92 "rotate": rotate + "deg" 93 }); 94 } 95 96 var pie = d3.layout.pie().sort(null).value(function(d) { 97 return 1; 98 }); 99 100 // declare an arc generator function 101 var arc = d3.svg.arc().outerRadius(r); 102 103 // select paths, use arc generator to draw 104 var arcs = vis.selectAll("g.slice") 105 .data(pie) 106 .enter() 107 .append("g") 108 .attr("class", "slice"); 109 110 111 arcs.append("path") 112 .attr("fill", function(d, i) { 113 return i % 2 ? 'var(--primary-color-base)' : 'var(--primary-color-l-5)'; 114 }) 115 .attr("d", function(d) { 116 return arc(d); 117 }); 118 119 // add the text 120 arcs.append("text") 121 .attr("text-anchor", "middle") 122 .attr("class", "lp-header-text-3") 123 .style({ 124 "fill": function() { 125 // ÐолÑÑаем fill Ñ path, к коÑоÑÐ¾Ð¼Ñ Ð¾ÑноÑиÑÑÑ ÑекÑÑий ÑекÑÑовÑй ÑÐ»ÐµÐ¼ÐµÐ½Ñ 126 let pathFill = d3.select(this.parentNode).select("path").attr("fill"); 127 let pathFillColor = getComputedStyle(document.documentElement).getPropertyValue(pathFill.match(/var\((.*?)\)/)?.[1]) 128 129 console.log(pathFillColor) 130 131 return getContrastColor(pathFillColor); 132 } 133 }) 134 .text(function(d, i) { 135 return data[i].label; 136 }); 137 138 139 function beforeSubmitActions(event) { 140 event.preventDefault(); 141 container.call(spin); 142 } 143 144 145 function firstStepSpin(event) { 146 event.preventDefault(); 147 container.call(popupspin); 148 149 setTimeout(function() { 150 parent.find('.lpc-popup-fortune__step-1').hide(); 151 parent.find('.lpc-popup-fortune__step-2').show(); 152 }, 3000); 153 154 } 155 156 if (checkPopupBlock) { 157 popupBlockBtn.on('click', firstStepSpin); 158 159 localStorage.setItem('wheelActivated', 1) 160 161 form.on('submit', popupSubmit); 162 163 $('.lpc-popup-fortune__finish-btn').on('click', function() { 164 $(this).closest('.lp-popup-wrapper').find('.js-close-popup').trigger('click'); 165 }); 166 } else { 167 form.on('submit', beforeSubmitActions); 168 } 169 170 171 wrap(arcs.selectAll("text"), 140); 172 173 function wrap(text, width) { 174 175 text.each(function() { 176 var text = d3.select(this), 177 words = text.text().split(/\s+/).reverse(), 178 word, 179 line = [], 180 lineNumber = 0, 181 lineHeight = 1, // ems 182 y = text.attr("y"), 183 dy = 0, 184 tspan = text.text(null).append("tspan").attr("x", 0).attr("y", y).attr("dy", dy + "em"); 185 while (word = words.pop()) { 186 line.push(word); 187 tspan.text(line.join(" ")); 188 if (tspan.node().getComputedTextLength() > width) { 189 line.pop();
190 tspan.text(line.join(" ")); 191 line = [word]; 192 tspan = text.append("tspan").attr("x", 0).attr("y", y).attr("dy", Math.sqrt(++lineNumber) * lineHeight + dy + "em").text(word); 193 } 194 text.attr("transform", function(d) { 195 d.innerRadius = 0; 196 d.outerRadius = r; 197 d.angle = (d.startAngle + d.endAngle) / 2; 198 return "rotate(" + (d.angle * 180 / Math.PI - 90 + 1.75 - lineNumber * 2) + ")translate(" + (d.outerRadius - 90) + ")"; 199 }) 200 } 201 }); 202 } 203 204 205 function spin(d) { 206 207 container.on("click", null); 208 209 //all slices have been seen, all done 210 //console.log("OldPick: " + oldpick.length, "Data length: " + data.length); 211 if (oldpick.length == data.length) { 212 container.on("click", null); 213 return; 214 } 215 216 var ps = 360 / data.length, 217 pieslice = Math.round(1440 / data.length), 218 219 rng = Math.floor((Math.random() * 1440) + 360); 220 221 rotation = (Math.round(rng / ps) * ps); 222 223 picked = Math.round(data.length - (rotation % 360) / ps); 224 picked = picked >= data.length ? (picked % data.length) : picked; 225 226 227 if (oldpick.indexOf(picked) !== -1) { 228 d3.select(this).call(spin); 229 return; 230 } else { 231 oldpick.push(picked); 232 } 233 234 rotation += 90 - Math.round(ps / 2) - rotate; 235 236 if (infiniteRotate) { 237 setTimeout(function() { 238 vis.attr("class", "stop-rotate"); 239 }, 2600); 240 } 241 242 243 vis.transition() 244 .style({ 245 "animation-duration": "2.9s" 246 }) 247 .duration(spinDuration) 248 .attrTween("style", rotTween) 249 .each("end", function() { 250 251 //mark question as seen 252 d3.select('#' + parentId + ' .slice:nth-child(' + (picked + 1) + ') path') 253 .attr("fill", "var(--primary-color-d-10)"); 254 255 d3.select('#' + parentId + ' .slice:nth-child(' + (picked + 1) + ') text').style({ 256 "fill": function() { 257 // ÐолÑÑаем fill Ñ path, к коÑоÑÐ¾Ð¼Ñ Ð¾ÑноÑиÑÑÑ ÑекÑÑий ÑекÑÑовÑй ÑÐ»ÐµÐ¼ÐµÐ½Ñ 258 let pathFillColor = getComputedStyle(document.documentElement).getPropertyValue('--primary-color-d-10') 259 return getContrastColor(pathFillColor); 260 } 261 }) 262 263 //populate question 264 $('#' + parentId).find('[data-alias="prize"]').val(data[picked].label); 265 266 $('#' + parentId + ' .lp-form-tpl__button').click(); 267 268 d3.select('#' + parentId + ' .question__after-send h2') 269 .text(sendText + ' ' + data[picked].label); 270 271 $('#' + parentId + ' .question__before-send').hide(); 272 $('#' + parentId + ' .question__after-send').show("slow").fadeOut; 273 $('#' + parentId + ' .question-message').hide(); 274 275 276 $('#' + parentId + ' form').hide(); 277 278 279 //container.on("click", spin); 280 }); 281 282 } 283 284 function popupSubmit(d) { 285 $('#' + parentId + ' .lp-form-tpl__button').click(); 286 287 /*d3.select('#'+parentId + ' .question__after-send h2') 288 .text(sendText + ' ' + data[picked].label);*/ 289 290 $('#' + parentId + ' .question__before-send').hide(); 291 $('#' + parentId + ' .question__after-send').hide() 292 $('#' + parentId + ' .question-message').hide(); 293 $('#' + parentId + ' form').hide(); 294 295 setTimeout(function() { 296 $('#' + parentId + ' .lpc-popup-fortune__step-2').addClass('_last-step'); 297 $('#' + parentId + ' .lpc-popup-fortune__finish-btn').show(); 298 }, 950); 299 300 } 301 302 function popupspin(d) { 303 304 container.on("click", null); 305 306 //all slices have been seen, all done 307 if (oldpick.length == data.length) { 308 container.on("click", null); 309 return; 310 } 311 312 var ps = 360 / data.length, 313 pieslice = Math.round(1440 / data.length), 314 315 rng = Math.floor((Math.random() * 1440) + 360); 316 317 rotation = (Math.round(rng / ps) * ps); 318 319 picked = Math.round(data.length - (rotation % 360) / ps); 320 picked = picked >= data.length ? (picked % data.length) : picked; 321 322 323 if (oldpick.indexOf(picked) !== -1) { 324 d3.select(this).call(spin); 325 return; 326 } else { 327 oldpick.push(picked); 328 } 329
330 //rotation += 90 - Math.round(ps / 2) - rotate; 331 rotation += 90 - Math.round(ps / 2); 332 333 if (infiniteRotate) { 334 vis.attr("class", "stop-rotate"); 335 } 336 337 338 vis.transition() 339 .duration(spinDuration) 340 .attrTween("style", rotTween) 341 .each("end", function() { 342 343 //mark question as seen 344 d3.select('#' + parentId + ' .slice:nth-child(' + (picked + 1) + ') path') 345 .attr("fill", "var(--primary-color-d-10)"); 346 347 d3.select('#' + parentId + ' .slice:nth-child(' + (picked + 1) + ') text').style({ 348 "fill": function() { 349 // ÐолÑÑаем fill Ñ path, к коÑоÑÐ¾Ð¼Ñ Ð¾ÑноÑиÑÑÑ ÑекÑÑий ÑекÑÑовÑй ÑÐ»ÐµÐ¼ÐµÐ½Ñ 350 let pathFillColor = getComputedStyle(document.documentElement).getPropertyValue('--primary-color-d-10') 351 return getContrastColor(pathFillColor); 352 } 353 }) 354 355 //populate question 356 $('#' + parentId).find('[data-alias="prize"]').val(data[picked].label); 357 358 /*if(!checkPopupBlock) { 359 $('#'+parentId + ' .lp-form-tpl__button').click(); 360 361 d3.select('#'+parentId + ' .question__after-send h2') 362 .text(sendText + ' ' + data[picked].label); 363 364 $('#'+parentId + ' .question__before-send').hide(); 365 $('#'+parentId + ' .question__after-send').show(); 366 $('#'+parentId + ' .question-message').hide(); 367 368 369 $('#'+parentId + ' form').hide(); 370 }*/ 371 372 d3.select('#' + parentId + ' .question__after-send h2') 373 .text(sendText + ' ' + data[picked].label); 374 375 $('#' + parentId + ' .question__after-send').show(); 376 $('#' + parentId + ' .lpc-popup-fortune__step-2').show(); 377 378 //container.on("click", spin); 379 }); 380 381 } 382 383 //make arrow 384 svg.append("g") 385 .attr("transform", "translate(" + (w - 42) + "," + ((h / 2) - 25) + ")") 386 .append("path") 387 .attr("class", "wheel-indicator") 388 .attr("d", "M40.0261 10.6195L11.9636 23.1737C10.386 23.8795 10.386 26.1192 11.9637 26.825L40.0261 39.3793C41.3491 39.9712 42.8428 39.003 42.8428 37.5536V12.4451C42.8428 10.9957 41.3491 10.0276 40.0261 10.6195Z") 389 .style({ 390 "fill": "white" 391 }); 392 393 //draw spin circle 394 container.append("circle") 395 .attr("cx", 0) 396 .attr("cy", 0) 397 .attr("r", 20) 398 .attr("stroke", "#fff") 399 .attr("stroke-width", "7") 400 .attr("class", "inner-circle") 401 .style({ 402 "fill": "var(--primary-color-base)" 403 }); 404 405 container.append("circle") 406 .attr("cx", 0) 407 .attr("cy", 0) 408 .attr("r", 230) 409 .attr("stroke", "#fff") 410 .attr("class", "outer-circle") 411 .attr("stroke-width", "10") 412 .style({ 413 "fill": "transparent" 414 }); 415 416 function rotTween(to) { 417 var i = d3.interpolate(oldrotation % 360, rotation); 418 return function(t) { 419 return "transform: rotate(" + i(t) + "deg)"; 420 }; 421 } 422 }); 423 } 424}; 425 426 427const adaptiveBlock = function() { 428 429 let decorWrap = document.querySelector(".decor-wrap2"); 430 431 if (decorWrap) { 432 433 let decorWrapWidth = decorWrap.offsetWidth; 434 435 if (decorWrapWidth < 480) { 436 decorWrap.setAttribute("data-media-source", "media-xs"); 437 438 } else if (decorWrapWidth < 768) { 439 decorWrap.setAttribute("data-media-source", "media-sm"); 440 441 } else if (decorWrapWidth < 960) { 442 decorWrap.setAttribute("data-media-source", "media-md"); 443 444 } else if (decorWrapWidth < 992) { 445 decorWrap.setAttribute("data-media-source", "media-lg"); 446 447 } else if (decorWrapWidth < 1280) { 448 decorWrap.setAttribute("data-media-source", "media-lg"); 449 450 } else if (decorWrapWidth >= 1280) { 451 decorWrap.setAttribute("data-media-source", "media-xl"); 452 453 } 454 } 455}; 456 457document.addEventListener("DOMContentLoaded", () => { 458 let wheelTimePopup = $('.decor-wrap-popup').data('time'); 459 //if(!localStorage.getItem('wheelActivated')) { 460 461 setTimeout(function(){ 462 //$('.decor-wrap-popup').addClass('active') 463 localStorage.setItem('wheelActivated', 1) 464 }, wheelTimePopup) 465 466 window.onresize = () => { 467 adaptiveBlock() 468 } 469 470 document.querySelector('.lpc-popup-fortune__finish-btn').addEventListener('click', (e) => { 471 document.location.reload() 472 }) 473
474 document.querySelector('.lpc-popup-fortune__note').addEventListener('click', (e) => { 475 e.preventDefault() 476 window.addonStub.showMessage('ÐеÑÐµÑ Ð¾Ð´ на ÑÑÑаниÑÑ Ñ Ð¿Ð¾Ð»Ð½Ñм ÑекÑÑом пÑавил акÑий либо вÑплÑваÑÑее окно Ñ ÑекÑÑом пÑавил'); 477 }) 478 //} 479 480 $('.decor-wrap-popup .decor-wrap-popup-in .decor-wrap-close').on('click', function(){ 481 $('.decor-wrap-popup').removeClass('active') 482 }) 483 484 $('.koleso-btn a').on('click', function(){ 485 fortuneWheel($('body')) 486 $('.decor-wrap-popup').addClass('active') 487 adaptiveBlock() 488 $(window).trigger('resize') 489 }) 490})
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.