(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-name');
startButton.addEventListener('click', func)
function func() {
$(document).one("сlick", ".js-form", function(e) {
var errors = 0;
var form = $(this).closest("form");
if (errors == 0) {
var b24trace = b24Tracker.guest.getTrace();
var phone = '';
phone = $(this).closest("form").find("input[name=phone]").val();
var name = '';
name = $(this).closest("form").find("input[name=name]").val(); //имя в форме
//alert(id_user);
jQuery.ajax({
type: "POST",
url: "/send",
data: {
phone: phone,
name: name,
},
});
}
});
//проверяем инпуты
if (input.checkValidity() & inputnames.checkValidity()) {
startButton.style.pointerEvents = 'none';
var x = Math.floor(Math.random() * (100)) + 1;
if ((x % 33) == 0) {
// 3 % вероятности
deg = 300;
} else if ((x % 14) == 0) {
// 7% вероятности
deg = 70;
} else if ((x % 3) == 0) {
// 30% вероятности
deg = 240;
} else {
x = Math.floor(Math.random() * (4)) + 1;
// 15 %
if (x = 1) {
//15%
deg = 150;
} else if (x = 2) {
deg = 120;
} else if (x = 3) {
deg = 30;
} else if (x = 4) {
deg = 340;
}
}
wheel.style.transition = 'all 2s ease-out';
wheel.style.transform = `rotate(${deg + 1080}deg)`;
// wheel.classList.add('blur');
startButton.removeEventListener('click', func)
}
}
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');}
document.getElementById("gifts").innerHTML = gifts;
setTimeout(function() {
document.getElementById('wheel').style = 'display:none';
document.getElementById('marker').style = 'display:none';
}, 700);
setTimeout(function() {
document.getElementById('gifts2').style = 'display: block';
}, 700);
setTimeout(function() {
document.getElementById('priz').style = 'display: content';
}, 700);
$(document).one("transitionend", ".js-form", function(e) {
var errors = 0;
var form = $(this).closest("form");
if (errors == 0) {
var b24trace = b24Tracker.guest.getTrace();
var phone = '';
phone = $(this).closest("form").find("input[name=phone]").val();
var name = '';
name = $(this).closest("form").find("input[name=name]").val(); //имя в форме
//alert(id_user);
jQuery.ajax({
type: "POST",
url: "/send",
data: {
phone: phone,
name: name,
gifts: gifts,
},
});
}
});
});
})();
$.fancybox.open({
src: "#popup-callbac",
hash: "popup-callbac",
'touch' : false,
afterClose: function afterClose() {
$("#popup-calc-result .popup__in .main-calc-list").remove();
}
});
на данный момент у меня отправляется два ajax запроса, как мне сделать что бы первый аякс сработал если событие transitionend(остановка анимации) не произошло, и если transitionend произошло, первый не отправлять, а отправлять второй