колесо на Js

[venom1996]

попытаюсь ещё объяснить, есть цельная картинка с колесом, в ней уже есть призы, то есть они нарисованы, я в js должен создать массив с темы призами которые есть на картинке, что бы потом отправлять их в crm

[рони]

venom1996,
не могу помочь

[venom1996]

if (actualDeg >= 0 && actualDeg <= 45 ) {

    gifts = '1';

} else if (actualDeg >= 45 && actualDeg <= 90 ) {

    gifts = '2';

} else if (actualDeg >= 90  &&  actualDeg <= 135) {

   gifts = '3';

} else if (actualDeg >= 135  && actualDeg <= 180) {

    gifts = '4';
    
} else if (actualDeg >= 181 && actualDeg <= 225) {
     
     gifts = '5';
  
} else if (actualDeg >= 225 && actualDeg <= 270) {
     
    gifts = '6';
    
} else if (actualDeg >= 270  && actualDeg <= 315) {

     
    gifts = '7';

} else if (actualDeg >= 315 && actualDeg < 360) {

    gifts = '8';

} else { alert('net podarka');}

решил таким костылём )

[venom1996]

только как мне теперь создать куки при нажатии на кнопку ? что бы окно не появлялось при повторном посещении пользователя ?

[рони]

что бы окно не появлялось при повторном посещении пользователя ?

(function() {
  if(localStorage.yes) return;
  localStorage.yes = 'yes';
  const wheel = document.querySelector('.wheel')

[venom1996]

рони,
нужно что бы у одного пользователь была возможно прокрутить колесо только один раз, то есть создать куку по кнопке с временем 30 дней, что бы в след раз когда он открыл сайт, сам pupup не появлялся, следовать и играть он не сможет

[venom1996]

решил проблему таким путём

(function() {
    const wheel = document.querySelector('.wheel');
    const startButton = document.querySelector('.btn1');
    var deg = 0;
    const input = document.querySelector('#popup-callback-phone');
    const inputnames = document.querySelector('#consumers-feedback-names');

    startButton.addEventListener('click', () => {
        if (input.checkValidity() & inputnames.checkValidity()) {
            startButton.style.pointerEvents = 'none';
            deg = 185;
            if(deg >= 181 && deg <= 225) {
                deg + 229;
            }
            wheel.style.transition = 'all 10s ease-out';
            wheel.style.transform = `rotate(${deg}deg)`;
            wheel.classList.add('blur');


        }
    });



    wheel.addEventListener('transitionend', () => {
      //тут делаем куку, которая создаётся при остановке колеса
        document.cookie = "played=true;max-age=3600*24*30";
        wheel.classList.remove('blur');
        startButton.style.pointerEvents = 'auto';
        wheel.style.transition = 'none';
        var actualDeg = deg % 360;
        wheel.style.transform = `rotate(${actualDeg}deg)`;

        var gifts;

        if (actualDeg >= 0 && actualDeg <= 45 ) {

            gifts = '1';

        } else if (actualDeg >= 45 && actualDeg <= 90 ) {

            gifts = '2';

        } else if (actualDeg >= 90  &&  actualDeg <= 135) {

            gifts = '3';

        } else if (actualDeg >= 135  && actualDeg <= 180) {

            gifts = '4';

        } else if (actualDeg >= 181 && actualDeg <= 225) {

            gifts = '5';

        } else if (actualDeg >= 225 && actualDeg <= 270) {

            gifts = '6';

        } else if (actualDeg >= 270  && actualDeg <= 315) {


            gifts = '7';

        } else if (actualDeg >= 315 && actualDeg < 360) {

            gifts = '8';

        } else { alert('net podarka');}
        
      $.fancybox.open($("#popup-success8"));
    document.getElementById("gifts").innerHTML = gifts;
        
    });
})();

  $.fancybox.open({
    src: "#popup-callbac",
    hash: "popup-callbac",
    afterClose: function afterClose() {
        $("#popup-calc-result .popup__in .main-calc-list").remove();
    }
});
//если кука существует, то скрываем попуп
if (getCookie("played")) {
    $.fancybox.close();
}