Files
red-valley/resources/[framework]/[addons]/ak4y-dice/html/index.html
2026-03-29 21:41:17 +03:00

699 lines
22 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ak4y-dice</title>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.1.1/howler.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="main.css" />
</head>
<body style="display: flex">
<div class="menuBox">
<div class="invitationMenu">
<img src="./img/menuleftdice.png" alt="" class="menuEffectImg" />
<img src="./img/bgeffect.png" alt="" class="menuInEffectImg" />
<img src="./img/bgeffect2.png" alt="" class="menuInEffectImg2" />
<div class="topSide">
<div class="profileBox">
<div
class="profileImg"
style="background-image: url(./img/pp.png)"
></div>
<h2 class="profileName">
<p class="targetName">Brenden Randall</p>
<p class="targetId">ID 24</p>
</h2>
</div>
<i class="fa-solid fa-circle-info"></i>
</div>
<div class="dicegameTitle">
<i class="fa-solid fa-dice"></i>
<h1 class="dicegameTitleText">
Dice Game
<p>
To play dice with <span class="descTargetName"></span>please fill
in the form below
</p>
</h1>
</div>
<div class="menuLine"></div>
<div class="roundInputBox">
<div class="roundInputTitle">
<i class="fa-solid fa-dice-two"></i>
<h4 class="roundInputTitleText">dice round</h4>
</div>
<div class="custom-select">
<select id="mySelectArea">
<!-- <option value="1">option 1</option>
<option value="2">option 2</option>
<option value="3">option 3</option> -->
</select>
<i class="fa-solid fa-chevron-down"></i>
</div>
</div>
<div class="betInputBox">
<div class="betInputTitle">
<i class="fa-solid fa-money-bill"></i>
<h4 class="betInputTitleText">betting</h4>
</div>
<div class="bet-input">
<input
id="bettingAmount"
class="inputAmount"
type="number"
required
placeholder="Amount..."
/>
</div>
</div>
<div class="invitationButtonBox">
<div class="sendButton">
<i class="fa-solid fa-envelope"></i>
Send
</div>
<div class="cancelButton">
<i class="fa-sharp fa-solid fa-xmark"></i>
</div>
</div>
</div>
<div class="inviteAcceptMenu">
<img src="./img/menuleftdice.png" alt="" class="menuEffectImg" />
<img src="./img/bgeffect.png" alt="" class="menuInEffectImg" />
<img src="./img/bgeffect2.png" alt="" class="menuInEffectImg2" />
<div class="topSide">
<div class="profileBox">
<div
class="profileImg"
style="background-image: url(./img/pp.png)"
></div>
<h2 class="profileName">
<p class="ownerName"></p>
<!-- Brenden Randall -->
<p class="ownerId">ID 24</p>
</h2>
</div>
<i class="fa-solid fa-circle-info"></i>
</div>
<div class="dicegameTitle">
<i class="fa-solid fa-dice"></i>
<h1 class="dicegameTitleText">
Dice Game
<p>
To play dice with <span class="invitedTargetName"></span> please
fill in the form below
</p>
</h1>
</div>
<div class="menuLine"></div>
<div class="diceGameInfoBox">
<div class="diceGameInfo">
<i class="fa-solid fa-dice-three"></i>
<p class="inviteRound">4 Round</p>
</div>
<div class="diceGameInfo" style="color: #40dc75">
<i class="fa-solid fa-money-bill" style="color: #40dc75"></i>
<p class="invitePrice">$5000</p>
</div>
</div>
<div class="diceInvitedButton">
<div class="diceInvitedAcceptButton">
Accept
<!-- <div class="yKey">Y</div> -->
</div>
<div class="diceInvitedCancelButton">
Denied
<!-- <div class="yKey">N</div> -->
</div>
</div>
</div>
</div>
<div class="gamePage">
<img
src="./img/gamepage/gamepagebg.png"
alt=""
class="gamepagebgeffect"
/>
<img
src="./img/gamepage/gamepageleftbottom.png"
alt=""
class="gamepageeffect1"
/>
<img
src="./img/gamepage/gamepagerighttop.png"
alt=""
class="gamepageeffect2"
/>
<!-- start game side -->
<div class="startGameSide">
<h2 class="startText">3</h2>
</div>
<div class="queueNotify">
<!-- SIRA BİLDİRİMİ -->
<i class="fa-solid fa-circle-info"></i>
you're next in line for the dice roll.
</div>
<div class="gameTopSide">
<div class="gameTitleBox">
<img src="./img/menuleftdice.png" alt="" class="gameTitleImg" />
<h1 class="gameTitle">
DICE
<p>GAME</p>
</h1>
</div>
<h2 class="gameDescription">
INFORMATION
<p>
Lorem ipsum dolor sit amet consectetur. Suspendisse tortor habitant
diam aliquet consequat pellentesque nibh.
</p>
</h2>
</div>
<div class="gameWonSide">
<h2 class="gameWonText">
Congratulations
<p>YOU WIN</p>
</h2>
<p class="gameWonDescription">
Lorem ipsum dolor sit amet consectetur. Cursus amet adipiscing
</p>
<i class="fa-solid fa-money-bill"></i>
<div class="gameWonPrice" id="wonAmount">$50000</div>
<div class="gameWonButton">Close (5)</div>
</div>
<div class="gameDrawSide">
<h2 class="gameWonText">
<p style="color: #ddd">DRAW</p>
</h2>
<p class="gameWonDescription">
Lorem ipsum dolor sit amet consectetur. Cursus amet adipiscing
</p>
<i
class="fa-solid fa-right-left"
style="
color: #cacaca;
filter: drop-shadow(0px 16px 89px rgba(255, 255, 255, 0.78));
"
></i>
<div class="gameWonPrice" style="color: #a0a0a0">Try Again</div>
<div class="gameDrawButton">Close (5)</div>
</div>
<div class="gameLoseSide">
<h2 class="gameWonText">
<p style="color: #cc4d4d">YOU LOSE</p>
</h2>
<p class="gameWonDescription">
Lorem ipsum dolor sit amet consectetur. Cursus amet adipiscing
</p>
<i
class="fa-solid fa-xmark"
style="
color: #cc4d4d;
filter: drop-shadow(0px 13px 95px #cc4d4d)
drop-shadow(0px 13px 95px #cc4d4d)
drop-shadow(0px 13px 152px #cc4d4d);
"
></i>
<div class="gameWonPrice" style="color: #cc4d4d">Try Again</div>
<div class="gameLoseButton">Close (5)</div>
</div>
<div class="gameCenterSide">
<div class="teamBox">
<div class="teamBgEffect blueteam"></div>
<div
class="teamProfile"
style="background-image: url(./img/blueteam.png)"
></div>
<h2 class="teamProfileName">
<span class="gameOwnerName">Brenden Randall</span>
<p class="gameOwnerId">ID 5</p>
</h2>
<div class="teamProgressBar">
<div class="progressBar">
<div class="progress blueteam">
<span class="progress-text blueteamx">12</span>
</div>
</div>
</div>
<div class="teamRoundDiceBoxs" id="ownerDices">
<!-- <div class="teamRoundDiceBox">
R:1
<div class="teamRoundDice">
<i class="fa-solid fa-dice-one"></i>
</div>
</div> -->
<!-- <div class="teamRoundDiceBox">
R:1
<div class="teamRoundDice">
<i class="fa-solid fa-dice-five"></i>
</div>
</div>
<div class="teamRoundDiceBox">
R:1
<div class="teamRoundDice">
<i class="fa-solid fa-dice-one"></i>
</div>
</div>
<div class="teamRoundDiceBox">
R:1
<div class="teamRoundDice">
<i class="fa-solid fa-dice-three"></i>
</div>
</div> -->
</div>
</div>
<div class="gameInfoSide">
<div class="gameInfoBox">
<div class="gameInfoRound">
<i class="fa-solid fa-dice-three"></i>
<span class="ingameRoundText">4 Round</span>
</div>
<div class="gameInfoBet">
<i class="fa-solid fa-money-bill"></i>
<h3 class="gameInfoBetText">
bet
<p class="betAmountIngame">$5000</p>
</h3>
</div>
</div>
<div class="gameInfoSideBottom">
<div class="gameDiceTimeBox">
<div class="rollDice" id="rollDiceOwner">
<i id="ownerDiceRoll" class="fa-solid fa-dice-one"></i>
</div>
<div class="single-chart">
<svg viewBox="0 0 36 36" class="circular-chart orange">
<path
class="circle-bg"
d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831"
/>
<path
id="animpath"
calcMode="linear"
class="circle"
stroke-dasharray="0, 100"
d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831"
/>
<text x="18" y="18.35" class="percentage">30Sec</text>
<text x="18" y="22.35" class="percentage2">waiting!</text>
</svg>
</div>
<div class="rollDice" id="rollDicePlayer">
<i id="playerDiceRoll" class="fa-solid fa-dice-five"></i>
</div>
</div>
<div class="nextArrowBox">
<i class="fa-solid fa-arrow-left-long"></i>
<div class="roundSay">Round 2</div>
<i class="fa-solid fa-arrow-right-long"></i>
</div>
</div>
</div>
<div class="teamBox">
<div class="teamBgEffect redteam"></div>
<div
class="redteamProfile"
style="background-image: url(./img/blueteam.png)"
></div>
<h2 class="teamProfileName">
<span class="gamePlayerName">Brenden Randall</span>
<p class="gamePlayerId">ID 5</p>
</h2>
<div class="teamProgressBar">
<div class="progressBar">
<div class="progress redteam">
<span class="progress-text redteamx">12</span>
</div>
</div>
</div>
<div class="teamRoundDiceBoxs" id="playerDices">
<!-- <div class="teamRoundDiceBox">
R:1
<div class="teamRoundDice">
<i class="fa-solid fa-dice-one"></i>
</div>
</div> -->
<!-- <div class="teamRoundDiceBox">
R:1
<div class="teamRoundDice">
<i class="fa-solid fa-dice-five"></i>
</div>
</div>
<div class="teamRoundDiceBox">
R:1
<div class="teamRoundDice">
<i class="fa-solid fa-dice-one"></i>
</div>
</div>
<div class="teamRoundDiceBox">
R:1
<div class="teamRoundDice">
<i class="fa-solid fa-dice-three"></i>
</div>
</div> -->
</div>
</div>
</div>
<div class="gameBottomSide">
<h2 class="gameButtonDescription">
Information
<p>
Lorem ipsum dolor sit amet consectetur. Posuere maecenas vestibulum
purus risus tellus.
</p>
</h2>
<div id="gameButtonBoxx" class="gameButtonBox">
<div id="diceRollButton" class="gameRollDiceButton">
<i class="fa-solid fa-dice-five"></i>Roll the dices
</div>
<div class="gameLeaveButton">
<i class="fa-solid fa-door-open"></i>
</div>
</div>
</div>
<div class="gameLeaveConfirm">
<div class="gameLeaveBox">
<div class="gameLeaveText">
DICE GAME LEAVE
<p>
Are you sure you want to quit the dice game? you will not get your
money back!
</p>
</div>
<div class="gameLeaveButtonBox">
<div class="gameLeaveContinueButton">Continue</div>
<div class="gameLeaveAcceptButton">Leave</div>
</div>
</div>
</div>
</div>
<div class="notifyPage">
<!-- display flex -->
<div class="notifyBoxSuccess">
<svg
width="52.5vw"
height="16.7188vw"
viewBox="0 0 1008 321"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g filter="url(#filter0_f_2413_381)">
<rect
x="248"
y="248"
width="512"
height="344"
rx="172"
fill="#030810"
/>
</g>
<g filter="url(#filter1_f_2413_381)">
<rect
x="248"
y="248"
width="512"
height="344"
rx="172"
fill="#030810"
/>
</g>
<g filter="url(#filter2_f_2413_381)">
<rect
x="248"
y="248"
width="512"
height="344"
rx="172"
fill="#030810"
/>
</g>
<g filter="url(#filter3_f_2413_381)">
<rect
x="248"
y="248"
width="512"
height="344"
rx="172"
fill="#030810"
/>
</g>
<defs>
<filter
id="filter0_f_2413_381"
x="0.873566"
y="0.873566"
width="1006.25"
height="838.253"
filterUnits="userSpaceOnUse"
color-interpolation-filters="sRGB"
>
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation="123.563"
result="effect1_foregroundBlur_2413_381"
/>
</filter>
<filter
id="filter1_f_2413_381"
x="0.873566"
y="0.873566"
width="1006.25"
height="838.253"
filterUnits="userSpaceOnUse"
color-interpolation-filters="sRGB"
>
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation="123.563"
result="effect1_foregroundBlur_2413_381"
/>
</filter>
<filter
id="filter2_f_2413_381"
x="0.873566"
y="0.873566"
width="1006.25"
height="838.253"
filterUnits="userSpaceOnUse"
color-interpolation-filters="sRGB"
>
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation="123.563"
result="effect1_foregroundBlur_2413_381"
/>
</filter>
<filter
id="filter3_f_2413_381"
x="0.873566"
y="0.873566"
width="1006.25"
height="838.253"
filterUnits="userSpaceOnUse"
color-interpolation-filters="sRGB"
>
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation="123.563"
result="effect1_foregroundBlur_2413_381"
/>
</filter>
</defs>
</svg>
<h1 class="notifyTitle">
Send Invite
<p>
Lorem ipsum dolor sit amet consectetur. Sed iaculis vulputate vitae
</p>
</h1>
<div id="successNotifyLine" class="notifyLine"></div>
</div>
<div class="notifyBoxDenied">
<svg
width="52.5vw"
height="16.7188vw"
viewBox="0 0 1008 321"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g filter="url(#filter0_f_2413_381)">
<rect
x="248"
y="248"
width="512"
height="344"
rx="172"
fill="#030810"
/>
</g>
<g filter="url(#filter1_f_2413_381)">
<rect
x="248"
y="248"
width="512"
height="344"
rx="172"
fill="#030810"
/>
</g>
<g filter="url(#filter2_f_2413_381)">
<rect
x="248"
y="248"
width="512"
height="344"
rx="172"
fill="#030810"
/>
</g>
<g filter="url(#filter3_f_2413_381)">
<rect
x="248"
y="248"
width="512"
height="344"
rx="172"
fill="#030810"
/>
</g>
<defs>
<filter
id="filter0_f_2413_381"
x="0.873566"
y="0.873566"
width="1006.25"
height="838.253"
filterUnits="userSpaceOnUse"
color-interpolation-filters="sRGB"
>
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation="123.563"
result="effect1_foregroundBlur_2413_381"
/>
</filter>
<filter
id="filter1_f_2413_381"
x="0.873566"
y="0.873566"
width="1006.25"
height="838.253"
filterUnits="userSpaceOnUse"
color-interpolation-filters="sRGB"
>
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation="123.563"
result="effect1_foregroundBlur_2413_381"
/>
</filter>
<filter
id="filter2_f_2413_381"
x="0.873566"
y="0.873566"
width="1006.25"
height="838.253"
filterUnits="userSpaceOnUse"
color-interpolation-filters="sRGB"
>
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation="123.563"
result="effect1_foregroundBlur_2413_381"
/>
</filter>
<filter
id="filter3_f_2413_381"
x="0.873566"
y="0.873566"
width="1006.25"
height="838.253"
filterUnits="userSpaceOnUse"
color-interpolation-filters="sRGB"
>
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation="123.563"
result="effect1_foregroundBlur_2413_381"
/>
</filter>
</defs>
</svg>
<h1 class="notifyTitle denied">
Request Denied
<p>
Lorem ipsum dolor sit amet consectetur. Sed iaculis vulputate vitae
</p>
</h1>
<div
id="deniedNotifyLine"
class="notifyLine"
style="background: #c14646"
></div>
</div>
</div>
<script src="js/jquery-3.6.0.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="js/app.js?v=1"></script>
</body>
</html>