628 lines
18 KiB
JavaScript
628 lines
18 KiB
JavaScript
var profilePhoto = "./img/pp.png";
|
|
var diceRollSound = null;
|
|
var countDownSound = null;
|
|
var onInvitedPage = false
|
|
var onGamePage = false
|
|
var playerType = "owner"
|
|
var yourTurn = false
|
|
var element = document.getElementById("animpath");
|
|
var pathLength = element.getTotalLength();
|
|
|
|
var continuex = true
|
|
|
|
var generalTimer = 30
|
|
var generalTimeOut
|
|
|
|
element.style.strokeDasharray = pathLength;
|
|
element.style.strokeDashoffset = pathLength;
|
|
|
|
$(document).ready(function () {
|
|
if (diceRollSound != null) {
|
|
diceRollSound.pause();
|
|
}
|
|
diceRollSound = new Howl({ src: ["sound/rollSound1.mp3"] });
|
|
diceRollSound.volume(0.7);
|
|
|
|
if (countDownSound != null) {
|
|
countDownSound.pause();
|
|
}
|
|
countDownSound = new Howl({ src: ["sound/countdown.mp3"] });
|
|
countDownSound.volume(0.2);
|
|
});
|
|
|
|
function animateRoute(e, len, breakS)
|
|
{
|
|
|
|
// Each step we decrement the dash offset
|
|
len -= 3.33;
|
|
if (len < 0)
|
|
len = 0; // clamp to minimum 0
|
|
|
|
element.style.strokeDashoffset = len;
|
|
|
|
// We need to stop looping when the length gets to 0
|
|
if (len > 0) {
|
|
generalTimer -= 1
|
|
if (generalTimer <= 0) {
|
|
generalTimer = 0
|
|
if (continuex){
|
|
if (yourTurn){
|
|
$.post(
|
|
"https://ak4y-dice/rolled",
|
|
JSON.stringify({})
|
|
);
|
|
}
|
|
}
|
|
}
|
|
$('.percentage').html(generalTimer+"Sec")
|
|
// Do another step
|
|
generalTimeOut = setTimeout(function() { animateRoute(e, len); }, 1000);
|
|
}
|
|
}
|
|
|
|
window.addEventListener("message", (event) => {
|
|
if (event.data.type === "openMenu") {
|
|
$(".notifyPage").css("display", "none");
|
|
firstOpen = false;
|
|
var xhr = new XMLHttpRequest();
|
|
xhr.responseType = "text";
|
|
xhr.open("GET", event.data.steamPP, true);
|
|
xhr.send();
|
|
xhr.onreadystatechange = processRequest;
|
|
function processRequest(e) {
|
|
if (xhr.readyState == 4 && xhr.status == 200) {
|
|
var string = xhr.responseText.toString();
|
|
var array = string.split("avatarfull");
|
|
var array2 = array[1].toString().split('"');
|
|
profilePhoto = array2[2].toString();
|
|
$(".profileImg").css("background-image", `url(${profilePhoto})`);
|
|
}
|
|
}
|
|
$('.targetName').html(event.data.targetName)
|
|
$('.descTargetName').html(event.data.targetName + " ")
|
|
$('.targetId').html("ID "+ event.data.targetId)
|
|
$("#mySelectArea").empty();
|
|
event.data.diceOptions.forEach(element => {
|
|
var x = document.getElementById("mySelectArea");
|
|
var option = document.createElement("option");
|
|
option.text = element.optionLabel;
|
|
option.value = element.optionId;
|
|
$(option).attr("optionData", `${JSON.stringify(element)}`);
|
|
x.add(option);
|
|
});
|
|
|
|
$(".menuBox").css("display", "flex");
|
|
$(".invitationMenu").css("display", "flex");
|
|
}else if (event.data.type === "close"){
|
|
closeMenu()
|
|
$.post("https://ak4y-dice/closeMenu", JSON.stringify());
|
|
}else if (event.data.type === "inviteMenu"){
|
|
$(".notifyPage").css("display", "none");
|
|
var xhr = new XMLHttpRequest();
|
|
xhr.responseType = "text";
|
|
xhr.open("GET", event.data.steamPP, true);
|
|
xhr.send();
|
|
xhr.onreadystatechange = processRequest;
|
|
function processRequest(e) {
|
|
if (xhr.readyState == 4 && xhr.status == 200) {
|
|
var string = xhr.responseText.toString();
|
|
var array = string.split("avatarfull");
|
|
var array2 = array[1].toString().split('"');
|
|
profilePhoto = array2[2].toString();
|
|
$(".profileImg").css("background-image", `url(${profilePhoto})`);
|
|
}
|
|
}
|
|
$(".menuBox").css("display", "flex");
|
|
$(".inviteAcceptMenu").css("display", "flex");
|
|
$('.invitedTargetName').html(event.data.ownerName)
|
|
$('.ownerName').html(event.data.ownerName)
|
|
$('.ownerId').html("ID "+event.data.ownerId)
|
|
$('.inviteRound').html(event.data.round+" Round")
|
|
$('.invitePrice').html("$"+event.data.betting)
|
|
}else if (event.data.type === "ownerInviteNotif"){
|
|
$("#successNotifyLine").css("width", "7.2396vw")
|
|
$(".notifyPage").css("display", "flex");
|
|
$(".notifyBoxDenied").css("display", "none");
|
|
$(".notifyBoxSuccess").css("display", "flex");
|
|
$("#successNotifyLine")
|
|
.stop()
|
|
.animate(
|
|
{
|
|
width: "0%",
|
|
},
|
|
{
|
|
duration: parseInt(10000),
|
|
complete: function () {
|
|
$(".notifyBoxSuccess").css("display", "none");
|
|
// $(".notifyPage").css("display", "none");
|
|
$(".notifyBoxDenied").css("display", "none");
|
|
},
|
|
}
|
|
);
|
|
}
|
|
else if (event.data.type === "inviteDeclinedNotif"){
|
|
$("#deniedNotifyLine").css("width", "7.2396vw")
|
|
$(".notifyBoxSuccess").css("display", "none");
|
|
$(".notifyPage").css("display", "flex");
|
|
$(".notifyBoxSuccess").css("display", "none");
|
|
$(".notifyBoxDenied").css("display", "flex");
|
|
$("#deniedNotifyLine")
|
|
.stop()
|
|
.animate(
|
|
{
|
|
width: "0%",
|
|
},
|
|
{
|
|
duration: parseInt(10000),
|
|
complete: function () {
|
|
$(".notifyBoxSuccess").css("display", "none");
|
|
// $(".notifyPage").css("display", "none");
|
|
$(".notifyBoxDenied").css("display", "none");
|
|
},
|
|
}
|
|
);
|
|
}
|
|
else if (event.data.type === "inviteAcceptedGameStarted"){
|
|
startText = 3
|
|
$(".gamePage").css("display", "flex");
|
|
$('#ownerDices').empty()
|
|
$('#playerDices').empty()
|
|
$('.startGameSide').css("opacity", "1")
|
|
$('.startGameSide').css("display", "flex")
|
|
clearTimeout(generalTimeOut)
|
|
element.style.strokeDashoffset = 100;
|
|
generalTimer = 30
|
|
$('.percentage').html("30Sec")
|
|
$('.startText').html("3")
|
|
countDownSound.play()
|
|
countdownInterval = setInterval(() => {
|
|
startText -= 1
|
|
if (startText < 0) startText = 0
|
|
$('.startText').html(startText.toString())
|
|
if (startText == 0) clearInterval(countdownInterval)
|
|
}, 1050);
|
|
$('.roundSay').html("Round 1")
|
|
$('.fa-arrow-right-long').css("opacity", "0.12")
|
|
$('.fa-arrow-left-long').css("opacity", "1")
|
|
$('.gameWonSide').css("display", "none")
|
|
$('.gameDrawSide').css("display", "none")
|
|
$('.gameLoseSide').css("display", "none")
|
|
$('.gameCenterSide').css("display", "flex")
|
|
$('.gameBottomSide').css("display", "flex")
|
|
|
|
$('.betAmountIngame').html("$"+event.data.betAmount)
|
|
|
|
$('.gameOwnerId').html("ID "+event.data.ownerId)
|
|
$('.gameOwnerName').html(event.data.ownerName)
|
|
|
|
$('.gamePlayerName').html(event.data.playerName)
|
|
$('.gamePlayerId').html("ID "+event.data.playerId)
|
|
|
|
$('.ingameRoundText').html(event.data.rount+" Round")
|
|
$(".notifyPage").css("display", "none");
|
|
$(".menuBox").css("display", "none");
|
|
$(".invitationMenu").css("display", "none");
|
|
$(".inviteAcceptMenu").css("display", "none");
|
|
|
|
if (event.data.areYouOwner ? playerType = "owner" : playerType = "player")
|
|
$('.progress.blueteam').css("width", "0%")
|
|
$('.progress.redteam').css("width", "0%")
|
|
|
|
$('.progress-text.blueteamx').html("0")
|
|
$('.progress-text.redteamx').html("0")
|
|
|
|
|
|
var xhr = new XMLHttpRequest();
|
|
xhr.responseType = "text";
|
|
xhr.open("GET", event.data.ownerSteam, true);
|
|
xhr.send();
|
|
xhr.onreadystatechange = processRequest;
|
|
function processRequest(e) {
|
|
if (xhr.readyState == 4 && xhr.status == 200) {
|
|
var string = xhr.responseText.toString();
|
|
var array = string.split("avatarfull");
|
|
var array2 = array[1].toString().split('"');
|
|
profilePhotox = array2[2].toString();
|
|
$(".teamProfile").css("background-image", `url(${profilePhotox})`);
|
|
}
|
|
}
|
|
|
|
setTimeout(() => {
|
|
var xhr = new XMLHttpRequest();
|
|
xhr.responseType = "text";
|
|
xhr.open("GET", event.data.playerSteam, true);
|
|
xhr.send();
|
|
xhr.onreadystatechange = processRequest;
|
|
function processRequest(e) {
|
|
if (xhr.readyState == 4 && xhr.status == 200) {
|
|
var string = xhr.responseText.toString();
|
|
var array = string.split("avatarfull");
|
|
var array2 = array[1].toString().split('"');
|
|
profilePhotoy = array2[2].toString();
|
|
$(".redteamProfile").css("background-image", `url(${profilePhotoy})`);
|
|
}
|
|
}
|
|
}, 100);
|
|
|
|
setTimeout(() => {
|
|
$(".startGameSide").animate({ opacity: 0 }, 300);
|
|
setTimeout(() => {
|
|
onGamePage = true
|
|
continuex = true
|
|
clearInterval(countdownInterval)
|
|
$('.startGameSide').css("display", "none")
|
|
playGame(event.data.gameData)
|
|
}, 700);
|
|
}, 3700);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
else if (event.data.type === "forceCloseGame"){
|
|
closeMenu()
|
|
continuex = false
|
|
clearTimeout(generalTimeOut)
|
|
$(".notifyPage").css("display", "none");
|
|
$(".gamePage").css("display", "none");
|
|
$(".menuBox").css("display", "none");
|
|
$.post("https://ak4y-dice/closeMenu", JSON.stringify());
|
|
}
|
|
else if (event.data.type === "rolled"){
|
|
continuex = event.data.continue
|
|
yourTurn = false
|
|
|
|
document.getElementById("diceRollButton").className = "gameRollDiceButtonPassive"
|
|
|
|
var diceText = "x"
|
|
var randomArray = ["fa-solid fa-dice-one", "fa-solid fa-dice-two", "fa-solid fa-dice-three", "fa-solid fa-dice-four", "fa-solid fa-dice-five", "fa-solid fa-dice-six"]
|
|
switch (event.data.rollDice) {
|
|
case 1:
|
|
diceText = "fa-solid fa-dice-one"
|
|
break;
|
|
case 2:
|
|
diceText = "fa-solid fa-dice-two"
|
|
break;
|
|
case 3:
|
|
diceText = "fa-solid fa-dice-three"
|
|
break;
|
|
case 4:
|
|
diceText = "fa-solid fa-dice-four"
|
|
break;
|
|
case 5:
|
|
diceText = "fa-solid fa-dice-five"
|
|
break;
|
|
case 6:
|
|
diceText = "fa-solid fa-dice-six"
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
diceRollSound.play()
|
|
if (event.data.gameData.turn == "player"){
|
|
var rocket = document.getElementById('ownerDiceRoll');
|
|
var degrees = 0
|
|
ownerInterval = setInterval(() => {
|
|
var randomText = Math.floor(Math.random() * randomArray.length);
|
|
document.getElementById("ownerDiceRoll").className = randomArray[randomText];
|
|
}, 100);
|
|
|
|
rotateInterval = setInterval(() => {
|
|
degrees++;
|
|
rocket.style.webkitTransform = 'rotate(' + degrees + 'deg)';
|
|
}, 1);
|
|
|
|
setTimeout(() => {
|
|
rocket.style.webkitTransform = 'rotate(' + 0 + 'deg)';
|
|
clearInterval(rotateInterval)
|
|
clearInterval(ownerInterval)
|
|
}, 1450);
|
|
}else{
|
|
var rocket = document.getElementById('playerDiceRoll');
|
|
var degrees = 0
|
|
playerInterval = setInterval(() => {
|
|
var randomText = Math.floor(Math.random() * randomArray.length);
|
|
|
|
document.getElementById("playerDiceRoll").className = randomArray[randomText];
|
|
}, 100);
|
|
|
|
rotateInterval = setInterval(() => {
|
|
degrees++;
|
|
rocket.style.webkitTransform = 'rotate(' + degrees + 'deg)';
|
|
}, 1);
|
|
|
|
setTimeout(() => {
|
|
rocket.style.webkitTransform = 'rotate(' + 0 + 'deg)';
|
|
clearInterval(rotateInterval)
|
|
clearInterval(playerInterval)
|
|
}, 1450);
|
|
}
|
|
|
|
clearTimeout(generalTimeOut)
|
|
|
|
setTimeout(() => {
|
|
|
|
|
|
|
|
if (event.data.gameData.turn == "player"){
|
|
document.getElementById("ownerDiceRoll").className = diceText;
|
|
|
|
$('#ownerDices').append(`
|
|
<div class="teamRoundDiceBox">
|
|
R:${event.data.gameData.round}
|
|
<div class="teamRoundDice">
|
|
<i class="${diceText}"></i>
|
|
</div>
|
|
</div>
|
|
`)
|
|
}else{
|
|
document.getElementById("playerDiceRoll").className = diceText;
|
|
|
|
$('#playerDices').append(`
|
|
<div class="teamRoundDiceBox">
|
|
R:${event.data.gameData.round-1}
|
|
<div class="teamRoundDice">
|
|
<i class="${diceText}"></i>
|
|
</div>
|
|
</div>
|
|
`)
|
|
}
|
|
if (event.data.continue){
|
|
playGame(event.data.gameData, event.data.continue)
|
|
}else{
|
|
|
|
continuex = false
|
|
playGame(event.data.gameData, event.data.continue)
|
|
setTimeout(() => {
|
|
document.getElementById("diceRollButton").className = "gameRollDiceButtonPassive"
|
|
|
|
$('.fa-arrow-right-long').css("opacity", "0.12")
|
|
$('.fa-arrow-left-long').css("opacity", "0.12")
|
|
}, 10);
|
|
clearTimeout(generalTimeOut)
|
|
if (event.data.winner == playerType){
|
|
setTimeout(() => {
|
|
element.style.strokeDashoffset = 100;
|
|
generalTimer = 30
|
|
$('.percentage').html("30Sec")
|
|
clearTimeout(generalTimeOut)
|
|
}, 150);
|
|
setTimeout(() => {
|
|
$('.gameCenterSide').css("display", "none")
|
|
$('.gameBottomSide').css("display", "none")
|
|
$('.gameLeaveConfirm').css("display", "none")
|
|
$('#wonAmount').html(`$${event.data.gameData.bettingAmount * 2}`)
|
|
$('.gameWonSide').css("display", "flex")
|
|
var countDownText = 5
|
|
$('.gameWonButton').html(`Close (${countDownText})`)
|
|
closebuttonInterval = setInterval(() => {
|
|
countDownText -= 1
|
|
if (countDownText < 0) countDownText = 0
|
|
$('.gameWonButton').html(`Close (${countDownText})`)
|
|
if (countDownText == 0){
|
|
clearInterval(closebuttonInterval)
|
|
$.post("https://ak4y-dice/gameClose", JSON.stringify({force: false}));
|
|
}
|
|
}, 1000);
|
|
}, 3000);
|
|
|
|
|
|
|
|
}else{
|
|
if (event.data.winner == "berabere"){
|
|
setTimeout(() => {
|
|
element.style.strokeDashoffset = 100;
|
|
generalTimer = 30
|
|
$('.percentage').html("30Sec")
|
|
clearTimeout(generalTimeOut)
|
|
}, 150);
|
|
setTimeout(() => {
|
|
$('.gameCenterSide').css("display", "none")
|
|
$('.gameBottomSide').css("display", "none")
|
|
$('.gameLeaveConfirm').css("display", "none")
|
|
$('.gameDrawSide').css("display", "flex")
|
|
var countDownText = 5
|
|
$('.gameDrawButton').html(`Close (${countDownText})`)
|
|
closebuttonInterval = setInterval(() => {
|
|
countDownText -= 1
|
|
if (countDownText < 0) countDownText = 0
|
|
$('.gameDrawButton').html(`Close (${countDownText})`)
|
|
if (countDownText == 0){
|
|
clearInterval(closebuttonInterval)
|
|
$.post("https://ak4y-dice/gameClose", JSON.stringify({force: false}));
|
|
} }, 1000);
|
|
}, 3000);
|
|
|
|
|
|
}else{
|
|
setTimeout(() => {
|
|
element.style.strokeDashoffset = 100;
|
|
generalTimer = 30
|
|
$('.percentage').html("30Sec")
|
|
clearTimeout(generalTimeOut)
|
|
}, 150);
|
|
setTimeout(() => {
|
|
$('.gameCenterSide').css("display", "none")
|
|
$('.gameBottomSide').css("display", "none")
|
|
$('.gameLeaveConfirm').css("display", "none")
|
|
$('.gameLoseSide').css("display", "flex")
|
|
|
|
var countDownText = 5
|
|
$('.gameLoseButton').html(`Close (${countDownText})`)
|
|
closebuttonInterval = setInterval(() => {
|
|
countDownText -= 1
|
|
if (countDownText < 0) countDownText = 0
|
|
$('.gameLoseButton').html(`Close (${countDownText})`)
|
|
if (countDownText == 0){
|
|
clearInterval(closebuttonInterval)
|
|
$.post("https://ak4y-dice/gameClose", JSON.stringify({force: false}));
|
|
} }, 1000);
|
|
}, 3000);
|
|
}
|
|
|
|
}
|
|
}
|
|
}, 1500);
|
|
}
|
|
});
|
|
|
|
|
|
|
|
function playGame(data, continuexD){
|
|
if (continuexD !== false){
|
|
startTiming()
|
|
}
|
|
|
|
turnDice(data)
|
|
}
|
|
|
|
function turnDice(data){
|
|
$('.roundSay').html("Round "+data.round)
|
|
|
|
|
|
$(".progress.blueteam").css("width", (data.totalOwnerDice / (6*data.selectedConfigOption.optionRound)) * 100 + "%");
|
|
$(".progress.redteam").css("width", (data.totalPlayerDice / (6*data.selectedConfigOption.optionRound)) * 100 + "%");
|
|
|
|
$('.progress-text.blueteamx').html(data.totalOwnerDice)
|
|
$('.progress-text.redteamx').html(data.totalPlayerDice)
|
|
|
|
if (data.turn == "owner"){
|
|
$('.fa-arrow-right-long').css("opacity", "0.12")
|
|
$('.fa-arrow-left-long').css("opacity", "1")
|
|
|
|
}else{
|
|
$('.fa-arrow-right-long').css("opacity", "1")
|
|
$('.fa-arrow-left-long').css("opacity", "0.12")
|
|
}
|
|
|
|
if (data.turn == playerType){
|
|
yourTurn = true
|
|
document.getElementById("diceRollButton").className = "gameRollDiceButton"
|
|
}else{
|
|
yourTurn = false
|
|
document.getElementById("diceRollButton").className = "gameRollDiceButtonPassive"
|
|
}
|
|
}
|
|
|
|
function startTiming(){
|
|
clearTimeout(generalTimeOut)
|
|
element.style.strokeDashoffset = 100;
|
|
generalTimer = 30
|
|
$('.percentage').html("30Sec")
|
|
setTimeout(() => {
|
|
animateRoute(element, pathLength);
|
|
}, 1000);
|
|
}
|
|
|
|
|
|
|
|
|
|
$(document).on("keydown", function () {
|
|
// EKLENECEK
|
|
switch (event.keyCode) {
|
|
case 27: // ESC
|
|
if (onGamePage){
|
|
$('.gameLeaveConfirm').css("display", "flex")
|
|
}else{
|
|
closeMenu();
|
|
$.post("https://ak4y-dice/closeMenu", JSON.stringify());
|
|
}
|
|
break;
|
|
}
|
|
});
|
|
|
|
$(document).on("click", ".gameRollDiceButton", function () {
|
|
if (continuex){
|
|
if (yourTurn){
|
|
$.post(
|
|
"https://ak4y-dice/rolled",
|
|
JSON.stringify({})
|
|
);
|
|
}
|
|
}
|
|
});
|
|
|
|
|
|
$(document).on("click", ".sendButton", function () {
|
|
var selectDiv = document.getElementById("mySelectArea");
|
|
var selectedIndex = selectDiv.options[selectDiv.selectedIndex].value;
|
|
var bettingAmount = document.getElementById('bettingAmount').value
|
|
if (bettingAmount.length > 0){
|
|
$.post(
|
|
"https://ak4y-dice/sendInvite",
|
|
JSON.stringify({
|
|
selectedOption: selectedIndex,
|
|
bettingAmount: bettingAmount,
|
|
})
|
|
);
|
|
$(".menuBox").css("display", "none");
|
|
$(".invitationMenu").css("display", "none");
|
|
}else{
|
|
// console.log("BURAYA BETTİNG EKLENMEDİ UYARISI EKLENECEK")
|
|
}
|
|
});
|
|
|
|
$(document).on("click", ".gameWonButton", function () {
|
|
gameCloseButton()
|
|
});
|
|
$(document).on("click", ".gameDrawButton", function () {
|
|
gameCloseButton()
|
|
});
|
|
$(document).on("click", ".gameLoseButton", function () {
|
|
gameCloseButton()
|
|
});
|
|
|
|
function gameCloseButton(){
|
|
$.post("https://ak4y-dice/gameClose", JSON.stringify({force: false}));
|
|
}
|
|
|
|
$(document).on("click", ".diceInvitedAcceptButton", function () {
|
|
$.post(
|
|
"https://ak4y-dice/inviteAccepted",JSON.stringify({})
|
|
);
|
|
$(".menuBox").css("display", "none");
|
|
$(".invitationMenu").css("display", "none");
|
|
$(".inviteAcceptMenu").css("display", "none");
|
|
});
|
|
|
|
$(document).on("click", ".gameLeaveButton", function () {
|
|
$('.gameLeaveConfirm').css("display", "flex")
|
|
});
|
|
|
|
$(document).on("click", ".gameLeaveContinueButton", function () {
|
|
$('.gameLeaveConfirm').css("display", "none")
|
|
});
|
|
|
|
$(document).on("click", ".gameLeaveAcceptButton", function () {
|
|
closeMenu()
|
|
continuex = false
|
|
clearTimeout(generalTimeOut)
|
|
$('.gameLeaveConfirm').css("display", "none")
|
|
$(".menuBox").css("display", "none");
|
|
$.post("https://ak4y-dice/gameClose", JSON.stringify({force: true}));
|
|
});
|
|
|
|
$(document).on("click", ".diceInvitedCancelButton", function () {
|
|
|
|
$.post(
|
|
"https://ak4y-dice/inviteDeclined",JSON.stringify({})
|
|
);
|
|
$(".menuBox").css("display", "none");
|
|
$(".invitationMenu").css("display", "none");
|
|
$(".inviteAcceptMenu").css("display", "none");
|
|
});
|
|
|
|
$(document).on("click", ".cancelButton", function () {
|
|
closeMenu()
|
|
$.post("https://ak4y-dice/closeMenu", JSON.stringify());
|
|
});
|
|
|
|
function closeMenu() {
|
|
onGamePage = false
|
|
$(".menuBox").css("display", "none");
|
|
$(".invitationMenu").css("display", "none");
|
|
$(".inviteAcceptMenu").css("display", "none");
|
|
}
|